materialize-rails 0.97.5.custom1

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

@@ -0,0 +1,129 @@
+(function ($) {
+
+  var methods = {
+    init : function() {
+      return this.each(function() {
+
+      // For each set of tabs, we want to keep track of
+      // which tab is active and its associated content
+      var $this = $(this),
+          window_width = $(window).width();
+
+      $this.width('100%');
+      var $active, $content, $links = $this.find('li.tab a'),
+          $tabs_width = $this.width(),
+          $tab_width = $this.find('li').first().outerWidth(),
+          $index = 0;
+
+      // If the location.hash matches one of the links, use that as the active tab.
+      $active = $($links.filter('[href="'+location.hash+'"]'));
+
+      // If no match is found, use the first link or any with class 'active' as the initial active tab.
+      if ($active.length === 0) {
+          $active = $(this).find('li.tab a.active').first();
+      }
+      if ($active.length === 0) {
+        $active = $(this).find('li.tab a').first();
+      }
+
+      $active.addClass('active');
+      $index = $links.index($active);
+      if ($index < 0) {
+        $index = 0;
+      }
+
+      $content = $($active[0].hash);
+
+      // append indicator then set indicator width to tab width
+      $this.append('<div class="indicator"></div>');
+      var $indicator = $this.find('.indicator');
+      if ($this.is(":visible")) {
+        $indicator.css({"right": $tabs_width - (($index + 1) * $tab_width)});
+        $indicator.css({"left": $index * $tab_width});
+      }
+      $(window).resize(function () {
+        $tabs_width = $this.width();
+        $tab_width = $this.find('li').first().outerWidth();
+        if ($index < 0) {
+          $index = 0;
+        }
+        if ($tab_width !== 0 && $tabs_width !== 0) {
+          $indicator.css({"right": $tabs_width - (($index + 1) * $tab_width)});
+          $indicator.css({"left": $index * $tab_width});
+        }
+      });
+
+      // Hide the remaining content
+      $links.not($active).each(function () {
+        $(this.hash).hide();
+      });
+
+
+      // Bind the click event handler
+      $this.on('click', 'a', function(e) {
+        if ($(this).parent().hasClass('disabled')) {
+          e.preventDefault();
+          return;
+        }
+
+        $tabs_width = $this.width();
+        $tab_width = $this.find('li').first().outerWidth();
+
+        // Make the old tab inactive.
+        $active.removeClass('active');
+        $content.hide();
+
+        // Update the variables with the new link and content
+        $active = $(this);
+        $content = $(this.hash);
+        $links = $this.find('li.tab a');
+
+        // Make the tab active.
+        $active.addClass('active');
+        var $prev_index = $index;
+        $index = $links.index($(this));
+        if ($index < 0) {
+          $index = 0;
+        }
+        // Change url to current tab
+        // window.location.hash = $active.attr('href');
+
+        $content.show();
+
+        // Update indicator
+        if (($index - $prev_index) >= 0) {
+          $indicator.velocity({"right": $tabs_width - (($index + 1) * $tab_width)}, { duration: 300, queue: false, easing: 'easeOutQuad'});
+          $indicator.velocity({"left": $index * $tab_width}, {duration: 300, queue: false, easing: 'easeOutQuad', delay: 90});
+
+        }
+        else {
+          $indicator.velocity({"left": $index * $tab_width}, { duration: 300, queue: false, easing: 'easeOutQuad'});
+          $indicator.velocity({"right": $tabs_width - (($index + 1) * $tab_width)}, {duration: 300, queue: false, easing: 'easeOutQuad', delay: 90});
+        }
+
+        // Prevent the anchor's default click action
+        e.preventDefault();
+      });
+    });
+
+    },
+    select_tab : function( id ) {
+      this.find('a[href="#' + id + '"]').trigger('click');
+    }
+  };
+
+  $.fn.tabs = function(methodOrOptions) {
+    if ( methods[methodOrOptions] ) {
+      return methods[ methodOrOptions ].apply( this, Array.prototype.slice.call( arguments, 1 ));
+    } else if ( typeof methodOrOptions === 'object' || ! methodOrOptions ) {
+      // Default to "init"
+      return methods.init.apply( this, arguments );
+    } else {
+      $.error( 'Method ' +  methodOrOptions + ' does not exist on jQuery.tooltip' );
+    }
+  };
+
+  $(document).ready(function(){
+    $('ul.tabs').tabs();
+  });
+}( jQuery ));

