Merge branch 'fullpage-class' of github.com:bgilbert/openseadragon into bgilbert-fullpage-class

Fixed Conflicts:
	test/test.html

src/drawer.js

@@ -377,7 +377,7 @@ $.Drawer.prototype = {
         element.href    = "#/overlay/"+id;
     }
     element.id        = id;
-    element.className = element.className + " " + ( overlay.className ?
+    $.addClass( element, overlay.className ?
         overlay.className :
         "openseadragon-overlay"
     );

src/openseadragon.js

@@ -1025,6 +1025,48 @@ window.OpenSeadragon = window.OpenSeadragon || function( options ){
         },
 
 
+        /**
+         * Add the specified CSS class to the element if not present.
+         * @name $.addClass
+         * @function
+         * @param {Element|String} element
+         * @param {String} className
+         */
+        addClass: function( element, className ) {
+            element = $.getElement( element );
+
+            if ( ! element.className ) {
+                element.className = className;
+            } else if ( ( ' ' + element.className + ' ' ).
+                indexOf( ' ' + className + ' ' ) === -1 ) {
+                element.className += ' ' + className;
+            }
+        },
+
+
+        /**
+         * Remove the specified CSS class from the element.
+         * @name $.removeClass
+         * @function
+         * @param {Element|String} element
+         * @param {String} className
+         */
+        removeClass: function( element, className ) {
+            var oldClasses,
+                newClasses = [],
+                i;
+
+            element = $.getElement( element );
+            oldClasses = element.className.split( /\s+/ );
+            for ( i = 0; i < oldClasses.length; i++ ) {
+                if ( oldClasses[ i ] && oldClasses[ i ] !== className ) {
+                    newClasses.push( oldClasses[ i ] );
+                }
+            }
+            element.className = newClasses.join(' ');
+        },
+
+
         /**
          * Adds an event listener for the given element, eventName and handler.
          * @function

src/viewer.js

@@ -515,12 +515,10 @@ $.extend( $.Viewer.prototype, $.EventHandler.prototype, $.ControlDock.prototype,
 
                 //Make sure the user has some ability to style the toolbar based
                 //on the mode
-                this.toolbar.element.setAttribute( 
+                $.addClass( this.toolbar.element, 'fullpage' );
-                    'class',
-                    this.toolbar.element.className +" fullpage"
-                );
             }
             
+            $.addClass( this.element, 'fullpage' );
             body.appendChild( this.element );
             
             if( $.supportsFullScreen ){
@@ -590,6 +588,8 @@ $.extend( $.Viewer.prototype, $.EventHandler.prototype, $.ControlDock.prototype,
             for ( i = 0; i < nodes; i++ ){
                 body.appendChild( this.previousBody.shift() );
             }
+
+            $.removeClass( this.element, 'fullpage' );
             THIS[ this.hash ].prevElementParent.insertBefore(
                 this.element,
                 THIS[ this.hash ].prevNextSibling
@@ -602,10 +602,7 @@ $.extend( $.Viewer.prototype, $.EventHandler.prototype, $.ControlDock.prototype,
 
                 //Make sure the user has some ability to style the toolbar based
                 //on the mode
-                this.toolbar.element.setAttribute( 
+                $.removeClass( this.toolbar.element, 'fullpage' );
-                    'class',
-                    this.toolbar.element.className.replace('fullpage','')
-                );
                 //this.toolbar.element.style.position = 'relative';
                 this.toolbar.parentNode.insertBefore( 
                     this.toolbar.element,

test/basic.js

@@ -102,6 +102,23 @@
         Util.simulateViewerClick(viewer, 0.25, 0.25);
     });
 
+    // ----------
+    test('Fullscreen', function() {
+        ok(!viewer.isFullPage(), 'Started out not fullpage');
+        ok(!$(viewer.element).hasClass('fullpage'),
+            'No fullpage class on div');
+
+        viewer.setFullPage(true);
+        ok(viewer.isFullPage(), 'Enabled fullpage');
+        ok($(viewer.element).hasClass('fullpage'),
+            'Fullpage class added to div');
+
+        viewer.setFullPage(false);
+        ok(!viewer.isFullPage(), 'Disabled fullpage');
+        ok(!$(viewer.element).hasClass('fullpage'),
+            'Fullpage class removed from div');
+    });
+
     // ----------
     asyncTest('Close', function() {
         var closeHandler = function() {

test/test.html

@@ -14,9 +14,10 @@
     <script src="/test/lib/jquery-1.9.1.min.js"></script>
     <script src="/test/lib/jquery.simulate.js"></script>
     <script src="/build/openseadragon/openseadragon.min.js"></script>
-    <script src="/test/util.js"></script>
+    <script src="/test/test.js"></script>
     <script src="/test/basic.js"></script>
     <script src="/test/strings.js"></script>
     <script src="/test/formats.js"></script>
+    <script src="/test/utils.js"></script>
 </body>
 </html>

test/utils.js

@@ -0,0 +1,52 @@
+(function() {
+    module("utils");
+
+    test("addRemoveClass", function() {
+        var div = OpenSeadragon.makeNeutralElement('div');
+        strictEqual(div.className, '',
+            "makeNeutralElement set no classes");
+
+        OpenSeadragon.addClass(div, 'foo');
+        strictEqual(div.className, 'foo',
+            "Added first class");
+        OpenSeadragon.addClass(div, 'bar');
+        strictEqual(div.className, 'foo bar',
+            "Added second class");
+        OpenSeadragon.addClass(div, 'baz');
+        strictEqual(div.className, 'foo bar baz',
+            "Added third class");
+        OpenSeadragon.addClass(div, 'plugh');
+        strictEqual(div.className, 'foo bar baz plugh',
+            "Added fourth class");
+
+        OpenSeadragon.addClass(div, 'foo');
+        strictEqual(div.className, 'foo bar baz plugh',
+            "Re-added first class");
+        OpenSeadragon.addClass(div, 'bar');
+        strictEqual(div.className, 'foo bar baz plugh',
+            "Re-added middle class");
+        OpenSeadragon.addClass(div, 'plugh');
+        strictEqual(div.className, 'foo bar baz plugh',
+            "Re-added last class");
+
+        OpenSeadragon.removeClass(div, 'xyzzy');
+        strictEqual(div.className, 'foo bar baz plugh',
+            "Removed nonexistent class");
+        OpenSeadragon.removeClass(div, 'ba');
+        strictEqual(div.className, 'foo bar baz plugh',
+            "Removed nonexistent class with existent substring");
+
+        OpenSeadragon.removeClass(div, 'bar');
+        strictEqual(div.className, 'foo baz plugh',
+            "Removed middle class");
+        OpenSeadragon.removeClass(div, 'plugh');
+        strictEqual(div.className, 'foo baz',
+            "Removed last class");
+        OpenSeadragon.removeClass(div, 'foo');
+        strictEqual(div.className, 'baz',
+            "Removed first class");
+        OpenSeadragon.removeClass(div, 'baz');
+        strictEqual(div.className, '',
+            "Removed only class");
+    });
+})();