ladda-bootstrap-rails 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 23fb513ae607dfa7d3059300de6f8a6c6e6f7840
+  data.tar.gz: ea0c3a5d5e5f8bf681f347f209e33effdf205094
+SHA512:
+  metadata.gz: 643a817af4c6380aafd38ab224b56f058e98387dceea53addfa863520f868192d3d0f7c6509de7deb1c77e87f5419dbbd4565912ff34d1f35c3acba0363cd268
+  data.tar.gz: 6de86b05b26341cba0d07efa8bebf14b36f4ddaffd7b3a196611ba097851e96467f82dcb530ecf9021b87e7b63f4fc1591763ad0a4bd6bce12c0e9ffa3c5643d

data/.gitignore

@@ -0,0 +1,18 @@
+*.gem
+*.rbc
+.bundle
+.config
+coverage
+InstalledFiles
+lib/bundler/man
+pkg
+rdoc
+spec/reports
+test/tmp
+test/version_tmp
+tmp
+
+# YARD artifacts
+.yardoc
+_yardoc
+doc/

data/Gemfile

@@ -0,0 +1,4 @@
+source 'https://rubygems.org'
+
+# Specify your gem's dependencies in ladda-bootstrap-rails.gemspec
+gemspec

data/LICENSE.txt

@@ -0,0 +1,22 @@
+Copyright (c) 2014 rafaelliu
+
+MIT License
+
+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,21 @@
+# ladda-bootstrap-rails
+
+A thin wrapper around https://github.com/msurguy/ladda-bootstrap.
+
+## Usage
+
+Gemfile:
+```
+gem 'ladda-bootstrap-rails', :git => 'git://github.com/vendji/ladda-bootstrap-rails.git'
+```
+
+application.js:
+```
+//= require spin
+//= require ladda
+```
+
+application.css:
+```
+*= require ladda-themeless
+```

data/Rakefile

@@ -0,0 +1 @@
+require "bundler/gem_tasks"

data/ladda-bootstrap-rails.gemspec

@@ -0,0 +1,19 @@
+# -*- encoding: utf-8 -*-
+
+Gem::Specification.new do |s|
+  s.name        = "ladda-bootstrap-rails"
+  s.version     = "0.1.0"
+  s.platform    = Gem::Platform::RUBY
+  s.authors     = ["Rafael Liu"]
+  s.email       = ["rafael@vendji.com"]
+  s.homepage    = "https://github.com/vendji/ladda-bootstrap-rails"
+  s.summary     = "A Ladda Bootrap wrapper for Rails 3"
+  s.description = "This gem provides CSS and JS for Ladda Bootstrap."
+  s.license     = "MIT"
+
+  s.required_rubygems_version = ">= 1.3.6"
+
+  s.files        = `git ls-files`.split("\n")
+  s.executables  = `git ls-files -- bin/*`.split("\n").map { |f| File.basename(f) }
+  s.require_path = 'lib'
+end

data/lib/ladda-bootstrap-rails.rb

@@ -0,0 +1,6 @@
+module LaddaBootstrap
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/vendor/assets/javascripts/ladda.js

