Here we show you how to bring motion into you web-page. We'll do this in simple steps.

If you are impatient you may skip the explanation and view the HelloWorld! immediately.

Note that this tutorial assumes that you have already created an App, and a named motion within that App. If you have not, the tutorial App Hello will take you through the steps.

Bringing shared motion into you web page is easy. You'll need:

1. scripts
2. the APPID of your MCorp application and the NAME of your motion
3. three lines of code

<!-- Import Motion Corporation services -->
<script type="text/javascript" src="http://www.mcorp.no/lib/mcorp-2.0.js"></script>

Add these lines to the "head" section of your HTML page:

<script type="text/javascript">

// APPID is a number, but please use a string to hold it, otherwise it could get truncated.
var app = MCorp.app("YOUR_APPID_GOES_HERE");
app.run = function () {
    // your code goes here
};
app.init();

</script>

You'll find the APPID in App Info. It must be a string, otherwise JavaScript might round it.

The app variable will hold your App object, which provide access to your motions. More about the the App object in App Hello.

App initialisation is started by app.init(). When completed, app.run() is executed.

<script type="text/javascript">

// APPID is a number, but please use a string to hold it, otherwise it could get truncated.
var app = MCorp.app("YOUR_APPID_GOES_HERE");
app.run = function () {
    app.motions[MOTION_NAME_GOES_HERE].on("timeupdate", function (e) {console.log(e.pos);});
};
app.init();

</script>

This short piece of code will print the position of the motion to the console whenever the timeupdate event fires. If the motion is paused timeupdate will only fire once. However, if the motion is requested to play, timeupdate will start fireing periodically (5Hz).

All the motions of this application are available in app.motions. You'll get the correct one by supplying its name, as defined in App Info.

To investigate further what you can do with your motions, please have a look at the Motion API.