uikit-sass-rails 1.3.0 → 1.4.0

data/vendor/assets/javascripts/uikit/core/modal.js

@@ -0,0 +1,323 @@
+/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+(function(UI) {
+
+    "use strict";
+
+    var active = false, $html = UI.$html, body;
+
+    UI.component('modal', {
+
+        defaults: {
+            keyboard: true,
+            bgclose: true,
+            minScrollHeight: 150,
+            center: false
+        },
+
+        scrollable: false,
+        transition: false,
+
+        init: function() {
+
+            if (!body) body = UI.$('body');
+
+            if (!this.element.length) return;
+
+            var $this = this;
+
+            this.paddingdir = "padding-" + (UI.langdirection == 'left' ? "right":"left");
+            this.dialog     = this.find(".uk-modal-dialog");
+
+            // Update ARIA
+            this.element.attr('aria-hidden', this.element.hasClass("uk-open"));
+
+            this.on("click", ".uk-modal-close", function(e) {
+                e.preventDefault();
+                $this.hide();
+            }).on("click", function(e) {
+
+                var target = UI.$(e.target);
+
+                if (target[0] == $this.element[0] && $this.options.bgclose) {
+                    $this.hide();
+                }
+            });
+        },
+
+        toggle: function() {
+            return this[this.isActive() ? "hide" : "show"]();
+        },
+
+        show: function() {
+
+            if (!this.element.length) return;
+
+            var $this = this;
+
+            if (this.isActive()) return;
+            if (active) active.hide(true);
+
+            this.element.removeClass("uk-open").show();
+            this.resize();
+            active = this;
+
+            this.element.addClass("uk-open");
+
+            $html.addClass("uk-modal-page").height(); // force browser engine redraw
+
+            // Update ARIA
+            this.element.attr('aria-hidden', 'false');
+
+            this.element.trigger("show.uk.modal");
+
+            UI.Utils.checkDisplay(this.dialog, true);
+
+            return this;
+        },
+
+        hide: function(force) {
+
+            if (!this.isActive()) return;
+
+            if (!force && UI.support.transition) {
+
+                var $this = this;
+
+                this.one(UI.support.transition.end, function() {
+                    $this._hide();
+                }).removeClass("uk-open");
+
+            } else {
+
+                this._hide();
+            }
+
+            return this;
+        },
+
+        resize: function() {
+
+            var bodywidth  = body.width();
+
+            this.scrollbarwidth = window.innerWidth - bodywidth;
+
+            body.css(this.paddingdir, this.scrollbarwidth);
+
+            this.element.css('overflow-y', this.scrollbarwidth ? 'scroll' : 'auto');
+
+            if (!this.updateScrollable() && this.options.center) {
+
+                var dh  = this.dialog.outerHeight(),
+                pad = parseInt(this.dialog.css('margin-top'), 10) + parseInt(this.dialog.css('margin-bottom'), 10);
+
+                if ((dh + pad) < window.innerHeight) {
+                    this.dialog.css({'top': (window.innerHeight/2 - dh/2) - pad });
+                } else {
+                    this.dialog.css({'top': ''});
+                }
+            }
+        },
+
+        updateScrollable: function() {
+
+            // has scrollable?
+            var scrollable = this.dialog.find('.uk-overflow-container:visible:first');
+
+            if (scrollable.length) {
+
+                scrollable.css("height", 0);
+
+                var offset = Math.abs(parseInt(this.dialog.css("margin-top"), 10)),
+                dh     = this.dialog.outerHeight(),
+                wh     = window.innerHeight,
+                h      = wh - 2*(offset < 20 ? 20:offset) - dh;
+
+                scrollable.css("height", h < this.options.minScrollHeight ? "":h);
+
+                return true;
+            }
+
+            return false;
+        },
+
+        _hide: function() {
+
+            this.element.hide().removeClass("uk-open");
+
+            // Update ARIA
+            this.element.attr('aria-hidden', 'true');
+
+            $html.removeClass("uk-modal-page");
+
+            body.css(this.paddingdir, "");
+
+            if(active===this) active = false;
+
+            this.trigger("hide.uk.modal");
+        },
+
+        isActive: function() {
+            return (active == this);
+        }
+
+    });
+
+    UI.component('modalTrigger', {
+
+        boot: function() {
+
+            // init code
+            UI.$html.on("click.modal.uikit", "[data-uk-modal]", function(e) {
+
+                var ele = UI.$(this);
+
+                if (ele.is("a")) {
+                    e.preventDefault();
+                }
+
+                if (!ele.data("modalTrigger")) {
+                    var modal = UI.modalTrigger(ele, UI.Utils.options(ele.attr("data-uk-modal")));
+                    modal.show();
+                }
+
+            });
+
+            // close modal on esc button
+            UI.$html.on('keydown.modal.uikit', function (e) {
+
+                if (active && e.keyCode === 27 && active.options.keyboard) { // ESC
+                    e.preventDefault();
+                    active.hide();
+                }
+            });
+
+            UI.$win.on("resize orientationchange", UI.Utils.debounce(function(){
+                if (active) active.resize();
+            }, 150));
+        },
+
+        init: function() {
+
+            var $this = this;
+
+            this.options = UI.$.extend({
+                "target": $this.element.is("a") ? $this.element.attr("href") : false
+            }, this.options);
+
+            this.modal = UI.modal(this.options.target, this.options);
+
+            this.on("click", function(e) {
+                e.preventDefault();
+                $this.show();
+            });
+
+            //methods
+            this.proxy(this.modal, "show hide isActive");
+        }
+    });
+
+    UI.modal.dialog = function(content, options) {
+
+        var modal = UI.modal(UI.$(UI.modal.dialog.template).appendTo("body"), options);
+
+        modal.on("hide.uk.modal", function(){
+            if (modal.persist) {
+                modal.persist.appendTo(modal.persist.data("modalPersistParent"));
+                modal.persist = false;
+            }
+            modal.element.remove();
+        });
+
+        setContent(content, modal);
+
+        return modal;
+    };
+
+    UI.modal.dialog.template = '<div class="uk-modal"><div class="uk-modal-dialog" style="min-height:0;"></div></div>';
+
+    UI.modal.alert = function(content, options) {
+
+        UI.modal.dialog(([
+            '<div class="uk-margin uk-modal-content">'+String(content)+'</div>',
+            '<div class="uk-modal-footer uk-text-right"><button class="uk-button uk-button-primary uk-modal-close">Ok</button></div>'
+        ]).join(""), UI.$.extend({bgclose:false, keyboard:false}, options)).show();
+    };
+
+    UI.modal.confirm = function(content, onconfirm, options) {
+
+        onconfirm = UI.$.isFunction(onconfirm) ? onconfirm : function(){};
+
+        var modal = UI.modal.dialog(([
+            '<div class="uk-margin uk-modal-content">'+String(content)+'</div>',
+            '<div class="uk-modal-footer uk-text-right"><button class="uk-button uk-button-primary js-modal-confirm">Ok</button> <button class="uk-button uk-modal-close">Cancel</button></div>'
+        ]).join(""), UI.$.extend({bgclose:false, keyboard:false}, options));
+
+        modal.element.find(".js-modal-confirm").on("click", function(){
+            onconfirm();
+            modal.hide();
+        });
+
+        modal.show();
+    };
+
+    UI.modal.prompt = function(text, value, onsubmit, options) {
+
+        onsubmit = UI.$.isFunction(onsubmit) ? onsubmit : function(value){};
+
+        var modal = UI.modal.dialog(([
+            text ? '<div class="uk-modal-content uk-form">'+String(text)+'</div>':'',
+            '<div class="uk-margin-small-top uk-modal-content uk-form"><p><input type="text" class="uk-width-1-1"></p></div>',
+            '<div class="uk-modal-footer uk-text-right"><button class="uk-button uk-button-primary js-modal-ok">Ok</button> <button class="uk-button uk-modal-close">Cancel</button></div>'
+        ]).join(""), UI.$.extend({bgclose:false, keyboard:false}, options)),
+        input = modal.element.find("input[type='text']").val(value || '');
+
+        modal.element.find(".js-modal-ok").on("click", function(){
+            if (onsubmit(input.val())!==false){
+                modal.hide();
+            }
+        });
+        modal.show();
+        setTimeout(function(){ input.focus(); }, 100);
+    };
+
+    UI.modal.blockUI = function(content, options) {
+
+        var modal = UI.modal.dialog(([
+            '<div class="uk-margin uk-modal-content">'+String(content || '<div class="uk-text-center">...</div>')+'</div>'
+        ]).join(""), UI.$.extend({bgclose:false, keyboard:false}, options));
+
+        modal.content = modal.element.find('.uk-modal-content:first');
+        modal.show();
+
+        return modal;
+    };
+
+
+    // helper functions
+    function setContent(content, modal){
+
+        if(!modal) return;
+
+        if (typeof content === 'object') {
+
+            // convert DOM object to a jQuery object
+            content = content instanceof jQuery ? content : UI.$(content);
+
+            if(content.parent().length) {
+                modal.persist = content;
+                modal.persist.data("modalPersistParent", content.parent());
+            }
+        }else if (typeof content === 'string' || typeof content === 'number') {
+                // just insert the data as innerHTML
+                content = UI.$('<div></div>').html(content);
+        }else {
+                // unsupported data type!
+                content = UI.$('<div></div>').html('UIkit.modal Error: Unsupported data type: ' + typeof content);
+        }
+
+        content.appendTo(modal.element.find('.uk-modal-dialog'));
+
+        return modal;
+    }
+
+})(UIkit);