@@ -0,0 +1,157 @@
+(function(root, factory) {
+    if (typeof exports === "object") {
+        module.exports = factory();
+    } else if (typeof define === "function" && define.amd) {
+        define([ "spin" ], factory);
+    } else {
+        root.Ladda = factory(root.Spinner);
+    }
+})(this, function(Spinner) {
+    "use strict";
+    var ALL_INSTANCES = [];
+    function create(button) {
+        if (typeof button === "undefined") {
+            console.warn("Ladda button target must be defined.");
+            return;
+        }
+        if (!button.querySelector(".ladda-label")) {
+            button.innerHTML = '<span class="ladda-label">' + button.innerHTML + "</span>";
+        }
+        var spinner = createSpinner(button);
+        var spinnerWrapper = document.createElement("span");
+        spinnerWrapper.className = "ladda-spinner";
+        button.appendChild(spinnerWrapper);
+        var timer;
+        var instance = {
+            start: function() {
+                button.setAttribute("disabled", "");
+                button.setAttribute("data-loading", "");
+                clearTimeout(timer);
+                spinner.spin(spinnerWrapper);
+                this.setProgress(0);
+                return this;
+            },
+            startAfter: function(delay) {
+                clearTimeout(timer);
+                timer = setTimeout(function() {
+                    instance.start();
+                }, delay);
+                return this;
+            },
+            stop: function() {
+                button.removeAttribute("disabled");
+                button.removeAttribute("data-loading");
+                clearTimeout(timer);
+                timer = setTimeout(function() {
+                    spinner.stop();
+                }, 1e3);
+                return this;
+            },
+            toggle: function() {
+                if (this.isLoading()) {
+                    this.stop();
+                } else {
+                    this.start();
+                }
+                return this;
+            },
+            setProgress: function(progress) {
+                progress = Math.max(Math.min(progress, 1), 0);
+                var progressElement = button.querySelector(".ladda-progress");
+                if (progress === 0 && progressElement && progressElement.parentNode) {
+                    progressElement.parentNode.removeChild(progressElement);
+                } else {
+                    if (!progressElement) {
+                        progressElement = document.createElement("div");
+                        progressElement.className = "ladda-progress";
+                        button.appendChild(progressElement);
+                    }
+                    progressElement.style.width = (progress || 0) * button.offsetWidth + "px";
+                }
+            },
+            enable: function() {
+                this.stop();
+                return this;
+            },
+            disable: function() {
+                this.stop();
+                button.setAttribute("disabled", "");
+                return this;
+            },
+            isLoading: function() {
+                return button.hasAttribute("data-loading");
+            }
+        };
+        ALL_INSTANCES.push(instance);
+        return instance;
+    }
+    function bind(target, options) {
+        options = options || {};
+        var targets = [];
+        if (typeof target === "string") {
+            targets = toArray(document.querySelectorAll(target));
+        } else if (typeof target === "object" && typeof target.nodeName === "string") {
+            targets = [ target ];
+        }
+        for (var i = 0, len = targets.length; i < len; i++) {
+            (function() {
+                var element = targets[i];
+                if (typeof element.addEventListener === "function") {
+                    var instance = create(element);
+                    var timeout = -1;
+                    element.addEventListener("click", function() {
+                        instance.startAfter(1);
+                        if (typeof options.timeout === "number") {
+                            clearTimeout(timeout);
+                            timeout = setTimeout(instance.stop, options.timeout);
+                        }
+                        if (typeof options.callback === "function") {
+                            options.callback.apply(null, [ instance ]);
+                        }
+                    }, false);
+                }
+            })();
+        }
+    }
+    function stopAll() {
+        for (var i = 0, len = ALL_INSTANCES.length; i < len; i++) {
+            ALL_INSTANCES[i].stop();
+        }
+    }
+    function createSpinner(button) {
+        var height = button.offsetHeight, spinnerColor;
+        if (height > 32) {
+            height *= .8;
+        }
+        if (button.hasAttribute("data-spinner-size")) {
+            height = parseInt(button.getAttribute("data-spinner-size"), 10);
+        }
+        if (button.hasAttribute("data-spinner-color")) {
+            spinnerColor = button.getAttribute("data-spinner-color");
+        }
+        var lines = 12, radius = height * .2, length = radius * .6, width = radius < 7 ? 2 : 3;
+        return new Spinner({
+            color: spinnerColor || "#fff",
+            lines: lines,
+            radius: radius,
+            length: length,
+            width: width,
+            zIndex: "auto",
+            top: "auto",
+            left: "auto",
+            className: ""
+        });
+    }
+    function toArray(nodes) {
+        var a = [];
+        for (var i = 0; i < nodes.length; i++) {
+            a.push(nodes[i]);
+        }
+        return a;
+    }
+    return {
+        bind: bind,
+        create: create,
+        stopAll: stopAll
+    };
+});

data/vendor/assets/javascripts/spin.js

