out of curiosity, I asked ChatGPT (4) if it can convert this PureBasic-Code to JavaScript. The Code is from the help.
Code: Select all
If OpenWindow(0, 100, 200, 300, 200, "2D Drawing Test")
; Create an offscreen image, with a green circle in it.
; It will be displayed later
;
If CreateImage(0, DesktopScaledX(300), DesktopScaledY(200))
If StartDrawing(ImageOutput(0))
Circle(100,100,50,RGB(0,0,255)) ; a nice blue circle...
Box(150,20,20,20, RGB(0,255,0)) ; and a green box
FrontColor(RGB(255,0,0)) ; Finally, red lines..
For k=0 To 20
LineXY(10,10+k*8,200, 0)
Next
DrawingMode(#PB_2DDrawing_Transparent)
BackColor(RGB(0,155,155)) ; Change the text back and front colour
FrontColor(RGB(255,255,255))
DrawText(10,50,"Hello, this is a test")
StopDrawing()
EndIf
EndIf
; Create a gadget to display our nice image
;
ImageGadget(0, 0, 0, 0, 0, ImageID(0))
;
; This is the 'event loop'. All the user actions are processed here.
; It's very easy to understand: when an action occurs, the Event
; isn't 0 and we just have to see what have happened...
;
Repeat
Event = WaitWindowEvent()
Until Event = #PB_Event_CloseWindow ; If the user has pressed on the window close button
EndIf
End ; All the opened windows are closed automatically by PureBasicCode: Select all
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>2D Drawing Test</title>
</head>
<body>
<canvas id="drawingCanvas" width="300" height="200"></canvas>
<script>
// Get the canvas and its context
const canvas = document.getElementById('drawingCanvas');
const ctx = canvas.getContext('2d');
// Draw a blue circle
ctx.fillStyle = 'rgb(0, 0, 255)';
ctx.beginPath();
ctx.arc(100, 100, 50, 0, 2 * Math.PI);
ctx.fill();
// Draw a green box
ctx.fillStyle = 'rgb(0, 255, 0)';
ctx.fillRect(150, 20, 20, 20);
// Draw red lines
ctx.strokeStyle = 'rgb(255, 0, 0)';
for (let k = 0; k <= 20; k++) {
ctx.beginPath();
ctx.moveTo(10, 10 + k * 8);
ctx.lineTo(200, 0);
ctx.stroke();
}
// Draw text
ctx.fillStyle = 'rgb(255, 255, 255)';
ctx.font = '16px Arial';
ctx.fillText('Hello, this is a test', 10, 50);
// Event listener for closing the window (or tab in this case)
window.addEventListener('beforeunload', (event) => {
event.preventDefault();
event.returnValue = '';
});
</script>
</body>
</html>