QBJS v0.7.0 - Release

[grymmjack]

if you combine your project with Electron to generate stand-alone, cross-platform desktop applications, it will be much more interesting and will surely attract many developers...

Hey @Coolman, thanks for the suggestion.  There has actually already been a little bit of research into this already.  @grymmjack was posting on Discord just recently about some work he did to be able to build electronjs-based standalone executables from VSCode.  The concept actually works pretty well, though it does produce some very large executables (since it has to bundle a chromium browser).

At present, however, this isn't a major focus for me.  There is already a good way to make multi-platform, standalone executables with QBasic syntax... and that is QB64.  I'm not aiming to create a replacement for QB64.  For me it is about extending the reach of this fun and approachable syntax to the web and mobile.  Perhaps, I'll dedicate a separate thread to expand further on the motivation and goals of the project.

Yep. It's pretty danged easy to get it working too.
Mostly just download nwjs, setup your vscode extensions, modify your nwjs.publish.json and you're good.

Happy to share, LMK.

[grymmjack]

Hi All,

The latest version of QBJS (0.7.0) is now available.  Here are some highlights for this release:

AWESOME WORK!

The hotkeys are SUPER appreciated. I will now uninstall vimium

Wow the 2D library is awesome man. Line width and cap are huge

Rad, @dbox

Looks like you've been keeping up on the docs too! Great!

Congrats on this milestone

[dbox]

Rad, @dbox

Looks like you've been keeping up on the docs too! Great!

Congrats on this milestone

Thanks @grymmjack, I appreciate the kind words!  Sometimes it feels like updating the documentation takes longer than coding the features.

[dbox]

This release adds the ability to customize the QBJS IDE look-and-feel by selecting one of four themes.  To change the theme, click the settings button (cog icon) in the toolbar and then select the theme from the drop list.

Default Theme
This theme is obviously heavily inspired by the default QB64 theme (dark dark blue).
   

QBasic
Want your UI to look more like the original QBasic IDE?  Then this is the theme for you.
   

Windows Classic
This theme replicates the look-and-feel of an old school windows IDE.
   

VSCode Dark
Select this theme if you want QBJS to look like the VSCode IDE.
   

Which theme is your favorite?  Any suggestions for other themes?

[mnrvovrfc]

All of them look good but my eyes are beginning to fail me out of looking at bright screens.

Now it's possible to have an active screen instead of relying on Inkscape or other SVG processor, for bezier curves and stuff like that.

Great job!

[dbox]

All of them look good but my eyes are beginning to fail me out of looking at bright screens.

Now it's possible to have an active screen instead of relying on Inkscape or other SVG processor, for bezier curves and stuff like that.

Great job!

Awesome, thanks for the feedback @mnrvovrfc!

[dbox]

With 0.7.0, QBJS now supports working with custom fonts via the QB64 methods: _Font, _LoadFont and _FreeFont.  There are now three ways to load a font for use in your program:

1. From a Font File
As in QB64, fonts can be loaded from font file locations:

Code: (Select All)

Dim fnt As Long
fnt = _LoadFont("FONTS/SHOWG.TTF", 45)
_Font fnt

_PrintMode _KeepBackground
Cls , 15
Color 3
_PrintString (35, 170), "Custom Fonts are Cool!"

View in QBJS

2. From a Font Name
You can alternatively specify the font name.  As long as the font is installed on the system it will load the requested font.  You can also specify an HTML-style list of fallback font names as shown in the example below:

Code: (Select All)

Import Gfx From "lib/graphics/2d.bas"

Dim f As Long
f = _LoadFont("Arial, Helvetica, sans-serif", 60)
_Font f

Dim img As Long
img = _NewImage(_PrintWidth("Hello World!"), _FontHeight)
_Dest img
Color 15
_PrintMode _KeepBackground
_PrintString (0, 0), "Hello World!"
_Dest 0

