materialize-sass 0.97.2 → 0.97.3

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

@@ -1,4 +1,4 @@
-(function ($) {
+  (function ($) {
   $.fn.collapsible = function(options) {
     var defaults = {
         accordion: undefined
@@ -95,38 +95,36 @@
 
 
 
-      if (options.accordion || collapsible_type === "accordion" || collapsible_type === undefined) { // Handle Accordion
-        // Add click handler to only direct collapsible header children
-        $panel_headers = $this.find('> li > .collapsible-header');
-        $panel_headers.on('click.collapse', function (e) {
-          var element = $(e.target);
+      // Add click handler to only direct collapsible header children
+      $this.on('click.collapse', '> li > .collapsible-header', function(e) {
+        var $header = $(this),
+            element = $(e.target);
 
-          if (isChildrenOfPanelHeader(element)) {
-            element = getPanelHeader(element);
-          }
+        if (isChildrenOfPanelHeader(element)) {
+          element = getPanelHeader(element);
+        }
 
-          element.toggleClass('active');
+        element.toggleClass('active');
+
+        if (options.accordion || collapsible_type === "accordion" || collapsible_type === undefined) { // Handle Accordion
           accordionOpen(element);
-        });
-        // Open first active
+        } else { // Handle Expandables
+          expandableOpen(element);
+
+          if ($header.hasClass('active')) {
+            expandableOpen($header);
+          }
+        }
+      });
+
+      // Open first active
+      var $panel_headers = $this.find('> li > .collapsible-header');
+      if (options.accordion || collapsible_type === "accordion" || collapsible_type === undefined) { // Handle Accordion
         accordionOpen($panel_headers.filter('.active').first());
       }
       else { // Handle Expandables
-        $panel_headers.each(function () {
-          // Add click handler to only direct collapsible header children
-          $(this).on('click.collapse', function (e) {
-            var element = $(e.target);
-            if (isChildrenOfPanelHeader(element)) {
-              element = getPanelHeader(element);
-            }
-            element.toggleClass('active');
-            expandableOpen(element);
-          });
-          // Open any bodies that have the active class
-          if ($(this).hasClass('active')) {
-            expandableOpen($(this));
-          }
-
+        $panel_headers.filter('.active').each(function() {
+          expandableOpen($(this));
         });
       }
 

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

@@ -73,17 +73,20 @@
         activates.css('white-space', 'nowrap');
       }
 
-      // Below Origin
-      var verticalOffset = 0;
-      if (options.belowOrigin === true) {
-        verticalOffset = origin.height();
-      }
-
       // Offscreen detection
+      var windowHeight = window.innerHeight;
+      var originHeight = origin.innerHeight();
       var offsetLeft = origin.offset().left;
       var offsetTop = origin.offset().top - $(window).scrollTop();
       var currAlignment = options.alignment;
       var activatesLeft, gutterSpacing;
+
+      // Below Origin
+      var verticalOffset = 0;
+      if (options.belowOrigin === true) {
+        verticalOffset = originHeight;
+      }
+
       if (offsetLeft + activates.innerWidth() > $(window).width()) {
         // Dropdown goes past screen on right, force right alignment
         currAlignment = 'right';
@@ -93,11 +96,18 @@
         currAlignment = 'left';
       }
       // Vertical bottom offscreen detection
-      if (offsetTop + activates.innerHeight() > window.innerHeight) {
-        if (!verticalOffset) {
-          verticalOffset += origin.innerHeight();
+      if (offsetTop + activates.innerHeight() > windowHeight) {
+        // If going upwards still goes offscreen, just crop height of dropdown.
+        if (offsetTop + originHeight - activates.innerHeight() < 0) {
+          var adjustedHeight = windowHeight - offsetTop - verticalOffset;
+          activates.css('max-height', adjustedHeight);
+        } else {
+          // Flow upwards.
+          if (!verticalOffset) {
+            verticalOffset += originHeight;
+          }
+          verticalOffset -= activates.innerHeight();
         }
-        verticalOffset -= activates.innerHeight();
       }
 
       // Handle edge alignment
@@ -137,6 +147,7 @@
       isFocused = false;
       activates.fadeOut(options.outDuration);
       activates.removeClass('active');
+      activates.css('max-height', '');
       origin.removeClass('active');
     }
 

data/app/assets/javascripts/materialize/extras/nouislider.js

@@ -1,3 +1,13 @@
+/*!
+ * Materialize v0.97.3 (http://materializecss.com)
+ * Copyright 2014-2015 Materialize
+ * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
+ */
+/*!
+ * Materialize v0.97.2 (http://materializecss.com)
+ * Copyright 2014-2015 Materialize
+ * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
+ */
 /*!
  * Materialize v0.97.1 (http://materializecss.com)
  * Copyright 2014-2015 Materialize

data/app/assets/javascripts/materialize/extras/nouislider.min.js

@@ -1,5 +1,5 @@
 /*!
- * Materialize v0.97.1 (http://materializecss.com)
+ * Materialize v0.97.3 (http://materializecss.com)
  * Copyright 2014-2015 Materialize
  * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
  */

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

@@ -307,6 +307,36 @@
         label = selectOptions.first();
       }
 
+      // Function that renders and appends the option taking into
+      // account type and possible image icon.
+      var appendOptionWithIcon = function(select, option, type) {
+        // Add disabled attr if disabled
+        var disabledClass = (option.is(':disabled')) ? 'disabled ' : '';
+
+        // add icons
+        var icon_url = option.data('icon');
+        var classes = option.attr('class');
+        if (!!icon_url) {
+          var classString = '';
+          if (!!classes) classString = ' class="' + classes + '"';
+
+          // Check for multiple type.
+          if (type === 'multiple') {
+            options.append($('<li class="' + disabledClass + '"><img src="' + icon_url + '"' + classString + '><span><input type="checkbox"' + disabledClass + '/><label></label>' + option.html() + '</span></li>'));
+          } else {
+            options.append($('<li class="' + disabledClass + '"><img src="' + icon_url + '"' + classString + '><span>' + option.html() + '</span></li>'));
+          }
+          return true;
+        }
+
+        // Check for multiple type.
+        if (type === 'multiple') {
+          options.append($('<li class="' + disabledClass + '"><span><input type="checkbox"' + disabledClass + '/><label></label>' + option.html() + '</span></li>'));
+        } else {
+          options.append($('<li class="' + disabledClass + '"><span>' + option.html() + '</span></li>'));
+        }
+      };
+
       /* Create dropdown structure. */
       if (selectOptGroups.length) {
         // Check for optgroup
@@ -315,37 +345,17 @@
           options.append($('<li class="optgroup"><span>' + $(this).attr('label') + '</span></li>'));
 
           selectOptions.each(function() {
-            var disabledClass = ($(this).is(':disabled')) ? 'disabled ' : '';
-
-            // Add icons
-            if ($select.hasClass('icons')) {
-              var icon_url = $(this).data('icon');
-              var classes = $(this).attr('class');
-              if (!!icon_url) {
-                options.append($('<li class="' + disabledClass + '"><img src="' + icon_url + '" class="' + classes + '"><span>' + $(this).html() + '</span></li>'));
-                return true;
-              }
-            }
-            options.append($('<li class="' + disabledClass + '"><span>' + $(this).html() + '</span></li>'));
+            appendOptionWithIcon($select, $(this));
           });
         });
       } else {
         selectOptions.each(function () {
-          // Add disabled attr if disabled
           var disabledClass = ($(this).is(':disabled')) ? 'disabled ' : '';
           if (multiple) {
-            options.append($('<li class="' + disabledClass + '"><span><input type="checkbox"' + disabledClass + '/><label></label>' + $(this).html() + '</span></li>'));
+            appendOptionWithIcon($select, $(this), 'multiple');
+
           } else {
-            // Add icons
-            if ($select.hasClass('icons')) {
-              var icon_url = $(this).data('icon');
-              var classes = $(this).attr('class');
-              if (!!icon_url) {
-                options.append($('<li class="' + disabledClass + '"><img src="' + icon_url + '" class="' + classes + '"><span>' + $(this).html() + '</span></li>'));
-                return true;
-              }
-            }
-            options.append($('<li class="' + disabledClass + '"><span>' + $(this).html() + '</span></li>'));
+            appendOptionWithIcon($select, $(this));
           }
         });
       }
@@ -392,7 +402,7 @@
       $select.before($newSelect);
       $newSelect.before(dropdownIcon);
 
-      $('body').append(options);
+      $newSelect.after(options);
       // Check if section element is disabled
       if (!$select.is(':disabled')) {
         $newSelect.dropdown({'hover': false, 'closeOnClick': false});

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

@@ -123,6 +123,8 @@
 
 
     // Plugin initialization
+    $('.carousel.carousel-slider').carousel({full_width: true});
+    $('.carousel').carousel();
     $('.slider').slider({full_width: true});
     $('.parallax').parallax();
     $('.modal-trigger').leanModal();

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

@@ -13,7 +13,6 @@
       var $active, $content, $links = $this.find('li.tab a'),
           $tabs_width = $this.width(),
           $tab_width = $this.find('li').first().outerWidth(),
-          $tab_min_width = parseInt($this.find('li').first().css('minWidth')),
           $index = 0;
 
       // If the location.hash matches one of the links, use that as the active tab.
@@ -105,24 +104,6 @@
         // Prevent the anchor's default click action
         e.preventDefault();
       });
-
-      // Add scroll for small screens
-      if ($tab_width <= $tab_min_width) {
-        $this.wrap('<div class="hide-tab-scrollbar"></div>');
-
-        // Create the measurement node
-        var scrollDiv = document.createElement("div");
-        scrollDiv.className = "scrollbar-measure";
-        document.body.appendChild(scrollDiv);
-        var scrollbarHeight = scrollDiv.offsetHeight - scrollDiv.clientHeight;
-        document.body.removeChild(scrollDiv);
-
-        if (scrollbarHeight === 0) {
-          scrollbarHeight = 15;
-          $this.find('.indicator').css('bottom', scrollbarHeight);
-        }
-        $this.height($(this).height() + scrollbarHeight);
-      }
     });
 
     },

data/app/assets/stylesheets/materialize.scss

@@ -34,6 +34,7 @@
 @import "materialize/components/sideNav";
 @import "materialize/components/preloader";
 @import "materialize/components/slider";
+@import "materialize/components/carousel";
 @import "materialize/components/date_picker/default.scss";
 @import "materialize/components/date_picker/default.date.scss";
 @import "materialize/components/date_picker/default.time.scss";

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

@@ -0,0 +1,38 @@
+.carousel {
+  overflow: hidden;
+  position: relative;
+  width: 100%;
+  height: 400px;
+
+
+  @include perspective(500px);
+  transform-style: preserve-3d;
+  -webkit-transform-style: preserve-3d;
+  transform-origin: 0% 50%;
+
+  .carousel-item {
+    width: 200px;
+    position: absolute;
+    top: 0;
+    left: 0;
+
+    img {
+      width: 100%;
+    }
+  }
+
+  &.carousel-slider {
+    top: 0;
+    left: 0;
+    height: 0;
+
+    .carousel-item {
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      top: 0;
+      left: 0;
+    }
+  }
+}
+

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

@@ -695,11 +695,11 @@ select:disabled {
   border-top: 1px solid $dropdown-hover-bg-color;
 
   &.selected > span {
-    color: rgba(0,0,0, .7);
+    color: rgba(0, 0, 0, .7);
   }
 
   & > span {
-    color: rgba(0,0,0, .4);
+    color: rgba(0, 0, 0, .4);
   }
 
   & ~ li:not(.optgroup) {

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

@@ -61,7 +61,6 @@
       $perc: unquote((100 / ($num-cols / $i)) + "%");
       &.s#{$i} {
         width: $perc;
-        margin-left: 0;
       }
       &.offset-s#{$i} {
         margin-left: $perc;
@@ -82,7 +81,6 @@
         $perc: unquote((100 / ($num-cols / $i)) + "%");
         &.m#{$i} {
           width: $perc;
-          margin-left: 0;
         }
         &.offset-m#{$i} {
           margin-left: $perc;
@@ -104,7 +102,6 @@
         $perc: unquote((100 / ($num-cols / $i)) + "%");
         &.l#{$i} {
           width: $perc;
-          margin-left: 0;
         }
         &.offset-l#{$i} {
           margin-left: $perc;

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

@@ -32,6 +32,7 @@
 //      gradient($default,$start,$stop) *
 //          linear-gradient-top($default,$color1,$stop1,$color2,$stop2,[$color3,$stop3,$color4,$stop4])*
 //          linear-gradient-left($default,$color1,$stop1,$color2,$stop2,[$color3,$stop3,$color4,$stop4])*
+//      perspective($pixels)
 //      transform($args)
 //          transform-origin($args)
 //          transform-style($style)
@@ -285,6 +286,13 @@
     background-image: linear-gradient(left, $color1 $stop1, $color2 $stop2, $color3 $stop3, $color4 $stop4);
 }
 