@@ -0,0 +1,218 @@
+(function(root, factory) {
+    if (typeof exports == "object") module.exports = factory(); else if (typeof define == "function" && define.amd) define(factory); else root.Spinner = factory();
+})(this, function() {
+    "use strict";
+    var prefixes = [ "webkit", "Moz", "ms", "O" ], animations = {}, useCssAnimations;
+    function createEl(tag, prop) {
+        var el = document.createElement(tag || "div"), n;
+        for (n in prop) el[n] = prop[n];
+        return el;
+    }
+    function ins(parent) {
+        for (var i = 1, n = arguments.length; i < n; i++) parent.appendChild(arguments[i]);
+        return parent;
+    }
+    var sheet = function() {
+        var el = createEl("style", {
+            type: "text/css"
+        });
+        ins(document.getElementsByTagName("head")[0], el);
+        return el.sheet || el.styleSheet;
+    }();
+    function addAnimation(alpha, trail, i, lines) {
+        var name = [ "opacity", trail, ~~(alpha * 100), i, lines ].join("-"), start = .01 + i / lines * 100, z = Math.max(1 - (1 - alpha) / trail * (100 - start), alpha), prefix = useCssAnimations.substring(0, useCssAnimations.indexOf("Animation")).toLowerCase(), pre = prefix && "-" + prefix + "-" || "";
+        if (!animations[name]) {
+            sheet.insertRule("@" + pre + "keyframes " + name + "{" + "0%{opacity:" + z + "}" + start + "%{opacity:" + alpha + "}" + (start + .01) + "%{opacity:1}" + (start + trail) % 100 + "%{opacity:" + alpha + "}" + "100%{opacity:" + z + "}" + "}", sheet.cssRules.length);
+            animations[name] = 1;
+        }
+        return name;
+    }
+    function vendor(el, prop) {
+        var s = el.style, pp, i;
+        if (s[prop] !== undefined) return prop;
+        prop = prop.charAt(0).toUpperCase() + prop.slice(1);
+        for (i = 0; i < prefixes.length; i++) {
+            pp = prefixes[i] + prop;
+            if (s[pp] !== undefined) return pp;
+        }
+    }
+    function css(el, prop) {
+        for (var n in prop) el.style[vendor(el, n) || n] = prop[n];
+        return el;
+    }
+    function merge(obj) {
+        for (var i = 1; i < arguments.length; i++) {
+            var def = arguments[i];
+            for (var n in def) if (obj[n] === undefined) obj[n] = def[n];
+        }
+        return obj;
+    }
+    function pos(el) {
+        var o = {
+            x: el.offsetLeft,
+            y: el.offsetTop
+        };
+        while (el = el.offsetParent) o.x += el.offsetLeft, o.y += el.offsetTop;
+        return o;
+    }
+    var defaults = {
+        lines: 12,
+        length: 7,
+        width: 5,
+        radius: 10,
+        rotate: 0,
+        corners: 1,
+        color: "#000",
+        direction: 1,
+        speed: 1,
+        trail: 100,
+        opacity: 1 / 4,
+        fps: 20,
+        zIndex: 2e9,
+        className: "spinner",
+        top: "auto",
+        left: "auto",
+        position: "relative"
+    };
+    function Spinner(o) {
+        if (typeof this == "undefined") return new Spinner(o);
+        this.opts = merge(o || {}, Spinner.defaults, defaults);
+    }
+    Spinner.defaults = {};
+    merge(Spinner.prototype, {
+        spin: function(target) {
+            this.stop();
+            var self = this, o = self.opts, el = self.el = css(createEl(0, {
+                className: o.className
+            }), {
+                position: o.position,
+                width: 0,
+                zIndex: o.zIndex
+            }), mid = o.radius + o.length + o.width, ep, tp;
+            if (target) {
+                target.insertBefore(el, target.firstChild || null);
+                tp = pos(target);
+                ep = pos(el);
+                css(el, {
+                    left: (o.left == "auto" ? tp.x - ep.x + (target.offsetWidth >> 1) : parseInt(o.left, 10) + mid) + "px",
+                    top: (o.top == "auto" ? tp.y - ep.y + (target.offsetHeight >> 1) : parseInt(o.top, 10) + mid) + "px"
+                });
+            }
+            el.setAttribute("role", "progressbar");
+            self.lines(el, self.opts);
+            if (!useCssAnimations) {
+                var i = 0, start = (o.lines - 1) * (1 - o.direction) / 2, alpha, fps = o.fps, f = fps / o.speed, ostep = (1 - o.opacity) / (f * o.trail / 100), astep = f / o.lines;
+                (function anim() {
+                    i++;
+                    for (var j = 0; j < o.lines; j++) {
+                        alpha = Math.max(1 - (i + (o.lines - j) * astep) % f * ostep, o.opacity);
+                        self.opacity(el, j * o.direction + start, alpha, o);
+                    }
+                    self.timeout = self.el && setTimeout(anim, ~~(1e3 / fps));
+                })();
+            }
+            return self;
+        },
+        stop: function() {
+            var el = this.el;
+            if (el) {
+                clearTimeout(this.timeout);
+                if (el.parentNode) el.parentNode.removeChild(el);
+                this.el = undefined;
+            }
+            return this;
+        },
+        lines: function(el, o) {
+            var i = 0, start = (o.lines - 1) * (1 - o.direction) / 2, seg;
+            function fill(color, shadow) {
+                return css(createEl(), {
+                    position: "absolute",
+                    width: o.length + o.width + "px",
+                    height: o.width + "px",
+                    background: color,
+                    boxShadow: shadow,
+                    transformOrigin: "left",
+                    transform: "rotate(" + ~~(360 / o.lines * i + o.rotate) + "deg) translate(" + o.radius + "px" + ",0)",
+                    borderRadius: (o.corners * o.width >> 1) + "px"
+                });
+            }
+            for (;i < o.lines; i++) {
+                seg = css(createEl(), {
+                    position: "absolute",
+                    top: 1 + ~(o.width / 2) + "px",
+                    transform: o.hwaccel ? "translate3d(0,0,0)" : "",
+                    opacity: o.opacity,
+                    animation: useCssAnimations && addAnimation(o.opacity, o.trail, start + i * o.direction, o.lines) + " " + 1 / o.speed + "s linear infinite"
+                });
+                if (o.shadow) ins(seg, css(fill("#000", "0 0 4px " + "#000"), {
+                    top: 2 + "px"
+                }));
+                ins(el, ins(seg, fill(o.color, "0 0 1px rgba(0,0,0,.1)")));
+            }
+            return el;
+        },
+        opacity: function(el, i, val) {
+            if (i < el.childNodes.length) el.childNodes[i].style.opacity = val;
+        }
+    });
+    function initVML() {
+        function vml(tag, attr) {
+            return createEl("<" + tag + ' xmlns="urn:schemas-microsoft.com:vml" class="spin-vml">', attr);
+        }
+        sheet.addRule(".spin-vml", "behavior:url(#default#VML)");
+        Spinner.prototype.lines = function(el, o) {
+            var r = o.length + o.width, s = 2 * r;
+            function grp() {
+                return css(vml("group", {
+                    coordsize: s + " " + s,
+                    coordorigin: -r + " " + -r
+                }), {
+                    width: s,
+                    height: s
+                });
+            }
+            var margin = -(o.width + o.length) * 2 + "px", g = css(grp(), {
+                position: "absolute",
+                top: margin,
+                left: margin
+            }), i;
+            function seg(i, dx, filter) {
+                ins(g, ins(css(grp(), {
+                    rotation: 360 / o.lines * i + "deg",
+                    left: ~~dx
+                }), ins(css(vml("roundrect", {
+                    arcsize: o.corners
+                }), {
+                    width: r,
+                    height: o.width,
+                    left: o.radius,
+                    top: -o.width >> 1,
+                    filter: filter
+                }), vml("fill", {
+                    color: o.color,
+                    opacity: o.opacity
+                }), vml("stroke", {
+                    opacity: 0
+                }))));
+            }
+            if (o.shadow) for (i = 1; i <= o.lines; i++) seg(i, -2, "progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)");
+            for (i = 1; i <= o.lines; i++) seg(i);
+            return ins(el, g);
+        };
+        Spinner.prototype.opacity = function(el, i, val, o) {
+            var c = el.firstChild;
+            o = o.shadow && o.lines || 0;
+            if (c && i + o < c.childNodes.length) {
+                c = c.childNodes[i + o];
+                c = c && c.firstChild;
+                c = c && c.firstChild;
+                if (c) c.opacity = val;
+            }
+        };
+    }
+    var probe = css(createEl("group"), {
+        behavior: "url(#default#VML)"
+    });
+    if (!vendor(probe, "transform") && probe.adj) initVML(); else useCssAnimations = vendor(probe, "animation");
+    return Spinner;
+});

