HTML5 Extension SDK

Welcome to our brand new Clickteam Community Hub! We hope you will enjoy using the new features, which we will be further expanding in the coming months.

A few features including Passport are unavailable initially whilst we monitor stability of the new platform, we hope to bring these online very soon. Small issues will crop up following the import from our old system, including some message formatting, translation accuracy and other things.

Thank you for your patience whilst we've worked on this and we look forward to more exciting community developments soon!

Clickteam.
  • The HTML5 extension SDK is available on git at the following address :

    Please login to see this link.

    2 / 04 / 2014 : I have updated a much simpler version of the SDK.

    - Uses the source code of the HTML5 runtime installed on your machine
    - Contains a simple utility that does the job of poking the name of the extension in Extension.js if it is necessary (as it wont be necessary after 281.3 of the editor)
    - This utility also automatically copies your work in progress into the data\runtime\html5 directory of your installation of Fusion 2.5, as soon as you modify the code : you just have to do a Build & Run when you change something
    - Contains a Template.js, commented, and ready for you to modify

    It was ready actually since January, and I simply forgot to upload it on git. Sorry for that.

    Francois
    PM: Please login to see this link.

    Edited 3 times, last by Forum User (January 23, 2013 at 10:56 AM).

  • Is it still necessary to have methods to get typed parameters? Given that types are no longer important I think we should be able to avoid needing to specify the type. I would really like to see this factored away so that I can just call one method to get the action/condition parameters.

  • The way the parameter is stored in memory is different from parameter to parameter. Some have one, some have two values.
    Some have shorts other long (same in Javascript, but loading is different).
    And keeping it the same make conversion from Flash extensions very easy.

    Francois
    PM: Please login to see this link.

  • Can I identify which type of parameter is at index n? I noticed there is a .code property. Will this tell me what the parameter type at that index is? You may wish to keep the existing syntax for the purpose of porting from Flash (although if you were running through a Flash port, using 1 function means string replacing all references to get...Param with getParam, so it fits right into the current process and is just like removing type information from the functions), but that doesn't mean we shouldn't aim to have elegant methods for producing new HTML5 extensions.

    All I am suggesting is that if you know what the parameter type is at index n, you can call the correct methods internally for getting that param. getParam can return an object of any type, and I don't have to keep specifying types for every parameter, as from the perspective of the extension developer there is no need to supply information about the type of the parameter.

  • You are right. But there will be a switch/case statement in the routine, so it will be slower that just asking directly for the parameter.
    This can surely be done, but not really high in my priority list.

    Francois
    PM: Please login to see this link.

  • Hi everybody,
    I asked to Francois but he seems busy.
    I already did javascript plugins for another program, but I didn't have to make a c++ object for the runtime part.
    Because I want to adapt those plugins to MMF2's HTML5 runtime, could someone explain me how this runtime part works (I don't know C++ coding).
    Thanks

  • Sorry.
    There has been major modifications in the runtime for the last version. We will publish the new SDK on git as a open directory.
    Do you know any Javascript?
    The HTML5 SDK is not really different (only simpler) than Flash or XNA SDK.
    Please stay posted for more info on the SDK.

    Francois
    PM: Please login to see this link.

  • François, I've dropped to you some pm about that. I'm not sure you see exactly who am I.
    I already developped about 10 plugins for Construct2, so I obviously know javascript.

    My question was about the 'mfx object' side of the development process.
    I won't talk too much about C2 here, but their SDK is based on javascript for the edittime file awa for the runtime side.
    It seems the clickteam's HTML5 SDK needs to develop a C++ edittime object, and then link it to the javascript runtime *.js file.

    I've never developed on any SDK for MMF awa I never developed C++, so I don't know the process.
    Could someone take time to show me how to do this mfx object, add ACE to it, and then show me how to link ACE from mfx file to the javascript functions.

    François, si t'as pas tout compris, on peut continuer en français par PM ou par mail (si tu ne me remet pas, je suis celui qui t'a envoyé une série d'icone cette semaine...)

  • Sorry for not answering earlier.
    I wonder how construct does to have the edittime in Javascript with a C++ editor. Dont tell me that Construct2 is in Javascript?
    Well, you first have to install Visual Studio Express (free) and the SDK
    Just open one of the example project. The C++ SDK was the first SDK released. You will find the same functions (DisplayRunObject, HandleRunObject etc)
    Creating the list of actions and condition is defining the strings to use in the resource file, and entering the identifiers in an array at the start of the source code.
    I think everything is fairly well explained in the doc of the SDK.

    Francois
    PM: Please login to see this link.

  • Construct 2 uses a mix of JavaScript and xml for extensions and effects. Extensions are exported using the JavaScript api, so no C++ is required. This probably means they have embedded V8 (or some other JavaScript engine) into their application and have created JavaScript interfaces to their C++ api, so you can write extensions for Construct 2 without writing any C++, and it would be rather annoying if you had to write C++ for a JavaScript-only environment.

    In MMF2 we have the option of providing a JSON file for describing the extensions actions/conditions/expression, which means you can write extensions without having to write any C++ at all. It helps if you write your extensions for as many runtimes as you can, but you can write Javascript-only extensions:

    - Download the Flash dummy (it works as a dummy for any of the non-default runtimes) Please login to see this link.
    - Rename the flash dummy to whatever you are calling your extension, let's use MyExtension.mfx for example
    - Place a copy of MyExtensions.mfx in the Extensions and Data/Runtime directories
    - Create a JSON file describing the actions/conditions/expressions for your extension (see Please login to see this link. for an example of the syntax)
    - Place this JSON file in the Data/Runtime
    - Create an icon (png) for your extension and place it alonside the JSON
    - Write a HTML5 runtime extension conforming to your JSON, and place this at Data/Runtime/HTML5/MyExtension.js
    - Follow the instructions in the documentation for developing HTML5 extensions

    If you would like to see an example of this being done, take a look at Please login to see this link. - Here I have an object that works in Flash, Android and HTML5 only. The DateTime.mfx file is equivalent to the flash dummy, except I built the default EDIF project and embedded my own icon into it. I only wrote ActionScript for Flash, Java for Android and JavaScript for HTML5. No C++ was required at any stage. Hope this helps.

    Edited 3 times, last by MattEsch (November 2, 2012 at 12:41 PM).

  • I just finished to develop a Dropbox plugin in javascript but for another program (I won't speak about this software here, Francois ;)
    I didn't take the time to see how the MMF2 HTML5 Sdk works but it seems really complicated for me (specially for setting all ACE in runtime)

    I would like to know if I can count on you Francois, if I need some answer to some "newbies" questions about this SDK.
    If I succeed to figure out this SDK, then I will port all the extensions I already done for the other software.

    Thanks.

  • MattEsch, is your method still valid ?
    Because I started to work with it, and easily understand its working way.
    But I tried with a simple alert("") action and can't succeed to make it working at runtime. (I added CrunMyNameExtension to the extension.js, modified the runtimedev.js and change CrunMyNameExtension correctly into the MyExtension.js)
    Here is a little bit of my simple code in MyExtension.js:


    and then

    Code
    function test(param0) {
       alert(param0); }


    Also, is it possible to change the plugin properties (I'm affraid that I need to code in C++, which I just know anything of it, because for my plugins, it will be just so important.)

    Francois, it would be interesting to make sth like Construct 2' SDK for edittime in MMF3 - Because a lot of people (like me) knows only one or two language(s), and it's just "stupid" to not be able to code a plugin because you can't manage the edittime part....

    Edited once, last by iOSC (January 12, 2013 at 3:02 AM).

  • The action routine is simple enough, it should work.
    The only problem I see is how you defined your constants ACT_CREATE_FILE / ACT_CREATE_FOLDER
    Did you do as I do in the example JS files with :
    CRunMyExtension.ACT_CREATE_FILE=0 etc?
    If yes, the switch statement should be:
    case CRunMyExtension.ACT_CREATE_FILE:
    case CRunMyExtension.ACT_CREATE_FOLDER:
    Also make sure that the id number of the actions is the same in the C code and in the JS code.

    Francois
    PM: Please login to see this link.

  • as I told you in my PM, it sounds like you're speaking about the official SDK when I speak about the EDIF example that MattEsch showed me earlier.
    Also, what is your feeling about the way to make something for the edittime part in the future ?

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!