Tuesday, November 27, 2018

Bone Rush (PyWeek26)

I've been a regular participant in the pyweek contest. The last time i participated, i tried to use cocos-creator to work as editor for cocos2d (python) and was fairly successful in creating a clone of Reigns (a mobile game about making choices).

This time i wanted to replicate the rush fight game, where the faster you tap the faster the game moves. It's pretty fun mechanic and would fit well with the theme "flow". So i got to work with the same workflow i had before, create characters in inkscape and create sprites to be used in game. For a while i pondered about supporting skeletal animation using cocos-creator setup but was not sure if i was going to find time to do it, so i choose to go with sprite animations instead.

Creating the sprites was a big deal as i was not sure if i wanted to setup the character in blender / cocos-creator / Inkscape for capturing the animation images. Inkscape quickly fell apart as an option as there was no way i could keep track of all the animations and modify and create multiple files to be modified later. I had to choose between blender / cocos-creator.. i thankfully ran into another tool called dragon bones. This was pretty good as i could iterate over the animations and generate the sprite frames from the tool itself.

I later used the cocos-creator to setup the scene and played around with fonts and stuff but was able to quickly able to tweak the scene as much as i wanted. I wanted to add additional particle effects etc but was strapped for time and couldn't get it done in time.
The game is called Bone Rush and the above is a video of the game in action.

You can visit the official website for the game : bonerush

Saturday, March 17, 2018

Unity Game (WebGL) as a Firefox Extension

Firefox is known for its' extensions. That's in fact one of the main reasons people still use it. They had to take a bunch of bold steps in the recent times to stay relavant, like ending support for older extensions, changing the security model and the api.

Firefox  announced a new contest for addons, The Firefox Quantum Extensions challenge. I thought ill' give it a shot. I quickly looked up the documentation for creating an extension and looked pretty simple, there was this game for 2048 i was super excited to put games as extension, quick access short games might workout  i thought.. I wanted to check if i could use my existing game dev tools to create an extension.. hence Unity for FF Extension.

I quickly exported unity game as WebGL and tried loading it as an extension. I ran into issues with something called CSP i don't remember seeing it before but here it was preventing me from loading the unity webgl game as firefox extension. After a bunch of mucking around and not finding any straightforward answer i was able to get it working here it is for anybody else who might be looking for the same.

Three important parts for this (Get the starter code from GitHub)
  • Move the inline script from index.html to a separate file
  • Create a background script for FF addon that will open a new window through "BrowserAction"
  • Allow "blob:" support in the  security policy through manifest.json

Modify the index.html exported by UnityWebGL
The inline script is moved to a separate file called game_loader.js
 
The next thing to do is to add the right security policy to the manifest.json so that the unity loader can load the script blob.



The background script popuptest.js should be handling the browser action click event to launch a new window and load the games' index.html

With these things done, you should be able to load a unity game exported as webgl should be usable as a firefox extension.