data/vendor/assets/stylesheets/ladda-themeless.css

@@ -0,0 +1,330 @@
+/*!
+ * Ladda
+ * http://lab.hakim.se/ladda
+ * MIT licensed
+ *
+ * Copyright (C) 2013 Hakim El Hattab, http://hakim.se
+ */
+/*************************************
+ * CONFIG
+ */
+/*************************************
+ * MIXINS
+ */
+/*************************************
+ * BUTTON BASE
+ */
+.ladda-button {
+  position: relative; }
+
+/* Spinner animation */
+.ladda-button .ladda-spinner {
+  position: absolute;
+  z-index: 2;
+  display: inline-block;
+  width: 32px;
+  height: 32px;
+  top: 50%;
+  margin-top: -16px;
+  opacity: 0;
+  pointer-events: none; }
+
+/* Button label */
+.ladda-button .ladda-label {
+  position: relative;
+  z-index: 3; }
+
+/* Progress bar */
+.ladda-button .ladda-progress {
+  position: absolute;
+  width: 0;
+  height: 100%;
+  left: 0;
+  top: 0;
+  background: rgba(0, 0, 0, 0.2);
+  visibility: hidden;
+  opacity: 0;
+  -webkit-transition: 0.1s linear all !important;
+  -moz-transition: 0.1s linear all !important;
+  -ms-transition: 0.1s linear all !important;
+  -o-transition: 0.1s linear all !important;
+  transition: 0.1s linear all !important; }
+
+.ladda-button[data-loading] .ladda-progress {
+  opacity: 1;
+  visibility: visible; }
+
+/*************************************
+ * EASING
+ */
+.ladda-button,
+.ladda-button .ladda-spinner,
+.ladda-button .ladda-label {
+  -webkit-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  -moz-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  -ms-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  -o-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important; }
+
+.ladda-button[data-style=zoom-in],
+.ladda-button[data-style=zoom-in] .ladda-spinner,
+.ladda-button[data-style=zoom-in] .ladda-label,
+.ladda-button[data-style=zoom-out],
+.ladda-button[data-style=zoom-out] .ladda-spinner,
+.ladda-button[data-style=zoom-out] .ladda-label {
+  -webkit-transition: 0.3s ease all !important;
+  -moz-transition: 0.3s ease all !important;
+  -ms-transition: 0.3s ease all !important;
+  -o-transition: 0.3s ease all !important;
+  transition: 0.3s ease all !important; }
+
+/*************************************
+ * EXPAND LEFT
+ */
+.ladda-button[data-style=expand-right] .ladda-spinner {
+  right: 14px; }
+.ladda-button[data-style=expand-right][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-right][data-size="xs"] .ladda-spinner {
+  right: 4px; }
+.ladda-button[data-style=expand-right][data-loading] {
+  padding-right: 56px; }
+  .ladda-button[data-style=expand-right][data-loading] .ladda-spinner {
+    opacity: 1; }
+  .ladda-button[data-style=expand-right][data-loading][data-size="s"], .ladda-button[data-style=expand-right][data-loading][data-size="xs"] {
+    padding-right: 40px; }
+
+/*************************************
+ * EXPAND RIGHT
+ */
+.ladda-button[data-style=expand-left] .ladda-spinner {
+  left: 14px; }
+.ladda-button[data-style=expand-left][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-left][data-size="xs"] .ladda-spinner {
+  left: 4px; }
+.ladda-button[data-style=expand-left][data-loading] {
+  padding-left: 56px; }
+  .ladda-button[data-style=expand-left][data-loading] .ladda-spinner {
+    opacity: 1; }
+  .ladda-button[data-style=expand-left][data-loading][data-size="s"], .ladda-button[data-style=expand-left][data-loading][data-size="xs"] {
+    padding-left: 40px; }
+
+/*************************************
+ * EXPAND UP
+ */
+.ladda-button[data-style=expand-up] {
+  overflow: hidden; }
+  .ladda-button[data-style=expand-up] .ladda-spinner {
+    top: -32px;
+    left: 50%;
+    margin-left: -16px; }
+  .ladda-button[data-style=expand-up][data-loading] {
+    padding-top: 54px; }
+    .ladda-button[data-style=expand-up][data-loading] .ladda-spinner {
+      opacity: 1;
+      top: 14px;
+      margin-top: 0; }
+    .ladda-button[data-style=expand-up][data-loading][data-size="s"], .ladda-button[data-style=expand-up][data-loading][data-size="xs"] {
+      padding-top: 32px; }
+      .ladda-button[data-style=expand-up][data-loading][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-up][data-loading][data-size="xs"] .ladda-spinner {
+        top: 4px; }
+
+/*************************************
+ * EXPAND DOWN
+ */
+.ladda-button[data-style=expand-down] {
+  overflow: hidden; }
+  .ladda-button[data-style=expand-down] .ladda-spinner {
+    top: 62px;
+    left: 50%;
+    margin-left: -16px; }
+  .ladda-button[data-style=expand-down][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-down][data-size="xs"] .ladda-spinner {
+    top: 40px; }
+  .ladda-button[data-style=expand-down][data-loading] {
+    padding-bottom: 54px; }
+    .ladda-button[data-style=expand-down][data-loading] .ladda-spinner {
+      opacity: 1; }
+    .ladda-button[data-style=expand-down][data-loading][data-size="s"], .ladda-button[data-style=expand-down][data-loading][data-size="xs"] {
+      padding-bottom: 32px; }
+
+/*************************************
+ * SLIDE LEFT
+ */
+.ladda-button[data-style=slide-left] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-left] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-left] .ladda-spinner {
+    left: 100%;
+    margin-left: -16px; }
+  .ladda-button[data-style=slide-left][data-loading] .ladda-label {
+    opacity: 0;
+    left: -100%; }
+  .ladda-button[data-style=slide-left][data-loading] .ladda-spinner {
+    opacity: 1;
+    left: 50%; }
+
+/*************************************
+ * SLIDE RIGHT
+ */
+.ladda-button[data-style=slide-right] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-right] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-right] .ladda-spinner {
+    right: 100%;
+    margin-left: -16px; }
+  .ladda-button[data-style=slide-right][data-loading] .ladda-label {
+    opacity: 0;
+    left: 100%; }
+  .ladda-button[data-style=slide-right][data-loading] .ladda-spinner {
+    opacity: 1;
+    left: 50%; }
+
+/*************************************
+ * SLIDE UP
+ */
+.ladda-button[data-style=slide-up] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-up] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-up] .ladda-spinner {
+    left: 50%;
+    margin-left: -16px;
+    margin-top: 1em; }
+  .ladda-button[data-style=slide-up][data-loading] .ladda-label {
+    opacity: 0;
+    top: -1em; }
+  .ladda-button[data-style=slide-up][data-loading] .ladda-spinner {
+    opacity: 1;
+    margin-top: -16px; }
+
+/*************************************
+ * SLIDE DOWN
+ */
+.ladda-button[data-style=slide-down] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-down] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-down] .ladda-spinner {
+    left: 50%;
+    margin-left: -16px;
+    margin-top: -2em; }
+  .ladda-button[data-style=slide-down][data-loading] .ladda-label {
+    opacity: 0;
+    top: 1em; }
+  .ladda-button[data-style=slide-down][data-loading] .ladda-spinner {
+    opacity: 1;
+    margin-top: -16px; }
+
+/*************************************
+ * ZOOM-OUT
+ */
+.ladda-button[data-style=zoom-out] {
+  overflow: hidden; }
+
+.ladda-button[data-style=zoom-out] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px;
+  -webkit-transform: scale(2.5);
+  -moz-transform: scale(2.5);
+  -ms-transform: scale(2.5);
+  -o-transform: scale(2.5);
+  transform: scale(2.5); }
+
+.ladda-button[data-style=zoom-out] .ladda-label {
+  position: relative;
+  display: inline-block; }
+
+.ladda-button[data-style=zoom-out][data-loading] .ladda-label {
+  opacity: 0;
+  -webkit-transform: scale(0.5);
+  -moz-transform: scale(0.5);
+  -ms-transform: scale(0.5);
+  -o-transform: scale(0.5);
+  transform: scale(0.5); }
+
+.ladda-button[data-style=zoom-out][data-loading] .ladda-spinner {
+  opacity: 1;
+  -webkit-transform: none;
+  -moz-transform: none;
+  -ms-transform: none;
+  -o-transform: none;
+  transform: none; }
+
+/*************************************
+ * ZOOM-IN
+ */
+.ladda-button[data-style=zoom-in] {
+  overflow: hidden; }
+
+.ladda-button[data-style=zoom-in] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px;
+  -webkit-transform: scale(0.2);
+  -moz-transform: scale(0.2);
+  -ms-transform: scale(0.2);
+  -o-transform: scale(0.2);
+  transform: scale(0.2); }
+
+.ladda-button[data-style=zoom-in] .ladda-label {
+  position: relative;
+  display: inline-block; }
+
+.ladda-button[data-style=zoom-in][data-loading] .ladda-label {
+  opacity: 0;
+  -webkit-transform: scale(2.2);
+  -moz-transform: scale(2.2);
+  -ms-transform: scale(2.2);
+  -o-transform: scale(2.2);
+  transform: scale(2.2); }
+
+.ladda-button[data-style=zoom-in][data-loading] .ladda-spinner {
+  opacity: 1;
+  -webkit-transform: none;
+  -moz-transform: none;
+  -ms-transform: none;
+  -o-transform: none;
+  transform: none; }
+
+/*************************************
+ * CONTRACT
+ */
+.ladda-button[data-style=contract] {
+  overflow: hidden;
+  width: 100px; }
+
+.ladda-button[data-style=contract] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px; }
+
+.ladda-button[data-style=contract][data-loading] {
+  border-radius: 50%;
+  width: 52px; }
+
+.ladda-button[data-style=contract][data-loading] .ladda-label {
+  opacity: 0; }
+
+.ladda-button[data-style=contract][data-loading] .ladda-spinner {
+  opacity: 1; }
+
+/*************************************
+ * OVERLAY
+ */
+.ladda-button[data-style=contract-overlay] {
+  overflow: hidden;
+  width: 100px;
+  box-shadow: 0px 0px 0px 3000px rgba(0, 0, 0, 0); }
+
+.ladda-button[data-style=contract-overlay] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px; }
+
+.ladda-button[data-style=contract-overlay][data-loading] {
+  border-radius: 50%;
+  width: 52px;
+  /*outline: 10000px solid rgba( 0, 0, 0, 0.5 );*/
+  box-shadow: 0px 0px 0px 3000px rgba(0, 0, 0, 0.8); }
+
+.ladda-button[data-style=contract-overlay][data-loading] .ladda-label {
+  opacity: 0; }
+
+.ladda-button[data-style=contract-overlay][data-loading] .ladda-spinner {
+  opacity: 1; }

