Apply JSHint and JSCS with jQuery configs

Closes gh-535. Closes gh-529.

.gitignore

@@ -0,0 +1,2 @@
+/node_modules
+/npm-debug.log

.jshintrc

@@ -0,0 +1,12 @@
+{
+	"boss": true,
+	"curly": true,
+	"eqeqeq": true,
+	"eqnull": true,
+	"expr": true,
+	"immed": true,
+	"noarg": true,
+	"quotmark": "double",
+	"undef": true,
+	"unused": true
+}

CONTRIBUTING.md

@@ -19,3 +19,4 @@ Guidelines:
 * If proposing a feature, make sure to discuss that as an issue first.
 * Create a new [topic branch](https://github.com/dchelimsky/rspec/wiki/Topic-Branches) for every separate change you make.
 * Make sure impress.js runs successfully on as many browsers as you can test.
+* Run `npm lint` to make sure the code is consistent with the project standards.

js/impress.js

@@ -22,7 +22,7 @@
 // You are one of those who like to know how things work inside?
 // Let me show you the cogs that make impress.js run...
 ( function( document, window ) {
-    'use strict';
+    "use strict";
 
     // HELPER FUNCTIONS
 
@@ -31,15 +31,15 @@
     // The code is heavily inspired by Modernizr http://www.modernizr.com/
     var pfx = ( function() {
 
-        var style = document.createElement('dummy').style,
+        var style = document.createElement( "dummy" ).style,
-            prefixes = 'Webkit Moz O ms Khtml'.split(' '),
+            prefixes = "Webkit Moz O ms Khtml".split( " " ),
             memory = {};
 
         return function( prop ) {
             if ( typeof memory[ prop ] === "undefined" ) {
 
                 var ucProp  = prop.charAt( 0 ).toUpperCase() + prop.substr( 1 ),
-                    props   = (prop + ' ' + prefixes.join(ucProp + ' ') + ucProp).split(' ');
+                    props   = ( prop + " " + prefixes.join( ucProp + " " ) + ucProp ).split( " " );
 
                 memory[ prop ] = null;
                 for ( var i in props ) {
@@ -141,7 +141,8 @@
     // `getElementFromHash` returns an element located by id from hash part of
     // window location.
     var getElementFromHash = function() {
-        // get id from url # by removing `#` or `#/` from the beginning,
+
+        // Get id from url # by removing `#` or `#/` from the beginning,
         // so both "fallback" `#slide-id` and "enhanced" `#/slide-id` will work
         return byId( window.location.hash.replace( /^#\/?/, "" ) );
     };
@@ -169,20 +170,22 @@
 
     var ua = navigator.userAgent.toLowerCase();
     var impressSupported =
-                          // browser should support CSS 3D transtorms 
+
+                          // Browser should support CSS 3D transtorms
                            ( pfx( "perspective" ) !== null ) &&
 
-                          // and `classList` and `dataset` APIs
+                          // Browser should support `classList` and `dataset` APIs
                            ( body.classList ) &&
                            ( body.dataset ) &&
 
-                          // but some mobile devices need to be blacklisted,
+                          // But some mobile devices need to be blacklisted,
                           // because their CSS 3D support or hardware is not
                           // good enough to run impress.js properly, sorry...
                            ( ua.search( /(iphone)|(ipod)|(android)/ ) === -1 );
 
     if ( !impressSupported ) {
-        // we can't be sure that `classList` is supported
+
+        // We can't be sure that `classList` is supported
         body.className += " impress-not-supported ";
     } else {
         body.classList.remove( "impress-not-supported" );
@@ -196,7 +199,7 @@
     // sure if it makes any sense in practice ;)
     var roots = {};
 
-    // some default config values.
+    // Some default config values.
     var defaults = {
         width: 1024,
         height: 768,
@@ -208,7 +211,7 @@
         transitionDuration: 1000
     };
 
-    // it's just an empty function ... and a useless comment.
+    // It's just an empty function ... and a useless comment.
     var empty = function() { return false; };
 
     // IMPRESS.JS API
@@ -233,30 +236,30 @@
 
         rootId = rootId || "impress";
 
-        // if given root is already initialized just return the API
+        // If given root is already initialized just return the API
         if ( roots[ "impress-root-" + rootId ] ) {
             return roots[ "impress-root-" + rootId ];
         }
 
-        // data of all presentation steps
+        // Data of all presentation steps
         var stepsData = {};
 
-        // element of currently active step
+        // Element of currently active step
         var activeStep = null;
 
-        // current state (position, rotation and scale) of the presentation
+        // Current state (position, rotation and scale) of the presentation
         var currentState = null;
 
-        // array of step elements
+        // Array of step elements
         var steps = null;
 
-        // configuration options
+        // Configuration options
         var config = null;
 
-        // scale factor of the browser window
+        // Scale factor of the browser window
         var windowScale = null;
 
-        // root presentation elements
+        // Root presentation elements
         var root = byId( rootId );
         var canvas = document.createElement( "div" );
 
@@ -270,7 +273,7 @@
         // `impress:stepleave` is triggered when the step is left (the
         // transition to next step just starts).
 
-        // reference to last entered step
+        // Reference to last entered step
         var lastEntered = null;
 
         // `onStepEnter` is called whenever the step element is entered
@@ -337,11 +340,11 @@
             var meta = $( "meta[name='viewport']" ) || document.createElement( "meta" );
             meta.content = "width=device-width, minimum-scale=1, maximum-scale=1, user-scalable=no";
             if ( meta.parentNode !== document.head ) {
-                meta.name = 'viewport';
+                meta.name = "viewport";
                 document.head.appendChild( meta );
             }
 
-            // initialize configuration object
+            // Initialize configuration object
             var rootData = root.dataset;
             config = {
                 width: toNumber( rootData.width, defaults.width ),
@@ -349,18 +352,20 @@
                 maxScale: toNumber( rootData.maxScale, defaults.maxScale ),
                 minScale: toNumber( rootData.minScale, defaults.minScale ),
                 perspective: toNumber( rootData.perspective, defaults.perspective ),
-                transitionDuration: toNumber( rootData.transitionDuration, defaults.transitionDuration )
+                transitionDuration: toNumber(
+                  rootData.transitionDuration, defaults.transitionDuration
+                )
             };
 
             windowScale = computeWindowScale( config );
 
-            // wrap steps with "canvas" element
+            // Wrap steps with "canvas" element
             arrayify( root.childNodes ).forEach( function( el ) {
                 canvas.appendChild( el );
             } );
             root.appendChild( canvas );
 
-            // set initial styles
+            // Set initial styles
             document.documentElement.style.height = "100%";
 
             css( body, {
@@ -386,11 +391,11 @@
             body.classList.remove( "impress-disabled" );
             body.classList.add( "impress-enabled" );
 
-            // get and init steps
+            // Get and init steps
             steps = $$( ".step", root );
             steps.forEach( initStep );
 
-            // set a default initial state of the canvas
+            // Set a default initial state of the canvas
             currentState = {
                 translate: { x: 0, y: 0, z: 0 },
                 rotate:    { x: 0, y: 0, z: 0 },
@@ -415,15 +420,17 @@
             return ( step && step.id && stepsData[ "impress-" + step.id ] ) ? step : null;
         };
 
-        // used to reset timeout for `impress:stepenter` event
+        // Used to reset timeout for `impress:stepenter` event
         var stepEnterTimeout = null;
 
-        // `goto` API function that moves to step given with `el` parameter (by index, id or element),
+        // `goto` API function that moves to step given with `el` parameter
-        // with a transition `duration` optionally given as second parameter.
+        // (by index, id or element), with a transition `duration` optionally
+        // given as second parameter.
         var goto = function( el, duration ) {
 
             if ( !initialized || !( el = getStep( el ) ) ) {
-                // presentation not initialized or given element is not a step
+
+                // Presentation not initialized or given element is not a step
                 return false;
             }
 
@@ -434,7 +441,8 @@
             // So, as a lousy (and lazy) workaround we will make the page scroll back to the top
             // whenever slide is selected
             //
-            // If you are reading this and know any better way to handle it, I'll be glad to hear about it!
+            // If you are reading this and know any better way to handle it, I'll be glad to hear
+            // about it!
             window.scrollTo( 0, 0 );
 
             var step = stepsData[ "impress-" + el.id ];
@@ -447,7 +455,7 @@
 
             body.classList.add( "impress-on-" + el.id );
 
-            // compute target state of the canvas based on given step
+            // Compute target state of the canvas based on given step
             var target = {
                 rotate: {
                     x: -step.rotate.x,
@@ -473,7 +481,7 @@
             duration = toNumber( duration, config.transitionDuration );
             var delay = ( duration / 2 );
 
-            // if the same step is re-selected, force computing window scaling,
+            // If the same step is re-selected, force computing window scaling,
             // because it is likely to be caused by window resize
             if ( el === activeStep ) {
                 windowScale = computeWindowScale( config );
@@ -481,7 +489,7 @@
 
             var targetScale = target.scale * windowScale;
 
-            // trigger leave of currently active element (if it's not the same step again)
+            // Trigger leave of currently active element (if it's not the same step again)
             if ( activeStep && activeStep !== el ) {
                 onStepLeave( activeStep );
             }
@@ -495,7 +503,8 @@
             // visually nice and 'natural' looking transitions), so we need to know
             // that both of them are finished.
             css( root, {
-                // to keep the perspective look similar for different scales
+
+                // To keep the perspective look similar for different scales
                 // we need to 'scale' the perspective, too
                 transform: perspective( config.perspective / targetScale ) + scale( targetScale ),
                 transitionDuration: duration + "ms",
@@ -510,36 +519,47 @@
 
             // Here is a tricky part...
             //
-            // If there is no change in scale or no change in rotation and translation, it means there was actually
+            // If there is no change in scale or no change in rotation and translation, it means
-            // no delay - because there was no transition on `root` or `canvas` elements.
+            // there was actually no delay - because there was no transition on `root` or `canvas`
-            // We want to trigger `impress:stepenter` event in the correct moment, so here we compare the current
+            // elements. We want to trigger `impress:stepenter` event in the correct moment, so
-            // and target values to check if delay should be taken into account.
+            // here we compare the current and target values to check if delay should be taken into
+            // account.
             //
-            // I know that this `if` statement looks scary, but it's pretty simple when you know what is going on
+            // I know that this `if` statement looks scary, but it's pretty simple when you know
+            // what is going on
             // - it's simply comparing all the values.
             if ( currentState.scale === target.scale ||
-                (currentState.rotate.x === target.rotate.x && currentState.rotate.y === target.rotate.y &&
+                ( currentState.rotate.x === target.rotate.x &&
-                 currentState.rotate.z === target.rotate.z && currentState.translate.x === target.translate.x &&
+                  currentState.rotate.y === target.rotate.y &&
-                 currentState.translate.y === target.translate.y && currentState.translate.z === target.translate.z) ) {
+                  currentState.rotate.z === target.rotate.z &&
+                  currentState.translate.x === target.translate.x &&
+                  currentState.translate.y === target.translate.y &&
+                  currentState.translate.z === target.translate.z ) ) {
                 delay = 0;
             }
 
-            // store current state
+            // Store current state
             currentState = target;
             activeStep = el;
 
             // And here is where we trigger `impress:stepenter` event.
-            // We simply set up a timeout to fire it taking transition duration (and possible delay) into account.
+            // We simply set up a timeout to fire it taking transition duration
+            // (and possible delay) into account.
             //
-            // I really wanted to make it in more elegant way. The `transitionend` event seemed to be the best way
+            // I really wanted to make it in more elegant way. The `transitionend` event seemed to
-            // to do it, but the fact that I'm using transitions on two separate elements and that the `transitionend`
+            // be the best way to do it, but the fact that I'm using transitions on two separate
-            // event is only triggered when there was a transition (change in the values) caused some bugs and 
+            // elements and that the `transitionend` event is only triggered when there was a
-            // made the code really complicated, cause I had to handle all the conditions separately. And it still
+            // transition (change in the values) caused some bugs and made the code really
-            // needed a `setTimeout` fallback for the situations when there is no transition at all.
+            // complicated, cause I had to handle all the conditions separately. And it still
-            // So I decided that I'd rather make the code simpler than use shiny new `transitionend`.
+            // needed a `setTimeout` fallback for the situations when there is no transition at
+            // all.
+            // So I decided that I'd rather make the code simpler than use shiny new
+            // `transitionend`.
             //
-            // If you want learn something interesting and see how it was done with `transitionend` go back to
+            // If you want learn something interesting and see how it was done with `transitionend`
-            // version 0.5.2 of impress.js: http://github.com/bartaz/impress.js/blob/0.5.2/js/impress.js
+            // go back to
+            // version 0.5.2 of impress.js:
+            // http://github.com/bartaz/impress.js/blob/0.5.2/js/impress.js
             window.clearTimeout( stepEnterTimeout );
             stepEnterTimeout = window.setTimeout( function() {
                 onStepEnter( activeStep );
@@ -578,6 +598,7 @@
         // For example the `present` class can be used to trigger some custom
         // animations when step is shown.
         root.addEventListener( "impress:init", function() {
+
             // STEP CLASSES
             steps.forEach( function( step ) {
                 step.classList.add( "future" );
@@ -599,7 +620,7 @@
         // Adding hash change support.
         root.addEventListener( "impress:init", function() {
 
-            // last hash detected
+            // Last hash detected
             var lastHash = "";
 
             // `#/step-id` is used instead of `#step-id` to prevent default browser
@@ -613,6 +634,7 @@
             }, false );
 
             window.addEventListener( "hashchange", function() {
+
                 // When the step is entered hash in the location is updated
                 // (just few lines above from here), so the hash change is
                 // triggered and we would call `goto` again on the same element.
@@ -630,7 +652,7 @@
 
         body.classList.add( "impress-disabled" );
 
-        // store and return API for given impress.js root element
+        // Store and return API for given impress.js root element
         return ( roots[ "impress-root-" + rootId ] = {
             init: init,
             goto: goto,
@@ -640,7 +662,7 @@
 
     };
 
-    // flag that can be used in JS to check if browser have passed the support test
+    // Flag that can be used in JS to check if browser have passed the support test
     impress.supported = impressSupported;
 
 } )( document, window );
@@ -654,9 +676,9 @@
 // In future I think about moving it to make them optional, move to separate files
 // and treat more like a 'plugins'.
 ( function( document, window ) {
-    'use strict';
+    "use strict";
 
-    // throttling function calls, by Remy Sharp
+    // Throttling function calls, by Remy Sharp
     // http://remysharp.com/2010/07/21/throttling-function-calls/
     var throttle = function( fn, delay ) {
         var timer = null;
@@ -669,8 +691,9 @@
         };
     };
 
-    // wait for impress.js to be initialized
+    // Wait for impress.js to be initialized
     document.addEventListener( "impress:init", function( event ) {
+
         // Getting API from event data.
         // So you don't event need to know what is the id of the root element
         // or anything. `impress:init` event data gives you everything you
@@ -681,7 +704,9 @@
 
         // Prevent default keydown action when one of supported key is pressed.
         document.addEventListener( "keydown", function( event ) {
-            if ( event.keyCode === 9 || ( event.keyCode >= 32 && event.keyCode <= 34 ) || (event.keyCode >= 37 && event.keyCode <= 40) ) {
+            if ( event.keyCode === 9 ||
+               ( event.keyCode >= 32 && event.keyCode <= 34 ) ||
+               ( event.keyCode >= 37 && event.keyCode <= 40 ) ) {
                 event.preventDefault();
             }
         }, false );
@@ -707,18 +732,20 @@
                 return;
             }
 
-            if ( event.keyCode === 9 || ( event.keyCode >= 32 && event.keyCode <= 34 ) || (event.keyCode >= 37 && event.keyCode <= 40) ) {
+            if ( event.keyCode === 9 ||
+               ( event.keyCode >= 32 && event.keyCode <= 34 ) ||
+               ( event.keyCode >= 37 && event.keyCode <= 40 ) ) {
                 switch ( event.keyCode ) {
-                    case 33: // pg up
+                    case 33: // Page up
-                    case 37: // left
+                    case 37: // Left
-                    case 38: // up
+                    case 38: // Up
                              api.prev();
                              break;
-                    case 9:  // tab
+                    case 9:  // Tab
-                    case 32: // space
+                    case 32: // Space
-                    case 34: // pg down
+                    case 34: // Page down
-                    case 39: // right
+                    case 39: // Right
-                    case 40: // down
+                    case 40: // Down
                              api.next();
                              break;
                 }
@@ -727,10 +754,11 @@
             }
         }, false );
 
-        // delegated handler for clicking on the links to presentation steps
+        // Delegated handler for clicking on the links to presentation steps
         document.addEventListener( "click", function( event ) {
-            // event delegation with "bubbling"
+
-            // check if event target (or any of its parents is a link)
+            // Event delegation with "bubbling"
+            // Check if event target (or any of its parents is a link)
             var target = event.target;
             while ( ( target.tagName !== "A" ) &&
                     ( target !== document.documentElement ) ) {
@@ -740,8 +768,8 @@
             if ( target.tagName === "A" ) {
                 var href = target.getAttribute( "href" );
 
-                // if it's a link to presentation step, target this step
+                // If it's a link to presentation step, target this step
-                if ( href && href[0] === '#' ) {
+                if ( href && href[ 0 ] === "#" ) {
                     target = document.getElementById( href.slice( 1 ) );
                 }
             }
@@ -752,11 +780,13 @@
             }
         }, false );
 
-        // delegated handler for clicking on step elements
+        // Delegated handler for clicking on step elements
         document.addEventListener( "click", function( event ) {
             var target = event.target;
-            // find closest step element that is not active
+
-            while ( !(target.classList.contains("step") && !target.classList.contains("active")) &&
+            // Find closest step element that is not active
+            while ( !( target.classList.contains( "step" ) &&
+                      !target.classList.contains( "active" ) ) &&
                       ( target !== document.documentElement ) ) {
                 target = target.parentNode;
             }
@@ -766,7 +796,7 @@
             }
         }, false );
 
-        // touch handler to detect taps on the left and right side of the screen
+        // Touch handler to detect taps on the left and right side of the screen
         // based on awesome work of @hakimel: https://github.com/hakimel/reveal.js
         document.addEventListener( "touchstart", function( event ) {
             if ( event.touches.length === 1 ) {
@@ -786,9 +816,10 @@
             }
         }, false );
 
-        // rescale presentation when window is resized
+        // Rescale presentation when window is resized
         window.addEventListener( "resize", throttle( function() {
-            // force going to active step again, to trigger rescaling
+
+            // Force going to active step again, to trigger rescaling
             api.goto( document.querySelector( ".step.active" ), 500 );
         }, 250 ), false );
 

package.json

@@ -0,0 +1,31 @@
+{
+  "name": "impress.js",
+  "version": "0.5.3",
+  "description": "It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.",
+  "main": "js/impress.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/impress/impress.js.git"
+  },
+  "keywords": [
+    "presentation",
+    "slides",
+    "slideshow",
+    "css3",
+    "transitions",
+    "transforms",
+    "browser"
+  ],
+  "author": "Bartek Szopka",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/bartaz/impress.js/issues"
+  },
+  "scripts": {
+    "lint": "jshint js/impress.js && jscs js/impress.js --preset=jquery"
+  },
+  "devDependencies": {
+    "jscs": "2.11.0",
+    "jshint": "2.9.1"
+  }
+}