data/vendor/assets/javascripts/materialize/toasts.js

@@ -0,0 +1,136 @@
+Materialize.toast = function (message, displayLength, className, completeCallback) {
+    className = className || "";
+
+    var container = document.getElementById('toast-container');
+
+    // Create toast container if it does not exist
+    if (container === null) {
+        // create notification container
+        container = document.createElement('div');
+        container.id = 'toast-container';
+        document.body.appendChild(container);
+    }
+
+    // Select and append toast
+    var newToast = createToast(message);
+
+    // only append toast if message is not undefined
+    if(message){
+        container.appendChild(newToast);
+    }
+
+    newToast.style.top = '35px';
+    newToast.style.opacity = 0;
+
+    // Animate toast in
+    Vel(newToast, { "top" : "0px", opacity: 1 }, {duration: 300,
+      easing: 'easeOutCubic',
+      queue: false});
+
+    // Allows timer to be pause while being panned
+    var timeLeft = displayLength;
+    var counterInterval = setInterval (function(){
+
+
+      if (newToast.parentNode === null)
+        window.clearInterval(counterInterval);
+
+      // If toast is not being dragged, decrease its time remaining
+      if (!newToast.classList.contains('panning')) {
+        timeLeft -= 20;
+      }
+
+      if (timeLeft <= 0) {
+        // Animate toast out
+        Vel(newToast, {"opacity": 0, marginTop: '-40px'}, { duration: 375,
+            easing: 'easeOutExpo',
+            queue: false,
+            complete: function(){
+              // Call the optional callback
+              if(typeof(completeCallback) === "function")
+                completeCallback();
+              // Remove toast after it times out
+              this[0].parentNode.removeChild(this[0]);
+            }
+          });
+        window.clearInterval(counterInterval);
+      }
+    }, 20);
+
+
+
+    function createToast(html) {
+
+        // Create toast
+        var toast = document.createElement('div');
+        toast.classList.add('toast');
+        if (className) {
+            var classes = className.split(' ');
+
+            for (var i = 0, count = classes.length; i < count; i++) {
+                toast.classList.add(classes[i]);
+            }
+        }
+        // If type of parameter is HTML Element
+        if ( typeof HTMLElement === "object" ? html instanceof HTMLElement : html && typeof html === "object" && html !== null && html.nodeType === 1 && typeof html.nodeName==="string"
+) {
+          toast.appendChild(html);
+        }
+        else if (html instanceof jQuery) {
+          // Check if it is jQuery object
+          toast.appendChild(html[0]);
+        }
+        else {
+          // Insert as text;
+          toast.innerHTML = html; 
+        }
+        // Bind hammer
+        var hammerHandler = new Hammer(toast, {prevent_default: false});
+        hammerHandler.on('pan', function(e) {
+          var deltaX = e.deltaX;
+          var activationDistance = 80;
+
+          // Change toast state
+          if (!toast.classList.contains('panning')){
+            toast.classList.add('panning');
+          }
+
+          var opacityPercent = 1-Math.abs(deltaX / activationDistance);
+          if (opacityPercent < 0)
+            opacityPercent = 0;
+
+          Vel(toast, {left: deltaX, opacity: opacityPercent }, {duration: 50, queue: false, easing: 'easeOutQuad'});
+
+        });
+
+        hammerHandler.on('panend', function(e) {
+          var deltaX = e.deltaX;
+          var activationDistance = 80;
+
+          // If toast dragged past activation point
+          if (Math.abs(deltaX) > activationDistance) {
+            Vel(toast, {marginTop: '-40px'}, { duration: 375,
+                easing: 'easeOutExpo',
+                queue: false,
+                complete: function(){
+                  if(typeof(completeCallback) === "function") {
+                    completeCallback();
+                  }
+                  toast.parentNode.removeChild(toast);
+                }
+            });
+
+          } else {
+            toast.classList.remove('panning');
+            // Put toast back into original position
+            Vel(toast, { left: 0, opacity: 1 }, { duration: 300,
+              easing: 'easeOutExpo',
+              queue: false
+            });
+
+          }
+        });
+
+        return toast;
+    }
+};