data/vendor/assets/stylesheets/ladda.css

@@ -0,0 +1,392 @@
+/** Contains the default Ladda button theme styles */
+/*!
+ * Ladda
+ * http://lab.hakim.se/ladda
+ * MIT licensed
+ *
+ * Copyright (C) 2013 Hakim El Hattab, http://hakim.se
+ */
+/*************************************
+ * CONFIG
+ */
+/*************************************
+ * MIXINS
+ */
+/*************************************
+ * BUTTON BASE
+ */
+.ladda-button {
+  position: relative; }
+
+/* Spinner animation */
+.ladda-button .ladda-spinner {
+  position: absolute;
+  z-index: 2;
+  display: inline-block;
+  width: 32px;
+  height: 32px;
+  top: 50%;
+  margin-top: -16px;
+  opacity: 0;
+  pointer-events: none; }
+
+/* Button label */
+.ladda-button .ladda-label {
+  position: relative;
+  z-index: 3; }
+
+/* Progress bar */
+.ladda-button .ladda-progress {
+  position: absolute;
+  width: 0;
+  height: 100%;
+  left: 0;
+  top: 0;
+  background: rgba(0, 0, 0, 0.2);
+  visibility: hidden;
+  opacity: 0;
+  -webkit-transition: 0.1s linear all !important;
+  -moz-transition: 0.1s linear all !important;
+  -ms-transition: 0.1s linear all !important;
+  -o-transition: 0.1s linear all !important;
+  transition: 0.1s linear all !important; }
+
+.ladda-button[data-loading] .ladda-progress {
+  opacity: 1;
+  visibility: visible; }
+
+/*************************************
+ * EASING
+ */
+.ladda-button,
+.ladda-button .ladda-spinner,
+.ladda-button .ladda-label {
+  -webkit-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  -moz-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  -ms-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  -o-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;
+  transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important; }
+
+.ladda-button[data-style=zoom-in],
+.ladda-button[data-style=zoom-in] .ladda-spinner,
+.ladda-button[data-style=zoom-in] .ladda-label,
+.ladda-button[data-style=zoom-out],
+.ladda-button[data-style=zoom-out] .ladda-spinner,
+.ladda-button[data-style=zoom-out] .ladda-label {
+  -webkit-transition: 0.3s ease all !important;
+  -moz-transition: 0.3s ease all !important;
+  -ms-transition: 0.3s ease all !important;
+  -o-transition: 0.3s ease all !important;
+  transition: 0.3s ease all !important; }
+
+/*************************************
+ * EXPAND LEFT
+ */
+.ladda-button[data-style=expand-right] .ladda-spinner {
+  right: 14px; }
+.ladda-button[data-style=expand-right][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-right][data-size="xs"] .ladda-spinner {
+  right: 4px; }
+.ladda-button[data-style=expand-right][data-loading] {
+  padding-right: 56px; }
+  .ladda-button[data-style=expand-right][data-loading] .ladda-spinner {
+    opacity: 1; }
+  .ladda-button[data-style=expand-right][data-loading][data-size="s"], .ladda-button[data-style=expand-right][data-loading][data-size="xs"] {
+    padding-right: 40px; }
+
+/*************************************
+ * EXPAND RIGHT
+ */
+.ladda-button[data-style=expand-left] .ladda-spinner {
+  left: 14px; }
+.ladda-button[data-style=expand-left][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-left][data-size="xs"] .ladda-spinner {
+  left: 4px; }
+.ladda-button[data-style=expand-left][data-loading] {
+  padding-left: 56px; }
+  .ladda-button[data-style=expand-left][data-loading] .ladda-spinner {
+    opacity: 1; }
+  .ladda-button[data-style=expand-left][data-loading][data-size="s"], .ladda-button[data-style=expand-left][data-loading][data-size="xs"] {
+    padding-left: 40px; }
+
+/*************************************
+ * EXPAND UP
+ */
+.ladda-button[data-style=expand-up] {
+  overflow: hidden; }
+  .ladda-button[data-style=expand-up] .ladda-spinner {
+    top: -32px;
+    left: 50%;
+    margin-left: -16px; }
+  .ladda-button[data-style=expand-up][data-loading] {
+    padding-top: 54px; }
+    .ladda-button[data-style=expand-up][data-loading] .ladda-spinner {
+      opacity: 1;
+      top: 14px;
+      margin-top: 0; }
+    .ladda-button[data-style=expand-up][data-loading][data-size="s"], .ladda-button[data-style=expand-up][data-loading][data-size="xs"] {
+      padding-top: 32px; }
+      .ladda-button[data-style=expand-up][data-loading][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-up][data-loading][data-size="xs"] .ladda-spinner {
+        top: 4px; }
+
+/*************************************
+ * EXPAND DOWN
+ */
+.ladda-button[data-style=expand-down] {
+  overflow: hidden; }
+  .ladda-button[data-style=expand-down] .ladda-spinner {
+    top: 62px;
+    left: 50%;
+    margin-left: -16px; }
+  .ladda-button[data-style=expand-down][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-down][data-size="xs"] .ladda-spinner {
+    top: 40px; }
+  .ladda-button[data-style=expand-down][data-loading] {
+    padding-bottom: 54px; }
+    .ladda-button[data-style=expand-down][data-loading] .ladda-spinner {
+      opacity: 1; }
+    .ladda-button[data-style=expand-down][data-loading][data-size="s"], .ladda-button[data-style=expand-down][data-loading][data-size="xs"] {
+      padding-bottom: 32px; }
+
+/*************************************
+ * SLIDE LEFT
+ */
+.ladda-button[data-style=slide-left] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-left] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-left] .ladda-spinner {
+    left: 100%;
+    margin-left: -16px; }
+  .ladda-button[data-style=slide-left][data-loading] .ladda-label {
+    opacity: 0;
+    left: -100%; }
+  .ladda-button[data-style=slide-left][data-loading] .ladda-spinner {
+    opacity: 1;
+    left: 50%; }
+
+/*************************************
+ * SLIDE RIGHT
+ */
+.ladda-button[data-style=slide-right] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-right] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-right] .ladda-spinner {
+    right: 100%;
+    margin-left: -16px; }
+  .ladda-button[data-style=slide-right][data-loading] .ladda-label {
+    opacity: 0;
+    left: 100%; }
+  .ladda-button[data-style=slide-right][data-loading] .ladda-spinner {
+    opacity: 1;
+    left: 50%; }
+
+/*************************************
+ * SLIDE UP
+ */
+.ladda-button[data-style=slide-up] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-up] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-up] .ladda-spinner {
+    left: 50%;
+    margin-left: -16px;
+    margin-top: 1em; }
+  .ladda-button[data-style=slide-up][data-loading] .ladda-label {
+    opacity: 0;
+    top: -1em; }
+  .ladda-button[data-style=slide-up][data-loading] .ladda-spinner {
+    opacity: 1;
+    margin-top: -16px; }
+
+/*************************************
+ * SLIDE DOWN
+ */
+.ladda-button[data-style=slide-down] {
+  overflow: hidden; }
+  .ladda-button[data-style=slide-down] .ladda-label {
+    position: relative; }
+  .ladda-button[data-style=slide-down] .ladda-spinner {
+    left: 50%;
+    margin-left: -16px;
+    margin-top: -2em; }
+  .ladda-button[data-style=slide-down][data-loading] .ladda-label {
+    opacity: 0;
+    top: 1em; }
+  .ladda-button[data-style=slide-down][data-loading] .ladda-spinner {
+    opacity: 1;
+    margin-top: -16px; }
+
+/*************************************
+ * ZOOM-OUT
+ */
+.ladda-button[data-style=zoom-out] {
+  overflow: hidden; }
+
+.ladda-button[data-style=zoom-out] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px;
+  -webkit-transform: scale(2.5);
+  -moz-transform: scale(2.5);
+  -ms-transform: scale(2.5);
+  -o-transform: scale(2.5);
+  transform: scale(2.5); }
+
+.ladda-button[data-style=zoom-out] .ladda-label {
+  position: relative;
+  display: inline-block; }
+
+.ladda-button[data-style=zoom-out][data-loading] .ladda-label {
+  opacity: 0;
+  -webkit-transform: scale(0.5);
+  -moz-transform: scale(0.5);
+  -ms-transform: scale(0.5);
+  -o-transform: scale(0.5);
+  transform: scale(0.5); }
+
+.ladda-button[data-style=zoom-out][data-loading] .ladda-spinner {
+  opacity: 1;
+  -webkit-transform: none;
+  -moz-transform: none;
+  -ms-transform: none;
+  -o-transform: none;
+  transform: none; }
+
+/*************************************
+ * ZOOM-IN
+ */
+.ladda-button[data-style=zoom-in] {
+  overflow: hidden; }
+
+.ladda-button[data-style=zoom-in] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px;
+  -webkit-transform: scale(0.2);
+  -moz-transform: scale(0.2);
+  -ms-transform: scale(0.2);
+  -o-transform: scale(0.2);
+  transform: scale(0.2); }
+
+.ladda-button[data-style=zoom-in] .ladda-label {
+  position: relative;
+  display: inline-block; }
+
+.ladda-button[data-style=zoom-in][data-loading] .ladda-label {
+  opacity: 0;
+  -webkit-transform: scale(2.2);
+  -moz-transform: scale(2.2);
+  -ms-transform: scale(2.2);
+  -o-transform: scale(2.2);
+  transform: scale(2.2); }
+
+.ladda-button[data-style=zoom-in][data-loading] .ladda-spinner {
+  opacity: 1;
+  -webkit-transform: none;
+  -moz-transform: none;
+  -ms-transform: none;
+  -o-transform: none;
+  transform: none; }
+
+/*************************************
+ * CONTRACT
+ */
+.ladda-button[data-style=contract] {
+  overflow: hidden;
+  width: 100px; }
+
+.ladda-button[data-style=contract] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px; }
+
+.ladda-button[data-style=contract][data-loading] {
+  border-radius: 50%;
+  width: 52px; }
+
+.ladda-button[data-style=contract][data-loading] .ladda-label {
+  opacity: 0; }
+
+.ladda-button[data-style=contract][data-loading] .ladda-spinner {
+  opacity: 1; }
+
+/*************************************
+ * OVERLAY
+ */
+.ladda-button[data-style=contract-overlay] {
+  overflow: hidden;
+  width: 100px;
+  box-shadow: 0px 0px 0px 3000px rgba(0, 0, 0, 0); }
+
+.ladda-button[data-style=contract-overlay] .ladda-spinner {
+  left: 50%;
+  margin-left: -16px; }
+
+.ladda-button[data-style=contract-overlay][data-loading] {
+  border-radius: 50%;
+  width: 52px;
+  /*outline: 10000px solid rgba( 0, 0, 0, 0.5 );*/
+  box-shadow: 0px 0px 0px 3000px rgba(0, 0, 0, 0.8); }
+
+.ladda-button[data-style=contract-overlay][data-loading] .ladda-label {
+  opacity: 0; }
+
+.ladda-button[data-style=contract-overlay][data-loading] .ladda-spinner {
+  opacity: 1; }
+
+/*************************************
+ * CONFIG
+ */
+/*************************************
+ * BUTTON THEME
+ */
+.ladda-button {
+  background: #666;
+  border: 0;
+  padding: 14px 18px;
+  font-size: 18px;
+  cursor: pointer;
+  color: #fff;
+  border-radius: 2px;
+  border: 1px solid transparent;
+  -webkit-appearance: none;
+  -webkit-font-smoothing: antialiased;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
+  .ladda-button:hover {
+    border-color: rgba(0, 0, 0, 0.07);
+    background-color: #888; }
+  .ladda-button[data-color=green] {
+    background: #2aca76; }
+    .ladda-button[data-color=green]:hover {
+      background-color: #38d683; }
+  .ladda-button[data-color=blue] {
+    background: #53b5e6; }
+    .ladda-button[data-color=blue]:hover {
+      background-color: #69bfe9; }
+  .ladda-button[data-color=red] {
+    background: #ea8557; }
+    .ladda-button[data-color=red]:hover {
+      background-color: #ed956e; }
+  .ladda-button[data-color=purple] {
+    background: #9973c2; }
+    .ladda-button[data-color=purple]:hover {
+      background-color: #a685ca; }
+  .ladda-button[data-color=mint] {
+    background: #16a085; }
+    .ladda-button[data-color=mint]:hover {
+      background-color: #19b698; }
+  .ladda-button[disabled], .ladda-button[data-loading] {
+    border-color: rgba(0, 0, 0, 0.07);
+    cursor: default;
+    background-color: #999; }
+    .ladda-button[disabled]:hover, .ladda-button[data-loading]:hover {
+      cursor: default;
+      background-color: #999; }
+  .ladda-button[data-size=xs] {
+    padding: 4px 8px; }
+    .ladda-button[data-size=xs] .ladda-label {
+      font-size: 0.7em; }
+  .ladda-button[data-size=s] {
+    padding: 6px 10px; }
+    .ladda-button[data-size=s] .ladda-label {
+      font-size: 0.9em; }
+  .ladda-button[data-size=l] .ladda-label {
+    font-size: 1.2em; }
+  .ladda-button[data-size=xl] .ladda-label {
+    font-size: 1.5em; }

metadata

@@ -0,0 +1,55 @@
+--- !ruby/object:Gem::Specification
+name: ladda-bootstrap-rails
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Rafael Liu
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2014-06-01 00:00:00.000000000 Z
+dependencies: []
+description: This gem provides CSS and JS for Ladda Bootstrap.
+email:
+- rafael@vendji.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- .gitignore
+- Gemfile
+- LICENSE.txt
+- README.md
+- Rakefile
+- ladda-bootstrap-rails.gemspec
+- lib/ladda-bootstrap-rails.rb
+- vendor/assets/javascripts/ladda.js
+- vendor/assets/javascripts/spin.js
+- vendor/assets/stylesheets/ladda-themeless.css
+- vendor/assets/stylesheets/ladda.css
+homepage: https://github.com/vendji/ladda-bootstrap-rails
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - '>='
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - '>='
+    - !ruby/object:Gem::Version
+      version: 1.3.6
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.1.10
+signing_key: 
+specification_version: 4
+summary: A Ladda Bootrap wrapper for Rails 3
+test_files: []