Dim As Integer a, x, y
x = _Width / 2
y = _Height / 2
Do
    Line (1, 1)-(_Width, _Height), _RGBA(0, 0, 0, 70), BF
    Gfx.RotoZoom x, y, img, 1, 1, a
    a = a + 3
    If a > 359 Then a = 0
    _Limit 60
Loop

View in QBJS

3. From a URL
This option allows you to take advantage of the large collections of free fonts that are available online.  The example below uses a font from the Google Font collection:

Code: (Select All)

Import Dom From "lib/web/dom.bas"

Dim f
f = _LoadFont("https://fonts.gstatic.com/s/indieflower/v17/m8JVjfNVeKWVnh3QMuKkFcZVaUuH.woff2", 24)
_Font f

Cls , 15
Color 8
_PrintMode _KeepBackground

Print
Print "  Day 27:"
Print "  I am still trapped on the island with no hope of escape."
Print "  I struggle against despair, but the realization that I will"
Print "  never leave this place haunts my every waking thought..."
Print
Print "  I saw the parrot again today."

View in QBJS

[mnrvovrfc]

It's making my head spin!

It's time for some web developers to sit up and take notice that at least one BASIC dialect isn't "that little 8-bit language from the 1980's" which has less to do with Microsoft than ever.

[grymmjack]

Here are some mods from @bplus' excellent collection of proggies that use some of the new graphics methods:

Diamond Spaceship (FillTriangle)
Goldwave (FillTriangle)
Easy Spiral (FillCircle)
X-mas Star (RotoZoom)
Infinite Heart (FillCircle)
Guts (FillCircle)
Celtic Knot (FillCircle, FillEllipse)

The final example also demonstrates how to use the "$If WEB" metacommand to conditionally use the new graphics commands when in QBJS, but still have a version that will compile and run in QB64.

My goodness, @bplus you are such a guru. 40 lines... i'm drooling looking at this Math can be so pretty.

Maybe we could add them with share and play like this:

[dbox]

Another new feature introduced in 0.7.0 is the ability to trigger uploads and downloads to and from the browser from within your QBJS program.  The following example shows how to use this feature.  (As a bonus it also uses the new SaveImage method from the new 2D graphics library.)

Code: (Select All)

Import FS From "lib/io/fs.bas"

Import G2D From "lib/graphics/2d.bas"



Dim Shared img As Long



Screen _NewImage(600, 600, 32)



Print "Welcome to Image Decorator!"

Print "Press any key to upload an image file..."

Sleep



' Prompt the user to upload a PNG file 

' and save it to the temp directory

' Call the OnUpload sub with complete

MkDir "temp"

FS.UploadFile "temp", ".png, .jpg", sub_OnUpload



' Wait for the image to be uploaded

Do

    _Limit 60

Loop Until img



' Decorate the image

DecorateImage



' Make a copy of the image

Dim imgCopy As Long

imgCopy = _CopyImage(_Dest)



' Save the image

Color 0

_PrintMode _KeepBackground

Print "Press any key to save the new image..."

Sleep



' Save the image to the virtual file system

G2D.SaveImage imgCopy, "temp/newimage.png"



' Prompt the user to download the image file

FS.DownloadFile "temp/newimage.png"





Sub OnUpload (filename As String)

    img = _LoadImage(filename)

End Sub



Sub DecorateImage

    ' Scale the image to fit the screen

    Dim As Double scale

    Dim As Integer w, h, x, y

    w = _Width(img)

    h = _Height(img)

    If w > h Then

        scale = h / w

        w = _Width

        h = w * scale

    Else

        scale = w / h

        h = _Height

        w = h * scale

    End If



    ' Center the image

    w = w - 50

    h = h - 50

    x = (_Width - w) / 2

    y = (_Height - h) / 2



    ' Draw a drop shadow

    Cls , 15

    G2D.Shadow _RGB(100, 100, 100), 8, 8, 15

    Line (x, y)-(x + w - 1, y + h - 1), 0, BF

    G2D.ShadowOff

    

    ' Draw the image

    _PutImage (x, y)-(x + w, y + h), img

End Sub

View in QBJS