I said yesterday that a few things I'm doing in SmileBASIC might make their way back to JSE..

-=-=-

So, over in SmileBASIC, I'm having to code my own line/rect/oval commands. The main issue being, if everything else is done using Sprites, then any "primitive" draw commands would actually end up either 100% under or 100% over the sprites. Nothing can intermingle because simple-draws go onto a layer, but sprites exist on their own layer.. Or multiple layers.

The concept of doing sprite, rectangle over it, sprite over that, then another rectangle over the top...
That's damn near impossible in SmileBASIC.

Instead then, code my own, and use sprites to represent them.
The concept being, use a square white sprite, but shape and rotate it to look like the requested line or rectangle.
(I'll have to come up with a solution for ovals later!!)

This seems to be working well enough, and I'm easily able to draw the 4,000 sprite-limit sprites without any issues, even if some of those are rectangles, lines, or even text.

Gud gud!

So, I'm thinking about JSE, and wondering if this might be a decent way to do things using WebGL.
One of the bugbears of JSE is the inability to recolour sprites properly.
Could I use WebGL to draws everything, instead? Use this same sprite-scale methodology to get rectangles and lines, and then allow me to recolour everything neatly?
Mmmmm!

So I experimented. And, yes, I got the Chatbots involved.
I had to pass code between myself, Claude, Copilot and Gemini, but between the four of us, we managed to get this..



A 640x480 resolution, upscaled to fit to my screen size, with 3000 "lines" being drawn per frame.
And those aren't even lines. They're actually sprites..

And if you zoom right in...


(Zoomed in for your convenience)

Not a single sign of anti-aliasing.
Ooooh, now...
Oooooh!!!

There'd be an awful lot of work to get that all functional, but as far as a simple test goes, I do like the look of that, and that's with the WebGL engine drawing to its own buffer, then copying that buffer to the DisplayCanvas, which means, although WebGL has a knack of constantly clearing out its buffer, we can actually retain the buffer, because the DisplayCanvas holds the previous frame...
Which is a very important thing, in the way that a BASIC engine works. eg, 10 Print "Hello" 20 Goto 10 will endlessly scroll the buffer, so we need to be able to handle things like that.

Anyway, yeah, that's actually a really important element should I choose to move ahead with WebGL.

The only downside now is that drawing those oversized/stretched Rect/Line sprites can REALLY be bad for the CPU/GPU... I need to figure out a better way to do that, next.
It might be faster to draw an oversized one, down to a reduced size. I'll need to play with my options carefully, here.

WebGL : Possibly coming to JSE in the future, maybe, perhaps!!

... Wait, hang on a minute..
Don't the sprites already draw without aliasing...?
Couldn't I just...
....

Symbol 0,"2__0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0_0,;_;_;_;?";


SetControllerMethod Mouse
Graphics 160,100,3

fx=-100

Repeat
CLS;ResetDraw;AA False
SetFontSize 8

Text 80,20,"Line <  > Image",1

ang=Wrap(Mills()*0.1,0,360)
Line 40+Cos(ang)*16,60+Sin(ang)*16,40-Cos(ang)*16,60-Sin(ang)*16

SetSize 1,1
SetRot ang

DrawImg 120,60

if MouseDown()<0.5 then fx=-100
if MouseHit() then fx=MouseX();fy=MouseY()
if fx>-1
		//  You can draw a line with the mouse
			// BUT.. You'll notice the scaling issue.
			// I'd need to code an alternative version of Rotate-vs-Scaling for images.
	tx=MouseX();ty=MouseY()
	SetRot ATan2(fx-tx,ty-fy)+90
	cx=((tx-fx)/2)+fx
	cy=((ty-fy)/2)+fy
	SetSize Pyth(tx-fx,ty-fy)/32
	DrawImg cx,cy
endif

Flip
Forever

A.I. Corner

Lyrics : By me
Sound Imported : Bitter Love
> Reveal 🔎
| Suno Link

Alternative versions
| Suno Link

| Suno Link

| Suno Link

Sung by Suno


"Cartoon @Derek stands inside a Square Cube, holding a Square floppy disk, with a Square glowing monitor beside him, tessellating squares, squarium" by ArtFlow.ai

> Reveal 🔎