Pokitto Games in JavaScript

With the demise of PyInSky we were left without a good beginner-level language/environment.

So here’s a new one.

MicoJS Online IDE

Quick Intro:

  • Generates native code, no VM/interpretor
  • Based on Monaco (VSCode’s editor)
  • Your sourcecode is stored in your browser but can be exported as a zip file
  • Aims for full JS language compatibility, not API/library compatibility
  • New full-res 8-bit graphics engine with sprite zoom/rotation/recoloring support
  • Built-in simulator runs well even on very slow devices
  • Games are platform-independent by default
  • Wiki documenting both the API and language
  • Autocomplete with documentation
  • Built-in asset conversion. Drag-and-drop an image into the file list and it’s ready
  • Uses version 2 of the general palette (palette.pal), based on this paper.
  • Not Pine2K compatible. This is meant to be actual JavaScript, while Pine2K is a JS-like low-level language (PINE stands for Pine Is Not Ecmascript, after all).

Block Programming:

This is a new feature and is still unstable, but it’s available online for testing.

Planned Features

  • Import zipped project Done :white_check_mark:
  • Project sharing between multiple users/browsers
  • More UI polish
  • Audio support
  • Tilemap support Done :white_check_mark:
  • Hotspot profiling (partially implemented already)
  • Built-in image editor
  • More JS language support (see wiki for up-to-date list of what’s missing)
  • Export game as a single HTML file for sharing
  • Debug builds that tell you where/why a crash happened on hardware without a debugger
11 Likes

Sprite zooming and rotating is great!

This language/env could be also a nice intro for kids to programming and web technologies.

Should we have a game jam when the system is mature enough?

2 Likes

Got 404 when pressed the link…

1 Like

Argh, typo. Fixed it. Thanks! :sweat_smile:

2 Likes

Awesome new toy!
Will Monaco allow support also Goto Definition and global search and replace across multiple files?

I’m not sure, I’m still figuring out how things work in Monaco. It does support go-to for definitions in the same file, and it knows about things declared in other files if they’re open, so it’s 90% of the way there.

3 Likes

Latest changes:

  • Zipped project import (drag-and-drop a zip into the file tree)
  • Automatically clear debug log when starting the simulator
  • Ctrl+Enter (or Cmd+Enter on Mac) shortcut to start the simulator
  • Ctrl+S no longer tries to save the IDE as an HTML page
  • 32Blit support
6 Likes

Just a small update today:

  • Fixed bug in browser version of vectorLength function
  • Added PI / HALF_PI / TWO_PI
4 Likes

Another small update:

  • Fixed a bug where use of null would generate invalid code
  • Fixed a bug when comparing someString != otherString
  • Added getTime function
4 Likes

I’ve tried some builds with very minor modifications to the default template, and when I test in the gamebuino emulator and as a pokitto binary (running on hardware) I frequently get crashes when the little color wheel ball bounces (sometimes earlier). It looks like the crashes go away if I take out my print line, which looks like this:

text("Hello world! " + getWidth() + " " + getHeight(), 5, 5);

So… Maybe some bug somewhere in string concatenation? Or somewhere in a number to string cast?

2 Likes

Thanks for the bug report. Fixed it. Turns out strings weren’t triggering the garbage collector.

3 Likes
  • PicoSystem support
  • Fixed bug in 32Blit input
  • Added support for game metadata (title, author, description, version). Need to package Pokitto games into pop files next.
4 Likes
  • Sourcecode for the MicoJS buildbot, transpiler, and IDE is now online: GitHub - micojs/MicoBot
  • Added “Performance Considerations” section to wiki
5 Likes
  • Fixed minor IDE bug that happens after a file is deleted
  • Update PokittoLib and fix Pokitto builds
  • Add support for string.length
  • Fix transpiler errors showing up as “[Object object]”
  • Added pragmas documentation to wiki. These allow you to do things like including/excluding blocks of code depending on the platform, much like C’s #ifdef ... #endif blocks:
{"ifeq platform blit";
debug("32Blit");
}
{"ifeq platform pokitto";
debug("Pokitto");
}
{"ifeq platform meta";
debug("Meta");
}
3 Likes

Sorry if I’m missing something obvious, but… How does one save a project and/or transfer between computers? I don’t see an import button, but I do see export. However, export just downloads an empty zip file when I try it - not sure if that’s a bug or I’m just doing something wrong.

Are you sure the zip is empty? Can you paste it here or PM it to me?
To import the zip, you should be able to simply drop it into the file list to merge it into the current project.

Oh, I guess it wasn’t empty. I opened it with 7zip instead of windows explorer and the files were in a folder called ‘_’, which windows explorer apparently chose to hide.

3 Likes
  • Fixed a bug in the text rendering code
  • Optimization: allow ints to be used as object/array keys without converting to string first
  • Optimization: look up array length only once in for-of loops (non-standard behavior)
  • Optimization: recycle text and rect drawing commands between frames (experimental)
  • Added FAQ section to the wiki
  • Implemented ternary operator
5 Likes

I found the API functions without a verb a bit strange. Like image() instead of drawImage(), text() instead on drawText() etc.
Just having image() looks more like a class constructor to me.

1 Like

Yeah, I’d usually have drawImage as well, but I figured it might be good for people used to Pico-8 where they have functions like spr for drawing a sprite and rect for drawing a rectangle.

1 Like