Uncaught ReferenceError: FULLTILT is not defined

The README.md mentions that FullTilt is bundled with gyronorm.js but when running the page (using the default values) I’m getting the error:

"Uncaught ReferenceError: FULLTILT is not defined"

Sorry if I’m missing something obvious. Thanks.

[ada-ada-ada-art]

I managed to get it working in Vue.js (which uses Webpack to load modules, and should be similar to React or Angular). It is by no means a pretty solution, but it might get others to where they need to go.

Step 1

Download v0.5.3 of Fulltilt here, since it seems to be the latest version with a license, which allows commercial use.

Step 2

Remove line 17-22 and 1469-1473 from fulltilt.js, i.e.

(function ( window ) {

// Only initialize the FULLTILT API if it is not already attached to the DOM
if ( window.FULLTILT !== undefined && window.FULLTILT !== null ) {
    return;
}

and

////// Attach FULLTILT to root DOM element //////

window.FULLTILT = FULLTILT;

})( window );

Step 3

Attach this to the end of the file: export default FULLTILT;. Then save the file somewhere locally in your project. For me, that was assets/fulltilt.js.

Step 4

Change line 112 and 116 in lib/gyronorm.js to: var deviceOrientationPromise = new this.FULLTILT.getDeviceOrientation({ 'type': _orientationBase }).then(function(controller) {

and

var deviceMotionPromise = new this.FULLTILT.getDeviceMotion().then(function(controller) {

Step 5

Import FULLTILT and Gyronorm to your project, e.g. like this:

import FULLTILT from '../assets/fulltilt.js';
import GyroNorm from 'gyronorm';

Step 6

After constructing the Gyronorm object and before initializing it, add Fulltilt to the object like this:

var gn = new GyroNorm();
gn.FULLTILT = FULLTILT;

That’s it. You should be able to work with Gyronorm now.

I’m sure there is a smarter way, e.g. by passing Fulltilt to the constructor or, as @dorukeker suggests, to remove the Fulltilt dependency altogether.

[angularsen]

I run into the same with webpack following this: https://github.com/dorukeker/gyronorm.js/pull/30

import GyroNorm from 'gyronorm';

    const gn = new GyroNorm();
    gn.init()
      .then(() => {
        gn.start(data => {
        });
      })
      .catch(e => {
      });

Will use the minified distributable meanwhile:

// import GyroNorm from 'gyronorm';
var GyroNorm = require('../libs/gyronorm.complete.js');