materialize-sass 0.98.0 → 0.98.1

data/app/assets/javascripts/materialize/global.js

@@ -51,7 +51,20 @@
 }(window));
 
 
-// Unique ID
+/**
+ * Generate approximated selector string for a jQuery object
+ * @param {jQuery} obj  jQuery object to be parsed
+ * @returns {string}
+ */
+Materialize.objectSelectorString = function(obj) {
+  var tagStr = obj.prop('tagName') || '';
+  var idStr = obj.attr('id') || '';
+  var classStr = obj.attr('class') || '';
+  return (tagStr + idStr + classStr).replace(/\s/g,'');
+};
+
+
+// Unique Random ID
 Materialize.guid = (function() {
   function s4() {
     return Math.floor((1 + Math.random()) * 0x10000)

data/app/assets/javascripts/materialize/init.js

@@ -179,7 +179,7 @@
     $('.datepicker').pickadate({selectYears: 20});
     $('select').not('.disabled').material_select();
     $('input.autocomplete').autocomplete({
-      data: {"Apple": null, "Microsoft": null, "Google": 'http://placehold.it/250x250'}
+      data: {"Apple": null, "Microsoft": null, "Google": 'http://placehold.it/250x250'},
     });
 
     // Chips
@@ -199,11 +199,13 @@
       secondaryPlaceholder: '+Tag',
     });
     $('.chips-autocomplete').material_chip({
-      autocompleteData: {
-        'Apple': null,
-        'Microsoft': null,
-        'Google': null
-      }
+      autocompleteOptions: {
+        data: {
+          'Apple': null,
+          'Microsoft': null,
+          'Google': null
+        }
+      },
     });
 
 

data/app/assets/javascripts/materialize/materialbox.js

@@ -235,7 +235,28 @@
           },
           {
             duration: outDuration,
-            queue: false, easing: 'easeOutQuad'
+            queue: false, easing: 'easeOutQuad',
+            complete: function() {
+              placeholder.css({
+                height: '',
+                width: '',
+                position: '',
+                top: '',
+                left: ''
+              });
+
+              origin.removeAttr('style');
+              origin.attr('style', originInlineStyles);
+
+              // Remove class
+              origin.removeClass('active');
+              doneAnimating = true;
+
+              // Remove overflow overrides on ancestors
+              if (ancestorsChanged) {
+                ancestorsChanged.css('overflow', '');
+              }
+            }
           }
         );
 
@@ -244,26 +265,7 @@
           duration: outDuration, // Delay prevents animation overlapping
           queue: false, easing: 'easeOutQuad',
           complete: function(){
-            placeholder.css({
-              height: '',
-              width: '',
-              position: '',
-              top: '',
-              left: ''
-            });
-
-            origin.removeAttr('style');
-            origin.attr('style', originInlineStyles);
-
-            // Remove class
-            origin.removeClass('active');
-            doneAnimating = true;
             $(this).remove();
-
-            // Remove overflow overrides on ancestors
-            if (ancestorsChanged) {
-              ancestorsChanged.css('overflow', '');
-            }
           }
         });
 

data/app/assets/javascripts/materialize/sideNav.js

@@ -221,7 +221,7 @@
           }).bind('panend', function(e) {
 
             if (e.gesture.pointerType == "touch") {
-              var $overlay = $('<div id="sidenav-overlay"></div>');
+              var $overlay = $('#sidenav-overlay');
               var velocityX = e.gesture.velocityX;
               var x = e.gesture.center.x;
               var leftPos = x - options.menuWidth;

data/app/assets/javascripts/materialize/tabs.js

@@ -100,7 +100,7 @@
           $indicator.css({"left": calcLeftPos($active) });
         }, 0);
       }
