uikit-sass-rails 1.3.0 → 1.4.0

data/vendor/assets/javascripts/uikit/components/sticky.js

@@ -1,19 +1,21 @@
-/*! UIkit 2.11.1 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
 (function(addon) {
 
     var component;
 
-    if (jQuery && jQuery.UIkit) {
-        component = addon(jQuery, jQuery.UIkit);
+    if (window.UIkit) {
+        component = addon(UIkit);
     }
 
     if (typeof define == "function" && define.amd) {
         define("uikit-sticky", ["uikit"], function(){
-            return component || addon(jQuery, jQuery.UIkit);
+            return component || addon(UIkit);
         });
     }
 
-})(function($, UI){
+})(function(UI){
+
+    "use strict";
 
     var $win         = UI.$win,
         $doc         = UI.$doc,
@@ -28,28 +30,78 @@
             clsinit      : 'uk-sticky-init',
             clsactive    : 'uk-active',
             getWidthFrom : '',
+            boundary     : false,
             media        : false,
-            target       : false
+            target       : false,
+            disabled     : false
+        },
+
+        boot: function() {
+
+            // should be more efficient than using $win.scroll(checkscrollposition):
+            UI.$doc.on('scrolling.uk.document', function() { checkscrollposition(); });
+            UI.$win.on('resize orientationchange', UI.Utils.debounce(function() {
+
+                if (!sticked.length) return;
+
+                for (var i = 0; i < sticked.length; i++) {
+                    sticked[i].reset(true);
+                    sticked[i].self.computeWrapper();
+                }
+
+                checkscrollposition();
+            }, 100));
+
+            // init code
+            UI.ready(function(context) {
+
+                setTimeout(function(){
+
+                    UI.$("[data-uk-sticky]", context).each(function(){
+
+                        var $ele = UI.$(this);
+
+                        if(!$ele.data("sticky")) {
+                            UI.sticky($ele, UI.Utils.options($ele.attr('data-uk-sticky')));
+                        }
+                    });
+
+                    checkscrollposition();
+                }, 0);
+            });
         },
 
         init: function() {
 
-            var wrapper  = $('<div class="uk-sticky-placeholder"></div>').css({
-                        'height' : this.element.css('position') != 'absolute' ? this.element.outerHeight() : '',
-                        'float'  : this.element.css("float") != "none" ? this.element.css("float") : '',
-                        'margin' : this.element.css("margin")
-                });
+            var wrapper  = UI.$('<div class="uk-sticky-placeholder"></div>'), boundary = this.options.boundary, boundtoparent;
+
+            this.wrapper = this.element.css('margin', 0).wrap(wrapper).parent();
+
+            this.computeWrapper();
+
+            if (boundary) {
 
-            wrapper = this.element.css('margin', 0).wrap(wrapper).parent();
+                if (boundary === true) {
+
+                    boundary      = this.wrapper.parent();
+                    boundtoparent = true;
+
+                } else if (typeof boundary === "string") {
+                    boundary = UI.$(boundary);
+                }
+            }
 
             this.sticky = {
-                options      : this.options,
-                element      : this.element,
-                currentTop   : null,
-                wrapper      : wrapper,
-                init         : false,
-                getWidthFrom : this.options.getWidthFrom || wrapper,
-                reset        : function(force) {
+                self          : this,
+                options       : this.options,
+                element       : this.element,
+                currentTop    : null,
+                wrapper       : this.wrapper,
+                init          : false,
+                getWidthFrom  : this.options.getWidthFrom || this.wrapper,
+                boundary      : boundary,
+                boundtoparent : boundtoparent,
+                reset         : function(force) {
 
                     var finalize = function() {
                         this.element.css({"position":"", "top":"", "width":"", "left":"", "margin":"0"});
@@ -73,8 +125,13 @@
                         finalize();
                     }
                 },
+
                 check: function() {
 
+                    if (this.options.disabled) {
+                        return false;
+                    }
+
                     if (this.options.media) {
 
                         switch(typeof(this.options.media)) {
@@ -93,7 +150,7 @@
 
                     var scrollTop      = $win.scrollTop(),
                         documentHeight = $doc.height(),
-                        dwh            = documentHeight - $win.height(),
+                        dwh            = documentHeight - window.innerHeight,
                         extra          = (scrollTop > dwh) ? dwh - scrollTop : 0,
                         elementTop     = this.wrapper.offset().top,
                         etse           = elementTop - this.options.top - extra;
@@ -106,31 +163,50 @@
         },
 
         update: function() {
-            scroller();
+            checkscrollposition(this.sticky);
+        },
+
+        enable: function() {
+            this.options.disabled = false;
+            this.update();
+        },
+
+        disable: function(force) {
+            this.options.disabled = true;
+            this.sticky.reset(force);
+        },
+
+        computeWrapper: function() {
+
+            this.wrapper.css({
+                'height' : this.element.css('position') != 'absolute' ? this.element.outerHeight() : '',
+                'float'  : this.element.css("float") != "none" ? this.element.css("float") : '',
+                'margin' : this.element.css("margin")
+            });
         }
     });
 
-    function scroller() {
+    function checkscrollposition() {
 
-        if (!sticked.length) return;
+        var stickies = arguments.length ? arguments : sticked;
+
+        if (!stickies.length || $win.scrollTop() < 0) return;
 
         var scrollTop       = $win.scrollTop(),
             documentHeight  = $doc.height(),
-            dwh             = documentHeight - $win.height(),
+            windowHeight    = $win.height(),
+            dwh             = documentHeight - windowHeight,
             extra           = (scrollTop > dwh) ? dwh - scrollTop : 0,
-            cls, newTop;
-
-        if(scrollTop < 0) return;
+            newTop, containerBottom, stickyHeight, sticky;
 
+        for (var i = 0; i < stickies.length; i++) {
 
-        for (var i = 0; i < sticked.length; i++) {
+            sticky = stickies[i];
 
-            if (!sticked[i].element.is(":visible") || sticked[i].animate) {
+            if (!sticky.element.is(":visible") || sticky.animate) {
                 continue;
             }
 
-            var sticky = sticked[i];
-
             if (!sticky.check()) {
 
                 if (sticky.currentTop !== null) {
@@ -142,16 +218,31 @@
                 if (sticky.options.top < 0) {
                     newTop = 0;
                 } else {
-                    newTop = documentHeight - sticky.element.outerHeight() - sticky.options.top - sticky.options.bottom - scrollTop - extra;
+                    stickyHeight = sticky.element.outerHeight();
+                    newTop = documentHeight - stickyHeight - sticky.options.top - sticky.options.bottom - scrollTop - extra;
                     newTop = newTop < 0 ? newTop + sticky.options.top : sticky.options.top;
                 }
 
+                if (sticky.boundary && sticky.boundary.length) {
+
+                    var bTop = sticky.boundary.position().top;
+
+                    if (sticky.boundtoparent) {
+                        containerBottom = documentHeight - (bTop + sticky.boundary.outerHeight()) + parseInt(sticky.boundary.css('padding-bottom'));
+                    } else {
+                        containerBottom = documentHeight - bTop - parseInt(sticky.boundary.css('margin-top'));
+                    }
+
+                    newTop = (scrollTop + stickyHeight) > (documentHeight - containerBottom - (sticky.options.top < 0 ? 0 : sticky.options.top)) ? (documentHeight - containerBottom) - (scrollTop + stickyHeight) : newTop;
+                }
+
+
                 if (sticky.currentTop != newTop) {
 
                     sticky.element.css({
                         "position" : "fixed",
                         "top"      : newTop,
-                        "width"    : (typeof sticky.getWidthFrom !== 'undefined') ? $(sticky.getWidthFrom).width() : sticky.element.width(),
+                        "width"    : (typeof sticky.getWidthFrom !== 'undefined') ? UI.$(sticky.getWidthFrom).width() : sticky.element.width(),
                         "left"     : sticky.wrapper.offset().left
                     });
 
@@ -161,7 +252,7 @@
 
                         if (location.hash && scrollTop > 0 && sticky.options.target) {
 
-                            var $target = $(location.hash);
+                            var $target = UI.$(location.hash);
 
                             if ($target.length) {
 
@@ -201,39 +292,7 @@
 
             sticky.init = true;
         }
-
     }
 
-    // should be more efficient than using $win.scroll(scroller):
-    $doc.on('uk-scroll', scroller);
-    $win.on('resize orientationchange', UI.Utils.debounce(function() {
-
-        if (!sticked.length) return;
-
-        for (var i = 0; i < sticked.length; i++) {
-            sticked[i].reset(true);
-        }
-
-        scroller();
-    }, 100));
-
-    // init code
-    UI.ready(function(context) {
-
-        setTimeout(function(){
-
-            $("[data-uk-sticky]", context).each(function(){
-
-                var $ele = $(this);
-
-                if(!$ele.data("sticky")) {
-                    UI.sticky($ele, UI.Utils.options($ele.attr('data-uk-sticky')));
-                }
-            });
-
-            scroller();
-        }, 0);
-    });
-
-    return $.fn.uksticky;
-});
+    return UI.sticky;
+});

data/vendor/assets/javascripts/uikit/components/timepicker.js

@@ -1,60 +1,52 @@
-/*! UIkit 2.11.1 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
 (function(addon) {
 
     var component;
 
-    if (jQuery && jQuery.UIkit) {
-        component = addon(jQuery, jQuery.UIkit);
+    if (window.UIkit) {
+        component = addon(UIkit);
     }
 
     if (typeof define == "function" && define.amd) {
         define("uikit-search", ["uikit"], function(){
-            return component || addon(jQuery, jQuery.UIkit);
+            return component || addon(UIkit);
         });
     }
 
-})(function($, UI){
+})(function(UI){
 
     "use strict";
 
-    var times = {'12h':[], '24h':[]};
 
-    for(var i = 0, h=''; i<24; i++) {
-
-        h = ''+i;
-
-        if(i<10)  h = '0'+h;
-
-        times['24h'].push({value: (h+':00')});
-        times['24h'].push({value: (h+':30')});
-
-        if (i > 0 && i<13) {
-            times['12h'].push({value: (h+':00 AM')});
-            times['12h'].push({value: (h+':30 AM')});
-        }
-
-        if (i > 12) {
+    UI.component('timepicker', {
 
-            h = h-12;
+        defaults: {
+            format : '24h',
+            delay  : 0,
+            start  : 0,
+            end    : 24
+        },
 
-            if (h < 10) h = '0'+String(h);
+        boot: function() {
 
-            times['12h'].push({value: (h+':00 PM')});
-            times['12h'].push({value: (h+':30 PM')});
-        }
-    }
+            // init code
+            UI.$html.on("focus.timepicker.uikit", "[data-uk-timepicker]", function(e) {
 
+                var ele = UI.$(this);
 
-    UI.component('timepicker', {
+                if (!ele.data("timepicker")) {
+                    var obj = UI.timepicker(ele, UI.Utils.options(ele.attr("data-uk-timepicker")));
 
-        defaults: {
-            format : '24h',
-            delay  : 0
+                    setTimeout(function(){
+                        obj.autocomplete.input.focus();
+                    }, 40);
+                }
+            });
         },
 
         init: function() {
 
-            var $this  = this;
+            var $this  = this, times = getTimeRange(this.options.start, this.options.end);
 
             this.options.minLength = 0;
             this.options.template  = '<ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results">{{~items}}<li data-value="{{$item.value}}"><a>{{$item.value}}</a></li>{{/items}}</ul>';
@@ -68,7 +60,7 @@
             this.autocomplete = UI.autocomplete(this.element.parent(), this.options);
             this.autocomplete.dropdown.addClass('uk-dropdown-small uk-dropdown-scrollable');
 
-            this.autocomplete.on('uk.autocomplete.show', function() {
+            this.autocomplete.on('show.uk.autocomplete', function() {
 
                 var selected = $this.autocomplete.dropdown.find('[data-value="'+$this.autocomplete.input.val()+'"]');
 
@@ -149,16 +141,47 @@
         }
     });
 
-    // init code
-    UI.$html.on("focus.timepicker.uikit", "[data-uk-timepicker]", function(e) {
-        var ele = $(this);
+    // helper
 
-        if (!ele.data("timepicker")) {
-            var obj = UI.timepicker(ele, UI.Utils.options(ele.attr("data-uk-timepicker")));
+    function getTimeRange(start, end) {
 
-            setTimeout(function(){
-                obj.autocomplete.input.focus();
-            }, 20);
+        start = start || 0;
+        end   = end || 24;
+
+        var times = {'12h':[], '24h':[]}, i, h;
+
+        for (i = start, h=''; i<end; i++) {
+
+            h = ''+i;
+
+            if (i<10)  h = '0'+h;
+
+            times['24h'].push({value: (h+':00')});
+            times['24h'].push({value: (h+':30')});
+
+            if (i === 0) {
+                h = 12;
+                times['12h'].push({value: (h+':00 AM')});
+                times['12h'].push({value: (h+':30 AM')});
+            }
+
+            if (i > 0 && i<13 && i!==12) {
+                times['12h'].push({value: (h+':00 AM')});
+                times['12h'].push({value: (h+':30 AM')});
+            }
+
+            if (i >= 12) {
+
+                h = h-12;
+                if (h === 0) h = 12;
+                if (h < 10) h = '0'+String(h);
+
+                times['12h'].push({value: (h+':00 PM')});
+                times['12h'].push({value: (h+':30 PM')});
+            }
         }
-    });
+
+        return times;
+    }
+
 });

data/vendor/assets/javascripts/uikit/components/tooltip.js

@@ -0,0 +1,220 @@
+/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+(function(addon) {
+    var component;
+
+    if (window.UIkit) {
+        component = addon(UIkit);
+    }
+
+    if (typeof define == "function" && define.amd) {
+        define("uikit-tooltip", ["uikit"], function(){
+            return component || addon(UIkit);
+        });
+    }
+})(function(UI){
+
+    "use strict";
+
+    var $tooltip,   // tooltip container
+        tooltipdelay, checkdelay;
+
+    UI.component('tooltip', {
+
+        defaults: {
+            "offset": 5,
+            "pos": "top",
+            "animation": false,
+            "delay": 0, // in miliseconds
+            "cls": "",
+            "src": function() { return this.attr("title"); }
+        },
+
+        tip: "",
+
+        boot: function() {
+
+            // init code
+            UI.$html.on("mouseenter.tooltip.uikit focus.tooltip.uikit", "[data-uk-tooltip]", function(e) {
+                var ele = UI.$(this);
+
+                if (!ele.data("tooltip")) {
+                    var obj = UI.tooltip(ele, UI.Utils.options(ele.attr("data-uk-tooltip")));
+                    ele.trigger("mouseenter");
+                }
+            });
+        },
+
+        init: function() {
+
+            var $this = this;
+
+            if (!$tooltip) {
+                $tooltip = UI.$('<div class="uk-tooltip"></div>').appendTo("body");
+            }
+
+            this.on({
+                "focus"     : function(e) { $this.show(); },
+                "blur"      : function(e) { $this.hide(); },
+                "mouseenter": function(e) { $this.show(); },
+                "mouseleave": function(e) { $this.hide(); }
+            });
+
+            this.tip = typeof(this.options.src) === "function" ? this.options.src.call(this.element) : this.options.src;
+
+            // disable title attribute
+            this.element.attr("data-cached-title", this.element.attr("title")).attr("title", "");
+        },
+
+        show: function() {
+
+            if (tooltipdelay)     clearTimeout(tooltipdelay);
+            if (checkdelay)       clearTimeout(checkdelay);
+            if (!this.tip.length) return;
+
+            $tooltip.stop().css({"top": -2000, "visibility": "hidden"}).show();
+            $tooltip.html('<div class="uk-tooltip-inner">' + this.tip + '</div>');
+
+            var $this      = this,
+                pos        = UI.$.extend({}, this.element.offset(), {width: this.element[0].offsetWidth, height: this.element[0].offsetHeight}),
+                width      = $tooltip[0].offsetWidth,
+                height     = $tooltip[0].offsetHeight,
+                offset     = typeof(this.options.offset) === "function" ? this.options.offset.call(this.element) : this.options.offset,
+                position   = typeof(this.options.pos) === "function" ? this.options.pos.call(this.element) : this.options.pos,
+                tmppos     = position.split("-"),
+                tcss       = {
+                    "display"    : "none",
+                    "visibility" : "visible",
+                    "top"        : (pos.top + pos.height + height),
+                    "left"       : pos.left
+                };
+
+
+            // prevent strange position
+            // when tooltip is in offcanvas etc.
+            if (UI.$html.css('position')=='fixed' || UI.$body.css('position')=='fixed'){
+                var bodyoffset = UI.$('body').offset(),
+                    htmloffset = UI.$('html').offset(),
+                    docoffset  = {'top': (htmloffset.top + bodyoffset.top), 'left': (htmloffset.left + bodyoffset.left)};
+
+                pos.left -= docoffset.left;
+                pos.top  -= docoffset.top;
+            }
+
+
+            if ((tmppos[0] == "left" || tmppos[0] == "right") && UI.langdirection == 'right') {
+                tmppos[0] = tmppos[0] == "left" ? "right" : "left";
+            }
+
+            var variants =  {
+                "bottom"  : {top: pos.top + pos.height + offset, left: pos.left + pos.width / 2 - width / 2},
+                "top"     : {top: pos.top - height - offset, left: pos.left + pos.width / 2 - width / 2},
+                "left"    : {top: pos.top + pos.height / 2 - height / 2, left: pos.left - width - offset},
+                "right"   : {top: pos.top + pos.height / 2 - height / 2, left: pos.left + pos.width + offset}
+            };
+
+            UI.$.extend(tcss, variants[tmppos[0]]);
+
+            if (tmppos.length == 2) tcss.left = (tmppos[1] == 'left') ? (pos.left) : ((pos.left + pos.width) - width);
+
+            var boundary = this.checkBoundary(tcss.left, tcss.top, width, height);
+
+            if(boundary) {
+
+                switch(boundary) {
+                    case "x":
+
+                        if (tmppos.length == 2) {
+                            position = tmppos[0]+"-"+(tcss.left < 0 ? "left": "right");
+                        } else {
+                            position = tcss.left < 0 ? "right": "left";
+                        }
+
+                        break;
+
+                    case "y":
+                        if (tmppos.length == 2) {
+                            position = (tcss.top < 0 ? "bottom": "top")+"-"+tmppos[1];
+                        } else {
+                            position = (tcss.top < 0 ? "bottom": "top");
+                        }
+
+                        break;
+
+                    case "xy":
+                        if (tmppos.length == 2) {
+                            position = (tcss.top < 0 ? "bottom": "top")+"-"+(tcss.left < 0 ? "left": "right");
+                        } else {
+                            position = tcss.left < 0 ? "right": "left";
+                        }
+
+                        break;
+
+                }
+
+                tmppos = position.split("-");
+
+                UI.$.extend(tcss, variants[tmppos[0]]);
+
+                if (tmppos.length == 2) tcss.left = (tmppos[1] == 'left') ? (pos.left) : ((pos.left + pos.width) - width);
+            }
+
+
+            tcss.left -= UI.$body.position().left;
+
+            tooltipdelay = setTimeout(function(){
+
+                $tooltip.css(tcss).attr("class", ["uk-tooltip", "uk-tooltip-"+position, $this.options.cls].join(' '));
+
+                if ($this.options.animation) {
+                    $tooltip.css({opacity: 0, display: 'block'}).animate({opacity: 1}, parseInt($this.options.animation, 10) || 400);
+                } else {
+                    $tooltip.show();
+                }
+
+                tooltipdelay = false;
+
+                // close tooltip if element was removed or hidden
+                checkdelay = setInterval(function(){
+                    if(!$this.element.is(':visible')) $this.hide();
+                }, 150);
+
+            }, parseInt(this.options.delay, 10) || 0);
+        },
+
+        hide: function() {
+            if(this.element.is("input") && this.element[0]===document.activeElement) return;
+
+            if(tooltipdelay) clearTimeout(tooltipdelay);
+            if (checkdelay)  clearTimeout(checkdelay);
+
+            $tooltip.stop();
+
+            if (this.options.animation) {
+                $tooltip.fadeOut(parseInt(this.options.animation, 10) || 400);
+            } else {
+                $tooltip.hide();
+            }
+        },
+
+        content: function() {
+            return this.tip;
+        },
+
+        checkBoundary: function(left, top, width, height) {
+
+            var axis = "";
+
+            if(left < 0 || ((left - UI.$win.scrollLeft())+width) > window.innerWidth) {
+               axis += "x";
+            }
+
+            if(top < 0 || ((top - UI.$win.scrollTop())+height) > window.innerHeight) {
+               axis += "y";
+            }
+
+            return axis;
+        }
+    });
+
+    return UI.tooltip;
+});