Added assets + dependencies

2025-03-01 10:31:47 +00:00 · 2015-02-25 14:08:14 +01:00
parent cb37f12f56
commit d5678d622e
748 changed files with 154165 additions and 0 deletions
--- a/bower_components/holderjs/.bower.json
+++ b/bower_components/holderjs/.bower.json
@@ -0,0 +1,16 @@
+{
+  "name": "holderjs",
+  "main": "holder.js",
+  "homepage": "https://github.com/imsky/holder",
+  "version": "2.4.1",
+  "_release": "2.4.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "v2.4.1",
+    "commit": "bd2e0be3c5c86afbdef1da092eb72c8ce7d52dce"
+  },
+  "_source": "git://github.com/imsky/holder.git",
+  "_target": "~2.4.1",
+  "_originalSource": "holderjs",
+  "_direct": true
+}
--- a/bower_components/holderjs/.gitattributes
+++ b/bower_components/holderjs/.gitattributes
@@ -0,0 +1,2 @@
+# Automatically normalize line endings for all text-based files
+* text=auto
--- a/bower_components/holderjs/.gitignore
+++ b/bower_components/holderjs/.gitignore
@@ -0,0 +1,2 @@
+node_modules/
+todo.md
--- a/bower_components/holderjs/.jshintrc
+++ b/bower_components/holderjs/.jshintrc
@@ -0,0 +1,11 @@
+{
+  "quotmark": true,
+  "boss": true,
+  "eqnull": true,
+  "expr": true,
+  "funcscope": true,
+  "loopfunc": true,
+  "smarttabs": true,
+  "node": true,
+  "browser": true
+}
--- a/bower_components/holderjs/README.md
+++ b/bower_components/holderjs/README.md
@@ -0,0 +1,310 @@
+Holder
+======
+
+![](http://imsky.github.io/holder/images/header.png)
+
+Holder renders image placeholders on the client side using SVG.
+
+Used by [Bootstrap](http://getbootstrap.com), thousands of [open source projects](https://github.com/search?q=holder.js+in%3Apath&type=Code&ref=searchresults), and [many other sites](https://search.nerdydata.com/search/#!/searchTerm=holder.js/searchPage=1/sort=pop).
+
+Installing
+----------
+
+* [Bower](http://bower.io/): `bower install holderjs`
+* [cdnjs](http://cdnjs.com/): <http://cdnjs.com/libraries/holder>
+* [jsDelivr](http://www.jsdelivr.com): <http://www.jsdelivr.com/#!holder>
+* [Rails Assets](https://rails-assets.org): `gem 'rails-assets-holderjs'`
+* [Meteor](http://atmospherejs.com/): `mrt add holder`
+* [Composer](https://packagist.org/): `php composer.phar update imsky/holder`
+* [NuGet](http://www.nuget.org/): `Install-Package Holder.js`
+
+Usage
+-----
+
+Include ``holder.js`` in your HTML:
+
+```html
+<script src="holder.js"></script>
+```
+
+Holder will then process all images with a specific ``src`` attribute, like this one:
+
+```html
+<img src="holder.js/200x300">
+```
+
+The above tag will render as a placeholder 200 pixels wide and 300 pixels tall.
+
+To avoid console 404 errors, you can use ``data-src`` instead of ``src``.
+
+Themes
+------
+
+![](http://imsky.github.io/holder/images/holder_sky.png)![](http://imsky.github.io/holder/images/holder_vine.png)![](http://imsky.github.io/holder/images/holder_lava.png)
+
+Holder includes support for themes, to help placeholders blend in with your layout.
+
+There are 6 default themes: ``sky``, ``vine``, ``lava``, ``gray``, ``industrial``, and ``social``. Use them like so:
+
+```html
+<img src="holder.js/200x300/sky">
+```
+
+Custom colors
+-------------
+
+Custom colors on a specific image can be specified in the ``background:foreground`` format using hex notation, like this:
+
+```html
+<img data-src="holder.js/100x200/#000:#fff">
+```
+
+The above will render a placeholder with a black background and white text.
+
+Custom text
+-----------
+
+You can specify custom text using the ``text:`` operator:
+
+```html
+<img data-src="holder.js/200x200/text:hello world">
+```
+
+If you have a group of placeholders where you'd like to use particular text, you can do so by adding a ``text`` property to the theme:
+
+```js
+Holder.addTheme("thumbnail", { background: "#fff", text: "Thumbnail" });
+```
+
+Holder automatically adds line breaks to text that goes outside of the image boundaries. If the text is so long it goes out of both horizontal and vertical boundaries, the text is moved to the top. If you prefer to control the line breaks, you can add `\n` to the `text` property:
+
+```html
+<img data-src="holder.js/300x200/text:Add \n line breaks \n anywhere.">
+```
+
+Custom fonts, web fonts and icon fonts
+--------------------------------------
+
+You can set a placeholder's font either through a theme or through the `font` flag:
+
+```html
+<img data-src="holder.js/300x200/font:Helvetica">
+```
+
+Placeholders using a custom font are rendered using canvas by default, due to SVG's constraints on cross-domain resource linking. If you're using only locally available fonts, you can disable this behavior by setting `noFontFallback` to `true` in `Holder.run` options. However, if you need to render a SVG placeholder using an externally loaded font, you have to use the `object` tag instead of the `img` tag and add a `holderjs` class to the appropriate `link` tags. Here's an example:
+
+```html
+<head>
+<link href="http://.../font-awesome.css" rel="stylesheet" class="holderjs">
+</head>
+<body>
+<object data="holder.js/300x200/font:FontAwesome"></object>
+```
+
+**Important:** When testing locally, font URLs must have a `http` or `https` protocol defined.
+
+`<object>` placeholders work like `<img>` placeholders, with the added benefit of their DOM being able to be inspected and modified.
+
+
+Customizing themes
+------------------
+
+Themes have 5 properties: ``foreground``, ``background``, ``size``, ``font`` and ``fontweight``. The ``size`` property specifies the minimum font size for the theme. The ``fontweight`` default value is ``bold``. You can create a sample theme like this:
+
+```js
+Holder.addTheme("dark", {
+  background: "#000",
+  foreground: "#aaa",
+  size: 11,
+  font: "Monaco",
+  fontweight: "normal"
+});
+```
+
+Using custom themes
+-------------------
+
+There are two ways to use custom themes with Holder:
+
+* Include theme at runtime to render placeholders already using the theme name
+* Include theme at any point and re-render placeholders that are using the theme name
+
+The first approach is the easiest. After you include ``holder.js``, add a ``script`` tag that adds the theme you want:
+
+```html
+<script src="holder.js"></script>
+<script>
+Holder.addTheme("bright", {
+  background: "white", foreground: "gray", size: 12
+});
+</script>
+```
+
+The second approach requires that you call ``run`` after you add the theme, like this:
+
+```js
+Holder.addTheme("bright", {background: "white", foreground: "gray", size: 12}).run();
+```
+
+Using custom themes and domain on specific images
+-------------------------------------------------
+
+You can use Holder in different areas on different images with custom themes:
+
+```html
+<img data-src="example.com/100x100/simple" id="new">
+```
+
+```js
+Holder.run({
+  domain: "example.com",
+  themes: {
+    "simple": {
+      background: "#fff",
+      foreground: "#000",
+      size: 12
+    }
+  },
+  images: "#new"
+});
+```
+
+Random themes
+-------------
+
+You can render a placeholder with a random theme using the `random` flag:
+```html
+<img data-src="holder.js/300x200/random">
+```
+
+Fluid placeholders
+------------------
+
+Specifying a dimension in percentages creates a fluid placeholder that responds to media queries.
+
+```html
+<img data-src="holder.js/100%x75/social">
+```
+
+By default, the fluid placeholder will show its current size in pixels. To display the original dimensions, i.e. 100%x75, set the ``textmode`` flag to ``literal`` like so: `holder.js/100%x75/textmode:literal`.
+
+Fluid placeholders need to be visible in order to work. In cases when a placeholder is not visible, the `Holder.invisibleErrorFn` function is called, which takes the callee function as an argument and returns a function that takes the placeholder element as an argument. This function by default throws an exception, however its behavior can and should be overridden by the user.
+
+Automatically sized placeholders
+--------------------------------
+
+If you'd like to avoid Holder enforcing an image size, use the ``auto`` flag like so:
+
+```html
+<img data-src="holder.js/200x200/auto">
+```
+
+The above will render a placeholder without any embedded CSS for height or width.
+
+To show the current size of an automatically sized placeholder, set the ``textmode`` flag to ``exact`` like so: `holder.js/200x200/auto/textmode:exact`.
+
+Background placeholders
+-----------------------
+
+Holder can render placeholders as background images for elements with the `holderjs` class, like this:
+
+```css
+#sample {background:url(?holder.js/200x200/social) no-repeat}
+```
+
+```html
+<div id="sample" class="holderjs"></div>
+```
+
+The Holder URL in CSS should have a `?` in front. Like in image placeholders, you can specify the Holder URL in a `data-background-src` attribute:
+
+```html
+<div data-background-src="?holder.js/300x200"></div>
+```
+
+**Important:** Make sure to define a height and/or width for elements with background placeholders. Fluid background placeholders are not yet supported.
+
+**Important:** Some browsers can't parse URLs like `?holder.js/300x200/#fff:#000` due to the `#` characters. You can use `^` in place of `#` like this: `?holder.js/300x200/^fff:^000`.
+
+Custom settings
+---------------
+
+Holder extends its default settings with the settings you provide, so you only have to include those settings you want changed. For example, you can run Holder on a specific domain like this:
+
+```js
+Holder.run({domain:"example.com"});
+```
+
+Using custom settings on load
+-----------------------------
+
+You can prevent Holder from running its default configuration by executing ``Holder.run`` with your custom settings right after including ``holder.js``. However, you'll have to execute ``Holder.run`` again to render any placeholders that use the default configuration.
+
+Inserting an image with optional custom theme
+---------------------------------------------
+
+You can add a placeholder programmatically by chaining Holder calls:
+
+```js
+Holder.addTheme("new", {
+  foreground: "#ccc",
+  background: "#000",
+  size: 10
+}).addImage("holder.js/200x100/new", "body").run();
+```
+
+The first argument in ``addImage`` is the ``src`` attribute, and the second is a CSS selector of the parent element.
+
+Using different renderers
+-------------------------
+
+Holder has three renderers: canvas, SVG, and HTML. The SVG renderer is used by default, however you can set the renderer using the `renderer` option, with either `svg`, `canvas`, or `html` values.
+
+```js
+Holder.run({renderer: 'canvas'});
+```
+
+Using with [lazyload.js](https://github.com/tuupola/jquery_lazyload)
+------------------------
+
+Holder is compatible with ``lazyload.js`` and works with both fluid and fixed-width images. For best results, run `.lazyload({skip_invisible:false})`.
+
+Using with Angular.js
+---------------------
+
+You can use Holder in Angular projects with the following JS and HTML code (by [Nick Clark](https://github.com/NickClark)):
+
+```js
+angular.module('MyModule').directive('myHolder', function() {
+  return {
+    link: function(scope, element, attrs) {
+      attrs.$set('data-src', attrs.myHolder);
+      Holder.run({images:element[0]});
+    }
+  };
+});
+```
+
+```html
+<img my-holder="holder.js/200x300">
+```
+
+Browser support
+---------------
+
+* Chrome
+* Firefox 3+
+* Safari 4+
+* Internet Explorer 9+ (with partial support for 6-8)
+* Opera 15+ (with partial support for 12)
+* Android (with fallback)
+
+License
+-------
+
+Holder is provided under the [MIT License](http://opensource.org/licenses/MIT).
+
+Credits
+-------
+
+Holder is a project by [Ivan Malopinsky](http://imsky.co).
--- a/bower_components/holderjs/bower.json
+++ b/bower_components/holderjs/bower.json
@@ -0,0 +1,4 @@
+{
+  "name": "holderjs",
+  "main": "holder.js"
+}
--- a/bower_components/holderjs/composer.json
+++ b/bower_components/holderjs/composer.json
@@ -0,0 +1,34 @@
+{
+    "name": "imsky/holder",
+    "description": "Client-side image placeholders.",
+    "homepage": "https://github.com/imsky/holder",
+    "keywords": [
+        "images",
+        "placeholders",
+        "client-side",
+        "canvas",
+        "generation",
+        "development"
+    ],
+    "license": "MIT",
+    "type": "component",
+    "authors": [
+        {
+            "name": "Ivan Malopinsky",
+            "homepage": "http://imsky.co"
+        }
+    ],
+    "require": {
+        "robloach/component-installer": "*"
+    },
+    "extra": {
+        "component": {
+            "scripts": [
+                "holder.js"
+            ],
+            "files": [
+                "holder.min.js"
+            ]
+        }
+    }
+}
--- a/bower_components/holderjs/gulpfile.js
+++ b/bower_components/holderjs/gulpfile.js
@@ -0,0 +1,63 @@
+var gulp = require('gulp');
+var concat = require('gulp-concat');
+var uglify = require('gulp-uglify');
+var header = require('gulp-header');
+var jshint = require('gulp-jshint');
+var todo = require('gulp-todo');
+var gulputil = require('gulp-util');
+
+var moment = require('moment');
+var pkg = require('./package.json');
+
+var banner =
+	'/*!\n\n' +
+	'<%= pkg.name %> - <%= pkg.summary %>\nVersion <%= pkg.version %>+<%= build %>\n' +
+	'\u00A9 <%= year %> <%= pkg.author.name %> - <%= pkg.author.url %>\n\n' +
+	'Site:     <%= pkg.homepage %>\n'+
+	'Issues:   <%= pkg.bugs.url %>\n' +
+	'License:  <%= pkg.license.url %>\n\n' +
+	'*/\n';
+
+function generateBuild(){
+	var date = new Date;
+	return Math.floor((date - (new Date(date.getFullYear(),0,0)))/1000).toString(36)
+}
+
+var build = generateBuild();
+
+var paths = {
+	scripts: ["src/ondomready.js", "src/polyfills.js", "src/augment.js", "src/holder.js"]
+}
+
+gulp.task('jshint', function () {
+	return gulp.src(paths.scripts[paths.scripts.length - 1])
+		.pipe(jshint())
+		.pipe(jshint.reporter('default'))
+});
+
+gulp.task('todo', function(){
+	return gulp.src(paths.scripts)
+		.pipe(todo())
+		.pipe(gulp.dest('./'))
+});
+
+gulp.task('scripts', ['jshint'], function () {
+	return gulp.src(paths.scripts)
+		.pipe(concat("holder.js"))
+		.pipe(uglify())
+		.pipe(header(banner, {
+			pkg: pkg,
+			year: moment().format("YYYY"),
+			build: build
+		}))
+		.pipe(gulp.dest("./"))
+});
+
+gulp.task('watch', function(){
+	gulp.watch(paths.scripts, ['default']);
+});
+
+gulp.task('default', ['todo', 'jshint', 'scripts'], function(){
+	build = generateBuild();
+	gulputil.log("Finished build "+build);
+});
--- a/bower_components/holderjs/holder.js
+++ b/bower_components/holderjs/holder.js
--- a/bower_components/holderjs/package.json
+++ b/bower_components/holderjs/package.json
@@ -0,0 +1,42 @@
+{
+  "name": "Holder",
+  "version": "2.4.1",
+  "summary": "client side image placeholders",
+  "description": "Holder uses SVG to render image placeholders entirely in browser.",
+  "author": {
+    "name": "Ivan Malopinsky",
+    "url": "http://imsky.co"
+  },
+  "homepage": "http://imsky.github.io/holder",
+  "license": {
+    "type": "MIT",
+    "url": "http://opensource.org/licenses/MIT"
+  },
+  "keywords": [
+    "images",
+    "placeholders",
+    "client-side",
+    "canvas",
+    "generation",
+    "development",
+    "svg"
+  ],
+  "main": "holder.js",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/imsky/holder.git"
+  },
+  "bugs": {
+    "url": "https://github.com/imsky/holder/issues"
+  },
+  "devDependencies": {
+    "moment": "^2.6.0",
+    "gulp": "~3",
+    "gulp-uglify": "^0.3.0",
+    "gulp-concat": "^2.2.0",
+    "gulp-header": "^1.0.2",
+    "gulp-jshint": "^1.6.1",
+    "gulp-todo": "^0.3.8",
+    "gulp-util": "~3"
+  }
+}
--- a/bower_components/holderjs/src/augment.js
+++ b/bower_components/holderjs/src/augment.js
@@ -0,0 +1,33 @@
+(function (global, factory) {
+	global.augment = factory();
+}(this, function () {
+    "use strict";
+
+    var Factory = function () {};
+    var slice = Array.prototype.slice;
+
+    var augment = function (base, body) {
+        var uber = Factory.prototype = typeof base === "function" ? base.prototype : base;
+        var prototype = new Factory(), properties = body.apply(prototype, slice.call(arguments, 2).concat(uber));
+        if (typeof properties === "object") for (var key in properties) prototype[key] = properties[key];
+        if (!prototype.hasOwnProperty("constructor")) return prototype;
+        var constructor = prototype.constructor;
+        constructor.prototype = prototype;
+        return constructor;
+    };
+
+    augment.defclass = function (prototype) {
+        var constructor = prototype.constructor;
+        constructor.prototype = prototype;
+        return constructor;
+    };
+
+    augment.extend = function (base, body) {
+        return augment(base, function (uber) {
+            this.uber = uber;
+            return body;
+        });
+    };
+
+    return augment;
+}));
--- a/bower_components/holderjs/src/holder.js
+++ b/bower_components/holderjs/src/holder.js
--- a/bower_components/holderjs/src/ondomready.js
+++ b/bower_components/holderjs/src/ondomready.js
@@ -0,0 +1,160 @@
+/*!
+ * onDomReady.js 1.4.0 (c) 2013 Tubal Martin - MIT license
+ *
+ * Specially modified to work with Holder.js
+ */
+
+;(function(name, global, callback){
+		global[name] = callback;
+})("onDomReady", this,
+
+(function(win) {
+
+    'use strict';
+
+    //Lazy loading fix for Firefox < 3.6
+    //http://webreflection.blogspot.com/2009/11/195-chars-to-help-lazy-loading.html
+    if (document.readyState == null && document.addEventListener) {
+        document.addEventListener("DOMContentLoaded", function DOMContentLoaded() {
+            document.removeEventListener("DOMContentLoaded", DOMContentLoaded, false);
+            document.readyState = "complete";
+        }, false);
+        document.readyState = "loading";
+    }
+
+    var doc = win.document,
+        docElem = doc.documentElement,
+
+        LOAD = "load",
+        FALSE = false,
+        ONLOAD = "on"+LOAD,
+        COMPLETE = "complete",
+        READYSTATE = "readyState",
+        ATTACHEVENT = "attachEvent",
+        DETACHEVENT = "detachEvent",
+        ADDEVENTLISTENER = "addEventListener",
+        DOMCONTENTLOADED = "DOMContentLoaded",
+        ONREADYSTATECHANGE = "onreadystatechange",
+        REMOVEEVENTLISTENER = "removeEventListener",
+
+        // W3C Event model
+        w3c = ADDEVENTLISTENER in doc,
+        top = FALSE,
+
+        // isReady: Is the DOM ready to be used? Set to true once it occurs.
+        isReady = FALSE,
+
+        // Callbacks pending execution until DOM is ready
+        callbacks = [];
+
+    // Handle when the DOM is ready
+    function ready( fn ) {
+        if ( !isReady ) {
+
+            // Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
+            if ( !doc.body ) {
+                return defer( ready );
+            }
+
+            // Remember that the DOM is ready
+            isReady = true;
+
+            // Execute all callbacks
+            while ( fn = callbacks.shift() ) {
+                defer( fn );
+            }
+        }
+    }
+
+    // The ready event handler
+    function completed( event ) {
+        // readyState === "complete" is good enough for us to call the dom ready in oldIE
+        if ( w3c || event.type === LOAD || doc[READYSTATE] === COMPLETE ) {
+            detach();
+            ready();
+        }
+    }
+
+    // Clean-up method for dom ready events
+    function detach() {
+        if ( w3c ) {
+            doc[REMOVEEVENTLISTENER]( DOMCONTENTLOADED, completed, FALSE );
+            win[REMOVEEVENTLISTENER]( LOAD, completed, FALSE );
+        } else {
+            doc[DETACHEVENT]( ONREADYSTATECHANGE, completed );
+            win[DETACHEVENT]( ONLOAD, completed );
+        }
+    }
+
+    // Defers a function, scheduling it to run after the current call stack has cleared.
+    function defer( fn, wait ) {
+        // Allow 0 to be passed
+        setTimeout( fn, +wait >= 0 ? wait : 1 );
+    }
+
+    // Attach the listeners:
+
+    // Catch cases where onDomReady is called after the browser event has already occurred.
+    // we once tried to use readyState "interactive" here, but it caused issues like the one
+    // discovered by ChrisS here: http://bugs.jquery.com/ticket/12282#comment:15
+    if ( doc[READYSTATE] === COMPLETE ) {
+        // Handle it asynchronously to allow scripts the opportunity to delay ready
+        defer( ready );
+
+    // Standards-based browsers support DOMContentLoaded
+    } else if ( w3c ) {
+        // Use the handy event callback
+        doc[ADDEVENTLISTENER]( DOMCONTENTLOADED, completed, FALSE );
+
+        // A fallback to window.onload, that will always work
+        win[ADDEVENTLISTENER]( LOAD, completed, FALSE );
+
+    // If IE event model is used
+    } else {
+        // Ensure firing before onload, maybe late but safe also for iframes
+        doc[ATTACHEVENT]( ONREADYSTATECHANGE, completed );
+
+        // A fallback to window.onload, that will always work
+        win[ATTACHEVENT]( ONLOAD, completed );
+
+        // If IE and not a frame
+        // continually check to see if the document is ready
+        try {
+            top = win.frameElement == null && docElem;
+        } catch(e) {}
+
+        if ( top && top.doScroll ) {
+            (function doScrollCheck() {
+                if ( !isReady ) {
+                    try {
+                        // Use the trick by Diego Perini
+                        // http://javascript.nwbox.com/IEContentLoaded/
+                        top.doScroll("left");
+                    } catch(e) {
+                        return defer( doScrollCheck, 50 );
+                    }
+
+                    // detach all dom ready events
+                    detach();
+
+                    // and execute any waiting functions
+                    ready();
+                }
+            })();
+        }
+    }
+
+    function onDomReady( fn ) {
+        // If DOM is ready, execute the function (async), otherwise wait
+        isReady ? defer( fn ) : callbacks.push( fn );
+    }
+
+    // Add version
+    onDomReady.version = "1.4.0";
+    // Add method to check if DOM is ready
+    onDomReady.isReady = function(){
+        return isReady;
+    };
+
+    return onDomReady;
+})(this));
--- a/bower_components/holderjs/src/polyfills.js
+++ b/bower_components/holderjs/src/polyfills.js
@@ -0,0 +1,259 @@
+//https://github.com/inexorabletash/polyfill/blob/master/web.js
+  if (!document.querySelectorAll) {
+    document.querySelectorAll = function (selectors) {
+      var style = document.createElement('style'), elements = [], element;
+      document.documentElement.firstChild.appendChild(style);
+      document._qsa = [];
+
+      style.styleSheet.cssText = selectors + '{x-qsa:expression(document._qsa && document._qsa.push(this))}';
+      window.scrollBy(0, 0);
+      style.parentNode.removeChild(style);
+
+      while (document._qsa.length) {
+        element = document._qsa.shift();
+        element.style.removeAttribute('x-qsa');
+        elements.push(element);
+      }
+      document._qsa = null;
+      return elements;
+    };
+  }
+
+  if (!document.querySelector) {
+    document.querySelector = function (selectors) {
+      var elements = document.querySelectorAll(selectors);
+      return (elements.length) ? elements[0] : null;
+    };
+  }
+
+  if (!document.getElementsByClassName) {
+    document.getElementsByClassName = function (classNames) {
+      classNames = String(classNames).replace(/^|\s+/g, '.');
+      return document.querySelectorAll(classNames);
+    };
+  }
+
+//https://github.com/inexorabletash/polyfill
+// ES5 15.2.3.14 Object.keys ( O )
+// https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/keys
+if (!Object.keys) {
+  Object.keys = function (o) {
+    if (o !== Object(o)) { throw TypeError('Object.keys called on non-object'); }
+    var ret = [], p;
+    for (p in o) {
+      if (Object.prototype.hasOwnProperty.call(o, p)) {
+        ret.push(p);
+      }
+    }
+    return ret;
+  };
+}
+
+//https://github.com/inexorabletash/polyfill/blob/master/web.js
+(function (global) {
+  var B64_ALPHABET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
+  global.atob = global.atob || function (input) {
+    input = String(input);
+    var position = 0,
+        output = [],
+        buffer = 0, bits = 0, n;
+
+    input = input.replace(/\s/g, '');
+    if ((input.length % 4) === 0) { input = input.replace(/=+$/, ''); }
+    if ((input.length % 4) === 1) { throw Error("InvalidCharacterError"); }
+    if (/[^+/0-9A-Za-z]/.test(input)) { throw Error("InvalidCharacterError"); }
+
+    while (position < input.length) {
+      n = B64_ALPHABET.indexOf(input.charAt(position));
+      buffer = (buffer << 6) | n;
+      bits += 6;
+
+      if (bits === 24) {
+        output.push(String.fromCharCode((buffer >> 16) & 0xFF));
+        output.push(String.fromCharCode((buffer >>  8) & 0xFF));
+        output.push(String.fromCharCode(buffer & 0xFF));
+        bits = 0;
+        buffer = 0;
+      }
+      position += 1;
+    }
+
+    if (bits === 12) {
+      buffer = buffer >> 4;
+      output.push(String.fromCharCode(buffer & 0xFF));
+    } else if (bits === 18) {
+      buffer = buffer >> 2;
+      output.push(String.fromCharCode((buffer >> 8) & 0xFF));
+      output.push(String.fromCharCode(buffer & 0xFF));
+    }
+
+    return output.join('');
+  };
+
+  global.btoa = global.btoa || function (input) {
+    input = String(input);
+    var position = 0,
+        out = [],
+        o1, o2, o3,
+        e1, e2, e3, e4;
+
+    if (/[^\x00-\xFF]/.test(input)) { throw Error("InvalidCharacterError"); }
+
+    while (position < input.length) {
+      o1 = input.charCodeAt(position++);
+      o2 = input.charCodeAt(position++);
+      o3 = input.charCodeAt(position++);
+
+      // 111111 112222 222233 333333
+      e1 = o1 >> 2;
+      e2 = ((o1 & 0x3) << 4) | (o2 >> 4);
+      e3 = ((o2 & 0xf) << 2) | (o3 >> 6);
+      e4 = o3 & 0x3f;
+
+      if (position === input.length + 2) {
+        e3 = 64; e4 = 64;
+      }
+      else if (position === input.length + 1) {
+        e4 = 64;
+      }
+
+      out.push(B64_ALPHABET.charAt(e1),
+               B64_ALPHABET.charAt(e2),
+               B64_ALPHABET.charAt(e3),
+               B64_ALPHABET.charAt(e4));
+    }
+
+    return out.join('');
+  };
+}(this));
+
+//https://github.com/jonathantneal/polyfill/blob/master/source/Window.prototype.getComputedStyle.ie8.js
+(function () {
+	if(window.getComputedStyle) return; //Add an exit if already defined
+	function getComputedStylePixel(element, property, fontSize) {
+		element.document; // Internet Explorer sometimes struggles to read currentStyle until the element's document is accessed.
+
+		var
+		value = element.currentStyle[property].match(/([\d\.]+)(%|cm|em|in|mm|pc|pt|)/) || [0, 0, ''],
+		size = value[1],
+		suffix = value[2],
+		rootSize;
+
+		fontSize = !fontSize ? fontSize : /%|em/.test(suffix) && element.parentElement ? getComputedStylePixel(element.parentElement, 'fontSize', null) : 16;
+		rootSize = property == 'fontSize' ? fontSize : /width/i.test(property) ? element.clientWidth : element.clientHeight;
+
+		return suffix == '%' ? size / 100 * rootSize :
+		       suffix == 'cm' ? size * 0.3937 * 96 :
+		       suffix == 'em' ? size * fontSize :
+		       suffix == 'in' ? size * 96 :
+		       suffix == 'mm' ? size * 0.3937 * 96 / 10 :
+		       suffix == 'pc' ? size * 12 * 96 / 72 :
+		       suffix == 'pt' ? size * 96 / 72 :
+		       size;
+	}
+
+	function setShortStyleProperty(style, property) {
+		var
+		borderSuffix = property == 'border' ? 'Width' : '',
+		t = property + 'Top' + borderSuffix,
+		r = property + 'Right' + borderSuffix,
+		b = property + 'Bottom' + borderSuffix,
+		l = property + 'Left' + borderSuffix;
+
+		style[property] = (style[t] == style[r] && style[t] == style[b] && style[t] == style[l] ? [ style[t] ] :
+		                   style[t] == style[b] && style[l] == style[r] ? [ style[t], style[r] ] :
+		                   style[l] == style[r] ? [ style[t], style[r], style[b] ] :
+		                   [ style[t], style[r], style[b], style[l] ]).join(' ');
+	}
+
+	// <CSSStyleDeclaration>
+	function CSSStyleDeclaration(element) {
+		var
+		style = this,
+		currentStyle = element.currentStyle,
+		fontSize = getComputedStylePixel(element, 'fontSize'),
+		unCamelCase = function (match) {
+			return '-' + match.toLowerCase();
+		},
+		property;
+
+		for (property in currentStyle) {
+			Array.prototype.push.call(style, property == 'styleFloat' ? 'float' : property.replace(/[A-Z]/, unCamelCase));
+			if (property == 'width') {
+				style[property] = element.offsetWidth + 'px';
+			} else if (property == 'height') {
+				style[property] = element.offsetHeight + 'px';
+			} else if (property == 'styleFloat') {
+				style.float = currentStyle[property];
+			} else if (/margin.|padding.|border.+W/.test(property) && style[property] != 'auto') {
+				style[property] = Math.round(getComputedStylePixel(element, property, fontSize)) + 'px';
+			} else if (/^outline/.test(property)) {
+				// errors on checking outline
+				try {
+					style[property] = currentStyle[property];
+				} catch (error) {
+					style.outlineColor = currentStyle.color;
+					style.outlineStyle = style.outlineStyle || 'none';
+					style.outlineWidth = style.outlineWidth || '0px';
+					style.outline = [style.outlineColor, style.outlineWidth, style.outlineStyle].join(' ');
+				}
+			} else {
+				style[property] = currentStyle[property];
+			}
+		}
+
+		setShortStyleProperty(style, 'margin');
+		setShortStyleProperty(style, 'padding');
+		setShortStyleProperty(style, 'border');
+
+		style.fontSize = Math.round(fontSize) + 'px';
+	}
+
+	CSSStyleDeclaration.prototype = {
+		constructor: CSSStyleDeclaration,
+		// <CSSStyleDeclaration>.getPropertyPriority
+		getPropertyPriority: function () {
+			throw new Error('NotSupportedError: DOM Exception 9');
+		},
+		// <CSSStyleDeclaration>.getPropertyValue
+		getPropertyValue: function(property) {
+		    var lookup = property.replace(/-([a-z])/g, function(match) {
+		        match = match.charAt ? match.split('') : match;
+		        return match[1].toUpperCase();
+		    });
+		    var ret = this[lookup];
+		    return ret;
+		},
+		// <CSSStyleDeclaration>.item
+		item: function (index) {
+			return this[index];
+		},
+		// <CSSStyleDeclaration>.removeProperty
+		removeProperty: function () {
+			throw new Error('NoModificationAllowedError: DOM Exception 7');
+		},
+		// <CSSStyleDeclaration>.setProperty
+		setProperty: function () {
+			throw new Error('NoModificationAllowedError: DOM Exception 7');
+		},
+		// <CSSStyleDeclaration>.getPropertyCSSValue
+		getPropertyCSSValue: function () {
+			throw new Error('NotSupportedError: DOM Exception 9');
+		}
+	};
+
+	// <window>.getComputedStyle
+	window.getComputedStyle = function (element) {
+		return new CSSStyleDeclaration(element);
+	};
+})();
+
+//https://gist.github.com/jimeh/332357
+if (!Object.prototype.hasOwnProperty){
+    /*jshint -W001, -W103 */
+    Object.prototype.hasOwnProperty = function(prop) {
+		var proto = this.__proto__ || this.constructor.prototype;
+		return (prop in this) && (!(prop in proto) || proto[prop] !== this[prop]);
+	}
+    /*jshint +W001, +W103 */
+}
--- a/bower_components/holderjs/test/.gitignore
+++ b/bower_components/holderjs/test/.gitignore
@@ -0,0 +1,6 @@
+performance.html
+benchmark.js
+lodash.js
+require.js
+test.js
+ua-parser.js
--- a/bower_components/holderjs/test/image.jpg
+++ b/bower_components/holderjs/test/image.jpg
--- a/bower_components/holderjs/test/index.html
+++ b/bower_components/holderjs/test/index.html
@@ -0,0 +1,215 @@
+<!doctype html>
+<html>
+<head>
+<title>Holder Testing</title>
+<meta charset="utf-8">
+<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" class="holderjs">
+<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css' class="holderjs">
+<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css' class='holderjs'>
+<style>
+	body {font-family:Arial,sans-serif;width:1050px;margin:0 auto}
+	.thumb {width:300px;height:250px;margin:25px;float:left}
+	.thumb img, .thumb .holderjs, .thumb object {display:block;margin:0 auto}
+	.thumb .caption {padding:10px;text-align:center;margin-top:10px}
+	.thumb.fullpage {float:none;clear:both;width:auto;height:100px;margin:25px}
+	.autosize img {width:100%}
+	#holder1 {background:url('?holder.js/300x200/text:Background%20placeholder/^eee:^222');width:300px;height:200px}
+</style>
+</head>
+<body>
+
+<div class="thumb">
+	<img data-src="holder.js/300x200">
+	<div class="caption">
+		 Plain placeholder
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/social">
+	<div class="caption">
+		 Themed placeholder
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/random/font:Droid Sans/text:Droid Sans">
+	<div class="caption">
+		Placeholder with random theme
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/text:заполнитель">
+	<div class="caption">
+		 Placeholder with text
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/#EE403D:#FFFFFF/text:Lorem ipsum dolor sit amet, consectetur adipiscing elit.">
+	<div class="caption">
+		 Placeholder with lengthy text
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.canvas/300x200/#EE403D:#FFFFFF/text:Lorem ipsum dolor sit amet, consectetur adipiscing elit.">
+	<div class="caption">
+		Canvas placeholder with lengthy text
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/social/text:Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tempor, libero quis accumsan fringilla, augue est laoreet orci, consectetur euismod augue nisl sit amet arcu. Fusce ultrices ornare metus in porta. Aenean ac nisl ut tellus dignissim auctor quis id arcu. Vivamus lorem neque, pulvinar non dictum vel, sagittis lobortis odio.">
+	<div class="caption">
+		 Placeholder with very lengthy text
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/social/text:Lorem ipsum   \n   dolor sit amet, consectetur adipiscing elit.">
+	<div class="caption">
+		 Placeholder with custom newline
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/randomrandom/hello:world/$$$$/%25%25%67/industrial/text:заполнитель">
+	<div class="caption">
+		 Placeholder with text and bad flags
+	</div>
+</div>
+<div class="thumb">
+	<script>
+	var r = Math.random();
+	if(r > 0.5){
+	document.write('<img data-src="holder.js/200x150" src="missing.jpg" style="width:200px;height:150px;outline:solid 3px red">');
+	}
+	else{
+	document.write('<img data-src="holder.js/200x150" src="image.jpg" style="width:200px;height:150px;outline:solid 3px green">');
+	}
+	</script>
+	<div class="caption">
+		Placeholder with (randomly) missing image source
+	</div>
+</div>
+<div class="thumb">
+	<div class="autosize">
+		<img data-src="holder.js/200x133/#111:#ffff00/auto">
+	</div>
+	<div class="caption">
+		 Auto-sized placeholder
+	</div>
+</div>
+<div class="thumb">
+	<div class="autosize">
+		<img data-src="holder.js/200x133/#111:#ffff00/auto/textmode:exact">
+	</div>
+	<div class="caption">
+		 Auto-sized placeholder in exact mode
+	</div>
+</div>
+<div class="thumb">
+	<div class="holderjs" id="holder1"></div>
+	<div class="caption">
+		<code>&lt;div&gt;</code> with background placeholder
+	</div>
+</div>
+<div class="thumb">
+	<div class="holderjs" style="width:300px;height:200px" data-background-src="?holder.js/300x200/#ff8362:#5e422e"></div>
+	<div class="caption">
+		<code>&lt;div&gt;</code> with <code>data-background-src</code> placeholder
+	</div>
+</div>
+
+<div class="thumb">
+	<div id="thumb1">
+	</div>
+	<div class="caption">
+		 Placeholder added through Holder API
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="custom.holder/150x100/custom/auto" style="width:300px;height:200px">
+	<div class="caption">
+		Auto-sized <code>canvas</code> placeholder with custom domain and theme
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200/font:Pacifico/#4466ff:#fff/text:Pacifico">
+	<div class="caption">
+		 Placeholder using <span style="font-family:Pacifico">Pacifico</span> font</span>
+	</div>
+</div>
+<div class="thumb">
+	<object data="holder.js/300x200/font:Pacifico/#4466ff:#fff/text:Pacifico"></object>
+	<div class="caption">
+		<code>object</code> placeholder using <span style="font-family:Pacifico">Pacifico</span> font</span>
+	</div>
+</div>
+<div class="thumb">
+	<div style="overflow:hidden">
+	<img data-src="holder.js/50x75/sky" style="float:left">
+	<img data-src="holder.js/100x75/vine" style="float:left">
+	<img data-src="holder.js/150x75/lava" style="float:left">
+	</div>
+	<div style="overflow:hidden">
+	<img data-src="holder.js/300x125/industrial" style="float:left">
+	</div>
+<div class="caption">
+		 Placeholders demonstrating adaptive text size
+	</div>
+</div>
+<div class="thumb">
+	<div style="height:200px">
+<img data-src="holder.js/100%25x50%25/sky">
+<img data-src="holder.js/100%25x50%25/lava">
+</div>
+<div class="caption">Two fluid placeholders in one parent using URI encoding</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/80%x50%/vine">
+	<div class="caption">
+		 Fluid placeholder
+	</div>
+</div>
+<div class="fullpage thumb">
+	<img data-src="holder.js/90%x80%/sky">
+	<div class="caption">
+		 Full-page fluid placeholder
+	</div>
+</div>
+<div class="fullpage thumb">
+	<object data-src="holder.js/90%x80%/vine"></object>
+	<div class="caption">
+		 Full-page fluid <code>object</code> placeholder
+	</div>
+</div>
+<div class="fullpage thumb">
+	<img data-src="holder.js/90%x80%/lava/textmode:literal">
+	<div class="caption">
+		 Full-page fluid placeholder in literal mode
+	</div>
+</div>
+<div class="thumb">
+	<img data-src="holder.js/300x200">
+	<div class="caption">
+		 Plain placeholder to ensure themes aren't leaked forward
+	</div>
+</div>
+
+<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
+<script src="../holder.js"></script>
+<!--
+<script src="require.js" data-main="test.js"></script>
+-->
+<script>
+Holder.add_image("holder.js/300x200/sky", "#thumb1").run();
+Holder.add_theme("custom", {foreground: "#fff", background: "#000", size: 15}).run({
+	domain: "custom.holder",
+	use_canvas: true
+})
+Holder.add_theme("fontawesome", {foreground: "#00ccaa", background: "#002211", size: 12}).run({
+	domain: "fontawesome.holder"
+})
+Holder.run({
+	domain: "holder.canvas",
+	use_canvas: true
+});
+
+</script>
+</body>
+</html>