data/vendor/assets/javascripts/uikit/core/nav.js

@@ -0,0 +1,117 @@
+/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+(function(UI) {
+
+    "use strict";
+
+    UI.component('nav', {
+
+        defaults: {
+            "toggle": ">li.uk-parent > a[href='#']",
+            "lists": ">li.uk-parent > ul",
+            "multiple": false
+        },
+
+        boot: function() {
+
+            // init code
+            UI.ready(function(context) {
+
+                UI.$("[data-uk-nav]", context).each(function() {
+                    var nav = UI.$(this);
+
+                    if (!nav.data("nav")) {
+                        var obj = UI.nav(nav, UI.Utils.options(nav.attr("data-uk-nav")));
+                    }
+                });
+            });
+        },
+
+        init: function() {
+
+            var $this = this;
+
+            this.on("click.uikit.nav", this.options.toggle, function(e) {
+                e.preventDefault();
+                var ele = UI.$(this);
+                $this.open(ele.parent()[0] == $this.element[0] ? ele : ele.parent("li"));
+            });
+
+            this.find(this.options.lists).each(function() {
+                var $ele   = UI.$(this),
+                    parent = $ele.parent(),
+                    active = parent.hasClass("uk-active");
+
+                $ele.wrap('<div style="overflow:hidden;height:0;position:relative;"></div>');
+                parent.data("list-container", $ele.parent());
+
+                // Init ARIA
+                parent.attr('aria-expanded', parent.hasClass("uk-open"));
+
+                if (active) $this.open(parent, true);
+            });
+
+        },
+
+        open: function(li, noanimation) {
+
+            var $this = this, element = this.element, $li = UI.$(li);
+
+            if (!this.options.multiple) {
+
+                element.children(".uk-open").not(li).each(function() {
+
+                    var ele = UI.$(this);
+
+                    if (ele.data("list-container")) {
+                        ele.data("list-container").stop().animate({height: 0}, function() {
+                            UI.$(this).parent().removeClass("uk-open");
+                        });
+                    }
+                });
+            }
+
+            $li.toggleClass("uk-open");
+
+            // Update ARIA
+            $li.attr('aria-expanded', $li.hasClass("uk-open"));
+
+            if ($li.data("list-container")) {
+
+                if (noanimation) {
+                    $li.data('list-container').stop().height($li.hasClass("uk-open") ? "auto" : 0);
+                    this.trigger("display.uk.check");
+                } else {
+                    $li.data('list-container').stop().animate({
+                        height: ($li.hasClass("uk-open") ? getHeight($li.data('list-container').find('ul:first')) : 0)
+                    }, function() {
+                        $this.trigger("display.uk.check");
+                    });
+                }
+            }
+        }
+    });
+
+
+    // helper
+
+    function getHeight(ele) {
+        var $ele = UI.$(ele), height = "auto";
+
+        if ($ele.is(":visible")) {
+            height = $ele.outerHeight();
+        } else {
+            var tmp = {
+                position: $ele.css("position"),
+                visibility: $ele.css("visibility"),
+                display: $ele.css("display")
+            };
+
+            height = $ele.css({position: 'absolute', visibility: 'hidden', display: 'block'}).outerHeight();
+
+            $ele.css(tmp); // reset element
+        }
+
+        return height;
+    }
+
+})(UIkit);

