HTML5 Runtime


Status	Released
Release Date	2014
Available for
Purchase	Expanded Capabilities:
Links	About the HTML5 Exporter HTML5 Export Module Details HTML5 Export Module 2.5 Support Forum HTML5 Export Module 2.5 Owner's Lounge

Fusion HTML5.png

The HTML5 Runtime exports creations for use any HTML5 browser that supports the Canvas element. The file needs to be placed on a web server to work as the creation cannot be locally ran through the file system. The free but limited version of the exporter is bundled with all versions of Clickteam Fusion 2.5 as of build 284. The free edition only exports to this limited version.

Build Types

There are three build types for HTML5:

HTML5 Application (limited version)

See Free Version.

HTML5 Development

This bundles the source code for all the extensions within Runtime.js, which will accelerate the time required to build the creation but use more disk space. The events used in your creation (the "source code") is also compiled with no obscuration, allowing for debugging or modification. This should not be uploaded to a live production server, as this could potentially allow others to steal your source code.

HTML5 Final Project

The build time will take slightly longer, but will only result obscured runtime code and the assets required for your creation. This is intended for final exports as it prevents hackers from stealing your source or modifying runtime behaviour.

Structure

The exporter creates files for use on a web server only. If the creation is attempted to run on a local computer (via the file system) than the web browser will display an error as it is not designed to do so.

Suppose the name of the creation is "MyApp".

MyApp
- index.html -- Your runtime is executed here.
- resources -- Your assets are stored here.
  - 9999.mp3 -- Silence required in order to play sounds on some devices.
  - MyApp.cc1
  - MyApp.cch
  - fire1D.png -- For virtual joysticks: P1 pushed down.
  - fire1U.png -- For virtual joysticks: P1 unpushed.
  - fire2D.png -- For virtual joysticks: P2 pushed down.
  - fire2U.png -- For virtual joysticks: P2 unpushed.
  - index.html -- Redirects to Clickteam's HTML5 webpage.
  - joyback.png -- For virtual joysticks: Beneath the stick.
  - joyfront.png -- For virtual joysticks: Top of the stick.
  - M0001*.png -- All your image assets.
  - 0000*.wav -- All your audio assets in WAV format.
  - 0000*.ogg -- All your audio assets in OGG format.
- src -- Your source code is stored here.
  - Runtime.js -- Compiled source code.
  - index.html -- Redirects to Clickteam's HTML5 webpage.

Running on a local system

As you cannot run index.html directly from the file system, you will need a web server and access it via a URL. There are a few various methods.

By pressing Build & Run within Fusion.
- This runs a Lacewing-powered web server on your local system, opening your web browser.
- This option is not compatible for Mac or Wine users.
Using python's web server module.
- Python must be installed on your system.
- Open a command prompt with your creation folder as the working directory.
- Type this command to host on port 8080: python -m SimpleHTTPServer 8080
Running your own local web server
- Apache - Windows, Mac, Linux, and others.
- Microsoft Internet Information Services (IIS) - Windows only.
- Personal Web Sharing - Mac only.

Running on a external server

There are many services available that will allow you to host your HTML5 creations, some free and others paid.

Pksoft Shared FTP Server This is for Fusion users to host their games and is intended for testing purposes. Other users can see your files, because it is a shared login. You cannot embed your apps. (Instructions)
BitBalloon This is a web hosting platform for hosting static sites and apps. HTTPS is enabled. You create a personal account (You must have a Mozilla Persona or GitHub account.) It is free for _.bitballoon.com URLs and paid for other domain URLs (_.mydomain.com). You cannot embed your apps. (Instructions)
netlify This is a web hosting platform for hosting static sites and apps. HTTPS is enabled. You create a personal account (You can also use a Mozilla Persona or GitHub account.) There are free & paid plans. You can embed your apps in iframes. (Instructions)
Dropbox Pro or Business You can upload your project to the Public folder and share links. You can also embed your apps in iframes. (Compare plans)

Free Version

The free version comes bundled with Fusion 2.5 build 284 and later. It is also the only exporter available for Clickteam Fusion 2.5 Free, which features more editor limitations.

Runtime Limitations

Each application cannot contain more than 3 frames.
Each frame cannot contain more than 100 backdrop objects and 30 other objects.
Each frame cannot contain more than 150 events.

Available Objects

Available Movements

Information from Clickteam

Debugging

Most major web browsers feature "Developer Tools" that allow debugging and inspection of code. This can usually be activated by pressing F12. The web console can be invaluable to identify why a project is not loading or a trace back of a crash or freeze.

For instance, a common error that may occur is:

Uncaught ReferenceError: Runtime is not defined

This is because the Runtime.js file is not accessible. This could be due to the fact it's non-existent, is pointing to the wrong file (eg. RuntimeDev.js) or there is a permissions error on the web server.

If the HTML5 runtime promptly halts and freezes due to an error, this could be as a result of a bug in an extension or object, which can be reported to the Bug Tracker should it be easily reproduced.

If no buttons show up and you cannot click on active objects, upgrade to build 285.1 .

Contributors to this page

Advaith (38.9%), Lh37 (61.1%)


		This is an archive.
		See the new ClickWiki at https://clickwiki.github.io. This version is just an archive for the purposes of migrating content to the new structure.