+// Perspective
+@mixin perspective($pixels) {
+    perspective: $pixels;
+    -webkit-perspective: $pixels;
+}
+
+
 // Text Shadow
 
 @mixin text-shadow($args) {

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

@@ -1,6 +1,8 @@
 .tabs {
   @include flexbox();
   position: relative;
+  overflow-x: scroll;
+  overflow-y: hidden;
   height: 48px;
   background-color: $tabs-bg-color;
   margin: 0 auto;
@@ -51,24 +53,4 @@
     background-color: $tabs-underline-color;
     will-change: left, right;
   }
-}
-
-.hide-tab-scrollbar {
-  position: relative;
-  height: 48px;
-  overflow: hidden;
-
-  .tabs {
-    overflow-x: scroll;
-    overflow-y: hidden;
-  }
-}
-
-// Hacky way to find scrollbar width or height.
-.scrollbar-measure {
-  width: 100px;
-  height: 100px;
-  overflow: scroll;
-  position: absolute;
-  top: -9999px;
-}
+}

data/app/assets/stylesheets/materialize/extras/nouislider.css

@@ -1,3 +1,13 @@
+/*!
+ * Materialize v0.97.3 (http://materializecss.com)
+ * Copyright 2014-2015 Materialize
+ * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
+ */
+/*!
+ * Materialize v0.97.2 (http://materializecss.com)
+ * Copyright 2014-2015 Materialize
+ * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
+ */
 /*!
  * Materialize v0.97.1 (http://materializecss.com)
  * Copyright 2014-2015 Materialize
@@ -31,7 +41,7 @@
 .noUi-origin {
 	position: absolute;
 	right: 0;
-	top: 0;
+	top: 6px;
 	left: 0;
 	bottom: 0;
 }