update value caching fn, may be suffering a reasonable performance penalty from calli...

diff --git a/js/foundation.new-reveal.js b/js/foundation.new-reveal.js
index ecaa934a66f030d1b732f7d7f6f4a8b13fdd86e6..3b82f6d14ff0968ef4e99ebac8fde94e3dc3e35c 100644 (file)
--- a/js/foundation.new-reveal.js
+++ b/js/foundation.new-reveal.js
@@ -23,13 +23,13 @@
     this._init();
 
     Foundation.registerPlugin(this, 'Reveal');
-    // Foundation.Keyboard.register('Reveal', {
-    //   'ENTER': 'open',
-    //   'SPACE': 'open',
-    //   'ESCAPE': 'close',
-    //   'TAB': 'tab_forward',
-    //   'SHIFT_TAB': 'tab_backward'
-    // });
+    Foundation.Keyboard.register('Reveal', {
+      'ENTER': 'open',
+      'SPACE': 'open',
+      'ESCAPE': 'close',
+      'TAB': 'tab_forward',
+      'SHIFT_TAB': 'tab_backward'
+    });
   }
 
   Reveal.defaults = {
@@ -126,8 +126,10 @@
   Reveal.prototype._init = function(){
     this.id = this.$element.attr('id');
     this.isActive = false;
+    this.cached = {};
 
     this.$anchor = $('[data-open="' + this.id + '"]').length ? $('[data-open="' + this.id + '"]') : $('[data-toggle="' + this.id + '"]');
+    this.$offsetParent = this.$element.offsetParent();
 
     if(this.$anchor.length){
       var anchorId = this.$anchor[0].id || Foundation.GetYoDigits(6, 'reveal');
@@ -192,6 +194,7 @@
       'close.zf.trigger': this.close.bind(this),
       'toggle.zf.trigger': this.toggle.bind(this),
       'resizeme.zf.trigger': function(){
+        _this.updateVals = true;
         if(_this.$element.is(':visible')){
           _this._setPosition(function(){});
         }
@@ -224,18 +227,28 @@
     if(window.location.hash === ( '#' + this.id) && !this.isActive){ this.open(); }
     else{ this.close(); }
   };
+  Reveal.prototype._cacheValues = function(){
+    this.cached.parentOffset = this.$element.offsetParent().offset();
+    this.cached.modalDims = this.$element[0].getBoundingClientRect();
+    this.cached.winWidth = window.innerWidth;
+    this.cached.vertOffset = window.innerHeight > this.cached.modalDims.height ? this.options.vOffset : 0;
+    console.log(window.innerHeight > this.cached.modalDims.height);
+    this.updateVals = false;
+  };
   /**
    * Sets the position of the modal before opening
    * @param {Function} cb - a callback function to execute when positioning is complete.
    * @private
    */
   Reveal.prototype._setPosition = function(cb){
-    console.log('calling');
-    var winWidth = window.innerWidth,
-        parentOffset = this.$element.offsetParent().offset(),
-        x = Math.round((winWidth - this.$element[0].getBoundingClientRect().width) / 2 - (parentOffset.left > 0 ? parentOffset.left : 0)),
-        y = Math.round(window.pageYOffset - (parentOffset.top > 0 ? parentOffset.top : 0) + this.options.vOffset);
-        
+    if(!this.cached.winWidth || this.updateVals){ this._cacheValues(); }
+    console.log('calling', this.cached  );
+    
+    // var winWidth = window.innerWidth,
+    //     parentOffset = this.$element.offsetParent().offset(),
+        var x = Math.round((this.cached.winWidth - this.cached.modalDims.width) / 2 - (this.cached.parentOffset.left > 0 ? this.cached.parentOffset.left : 0)),
+        y = Math.round(window.pageYOffset - (this.cached.parentOffset.top > 0 ? this.cached.parentOffset.top : 0) + this.cached.vertOffset);
+    
     this.$element.css('transform', 'translate(' + x + 'px, ' + y + 'px)');
     if(cb) cb();
     // var eleDims = Foundation.Box.GetDimensions(this.$element);

diff --git a/scss/components/_reveal.scss b/scss/components/_reveal.scss
index 5c52ec746067c50bdd89012c3ed14160fe3ba471..88a9df7bb768f4c713ffffd58343608a5b3e7674 100644 (file)
--- a/scss/components/_reveal.scss
+++ b/scss/components/_reveal.scss
@@ -59,6 +59,7 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
 /// Adds base styles for a modal.
 @mixin reveal-modal-base {
   @include disable-mouse-outline;
+
   display: none;
   top: 0;
   left: 0;
@@ -68,7 +69,13 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
   // margin: $reveal-offset auto 0;
   background-color: $reveal-background;
   border-radius: $reveal-radius;
+  
+  //chris's additions
+  overflow-y: auto;
+  max-height: 100vh;
+  //
 
+  
   @include breakpoint(medium) {
     min-height: 0;
   }