From 522bcbf058f53c26ada4a294e8b6f55514a4ebf5 Mon Sep 17 00:00:00 2001
From: Benjamin Gilbert <bgilbert@backtick.net>
Date: Sun, 12 May 2013 22:53:41 -0400
Subject: [PATCH] Add addClass()/removeClass() utility functions

---
 src/drawer.js        |  2 +-
 src/openseadragon.js | 42 ++++++++++++++++++++++++++++++++++++++++++
 src/viewer.js        | 10 ++--------
 3 files changed, 45 insertions(+), 9 deletions(-)

diff --git a/src/drawer.js b/src/drawer.js
index e9696012..40377aae 100644
--- a/src/drawer.js
+++ b/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"
     );
diff --git a/src/openseadragon.js b/src/openseadragon.js
index 186f48c1..3095799e 100644
--- a/src/openseadragon.js
+++ b/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
diff --git a/src/viewer.js b/src/viewer.js
index df8dce87..5b688bc3 100644
--- a/src/viewer.js
+++ b/src/viewer.js
@@ -515,10 +515,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( 
-                    'class',
-                    this.toolbar.element.className +" fullpage"
-                );
+                $.addClass( this.toolbar.element, 'fullpage' );
             }
             
             body.appendChild( this.element );
@@ -602,10 +599,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( 
-                    'class',
-                    this.toolbar.element.className.replace('fullpage','')
-                );
+                $.removeClass( this.toolbar.element, 'fullpage' );
                 //this.toolbar.element.style.position = 'relative';
                 this.toolbar.parentNode.insertBefore( 
                     this.toolbar.element,