]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
projects / thirdparty / foundation / foundation-sites.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 11eb851)
possible fix for #8690
authorjk <j.koehler@modulingo.de>
Thu, 28 Apr 2016 21:53:54 +0000 (23:53 +0200)
committerjk <j.koehler@modulingo.de>
Thu, 28 Apr 2016 21:53:54 +0000 (23:53 +0200)
assign a this var with a function.bind(this) to off only the function on _pauseEvents()

js/foundation.equalizer.js patch | blob | blame | history
test/visual/equalizer/equalizer-events.html [new file with mode: 0644] patch | blob

diff --git a/js/foundation.equalizer.js b/js/foundation.equalizer.js
index f20f279f208399e514480384ab41c1c1e03d5edd..910099b1938c3d6759dfb91abd6e6ec701bf5a19 100644 (file)
--- a/js/foundation.equalizer.js
+++ b/js/foundation.equalizer.js
@@ -38,6 +38,7 @@ class Equalizer {
     this.hasNested = this.$element.find('[data-equalizer]').length > 0;
     this.isNested = this.$element.parentsUntil(document.body, '[data-equalizer]').length > 0;
     this.isOn = false;
+    this._bindHandler = this._bindHandlers.bind(this);
 
     var imgs = this.$element.find('img');
     var tooSmall;
@@ -62,7 +63,15 @@ class Equalizer {
    */
   _pauseEvents() {
     this.isOn = false;
-    this.$element.off('.zf.equalizer resizeme.zf.trigger');
+    this.$element.off('.zf.equalizer resizeme.zf.trigger',this._bindHandler);
+  }
+
+  _bindHandlers(e) {
+    if (e.type === 'resizeme') {
+      this._reflow();
+    }else if (e.type === 'postequalized'){
+      if(e.target !== this.$element[0]){ this._reflow(); }
+    };
   }
 
   /**
@@ -73,11 +82,9 @@ class Equalizer {
     var _this = this;
     this._pauseEvents();
     if(this.hasNested){
-      this.$element.on('postequalized.zf.equalizer', function(e){
-        if(e.target !== _this.$element[0]){ _this._reflow(); }
-      });
+      this.$element.on('postequalized.zf.equalizer', this._bindHandler);
     }else{
-      this.$element.on('resizeme.zf.trigger', this._reflow.bind(this));
+      this.$element.on('resizeme.zf.trigger', this._bindHandler);
     }
     this.isOn = true;
   }
diff --git a/test/visual/equalizer/equalizer-events.html b/test/visual/equalizer/equalizer-events.html
new file mode 100644 (file)
index 0000000..01e9193
--- /dev/null
+++ b/test/visual/equalizer/equalizer-events.html
@@ -0,0 +1,88 @@
+<!doctype html>
+<!--[if IE 9]><html class="lt-ie10" lang="en" > <![endif]-->
+<html class="no-js" lang="en" dir="ltr">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>Foundation for Sites Testing</title>
+    <link href="../assets/css/foundation.css" rel="stylesheet" />
+  </head>
+  <body>
+    <div class="row column">
+      <h4>I Fire preequalized and postequalized on medium-up</h4>
+    </div>
+    <div class="row" data-equalizer data-equalize-on-stack="false" data-equalize-on="medium" id="equalizer1">
+      <div class="small-12 medium-3 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Test</div>
+        </div>
+      </div>
+      <div class="small-12 medium-3 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Test</div>
+        </div>
+      </div>
+      <div class="small-12 medium-3 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Test</div>
+        </div>
+      </div>
+      <div class="small-12 medium-3 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fuga officia iste ut distinctio magni accusantium, optio ipsa at cupiditate sequi!</div>
+        </div>
+      </div>
+    </div>
+    <div class="row column">
+      <h4>I Fire preequalized, preequalizedrow, postequalizedrow, postequalized, resizeme</h4>
+    </div>
+    <div class="row" data-equalizer data-equalize-by-row="true" id="equalizer2">
+      <div class="small-12 medium-6 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Test</div>
+        </div>
+      </div>
+      <div class="small-12 medium-6 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Test</div>
+        </div>
+      </div>
+      <div class="small-12 medium-6 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Test</div>
+        </div>
+      </div>
+      <div class="small-12 medium-6 columns">
+        <div class="callout">
+          <div class="callout" data-equalizer-watch>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Libero dolore inventore quibusdam deleniti a ipsa laborum, illo, soluta quas velit?</div>
+        </div>
+      </div>
+    </div>
+
+    <script src="../assets/js/vendor.js"></script>
+    <script src="../assets/js/foundation.js"></script>
+    <script>
+      $('[data-equalizer]').on('preequalized.zf.equalizer',function(e){
+        console.log($(this).attr('id')+' '+e.type);
+      });
+
+      $('[data-equalizer]').on('preequalizedrow.zf.equalizer',function(e){
+        console.log($(this).attr('id')+' '+e.type);
+      });
+
+      $('[data-equalizer]').on('postequalizedrow.zf.equalizer',function(e){
+        console.log($(this).attr('id')+' '+e.type);
+      });
+
+      $('[data-equalizer]').on('postequalized.zf.equalizer',function(e){
+        console.log($(this).attr('id')+' '+e.type);
+      });
+
+      $('[data-equalizer]').on('resizeme.zf.trigger',function(e){
+        console.log($(this).attr('id')+' '+e.type);
+      });
+
+      $(document).foundation();
+    </script>
+  </body>
+</html>
Mirror of https://github.com/foundation/foundation-sites.git