data/vendor/assets/javascripts/materialize/tooltip.js

@@ -0,0 +1,203 @@
+(function ($) {
+    $.fn.tooltip = function (options) {
+        var timeout = null,
+        margin = 5;
+
+      // Defaults
+      var defaults = {
+        delay: 350
+      };
+
+      // Remove tooltip from the activator
+      if (options === "remove") {
+        this.each(function(){
+          $('#' + $(this).attr('data-tooltip-id')).remove();
+          $(this).off('mouseenter.tooltip mouseleave.tooltip');
+        });
+        return false;
+      }
+
+      options = $.extend(defaults, options);
+
+
+      return this.each(function(){
+        var tooltipId = Materialize.guid();
+        var origin = $(this);
+        origin.attr('data-tooltip-id', tooltipId);
+
+        // Create Text span
+        var tooltip_text = $('<span></span>').text(origin.attr('data-tooltip'));
+
+        // Create tooltip
+        var newTooltip = $('<div></div>');
+        newTooltip.addClass('material-tooltip').append(tooltip_text)
+          .appendTo($('body'))
+          .attr('id', tooltipId);
+
+        var backdrop = $('<div></div>').addClass('backdrop');
+        backdrop.appendTo(newTooltip);
+        backdrop.css({ top: 0, left:0 });
+
+
+      //Destroy previously binded events
+      origin.off('mouseenter.tooltip mouseleave.tooltip');
+      // Mouse In
+      var started = false, timeoutRef;
+      origin.on({
+        'mouseenter.tooltip': function(e) {
+          var tooltip_delay = origin.attr('data-delay');
+          tooltip_delay = (tooltip_delay === undefined || tooltip_delay === '') ?
+              options.delay : tooltip_delay;
+          timeoutRef = setTimeout(function(){
+            started = true;
+            newTooltip.velocity('stop');
+            backdrop.velocity('stop');
+            newTooltip.css({ display: 'block', left: '0px', top: '0px' });
+
+            // Set Tooltip text
+            newTooltip.children('span').text(origin.attr('data-tooltip'));
+
+            // Tooltip positioning
+            var originWidth = origin.outerWidth();
+            var originHeight = origin.outerHeight();
+            var tooltipPosition =  origin.attr('data-position');
+            var tooltipHeight = newTooltip.outerHeight();
+            var tooltipWidth = newTooltip.outerWidth();
+            var tooltipVerticalMovement = '0px';
+            var tooltipHorizontalMovement = '0px';
+            var scale_factor = 8;
+            var targetTop, targetLeft, newCoordinates;
+
+            if (tooltipPosition === "top") {
+              // Top Position
+              targetTop = origin.offset().top - tooltipHeight - margin;
+              targetLeft = origin.offset().left + originWidth/2 - tooltipWidth/2;
+              newCoordinates = repositionWithinScreen(targetLeft, targetTop, tooltipWidth, tooltipHeight);
+
+              tooltipVerticalMovement = '-10px';
+              backdrop.css({
+                borderRadius: '14px 14px 0 0',
+                transformOrigin: '50% 90%',
+                marginTop: tooltipHeight,
+                marginLeft: (tooltipWidth/2) - (backdrop.width()/2)
+              });
+            }
+            // Left Position
+            else if (tooltipPosition === "left") {
+              targetTop = origin.offset().top + originHeight/2 - tooltipHeight/2;
+              targetLeft =  origin.offset().left - tooltipWidth - margin;
+              newCoordinates = repositionWithinScreen(targetLeft, targetTop, tooltipWidth, tooltipHeight);
+
+              tooltipHorizontalMovement = '-10px';
+              backdrop.css({
+                width: '14px',
+                height: '14px',
+                borderRadius: '14px 0 0 14px',
+                transformOrigin: '95% 50%',
+                marginTop: tooltipHeight/2,
+                marginLeft: tooltipWidth
+              });
+            }
+            // Right Position
+            else if (tooltipPosition === "right") {
+              targetTop = origin.offset().top + originHeight/2 - tooltipHeight/2;
+              targetLeft = origin.offset().left + originWidth + margin;
+              newCoordinates = repositionWithinScreen(targetLeft, targetTop, tooltipWidth, tooltipHeight);
+
+              tooltipHorizontalMovement = '+10px';
+              backdrop.css({
+                width: '14px',
+                height: '14px',
+                borderRadius: '0 14px 14px 0',
+                transformOrigin: '5% 50%',
+                marginTop: tooltipHeight/2,
+                marginLeft: '0px'
+              });
+            }
+            else {
+              // Bottom Position
+              targetTop = origin.offset().top + origin.outerHeight() + margin;
+              targetLeft = origin.offset().left + originWidth/2 - tooltipWidth/2;
+              newCoordinates = repositionWithinScreen(targetLeft, targetTop, tooltipWidth, tooltipHeight);
+              tooltipVerticalMovement = '+10px';
+              backdrop.css({
+                marginLeft: (tooltipWidth/2) - (backdrop.width()/2)
+              });
+            }
+
+            // Set tooptip css placement
+            newTooltip.css({
+              top: newCoordinates.y,
+              left: newCoordinates.x
+            });
+
+            // Calculate Scale to fill
+            scale_factor = tooltipWidth / 8;
+            if (scale_factor < 8) {
+              scale_factor = 8;
+            }
+            if (tooltipPosition === "right" || tooltipPosition === "left") {
+              scale_factor = tooltipWidth / 10;
+              if (scale_factor < 6)
+                scale_factor = 6;
+            }
+
+            newTooltip.velocity({ marginTop: tooltipVerticalMovement, marginLeft: tooltipHorizontalMovement}, { duration: 350, queue: false })
+              .velocity({opacity: 1}, {duration: 300, delay: 50, queue: false});
+            backdrop.css({ display: 'block' })
+              .velocity({opacity:1},{duration: 55, delay: 0, queue: false})
+              .velocity({scale: scale_factor}, {duration: 300, delay: 0, queue: false, easing: 'easeInOutQuad'});
+
+
+          }, tooltip_delay); // End Interval
+
+        // Mouse Out
+        },
+        'mouseleave.tooltip': function(){
+          // Reset State
+          started = false;
+          clearTimeout(timeoutRef);
+
+          // Animate back
+          setTimeout(function() {
+            if (started != true) {
+              newTooltip.velocity({
+                opacity: 0, marginTop: 0, marginLeft: 0}, { duration: 225, queue: false});
+              backdrop.velocity({opacity: 0, scale: 1}, {
+                duration:225,
+                queue: false,
+                complete: function(){
+                  backdrop.css('display', 'none');
+                  newTooltip.css('display', 'none');
+                  started = false;}
+              });
+            }
+          },225);
+        }
+        });
+    });
+  };
+
+  var repositionWithinScreen = function(x, y, width, height) {
+    var newX = x
+    var newY = y;
+
+    if (newX < 0) {
+      newX = 4;
+    } else if (newX + width > window.innerWidth) {
+      newX -= newX + width - window.innerWidth;
+    }
+
+    if (newY < 0) {
+      newY = 4;
+    } else if (newY + height > window.innerHeight + $(window).scrollTop) {
+      newY -= newY + height - window.innerHeight;
+    }
+
+    return {x: newX, y: newY};
+  };
+
+  $(document).ready(function(){
+     $('.tooltipped').tooltip();
+   });
+}( jQuery ));