uikit-rails 0.0.2 → 1.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: f59f3bd6d8784bd4f4b9bcf7f95108af4fbf358f
+  data.tar.gz: ffb30c359a44022047c955a43c7f02ce60cacddd
+SHA512:
+  metadata.gz: c5b4f6b8ef516077b7dcdbe63e91b04a2bf09656f3181442bb889203d1c96d15b5bb34f3bd8ad6228e049785f7d7fdb2205b840601bde80886f39ae16d5958df
+  data.tar.gz: f444d804e68128b27037497e26af984e8f99d496dae597468445095ef0e42d67bdcd64e49d0a2cb59208bf760d63c32af93971fc0c32d0e61ea3abec0ac6a561

data/.gitignore

@@ -1,4 +1,10 @@
 *.gem
-.bundle
-Gemfile.lock
-pkg/*
+/.bundle/
+/.yardoc
+/Gemfile.lock
+/_yardoc/
+/coverage/
+/doc/
+/pkg/
+/spec/reports/
+/tmp/

data/Gemfile

@@ -1,3 +1,4 @@
-source :rubygems
+source 'https://rubygems.org'
 
+# Specify your gem's dependencies in uikitten.gemspec
 gemspec

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Airship, LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,65 @@
+# UIKit for Sass
+[![Gem Version](https://badge.fury.io/rb/uikit-rails.svg)](https://badge.fury.io/rb/uikit-rails)
+
+## Installation
+
+`uikit-rails` is easy to drop into Rails with the asset pipeline.
+
+In your Gemfile you need to add the `uikit-rails` gem, and ensure that the `sass-rails` gem is present - it is added to new Rails applications by default.
+
+```ruby
+gem 'uikit-rails'
+gem 'sass-rails', '>= 3.2'
+```
+
+`bundle install` and restart your server to make the files available through the pipeline.
+
+Import UIKit styles in `app/assets/stylesheets/application.scss`:
+
+```scss
+@import "uikit";
+@import "uikit-components";
+```
+
+Make sure the file has `.scss` extension (or `.sass` for Sass syntax). If you have just generated a new Rails app,
+it may come with a `.css` file instead. If this file exists, it will be served instead of Sass, so rename it:
+
+```console
+$ mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss
+```
+
+Then, remove all the `*= require_self` and `*= require_tree .` statements from the sass file. Instead, use `@import` to import Sass files.
+
+Require UIKit Javascripts in `app/assets/javascripts/application.js`:
+
+```js
+//= require jquery
+//= require uikit
+//= require uikit-components
+```
+
+## Usage
+
+Import UIKit into a Sass file (for example, application.scss) to get all of UIKit's styles, mixins and variables!
+
+```scss
+@import "uikit";
+```
+
+The full list of uikit variables can be found [here](https://github.com/thinkairship/uikit-rails/wiki/Variables). You can override these by simply redefining the variable before the `@import` directive, e.g.:
+
+```scss
+$button-primary-color: #FF4200;
+$light-orange: #ff8c00;
+$nav-navbar-color: $light-orange;
+
+@import "uikit";
+```
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/thinkairship/uikit-rails.
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).

data/Rakefile

@@ -1,2 +1 @@
-require 'json'
 require "bundler/gem_tasks"

data/assets/javascripts/components/accordion.js

@@ -0,0 +1,174 @@
+/*! UIkit 2.24.2 | 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-accordion", ["uikit"], function(){
+            return component || addon(UIkit);
+        });
+    }
+})(function(UI){
+
+    "use strict";
+
+    UI.component('accordion', {
+
+        defaults: {
+            showfirst  : true,
+            collapse   : true,
+            animate    : true,
+            easing     : 'swing',
+            duration   : 300,
+            toggle     : '.uk-accordion-title',
+            containers : '.uk-accordion-content',
+            clsactive  : 'uk-active'
+        },
+
+        boot:  function() {
+
+            // init code
+            UI.ready(function(context) {
+
+                setTimeout(function(){
+
+                    UI.$("[data-uk-accordion]", context).each(function(){
+
+                        var ele = UI.$(this);
+
+                        if(!ele.data("accordion")) {
+                            UI.accordion(ele, UI.Utils.options(ele.attr('data-uk-accordion')));
+                        }
+                    });
+
+                }, 0);
+            });
+        },
+
+        init: function() {
+
+            var $this = this;
+
+            this.element.on('click.uikit.accordion', this.options.toggle, function(e) {
+
+                e.preventDefault();
+
+                $this.toggleItem(UI.$(this).data('wrapper'), $this.options.animate, $this.options.collapse);
+            });
+
+            this.update();
+
+            if (this.options.showfirst) {
+                this.toggleItem(this.toggle.eq(0).data('wrapper'), false, false);
+            }
+        },
+
+        toggleItem: function(wrapper, animated, collapse) {
+
+            var $this = this;
+
+            wrapper.data('toggle').toggleClass(this.options.clsactive);
+            wrapper.data('content').toggleClass(this.options.clsactive);
+
+            var active = wrapper.data('toggle').hasClass(this.options.clsactive);
+
+            if (collapse) {
+                this.toggle.not(wrapper.data('toggle')).removeClass(this.options.clsactive);
+                this.content.not(wrapper.data('content')).removeClass(this.options.clsactive)
+                    .parent().stop().css('overflow', 'hidden').animate({ height: 0 }, {easing: this.options.easing, duration: animated ? this.options.duration : 0}).attr('aria-expanded', 'false');
+            }
+
+            wrapper.stop().css('overflow', 'hidden');
+
+            if (animated) {
+
+                wrapper.animate({ height: active ? getHeight(wrapper.data('content')) : 0 }, {easing: this.options.easing, duration: this.options.duration, complete: function() {
+
+                    if (active) {
+                        wrapper.css({'overflow': '', 'height': 'auto'});
+                        UI.Utils.checkDisplay(wrapper.data('content'));
+                    }
+
+                    $this.trigger('display.uk.check');
+                }});
+
+            } else {
+
+                wrapper.height(active ? 'auto' : 0);
+
+                if (active) {
+                    wrapper.css({'overflow': ''});
+                    UI.Utils.checkDisplay(wrapper.data('content'));
+                }
+
+                this.trigger('display.uk.check');
+            }
+
+            // Update ARIA
+            wrapper.attr('aria-expanded', active);
+
+            this.element.trigger('toggle.uk.accordion', [active, wrapper.data('toggle'), wrapper.data('content')]);
+        },
+
+        update: function() {
+
+            var $this = this, $content, $wrapper, $toggle;
+
+            this.toggle = this.find(this.options.toggle);
+            this.content = this.find(this.options.containers);
+
+            this.content.each(function(index) {
+
+                $content = UI.$(this);
+
+                if ($content.parent().data('wrapper')) {
+                    $wrapper = $content.parent();
+                } else {
+                    $wrapper = UI.$(this).wrap('<div data-wrapper="true" style="overflow:hidden;height:0;position:relative;"></div>').parent();
+
+                    // Init ARIA
+                    $wrapper.attr('aria-expanded', 'false');
+                }
+
+                $toggle = $this.toggle.eq(index);
+
+                $wrapper.data('toggle', $toggle);
+                $wrapper.data('content', $content);
+                $toggle.data('wrapper', $wrapper);
+                $content.data('wrapper', $wrapper);
+            });
+
+            this.element.trigger('update.uk.accordion', [this]);
+        }
+
+    });
+
+    // 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;
+    }
+
+    return UI.accordion;
+});

data/assets/javascripts/components/accordion.min.js

@@ -0,0 +1,2 @@
+/*! UIkit 2.24.2 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
+!function(t){var i;window.UIkit&&(i=t(UIkit)),"function"==typeof define&&define.amd&&define("uikit-accordion",["uikit"],function(){return i||t(UIkit)})}(function(t){"use strict";function i(i){var o=t.$(i),e="auto";if(o.is(":visible"))e=o.outerHeight();else{var a={position:o.css("position"),visibility:o.css("visibility"),display:o.css("display")};e=o.css({position:"absolute",visibility:"hidden",display:"block"}).outerHeight(),o.css(a)}return e}return t.component("accordion",{defaults:{showfirst:!0,collapse:!0,animate:!0,easing:"swing",duration:300,toggle:".uk-accordion-title",containers:".uk-accordion-content",clsactive:"uk-active"},boot:function(){t.ready(function(i){setTimeout(function(){t.$("[data-uk-accordion]",i).each(function(){var i=t.$(this);i.data("accordion")||t.accordion(i,t.Utils.options(i.attr("data-uk-accordion")))})},0)})},init:function(){var i=this;this.element.on("click.uikit.accordion",this.options.toggle,function(o){o.preventDefault(),i.toggleItem(t.$(this).data("wrapper"),i.options.animate,i.options.collapse)}),this.update(),this.options.showfirst&&this.toggleItem(this.toggle.eq(0).data("wrapper"),!1,!1)},toggleItem:function(o,e,a){var n=this;o.data("toggle").toggleClass(this.options.clsactive),o.data("content").toggleClass(this.options.clsactive);var s=o.data("toggle").hasClass(this.options.clsactive);a&&(this.toggle.not(o.data("toggle")).removeClass(this.options.clsactive),this.content.not(o.data("content")).removeClass(this.options.clsactive).parent().stop().css("overflow","hidden").animate({height:0},{easing:this.options.easing,duration:e?this.options.duration:0}).attr("aria-expanded","false")),o.stop().css("overflow","hidden"),e?o.animate({height:s?i(o.data("content")):0},{easing:this.options.easing,duration:this.options.duration,complete:function(){s&&(o.css({overflow:"",height:"auto"}),t.Utils.checkDisplay(o.data("content"))),n.trigger("display.uk.check")}}):(o.height(s?"auto":0),s&&(o.css({overflow:""}),t.Utils.checkDisplay(o.data("content"))),this.trigger("display.uk.check")),o.attr("aria-expanded",s),this.element.trigger("toggle.uk.accordion",[s,o.data("toggle"),o.data("content")])},update:function(){var i,o,e,a=this;this.toggle=this.find(this.options.toggle),this.content=this.find(this.options.containers),this.content.each(function(n){i=t.$(this),i.parent().data("wrapper")?o=i.parent():(o=t.$(this).wrap('<div data-wrapper="true" style="overflow:hidden;height:0;position:relative;"></div>').parent(),o.attr("aria-expanded","false")),e=a.toggle.eq(n),o.data("toggle",e),o.data("content",i),e.data("wrapper",o),i.data("wrapper",o)}),this.element.trigger("update.uk.accordion",[this])}}),t.accordion});

data/assets/javascripts/components/autocomplete.js

@@ -0,0 +1,334 @@
+/*! UIkit 2.24.2 | 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-autocomplete", ["uikit"], function(){
+            return component || addon(UIkit);
+        });
+    }
+
+})(function(UI){
+
+    "use strict";
+
+    var active;
+
+    UI.component('autocomplete', {
+
+        defaults: {
+            minLength: 3,
+            param: 'search',
+            method: 'post',
+            delay: 300,
+            loadingClass: 'uk-loading',
+            flipDropdown: false,
+            skipClass: 'uk-skip',
+            hoverClass: 'uk-active',
+            source: null,
+            renderer: null,
+
+            // template
+
+            template: '<ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results">{{~items}}<li data-value="{{$item.value}}"><a>{{$item.value}}</a></li>{{/items}}</ul>'
+        },
+
+        visible  : false,
+        value    : null,
+        selected : null,
+
+        boot: function() {
+
+            // init code
+            UI.$html.on("focus.autocomplete.uikit", "[data-uk-autocomplete]", function(e) {
+
+                var ele = UI.$(this);
+
+                if (!ele.data("autocomplete")) {
+                    UI.autocomplete(ele, UI.Utils.options(ele.attr("data-uk-autocomplete")));
+                }
+            });
+
+            // register outer click for autocompletes
+            UI.$html.on("click.autocomplete.uikit", function(e) {
+                if (active && e.target!=active.input[0]) active.hide();
+            });
+        },
+
+        init: function() {
+
+            var $this   = this,
+                select  = false,
+                trigger = UI.Utils.debounce(function(e) {
+                    if(select) {
+                        return (select = false);
+                    }
+                    $this.handle();
+                }, this.options.delay);
+
+
+            this.dropdown = this.find('.uk-dropdown');
+            this.template = this.find('script[type="text/autocomplete"]').html();
+            this.template = UI.Utils.template(this.template || this.options.template);
+            this.input    = this.find("input:first").attr("autocomplete", "off");
+
+            if (!this.dropdown.length) {
+               this.dropdown = UI.$('<div class="uk-dropdown"></div>').appendTo(this.element);
+            }
+
+            if (this.options.flipDropdown) {
+                this.dropdown.addClass('uk-dropdown-flip');
+            }
+
+            this.dropdown.attr('aria-expanded', 'false');
+
+            this.input.on({
+                "keydown": function(e) {
+
+                    if (e && e.which && !e.shiftKey) {
+
+                        switch (e.which) {
+                            case 13: // enter
+                                select = true;
+
+                                if ($this.selected) {
+                                    e.preventDefault();
+                                    $this.select();
+                                }
+                                break;
+                            case 38: // up
+                                e.preventDefault();
+                                $this.pick('prev', true);
+                                break;
+                            case 40: // down
+                                e.preventDefault();
+                                $this.pick('next', true);
+                                break;
+                            case 27:
+                            case 9: // esc, tab
+                                $this.hide();
+                                break;
+                            default:
+                                break;
+                        }
+                    }
+
+                },
+                "keyup": trigger
+            });
+
+            this.dropdown.on("click", ".uk-autocomplete-results > *", function(){
+                $this.select();
+            });
+
+            this.dropdown.on("mouseover", ".uk-autocomplete-results > *", function(){
+                $this.pick(UI.$(this));
+            });
+
+            this.triggercomplete = trigger;
+        },
+
+        handle: function() {
+
+            var $this = this, old = this.value;
+
+            this.value = this.input.val();
+
+            if (this.value.length < this.options.minLength) return this.hide();
+
+            if (this.value != old) {
+                $this.request();
+            }
+
+            return this;
+        },
+
+        pick: function(item, scrollinview) {
+
+            var $this    = this,
+                items    = UI.$(this.dropdown.find('.uk-autocomplete-results').children(':not(.'+this.options.skipClass+')')),
+                selected = false;
+
+            if (typeof item !== "string" && !item.hasClass(this.options.skipClass)) {
+                selected = item;
+            } else if (item == 'next' || item == 'prev') {
+
+                if (this.selected) {
+                    var index = items.index(this.selected);
+
+                    if (item == 'next') {
+                        selected = items.eq(index + 1 < items.length ? index + 1 : 0);
+                    } else {
+                        selected = items.eq(index - 1 < 0 ? items.length - 1 : index - 1);
+                    }
+
+                } else {
+                    selected = items[(item == 'next') ? 'first' : 'last']();
+                }
+
+                selected = UI.$(selected);
+            }
+
+            if (selected && selected.length) {
+                this.selected = selected;
+                items.removeClass(this.options.hoverClass);
+                this.selected.addClass(this.options.hoverClass);
+
+                // jump to selected if not in view
+                if (scrollinview) {
+
+                    var top       = selected.position().top,
+                        scrollTop = $this.dropdown.scrollTop(),
+                        dpheight  = $this.dropdown.height();
+
+                    if (top > dpheight ||  top < 0) {
+                        $this.dropdown.scrollTop(scrollTop + top);
+                    }
+                }
+            }
+        },
+
+        select: function() {
+
+            if(!this.selected) return;
+
+            var data = this.selected.data();
+
+            this.trigger("selectitem.uk.autocomplete", [data, this]);
+
+            if (data.value) {
+                this.input.val(data.value).trigger('change');
+            }
+
+            this.hide();
+        },
+
+        show: function() {
+            if (this.visible) return;
+            this.visible = true;
+            this.element.addClass("uk-open");
+
+            if (active && active!==this) {
+                active.hide();
+            }
+
+            active = this;
+
+            // Update aria
+            this.dropdown.attr('aria-expanded', 'true');
+
+            return this;
+        },
+
+        hide: function() {
+            if (!this.visible) return;
+            this.visible = false;
+            this.element.removeClass("uk-open");
+
+            if (active === this) {
+                active = false;
+            }
+
+            // Update aria
+            this.dropdown.attr('aria-expanded', 'false');
+
+            return this;
+        },
+
+        request: function() {
+
+            var $this   = this,
+                release = function(data) {
+
+                    if(data) {
+                        $this.render(data);
+                    }
+
+                    $this.element.removeClass($this.options.loadingClass);
+                };
+
+            this.element.addClass(this.options.loadingClass);
+
+            if (this.options.source) {
+
+                var source = this.options.source;
+
+                switch(typeof(this.options.source)) {
+                    case 'function':
+
+                        this.options.source.apply(this, [release]);
+
+                        break;
+
+                    case 'object':
+
+                        if(source.length) {
+
+                            var items = [];
+
+                            source.forEach(function(item){
+                                if(item.value && item.value.toLowerCase().indexOf($this.value.toLowerCase())!=-1) {
+                                    items.push(item);
+                                }
+                            });
+
+                            release(items);
+                        }
+
+                        break;
+
+                    case 'string':
+
+                        var params ={};
+
+                        params[this.options.param] = this.value;
+
+                        UI.$.ajax({
+                            url: this.options.source,
+                            data: params,
+                            type: this.options.method,
+                            dataType: 'json'
+                        }).done(function(json) {
+                            release(json || []);
+                        });
+
+                        break;
+
+                    default:
+                        release(null);
+                }
+
+            } else {
+                this.element.removeClass($this.options.loadingClass);
+            }
+        },
+
+        render: function(data) {
+
+            this.dropdown.empty();
+
+            this.selected = false;
+
+            if (this.options.renderer) {
+
+                this.options.renderer.apply(this, [data]);
+
+            } else if(data && data.length) {
+
+                this.dropdown.append(this.template({"items":data}));
+                this.show();
+
+                this.trigger('show.uk.autocomplete');
+            }
+
+            return this;
+        }
+    });
+
+    return UI.autocomplete;
+});