Converted Magellan, Off-Canvas, Orbit, Reveal, and Responsive Toggle to template...

diff --git a/js/foundation.magellan.js b/js/foundation.magellan.js
index f6ba9d7b0e018ea60a1ef48de1d965134533713a..17aa1542bc6c80fa253ef4c52177f2ad784517d2 100644 (file)
--- a/js/foundation.magellan.js
+++ b/js/foundation.magellan.js
@@ -204,7 +204,7 @@
    */
   Magellan.prototype.destroy = function(){
     this.$element.off('.zf.trigger .zf.magellan')
-        .find('.' + this.options.activeClass).removeClass(this.options.activeClass);
+        .find(`.${this.options.activeClass}`).removeClass(this.options.activeClass);
 
     if(this.options.deepLinking){
       var hash = this.$active[0].getAttribute('href');

diff --git a/js/foundation.offcanvas.js b/js/foundation.offcanvas.js
index 9b9e1ea7019c20d62181bc2aa034e95ee4af5f93..f53e3941e9d76011b9ec34394be66f089c2f9272 100644 (file)
--- a/js/foundation.offcanvas.js
+++ b/js/foundation.offcanvas.js
@@ -304,7 +304,7 @@ OffCanvas.prototype.close = function(cb) {
   var _this = this;
 
   //  Foundation.Move(this.options.transitionTime, this.$element, function(){
-  $('[data-off-canvas-wrapper]').removeClass('is-off-canvas-open is-open-' + _this.options.position);
+  $('[data-off-canvas-wrapper]').removeClass(`is-off-canvas-open is-open-${_this.options.position}`);
   _this.$element.removeClass('is-open');
     // Foundation._reflow();
   // });

diff --git a/js/foundation.orbit.js b/js/foundation.orbit.js
index 3fda7d956e637dff4948147a9859d96e7a40e27e..1ca6ef604e53de7b74c6afe42ec5ecc40d6136bd 100644 (file)
--- a/js/foundation.orbit.js
+++ b/js/foundation.orbit.js
@@ -149,8 +149,8 @@
   * @private
   */
   Orbit.prototype._init = function(){
-    this.$wrapper = this.$element.find('.' + this.options.containerClass);
-    this.$slides = this.$element.find('.' + this.options.slideClass);
+    this.$wrapper = this.$element.find(`.${this.options.containerClass}`);
+    this.$slides = this.$element.find(`.${this.options.slideClass}`);
     var $images = this.$element.find('img'),
     initActive = this.$slides.filter('.is-active');
 
@@ -185,7 +185,7 @@
   * @private
   */
   Orbit.prototype._loadBullets = function(){
-    this.$bullets = this.$element.find('.' + this.options.boxOfBullets).find('button');
+    this.$bullets = this.$element.find(`.${this.options.boxOfBullets}`).find('button');
   };
   /**
   * Sets a `timer` object on the orbit, and starts the counter for the next slide.
@@ -291,7 +291,7 @@
           }
 
           if(this.options.navButtons){
-            var $controls = this.$element.find('.' + this.options.nextClass + ', .' + this.options.prevClass);
+            var $controls = this.$element.find(`.${this.options.nextClass}, .${this.options.prevClass}`);
             $controls.attr('tabindex', 0)
             //also need to handle enter/return and spacebar key presses
             .on('click.zf.orbit touchend.zf.orbit', function(){
@@ -350,9 +350,9 @@
 
         if(!chosenSlide){//most of the time, this will be auto played or clicked from the navButtons.
           $newSlide = isLTR ? //if wrapping enabled, check to see if there is a `next` or `prev` sibling, if not, select the first or last slide to fill in. if wrapping not enabled, attempt to select `next` or `prev`, if there's nothing there, the function will kick out on next step. CRAZY NESTED TERNARIES!!!!!
-          (this.options.infiniteWrap ? $curSlide.next('.' + this.options.slideClass).length ? $curSlide.next('.' + this.options.slideClass) : $firstSlide : $curSlide.next('.' + this.options.slideClass))//pick next slide if moving left to right
+          (this.options.infiniteWrap ? $curSlide.next(`.${this.options.slideClass}`).length ? $curSlide.next(`.${this.options.slideClass}`) : $firstSlide : $curSlide.next(`.${this.options.slideClass}`))//pick next slide if moving left to right
           :
-          (this.options.infiniteWrap ? $curSlide.prev('.' + this.options.slideClass).length ? $curSlide.prev('.' + this.options.slideClass) : $lastSlide : $curSlide.prev('.' + this.options.slideClass));//pick prev slide if moving right to left
+          (this.options.infiniteWrap ? $curSlide.prev(`.${this.options.slideClass}`).length ? $curSlide.prev(`.${this.options.slideClass}`) : $lastSlide : $curSlide.prev(`.${this.options.slideClass}`));//pick prev slide if moving right to left
         }else{
           $newSlide = chosenSlide;
         }
@@ -365,7 +365,7 @@
 
             Foundation.Motion.animateIn(
               $newSlide.addClass('is-active').css({'position': 'absolute', 'top': 0}),
-              this.options['animInFrom' + dirIn],
+              this.options[`animInFrom${dirIn}`],
               function(){
                 $newSlide.css({'position': 'relative', 'display': 'block'})
                 .attr('aria-live', 'polite');
@@ -373,7 +373,7 @@
 
               Foundation.Motion.animateOut(
                 $curSlide.removeClass('is-active'),
-                this.options['animOutTo' + dirOut],
+                this.options[`animOutTo${dirOut}`],
                 function(){
                   $curSlide.removeAttr('aria-live');
                   if(_this.options.autoPlay && !_this.timer.isPaused){
@@ -402,7 +402,7 @@
           * @param {Number} idx - the index of the current slide.
           */
           Orbit.prototype._updateBullets = function(idx){
-            var $oldBullet = this.$element.find('.' + this.options.boxOfBullets)
+            var $oldBullet = this.$element.find(`.${this.options.boxOfBullets}`)
             .find('.is-active').removeClass('is-active').blur(),
             span = $oldBullet.find('span:last').detach(),
             $newBullet = this.$bullets.eq(idx).addClass('is-active').append(span);

diff --git a/js/foundation.responsiveToggle.js b/js/foundation.responsiveToggle.js
index 55083733a1f29c5e5949a3f6d3b91b5a842a0455..38bac6b27c54fb2a71c55cd062ac97eca63cf1a1 100644 (file)
--- a/js/foundation.responsiveToggle.js
+++ b/js/foundation.responsiveToggle.js
@@ -44,7 +44,7 @@ ResponsiveToggle.prototype._init = function() {
     console.error('Your tab bar needs an ID of a Menu as the value of data-tab-bar.');
   }
 
-  this.$targetMenu = $('#'+targetID);
+  this.$targetMenu = $(`#${targetID}`);
   this.$toggler = this.$element.find('[data-toggle]');
 
   this._update();

diff --git a/js/foundation.reveal.js b/js/foundation.reveal.js
index 58bc374cd585a4b4f6ec4c1d4d5f112cebfd015e..ad04462fab9041d5f0de4f7f1f268e086fc61ddb 100644 (file)
--- a/js/foundation.reveal.js
+++ b/js/foundation.reveal.js
@@ -127,7 +127,7 @@
     this.id = this.$element.attr('id');
     this.isActive = false;
 
-    this.$anchor = $('[data-open="' + this.id + '"]').length ? $('[data-open="' + this.id + '"]') : $('[data-toggle="' + this.id + '"]');
+    this.$anchor = $(`[data-open="${this.id}"]`).length ? $(`[data-open="${this.id}"]`) : $(`[data-toggle="${this.id}"]`);
 
     if(this.$anchor.length){
       var anchorId = this.$anchor[0].id || Foundation.GetYoDigits(6, 'reveal');
@@ -158,7 +158,7 @@
     });
 
     this._events();
-    if(this.options.deepLink && window.location.hash === ( '#' + this.id)){
+    if(this.options.deepLink && window.location.hash === ( `#${this.id}`)){
       $(window).one('load.zf.reveal', this.open.bind(this));
     }
   };
@@ -213,7 +213,7 @@
       this.$overlay.off('.zf.reveal').on('click.zf.reveal', this.close.bind(this));
     }
     if(this.options.deepLink){
-      $(window).on('popstate.zf.reveal:' + this.id, this._handleState.bind(this));
+      $(window).on(`popstate.zf.reveal:${this.id}`, this._handleState.bind(this));
     }
   };
   /**
@@ -221,7 +221,7 @@
    * @private
    */
   Reveal.prototype._handleState = function(e){
-    if(window.location.hash === ( '#' + this.id) && !this.isActive){ this.open(); }
+    if(window.location.hash === ( `#${this.id}`) && !this.isActive){ this.open(); }
     else{ this.close(); }
   };
   /**
@@ -271,7 +271,7 @@
    */
   Reveal.prototype.open = function(){
     if(this.options.deepLink){
-      var hash = '#' + this.id;
+      var hash = `#${this.id}`;
 
       if(window.history.pushState){
         window.history.pushState(null, null, hash);
@@ -496,7 +496,7 @@
     }
     this.$element.hide().off();
     this.$anchor.off('.zf');
-    $(window).off('.zf.reveal:' + this.id);
+    $(window).off(`.zf.reveal:${this.id}`);
 
     Foundation.unregisterPlugin(this);
   };