-      $(window).resize(function () {
+      $(window).off('resize.tabs').on('resize.tabs', function () {
         $tabs_width = $this.width();
         $tab_width = Math.max($tabs_width, $this[0].scrollWidth) / $links.length;
         if (index < 0) {
@@ -143,7 +143,7 @@
 
 
       // Bind the click event handler
-      $this.on('click', 'a', function(e) {
+      $this.off('click.tabs').on('click.tabs', 'a', function(e) {
         if ($(this).parent().hasClass('disabled')) {
           e.preventDefault();
           return;

data/app/assets/javascripts/materialize/tapTarget.js

@@ -0,0 +1,181 @@
+(function ($) {
+
+  var methods = {
+  init: function (options) {
+    return this.each(function() {
+    var origin = $('#'+$(this).attr('data-activates'));
+    var screen = $('body');
+
+    // Creating tap target
+    var tapTargetEl = $(this);
+    var tapTargetWrapper = tapTargetEl.parent('.tap-target-wrapper');
+    var tapTargetWave = tapTargetWrapper.find('.tap-target-wave');
+    var tapTargetOriginEl = tapTargetWrapper.find('.tap-target-origin');
+    var tapTargetContentEl = tapTargetEl.find('.tap-target-content');
+
+    // Creating wrapper
+    if (!tapTargetWrapper.length) {
+      tapTargetWrapper = tapTargetEl.wrap($('<div class="tap-target-wrapper"></div>')).parent();
+    }
+
+    // Creating content
+    if (!tapTargetContentEl.length) {
+      tapTargetContentEl = $('<div class="tap-target-content"></div>');
+      tapTargetEl.append(tapTargetContentEl);
+    }
+
+    // Creating foreground wave
+    if (!tapTargetWave.length) {
+      tapTargetWave = $('<div class="tap-target-wave"></div>');
+
+      // Creating origin
+      if (!tapTargetOriginEl.length) {
+        tapTargetOriginEl = origin.clone(true, true);
+        tapTargetOriginEl.addClass('tap-target-origin');
+        tapTargetOriginEl.removeAttr('id');
+        tapTargetOriginEl.removeAttr('style');
+        tapTargetWave.append(tapTargetOriginEl);
+      }
+
+      tapTargetWrapper.append(tapTargetWave);
+    }
+
+    // Open
+    var openTapTarget = function() {
+      if (tapTargetWrapper.is('.open')) {
+        return;
+      }
+
+      // Adding open class
+      tapTargetWrapper.addClass('open');
+
+      setTimeout(function() {
+        tapTargetOriginEl.off('click.tapTarget').on('click.tapTarget', function(e) {
+          closeTapTarget();
+          tapTargetOriginEl.off('click.tapTarget');
+        });
+
+        $(document).off('click.tapTarget').on('click.tapTarget', function(e) {
+          closeTapTarget();
+          $(document).off('click.tapTarget');
+        });
+      }, 0);
+    };
+
+    // Close
+    var closeTapTarget = function(){
+      if (!tapTargetWrapper.is('.open')) {
+        return;
+      }
+
+      tapTargetWrapper.removeClass('open');
+      tapTargetOriginEl.off('click.tapTarget')
+      $(document).off('click.tapTarget');
+    };
+
+    // Pre calculate
+    var calculateTapTarget = function() {
+      // Element or parent is fixed position?
+      var isFixed = origin.css('position') === 'fixed';
+      if (!isFixed) {
+        var parents = origin.parents();
+        for(var i = 0; i < parents.length; i++) {
+          isFixed = $(parents[i]).css('position') == 'fixed';
+          if (isFixed) {
+            break;
+          }
+        }
+      }
+
+      // Calculating origin
+      var originWidth = origin.outerWidth();
+      var originHeight = origin.outerHeight();
+      var originTop = isFixed ? origin.offset().top - $(document).scrollTop() : origin.offset().top;
+      var originLeft = isFixed ? origin.offset().left - $(document).scrollLeft() : origin.offset().left;
+
+      // Calculating screen
+      var windowWidth = $(window).width();
+      var windowHeight = $(window).height();
+      var centerX = windowWidth / 2;
+      var centerY = windowHeight / 2;
+      var isLeft = originLeft <= centerX;
+      var isRight = originLeft > centerX;
+      var isTop = originTop <= centerY;
+      var isBottom = originTop > centerY;
+      var isCenterX = originLeft >= windowWidth*0.25 && originLeft <= windowWidth*0.75;
+      var isCenterY = originTop >= windowHeight*0.25 && originTop <= windowHeight*0.75;
+
+      // Calculating tap target
+      var tapTargetWidth = tapTargetEl.outerWidth();
+      var tapTargetHeight = tapTargetEl.outerHeight();
+      var tapTargetTop = originTop + originHeight/2 - tapTargetHeight/2;
+      var tapTargetLeft = originLeft + originWidth/2 - tapTargetWidth/2;
+      var tapTargetPosition = isFixed ? 'fixed' : 'absolute';
+
+      // Calculating content
+      var tapTargetTextWidth = isCenterX ? tapTargetWidth : tapTargetWidth/2 + originWidth;
+      var tapTargetTextHeight = tapTargetHeight/2;
+      var tapTargetTextTop = isTop ? tapTargetHeight/2 : 0;
+      var tapTargetTextBottom = 0;
+      var tapTargetTextLeft = isLeft && !isCenterX ? tapTargetWidth/2 - originWidth : 0;
+      var tapTargetTextRight = 0;
+      var tapTargetTextPadding = originWidth;
+      var tapTargetTextAlign = isBottom ? 'bottom' : 'top';
+
+      // Calculating wave
+      var tapTargetWaveWidth = originWidth > originHeight ? originWidth*2 : originWidth*2;
+      var tapTargetWaveHeight = tapTargetWaveWidth;
+      var tapTargetWaveTop = tapTargetHeight/2 - tapTargetWaveHeight/2;
+      var tapTargetWaveLeft = tapTargetWidth/2 - tapTargetWaveWidth/2;
+
+      // Setting tap target
+      var tapTargetWrapperCssObj = {};
+      tapTargetWrapperCssObj.top = isTop ? tapTargetTop : '';
+      tapTargetWrapperCssObj.right = isRight ? windowWidth - tapTargetLeft - tapTargetWidth : '';
+      tapTargetWrapperCssObj.bottom = isBottom ? windowHeight - tapTargetTop - tapTargetHeight : '';
+      tapTargetWrapperCssObj.left = isLeft ? tapTargetLeft : '';
+      tapTargetWrapperCssObj.position = tapTargetPosition;
+      tapTargetWrapper.css(tapTargetWrapperCssObj);
+
+      // Setting content
+      tapTargetContentEl.css({
+        width: tapTargetTextWidth,
+        height: tapTargetTextHeight,
+        top: tapTargetTextTop,
+        right: tapTargetTextRight,
+        bottom: tapTargetTextBottom,
+        left: tapTargetTextLeft,
+        padding: tapTargetTextPadding,
+        verticalAlign: tapTargetTextAlign
+      });
+
+      // Setting wave
+      tapTargetWave.css({
+        top: tapTargetWaveTop,
+        left: tapTargetWaveLeft,
+        width: tapTargetWaveWidth,
+        height: tapTargetWaveHeight
+      });
+    }
+
+    if (options == 'open') {
+      calculateTapTarget();
+      openTapTarget();
+    }
+
+    if (options == 'close')
+      closeTapTarget();
+    });
+  },
+  open: function() {},
+  close: function() {}
+  };
+
+  $.fn.tapTarget = function(methodOrOptions) {
+  if (methods[methodOrOptions] || typeof methodOrOptions === 'object')
+    return methods.init.apply( this, arguments );
+
+  $.error( 'Method ' +  methodOrOptions + ' does not exist on jQuery.tap-target' );
+  };
+
+}( jQuery ));

data/app/assets/stylesheets/materialize.scss

@@ -37,6 +37,8 @@
 @import "materialize/components/preloader";
 @import "materialize/components/slider";
 @import "materialize/components/carousel";
+@import "materialize/components/tapTarget";
+@import "materialize/components/pulse";
 @import "materialize/components/date_picker/default";
 @import "materialize/components/date_picker/default.date";
 @import "materialize/components/date_picker/default.time";

data/app/assets/stylesheets/materialize/components/_buttons.scss

@@ -89,6 +89,10 @@
   }
 
   &.btn-large {
+    &.halfway-fab {
+      bottom: -$button-floating-large-size / 2;
+    }
+
     width: $button-floating-large-size;
     height: $button-floating-large-size;
     i {
@@ -104,8 +108,7 @@
 
     position: absolute;
     right: 24px;
-    bottom: 0;
-    transform: translateY(50%);
+    bottom: -$button-floating-size / 2;
   }
 
   display: inline-block;

data/app/assets/stylesheets/materialize/components/_chips.scss

@@ -69,6 +69,11 @@
     border: 0 !important;
     box-shadow: none !important;
   }
+
+  // Autocomplete
+  .autocomplete-content {
+    margin-top: 0;
+  }
 }
 
 // Form prefix

data/app/assets/stylesheets/materialize/components/_dropdown.scss

@@ -52,6 +52,9 @@
     & > a > i {
       height: inherit;
       line-height: inherit;
+      float: left;
+      margin: 0 24px 0 0;
+      width: 24px;
     }
   }
 }

data/app/assets/stylesheets/materialize/components/_grid.scss

@@ -59,9 +59,10 @@
 
     $i: 1;
     @while $i <= $num-cols {
-      $perc: unquote((100 / ($num-cols / $i)) + "%");
-      &.s#{$i} {
-        width: $perc;
+      &.s#{$i},
+      &.m#{$i},
+      &.l#{$i},
+      &.xl#{$i} {
         margin-left: auto;
         left: auto;
         right: auto;
@@ -69,6 +70,15 @@
       $i: $i + 1;
     }
 
+    $i: 1;
+    @while $i <= $num-cols {
+      $perc: unquote((100 / ($num-cols / $i)) + "%");
+      &.s#{$i} {
+        width: $perc;
+      }
+      $i: $i + 1;
+    }
+
     $i: 1;
     @while $i <= $num-cols {
       $perc: unquote((100 / ($num-cols / $i)) + "%");
@@ -91,9 +101,6 @@
         $perc: unquote((100 / ($num-cols / $i)) + "%");
         &.m#{$i} {
           width: $perc;
-          margin-left: auto;
-          left: auto;
-          right: auto;
         }
         $i: $i + 1
       }
@@ -121,9 +128,6 @@
         $perc: unquote((100 / ($num-cols / $i)) + "%");
         &.l#{$i} {
           width: $perc;
-          margin-left: auto;
-          left: auto;
-          right: auto;
         }
         $i: $i + 1;
       }
@@ -143,5 +147,32 @@
         $i: $i + 1;
       }
     }
+
+    @media #{$extra-large-and-up} {
+
+      $i: 1;
+      @while $i <= $num-cols {
+        $perc: unquote((100 / ($num-cols / $i)) + "%");
+        &.xl#{$i} {
+          width: $perc;
+        }
+        $i: $i + 1;
+      }
+
+      $i: 1;
+      @while $i <= $num-cols {
+        $perc: unquote((100 / ($num-cols / $i)) + "%");
+        &.offset-xl#{$i} {
+          margin-left: $perc;
+        }
+        &.pull-xl#{$i} {
+          right: $perc;
+        }
+        &.push-xl#{$i} {
+          left: $perc;
+        }
+        $i: $i + 1;
+      }
+    }
   }
 }