Wrap tabs in IIFE

src/tabs/tabs.js

@@ -15,39 +15,44 @@
  * limitations under the License.
  */
 
-/**
+(function() {
+  'use strict';
+
+  /**
    * Class constructor for Tabs MDL component.
    * Implements MDL component design pattern defined at:
    * https://github.com/jasonmayes/mdl-component-design-pattern
+   *
    * @param {HTMLElement} element The element that will be upgraded.
    */
-function MaterialTabs(element) {
-  'use strict';
-
+  var MaterialTabs = function MaterialTabs(element) {
     // Stores the HTML element.
     this.element_ = element;
 
     // Initialize instance.
     this.init();
-}
+  };
+  window.MaterialTabs = MaterialTabs;
 
-/**
+  /**
    * Store constants in one place so they can be updated easily.
- * @enum {string}
+   *
+   * @enum {String}
    * @private
    */
-MaterialTabs.prototype.Constant_ = {
+  MaterialTabs.prototype.Constant_ = {
     // None at the moment.
-};
+  };
 
-/**
+  /**
    * Store strings for class names defined by this component that are used in
    * JavaScript. This allows us to simply change it in one place should we
    * decide to modify at a later date.
- * @enum {string}
+   *
+   * @enum {String}
    * @private
    */
-MaterialTabs.prototype.CssClasses_ = {
+  MaterialTabs.prototype.CssClasses_ = {
     TAB_CLASS: 'mdl-tabs__tab',
     PANEL_CLASS: 'mdl-tabs__panel',
     ACTIVE_CLASS: 'is-active',
@@ -57,15 +62,14 @@ MaterialTabs.prototype.CssClasses_ = {
     MDL_RIPPLE_CONTAINER: 'mdl-tabs__ripple-container',
     MDL_RIPPLE: 'mdl-ripple',
     MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events'
-};
+  };
 
-/**
+  /**
    * Handle clicks to a tabs component
+   *
    * @private
    */
-MaterialTabs.prototype.initTabs_ = function(e) {
-  'use strict';
-
+  MaterialTabs.prototype.initTabs_ = function() {
     if (this.element_.classList.contains(this.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {
       this.element_.classList.add(
         this.CssClasses_.MDL_JS_RIPPLE_EFFECT_IGNORE_EVENTS);
@@ -82,43 +86,40 @@ MaterialTabs.prototype.initTabs_ = function(e) {
     }
 
     this.element_.classList.add(this.CssClasses_.UPGRADED_CLASS);
-};
+  };
 
-/**
+  /**
    * Reset tab state, dropping active classes
+   *
    * @private
    */
-MaterialTabs.prototype.resetTabState_ = function() {
-  'use strict';
-
+  MaterialTabs.prototype.resetTabState_ = function() {
     for (var k = 0; k < this.tabs_.length; k++) {
       this.tabs_[k].classList.remove(this.CssClasses_.ACTIVE_CLASS);
     }
-};
+  };
 
-/**
+  /**
    * Reset panel state, droping active classes
+   *
    * @private
    */
-MaterialTabs.prototype.resetPanelState_ = function() {
-  'use strict';
-
+  MaterialTabs.prototype.resetPanelState_ = function() {
     for (var j = 0; j < this.panels_.length; j++) {
       this.panels_[j].classList.remove(this.CssClasses_.ACTIVE_CLASS);
     }
-};
-
-MaterialTabs.prototype.init = function() {
-  'use strict';
+  };
 
+  /**
+   * Initialize element.
+   */
+  MaterialTabs.prototype.init = function() {
     if (this.element_) {
       this.initTabs_();
     }
-};
-
-function MaterialTab(tab, ctx) {
-  'use strict';
+  };
 
+  function MaterialTab(tab, ctx) {
     if (tab) {
       if (ctx.element_.classList.contains(ctx.CssClasses_.MDL_JS_RIPPLE_EFFECT)) {
         var rippleContainer = document.createElement('span');
@@ -141,12 +142,13 @@ function MaterialTab(tab, ctx) {
       });
 
     }
-}
+  }
 
-// The component registers itself. It can assume componentHandler is available
-// in the global scope.
-componentHandler.register({
+  // The component registers itself. It can assume componentHandler is available
+  // in the global scope.
+  componentHandler.register({
     constructor: MaterialTabs,
     classAsString: 'MaterialTabs',
     cssClass: 'mdl-js-tabs'
-});
+  });
+})();