data/vendor/assets/javascripts/uikit/core/offcanvas.js

@@ -0,0 +1,178 @@
+/*! UIkit 2.20.3 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+(function(UI) {
+
+    "use strict";
+
+    var scrollpos = {x: window.scrollX, y: window.scrollY},
+        $win      = UI.$win,
+        $doc      = UI.$doc,
+        $html     = UI.$html,
+        Offcanvas = {
+
+        show: function(element) {
+
+            element = UI.$(element);
+
+            if (!element.length) return;
+
+            var $body     = UI.$('body'),
+                bar       = element.find(".uk-offcanvas-bar:first"),
+                rtl       = (UI.langdirection == "right"),
+                flip      = bar.hasClass("uk-offcanvas-bar-flip") ? -1:1,
+                dir       = flip * (rtl ? -1 : 1);
+
+            scrollpos = {x: window.pageXOffset, y: window.pageYOffset};
+
+            element.addClass("uk-active");
+
+            $body.css({"width": window.innerWidth, "height": window.innerHeight}).addClass("uk-offcanvas-page");
+            $body.css((rtl ? "margin-right" : "margin-left"), (rtl ? -1 : 1) * (bar.outerWidth() * dir)).width(); // .width() - force redraw
+
+            $html.css('margin-top', scrollpos.y * -1);
+
+            bar.addClass("uk-offcanvas-bar-show");
+
+            this._initElement(element);
+
+            bar.trigger('show.uk.offcanvas', [element, bar]);
+
+            // Update ARIA
+            element.attr('aria-hidden', 'false');
+        },
+
+        hide: function(force) {
+
+            var $body = UI.$('body'),
+                panel = UI.$(".uk-offcanvas.uk-active"),
+                rtl   = (UI.langdirection == "right"),
+                bar   = panel.find(".uk-offcanvas-bar:first"),
+                finalize = function() {
+                    $body.removeClass("uk-offcanvas-page").css({"width": "", "height": "", "margin-left": "", "margin-right": ""});
+                    panel.removeClass("uk-active");
+
+                    bar.removeClass("uk-offcanvas-bar-show");
+                    $html.css('margin-top', '');
+                    window.scrollTo(scrollpos.x, scrollpos.y);
+                    bar.trigger('hide.uk.offcanvas', [panel, bar]);
+
+                    // Update ARIA
+                    panel.attr('aria-hidden', 'true');
+                };
+
+            if (!panel.length) return;
+
+            if (UI.support.transition && !force) {
+
+                $body.one(UI.support.transition.end, function() {
+                    finalize();
+                }).css((rtl ? "margin-right" : "margin-left"), "");
+
+                setTimeout(function(){
+                    bar.removeClass("uk-offcanvas-bar-show");
+                }, 0);
+
+            } else {
+                finalize();
+            }
+        },
+
+        _initElement: function(element) {
+
+            if (element.data("OffcanvasInit")) return;
+
+            element.on("click.uk.offcanvas swipeRight.uk.offcanvas swipeLeft.uk.offcanvas", function(e) {
+
+                var target = UI.$(e.target);
+
+                if (!e.type.match(/swipe/)) {
+
+                    if (!target.hasClass("uk-offcanvas-close")) {
+                        if (target.hasClass("uk-offcanvas-bar")) return;
+                        if (target.parents(".uk-offcanvas-bar:first").length) return;
+                    }
+                }
+
+                e.stopImmediatePropagation();
+                Offcanvas.hide();
+            });
+
+            element.on("click", "a[href^='#']", function(e){
+
+                var link = UI.$(this),
+                    href = link.attr("href");
+
+                if (href == "#") {
+                    return;
+                }
+
+                UI.$doc.one('hide.uk.offcanvas', function() {
+
+                    var target;
+
+                    try {
+                        target = UI.$(href);
+                    } catch (e){
+                        target = ""
+                    }
+
+                    if (!target.length) {
+                        target = UI.$('[name="'+href.replace('#','')+'"]');
+                    }
+
+                    if (target.length && link.attr('data-uk-smooth-scroll') && UI.Utils.scrollToElement) {
+                        UI.Utils.scrollToElement(target, UI.Utils.options(link.attr('data-uk-smooth-scroll') || '{}'));
+                    } else {
+                        window.location.href = href;
+                    }
+                });
+
+                Offcanvas.hide();
+            });
+
+            element.data("OffcanvasInit", true);
+        }
+    };
+
+    UI.component('offcanvasTrigger', {
+
+        boot: function() {
+
+            // init code
+            $html.on("click.offcanvas.uikit", "[data-uk-offcanvas]", function(e) {
+
+                e.preventDefault();
+
+                var ele = UI.$(this);
+
+                if (!ele.data("offcanvasTrigger")) {
+                    var obj = UI.offcanvasTrigger(ele, UI.Utils.options(ele.attr("data-uk-offcanvas")));
+                    ele.trigger("click");
+                }
+            });
+
+            $html.on('keydown.uk.offcanvas', function(e) {
+
+                if (e.keyCode === 27) { // ESC
+                    Offcanvas.hide();
+                }
+            });
+        },
+
+        init: function() {
+
+            var $this = this;
+
+            this.options = UI.$.extend({
+                "target": $this.element.is("a") ? $this.element.attr("href") : false
+            }, this.options);
+
+            this.on("click", function(e) {
+                e.preventDefault();
+                Offcanvas.show($this.options.target);
+            });
+        }
+    });
+
+    UI.offcanvas = Offcanvas;
+
+})(UIkit);