Uncaught ReferenceError: FULLTILT is not defined

[thathurtabit]

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.

[dorukeker]

Hello,

If I was given $1 every time I miss something obvious, I'd be a millionaire :)

Are you adding manually? or via AMD or Common JS? Here is a direct copy/paste from README for manual adding

......

For production, add the minified complete version of gyronorm.js which is under the /dist folder.

<script src="<path_to_js_files>/gyronorm.complete.min.js"></script>

If you want to use the unminified version (for instance for development), then you need to add FullTilt manually.

<script src="<path_to_js_files>/fulltilt.min.js"></script>
<script src="<path_to_js_files>/gyronorm.js"></script>

.....

If you add gyronorm.complete.min.js , FULLTILT should come packaged with it. Is that the case?

Cheers, Doruk

[thathurtabit]

Hey @dorukeker, thanks for the response.

I installed via npm:

$ npm install gyronorm --save-dev

This version of gyronorm.js is built on top of the FullTilt project which uses JavaScript Promises. You do not need to install both libraries. FullTilt is bundled with gyronorm.js

And I'm currently using: var GyroNorm = require('gyronorm'); to include / require

But I'm getting: Uncaught ReferenceError: FULLTILT is not defined

Is this down to a problem with the FULLTILT dependency?

[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');

[cthorner]

Fulltilt is no longer MIT license ( https://github.com/adtile/Full-Tilt/issues/19 ). It looks like Adtile is protecting their patents by making it proprietary under CC Non-Commercial License 4.0 ( http://creativecommons.org/licenses/by-nc/4.0/ ). Which makes this library unusable for commercial use. Also, I think the Adtile license should be mentioned here as well?

[dorukeker]

Hi there, You can use what @angularsen mentioned to use the full version.

The full version of Gyronorm contains FullTilt version 0.5.3, which is MIT license. They changed the license type after v0.6.0.

Since it is all MIT, do you stil think there is an issue? @cthorner

Cheers, Doruk

[buesing]

I'm also having the same problem (FULLTILT is not defined). Using ES6 import after installing with npm. import GyroNorm from 'gyronorm';. When directly importing gyronorm.complete.js, I get other missing module errors. Also, I would have to manually update and manage the dependencies. Could you update the module so that it properly includes fulltilt or update the README so that it explains how exactly to use this module? Right now, doing what is stated in the README just doesn't work. Thanks!

[dorukeker]

@buesing and others I wont have time to update the module for the next couple of weeks. Is that possible some one from the list pics up and send a PR? I am more than glad to merge :)

[marcaaron]

Experiencing the same issue atm while trying to incorporate gyronorm into a React app.

import GyroNorm from 'gyronorm' results in: FULLTILT is not defined

const GyroNorm = require ('./gyronorm.complete.min.js') results in: 'define' is not defined & FULLTILT is not defined

simply adding it as a script to the index.html results in: Unexpected use of 'self', FULLTILT is not defined, & '_calibrationValues' is not defined

If I create a simple html site and do a basic script src to 'gyronorm.complete.min.js' everything works, but if I attempted to import via either of those two methods or even simply add it to my index.html page directly it breaks during compile. Anyone have any ideas?

[IanAbildskou]

I'm in the same position as @marcaaron

[dorukeker]

Experiencing the same issue atm while trying to incorporate gyronorm into a React app.

I don't have any React experience. So can't really help you out with this unfortunately. Just to give you some context: I build this library years ago to use with an installation. Since then I am almost never working with JS. So not very up-to-date with the (relatively) new frameworks.

I keep this thread open and will try to find some one to help out.

[IanAbildskou]

That's cool. Gyronorm seems like a very useful tool. I might spend some time investigating the issue. I'll keep you posted if I find anything.

[rudin]

Hi all, This bug doesn't look React-specific to me. It states that FULLTILT is not defined. By looking at the source code it says: new FULLTILT(... but indeed: where is FULLTILT being defined? Is it a class that has been/should be globally exposed to window?

[dorukeker]

Hello All,

I had some feedback from others who have experience in React. Below I list what I understand from their feedbacks. Please note that I might not be using the correct terminology.

As far as i understand when you add a library via React, it searches for any dependency library in NPM. This specific version of FULLTILT is not available on NPM due to licence issues. Therefore react cannot load that version and gives an error.

So for now that is all the info I have. Gyronorm is using FULLTILT library for the maths and calculation of the values that come form the vanilla JS API. The best way would be to re-write that section and remove FULLTILT dependency completely. Though I wont be able to pick this up at least for the coming months.

Anyone up for the task? :-) PR's are always welcome. Cheers, Doruk

[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.

[IanAbildskou]

Thanks for the cool fix @jepster-dk !

I found another fix.

I just added the fulltilt.js file to my repo and imported it in my index.js file like:

import FULLTILT from './fulltilt.js';

This was enough to mount it to the windowobject and make it available for the gyronorm script.

[Imprasna]

Uncaught ReferenceError: VanillaTilt is not defined I am getting this error can someone help me get this fixed, when using cdn I get this error in my console and it doesn't work the tilt functionality