Vendor Polymer components

8d068c21 · Pascal Hartig · 1fc9fbea · 8d068c21 · 8d068c21 · 8d068c21
Commit 8d068c21 authored Aug 25, 2014 by Pascal Hartig
41 changed files
--- a/bower.json
+++ b/bower.json
@@ -3,7 +3,7 @@
  "dependencies": {
    "jquery": "~2.1.0",
    "bootstrap": "~3.2.0",
-    "paper-tabs": "Polymer/paper-tabs#~0.3.5"
+    "paper-tabs": "Polymer/paper-tabs#~0.4.0"
  },
  "devDependencies": {
    "prefixfree": "91790e8aff6d807cd62018479db2307e1972b92a"

--- a/bower_components/core-selection/.bower.json
+++ b/bower_components/core-selection/.bower.json
+{
+  "name": "core-selection",
+  "private": true,
+  "dependencies": {
+    "polymer": "Polymer/polymer#^0.4.0"
+  },
+  "devDependencies": {
+    "polymer-test-tools": "Polymer/polymer-test-tools#master"
+  },
+  "homepage": "https://github.com/Polymer/core-selection",
+  "version": "0.4.1",
+  "_release": "0.4.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.4.1",
+    "commit": "dd6919363a49f1f4ff52fa0dffef88e2bdfbbfdc"
+  },
+  "_source": "git://github.com/Polymer/core-selection.git",
+  "_target": "^0.4.0",
+  "_originalSource": "Polymer/core-selection"
+}
\ No newline at end of file
--- a/bower_components/core-selection/README.md
+++ b/bower_components/core-selection/README.md
+core-selection
+==============
+
+See the [component page](http://polymer-project.org/docs/elements/core-elements.html#core-selection) for more information.
--- a/bower_components/core-selection/bower.json
+++ b/bower_components/core-selection/bower.json
+{
+  "name": "core-selection",
+  "private": true,
+  "dependencies": {
+    "polymer": "Polymer/polymer#^0.4.0"
+  },
+  "devDependencies": {
+    "polymer-test-tools": "Polymer/polymer-test-tools#master"
+  }
+}
\ No newline at end of file
--- a/bower_components/core-selection/core-selection.html
+++ b/bower_components/core-selection/core-selection.html
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<!--
+@group Polymer Core Elements
+
+The `<core-selection>` element is used to manage selection state. It has no
+visual appearance and is typically used in conjunction with another element.
+For example, [core-selector](#core-selector)
+use a `<core-selection>` to manage selection.
+
+To mark an item as selected, call the `select(item)` method on 
+`<core-selection>`. The item itself is an argument to this method.
+
+The `<core-selection>`element manages selection state for any given set of
+items. When an item is selected, the `core-select` event is fired.
+
+The attribute `multi` indicates if multiple items can be selected at once.
+  
+Example:
+ 
+    <polymer-element name="selection-example">
+       <template>
+         <style>
+           polyfill-next-selector { content: ':host > .selected'; }
+           ::content > .selected {
+             font-weight: bold;
+             font-style: italic;
+           }
+         </style>
+         <ul on-tap="{{itemTapAction}}">
+           <content></content>
+         </ul>
+         <core-selection id="selection" multi
+                         on-core-select="{{selectAction}}"></core-selection>
+       </template>
+       <script>
+         Polymer('selection-example', {
+           itemTapAction: function(e, detail, sender) {
+             this.$.selection.select(e.target);
+           },
+           selectAction: function(e, detail, sender) {
+             detail.item.classList.toggle('selected', detail.isSelected);
+           }
+         });
+       </script>
+    </polymer-element>
+
+    <selection-example>
+      <li>Red</li>
+      <li>Green</li>
+      <li>Blue</li>
+    </selection-example>
+ 
+@element core-selection
+-->
+
+<!--
+Fired when an item's selection state is changed. This event is fired both
+when an item is selected or deselected. The `isSelected` detail property
+contains the selection state.
+
+@event core-select
+@param {Object} detail
+  @param {boolean} detail.isSelected true for selection and false for de-selection
+  @param {Object} detail.item the item element
+-->
+<link rel="import" href="../polymer/polymer.html">
+
+<polymer-element name="core-selection" attributes="multi" hidden>
+  <script>
+    Polymer('core-selection', {
+      /**
+       * If true, multiple selections are allowed.
+       *
+       * @attribute multi
+       * @type boolean
+       * @default false
+       */
+      multi: false,
+      ready: function() {
+        this.clear();
+      },
+      clear: function() {
+        this.selection = [];
+      },
+      /**
+       * Retrieves the selected item(s).
+       * @method getSelection
+       * @returns Returns the selected item(s). If the multi property is true,
+       * getSelection will return an array, otherwise it will return 
+       * the selected item or undefined if there is no selection.
+      */
+      getSelection: function() {
+        return this.multi ? this.selection : this.selection[0];
+      },
+      /**
+       * Indicates if a given item is selected.
+       * @method isSelected
+       * @param {any} item The item whose selection state should be checked.
+       * @returns Returns true if `item` is selected.
+      */
+      isSelected: function(item) {
+        return this.selection.indexOf(item) >= 0;
+      },
+      setItemSelected: function(item, isSelected) {
+        if (item !== undefined && item !== null) {
+          if (isSelected) {
+            this.selection.push(item);
+          } else {
+            var i = this.selection.indexOf(item);
+            if (i >= 0) {
+              this.selection.splice(i, 1);
+            }
+          }
+          this.fire("core-select", {isSelected: isSelected, item: item});
+        }
+      },
+      /**
+       * Set the selection state for a given `item`. If the multi property
+       * is true, then the selected state of `item` will be toggled; otherwise
+       * the `item` will be selected.
+       * @method select
+       * @param {any} item: The item to select.
+      */
+      select: function(item) {
+        if (this.multi) {
+          this.toggle(item);
+        } else if (this.getSelection() !== item) {
+          this.setItemSelected(this.getSelection(), false);
+          this.setItemSelected(item, true);
+        }
+      },
+      /**
+       * Toggles the selection state for `item`.
+       * @method toggle
+       * @param {any} item: The item to toggle.
+      */
+      toggle: function(item) {
+        this.setItemSelected(item, !this.isSelected(item));
+      }
+    });
+  </script>
+</polymer-element>
--- a/bower_components/core-selection/demo.html
+++ b/bower_components/core-selection/demo.html
+<!DOCTYPE html>
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <title>Selection</title>
+  <script src="../platform/platform.js"></script>
+  <link rel="import" href="core-selection.html">
+</head>
+<body unresolved>
+
+  <polymer-element name="selection-example">
+    <template>
+      <style>
+        polyfill-next-selector { content: 'ul > *'; }
+        ::content > * {
+          cursor: pointer;
+        }
+
+        polyfill-next-selector { content: 'ul > .selected'; }
+        ::content > .selected {
+          font-weight: bold;
+          font-style: italic;
+        }
+      </style>
+
+      <ul on-tap="{{itemTapAction}}">
+        <content></content>
+      </ul>
+
+      <core-selection id="selection" multi on-core-select="{{selectAction}}"></core-selection>
+
+    </template>
+    <script>
+    Polymer('selection-example', {
+      itemTapAction: function(e, detail, sender) {
+        this.$.selection.select(e.target);
+      },
+      selectAction: function(e, detail, sender) {
+        detail.item.classList.toggle('selected', detail.isSelected);
+      }
+    });
+    </script>
+  </polymer-element>
+
+  <selection-example>
+    <li>Red</li>
+    <li>Green</li>
+    <li>Blue</li>
+  </selection-example>
+  
+</body>
+</html>
--- a/bower_components/core-selection/index.html
+++ b/bower_components/core-selection/index.html
+<!doctype html>
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE
+The complete set of authors may be found at http://polymer.github.io/AUTHORS
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS
+-->
+<html>
+<head>
+
+  <script src="../platform/platform.js"></script>
+  <link rel="import" href="../core-component-page/core-component-page.html">
+
+</head>
+<body unresolved>
+
+  <core-component-page></core-component-page>
+
+</body>
+</html>
--- a/bower_components/core-selector/.bower.json
+++ b/bower_components/core-selector/.bower.json
+{
+  "name": "core-selector",
+  "private": true,
+  "dependencies": {
+    "polymer": "Polymer/polymer#^0.4.0",
+    "core-selection": "Polymer/core-selection#^0.4.0"
+  },
+  "devDependencies": {
+    "polymer-test-tools": "Polymer/polymer-test-tools#master"
+  },
+  "homepage": "https://github.com/Polymer/core-selector",
+  "version": "0.4.1",
+  "_release": "0.4.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.4.1",
+    "commit": "7d2a5d5b127d0ed3feb7bcb0bdaaeb95c4499cc9"
+  },
+  "_source": "git://github.com/Polymer/core-selector.git",
+  "_target": "^0.4.0",
+  "_originalSource": "Polymer/core-selector"
+}
\ No newline at end of file
--- a/bower_components/core-selector/README.md
+++ b/bower_components/core-selector/README.md
+core-selector
+==============
+
+See the [component page](http://polymer-project.org/docs/elements/core-elements.html#core-selector) for more information.
--- a/bower_components/core-selector/bower.json
+++ b/bower_components/core-selector/bower.json
+{
+  "name": "core-selector",
+  "private": true,
+  "dependencies": {
+    "polymer": "Polymer/polymer#^0.4.0",
+    "core-selection": "Polymer/core-selection#^0.4.0"
+  },
+  "devDependencies": {
+    "polymer-test-tools": "Polymer/polymer-test-tools#master"
+  }
+}
\ No newline at end of file
--- a/bower_components/core-selector/core-selector.html
+++ b/bower_components/core-selector/core-selector.html
--- a/bower_components/core-selector/demo.html
+++ b/bower_components/core-selector/demo.html
+<!DOCTYPE html>
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+  <title>Selector</title>
+  <script src="../platform/platform.js"></script>
+  <link rel="import" href="core-selector.html">
+</head>
+<body unresolved>
+  <polymer-element name="selector-examples">
+    <template>
+      <style>
+        .list {
+          display: block;
+          border: 1px solid #ccc;
+          border-bottom: none;
+          background: #666;
+          color: white;
+          list-style: none;
+          margin: 0;
+          padding: 0;
+        }
+        
+        .list > * {
+          height: 40px;
+          line-height: 40px;
+          padding: 0 20px;
+          border-bottom: 1px solid #ccc;
+        }
+        
+        .list > *.core-selected {
+          background: #333;
+        }
+        
+        li {
+          height: 30px;
+        }
+        
+        li.core-selected:after {
+          content: "\2713";
+          position: absolute;
+          padding-left: 10px;
+        }
+      </style>
+      
+      <h2>basic</h2>
+      <core-selector class="list" selected="0">
+        <div>Item 0</div>
+        <div>Item 1</div>
+        <div>Item 2</div>
+        <div>Item 3</div>
+        <div>Item 4</div>
+      </core-selector>
+      
+      <h2>multi-selection</h2>
+      <core-selector class="list" selected="{{multiSelected}}" multi>
+        <div>Item 0</div>
+        <div>Item 1</div>
+        <div>Item 2</div>
+        <div>Item 3</div>
+        <div>Item 4</div>
+      </core-selector>
+      
+      <h2>list</h2>
+      <core-selector target="{{$.list}}" selected="0"></core-selector>
+      <ul id="list">
+        <li>Item 0</li>
+        <li>Item 1</li>
+        <li>Item 2</li>
+        <li>Item 3</li>
+        <li>Item 4</li>
+      </ul>
+      
+      <h2>binding of a group of radio buttons to a variable</h2>
+      <core-selector target="{{$.myForm}}" itemsSelector="input[type=radio]" 
+          selected="{{color}}" valueattr="value" selectedProperty="checked" 
+          activateEvent="change"></core-selector>
+      <form id="myForm">
+        <label><input type="radio" name="color" value="red"> Red</label> <br>
+        <label><input type="radio" name="color" value="green"> Green</label> <br>
+        <label><input type="radio" name="color" value="blue"> Blue</label> <br>
+        <p>color = {{color}}</p>
+      </form>
+      
+    </template>
+
+    <script>
+      Polymer('selector-examples', {
+        ready: function() {
+          this.multiSelected = [1, 3];
+          this.color = 'green';
+        }
+      });
+    </script>
+  </polymer-element>
+  
+  <selector-examples></selector-examples>
+</body>
+</html>
--- a/bower_components/core-selector/index.html
+++ b/bower_components/core-selector/index.html
+<!doctype html>
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE
+The complete set of authors may be found at http://polymer.github.io/AUTHORS
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS
+-->
+<html>
+<head>
+
+  <script src="../platform/platform.js"></script>
+  <link rel="import" href="../core-component-page/core-component-page.html">
+
+</head>
+<body unresolved>
+
+  <core-component-page></core-component-page>
+
+</body>
+</html>
--- a/bower_components/core-selector/metadata.html
+++ b/bower_components/core-selector/metadata.html
+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<x-meta id="core-selector" label="Selector" group="Core" isContainer>
+
+  <template>
+    <core-selector selected="0" style="width:100%;height:50px;"></core-selector>
+  </template>
+
+  <template>
+    <link rel="import" href="core-selector.html">
+  </template>
+
+</x-meta>
\ No newline at end of file
--- a/bower_components/paper-ripple/.bower.json
+++ b/bower_components/paper-ripple/.bower.json
+{
+  "name": "paper-ripple",
+  "private": true,
+  "dependencies": {
+    "core-icon": "Polymer/core-icon#^0.4.0",
+    "core-icons": "Polymer/core-icons#^0.4.0",
+    "font-roboto": "Polymer/font-roboto#^0.4.0"
+  },
+  "devDependencies": {
+    "polymer-test-tools": "Polymer/polymer-test-tools"
+  },
+  "homepage": "https://github.com/Polymer/paper-ripple",
+  "version": "0.4.1",
+  "_release": "0.4.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.4.1",
+    "commit": "1a6458e7495c8f640651a5c42019f51eeb458e29"
+  },
+  "_source": "git://github.com/Polymer/paper-ripple.git",
+  "_target": "^0.4.0",
+  "_originalSource": "Polymer/paper-ripple"
+}
\ No newline at end of file
--- a/bower_components/paper-ripple/README.md
+++ b/bower_components/paper-ripple/README.md
+paper-ripple
+============
+
+See the [component page](http://www.polymer-project.org/docs/elements/paper-elements.html#paper-ripple) for more information.
--- a/bower_components/paper-ripple/bower.json
+++ b/bower_components/paper-ripple/bower.json
+{
+  "name": "paper-ripple",
+  "private": true,
+  "dependencies": {
+    "core-icon": "Polymer/core-icon#^0.4.0",
+    "core-icons": "Polymer/core-icons#^0.4.0",
+    "font-roboto": "Polymer/font-roboto#^0.4.0"
+  },
+  "devDependencies": {
+    "polymer-test-tools": "Polymer/polymer-test-tools"
+  }
+}
\ No newline at end of file
--- a/bower_components/paper-ripple/demo.html
+++ b/bower_components/paper-ripple/demo.html
+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<!doctype html>
+<html>
+<head>
+  <title>paper-ripple</title>
+  
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  
+  <script src="../platform/platform.js"></script>
+  
+  <link rel="import" href="../core-icons/core-icons.html">
+  <link rel="import" href="paper-ripple.html">
+  <link rel="import" href="../font-roboto/roboto.html">
+  <link rel="import" href="../core-icon/core-icon.html">
+  
+  <style shim-shadowdom>
+  
+    body {
+      background-color: #f9f9f9;
+      font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
+      -webkit-user-select: none;
+      -moz-user-select: none;
+      -ms-user-select: none;
+      user-select: none;
+      -webkit-tap-highlight-color: rgba(0,0,0,0);
+      -webkit-touch-callout: none;
+    }
+    
+    section {
+      padding: 30px 25px;
+    }
+    
+    section > * {
+      margin: 10px
+    }
+    
+    /* Button */
+    .button {
+      display: inline-block;
+      position: relative;
+      width: 120px;
+      height: 32px;
+      line-height: 32px;
+      border-radius: 2px;
+      font-size: 0.9em;
+      background-color: #fff;
+      color: #646464;
+    }
+    
+    .button > paper-ripple {
+      border-radius: 2px;
+      overflow: hidden;
+    }
+    
+    .button.narrow {
+      width: 60px;
+    }
+    
+    .button.grey {
+      background-color: #eee;
+    }
+    
+    .button.blue {
+      background-color: #4285f4;
+      color: #fff;
+    }
+    
+    .button.green {
+      background-color: #0f9d58;
+      color: #fff;
+    }
+    
+    .button.raised {
+      transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+      transition-delay: 0.2s;
+      box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
+    }
+    
+    .button.raised:active {
+      box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
+      transition-delay: 0s;
+    }
+    
+    /* Icon Button */
+    .icon-button {
+      position: relative;
+      display: inline-block;
+      width: 56px;
+      height: 56px;
+    }
+    
+    .icon-button > core-icon {
+      margin: 16px;
+      transition: -webkit-transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+      transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+    
+    .icon-button:hover > core-icon {
+      -webkit-transform: scale(1.2);
+      transform: scale(1.2);
+    }
+    
+    .icon-button > paper-ripple {
+      overflow: hidden;
+      color: #646464;
+    }
+    
+    .icon-button.red > core-icon::shadow path {
+      fill: #db4437;
+    }
+    
+    .icon-button.red > paper-ripple {
+      color: #db4437;
+    }
+    
+    .icon-button.blue > core-icon::shadow path {
+      fill: #4285f4;
+    }
+    
+    .icon-button.blue > paper-ripple {
+      color: #4285f4;
+    }
+    
+    /* FAB */
+    .fab {
+      position: relative;
+      display: inline-block;
+      width: 56px;
+      height: 56px;
+      border-radius: 50%;
+      color: #fff;
+      overflow: hidden;
+      transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+      transition-delay: 0.2s;
+      box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
+    }
+    
+    .fab.red {
+      background-color: #d23f31;
+    }
+    
+    .fab.blue {
+      background-color: #4285f4;
+    }
+    
+    .fab.green {
+      background-color: #0f9d58;
+    }
+    
+    .fab:active {
+      box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
+      transition-delay: 0s;
+    }
+    
+    .fab > core-icon {
+      margin: 16px;
+    }
+    
+    .fab > core-icon::shadow path {
+      fill: #fff;
+    }
+    
+    /* Menu */
+    .menu {
+      display: inline-block;
+      width: 180px;
+      background-color: #fff;
+      box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
+    }
+    
+    .item {
+      position: relative;
+      height: 48px;
+      line-height: 48px;
+      color: #646464;
+      font-size: 0.9em;
+    }
+    
+    .menu.blue > .item {
+      color: #4285f4;
+    }
+    
+    /* Card, Dialog */
+    .card, .dialog {
+      position: relative;
+      display: inline-block;
+      width: 300px;
+      height: 240px;
+      vertical-align: top;
+      background-color: #fff;
+      box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24);
+    }
+    
+    .dialog {
+      box-sizing: border-box;
+      padding: 16px;
+    }
+    
+    .dialog > .content {
+      height: 170px;
+      font-size: 0.9em;
+    }
+    
+    .dialog > .content > .title {
+      font-size: 1.3em;
+    }
+    
+    .dialog > .button {
+      width: 90px;
+      float: right;
+    }
+    
+    .card.image {
+      background: url(http://lorempixel.com/300/240/nature/);
+      color: #fff;
+    }
+    
+    /* Misc */
+    .center {
+      text-align: center;
+    }
+    
+    .label {
+      padding: 0 16px;
+    }
+    
+    .label-blue {
+      color: #4285f4; 
+    }
+    
+    .label-red {
+      color: #d23f31; 
+    }
+    
+  </style>
+  
+</head>
+<body unresolved>
+
+  <section>
+  
+    <div class="button raised">
+      <div class="center" fit>SUBMIT</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+    <div class="button raised grey">
+      <div class="center" fit>CANCEL</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+    <div class="button raised blue">
+      <div class="center" fit>COMPOSE</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+    <div class="button raised green">
+      <div class="center" fit>OK</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+  </section>
+  
+  <section>
+    
+    <div class="button raised grey narrow">
+      <div class="center" fit>+1</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+    <div class="button raised grey narrow label-blue">
+      <div class="center" fit>+1</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+    <div class="button raised grey narrow label-red">
+      <div class="center" fit>+1</div>
+      <paper-ripple fit></paper-ripple>
+    </div>
+    
+  </section>
+  
+  <section>
+    
+    <div class="icon-button">
+      <core-icon icon="menu"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+    
+    <div class="icon-button">
+      <core-icon icon="more-vert"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+    
+    <div class="icon-button red">
+      <core-icon icon="delete"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+    
+    <div class="icon-button blue">
+      <core-icon icon="account-box"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+    
+  </section>
+  
+  <section>
+  
+    <div class="fab red">
+      <core-icon icon="add"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+    
+    <div class="fab blue">
+      <core-icon icon="mail"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+    
+    <div class="fab green">
+      <core-icon icon="create"></core-icon>
+      <paper-ripple class="circle recenteringTouch" fit></paper-ripple>
+    </div>
+  
+  </section>
+  
+  <section>
+  
+    <div class="menu">
+    
+      <div class="item">
+        <div class="label" fit>Mark as unread</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      <div class="item">
+        <div class="label" fit>Mark as important</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      <div class="item">
+        <div class="label" fit>Add to Tasks</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      <div class="item">
+        <div class="label" fit>Create event</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      
+    </div>
+    
+    <div class="menu blue">
+    
+      <div class="item">
+        <div class="label" fit>Import</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      <div class="item">
+        <div class="label" fit>Export</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      <div class="item">
+        <div class="label" fit>Print</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      <div class="item">
+        <div class="label" fit>Restore contacts</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      
+    </div>
+  
+  </section>
+  
+  <section>
+  
+    <div class="dialog">
+    
+      <div class="content">
+        <div class="title">Permission</div><br>
+        <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</div>
+      </div>
+    
+      <div class="button label-blue">
+        <div class="center" fit>ACCEPT</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+      
+      <div class="button">
+        <div class="center" fit>DECLINE</div>
+        <paper-ripple fit></paper-ripple>
+      </div>
+    
+    </div>
+  
+    <div class="card">
+    
+      <paper-ripple class="recenteringTouch" fit></paper-ripple>
+    
+    </div>
+    
+    <div class="card image">
+    
+      <paper-ripple class="recenteringTouch" fit></paper-ripple>
+    
+    </div>
+  
+  </section>
+  
+</body>
+</html>
--- a/bower_components/paper-ripple/index.html
+++ b/bower_components/paper-ripple/index.html
+<!doctype html>
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE
+The complete set of authors may be found at http://polymer.github.io/AUTHORS
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS
+-->
+<html>
+<head>
+
+  <script src="../platform/platform.js"></script>
+  <link rel="import" href="../core-component-page/core-component-page.html">
+
+</head>
+<body unresolved>
+
+  <core-component-page></core-component-page>
+
+</body>
+</html>
--- a/bower_components/paper-ripple/metadata.html
+++ b/bower_components/paper-ripple/metadata.html
+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<x-meta id="paper-ripple" label="Ripple" group="Paper">
+
+  <template>
+    <paper-ripple style="width: 300px; height: 300px;"></paper-ripple>
+  </template>
+
+  <template id="imports">
+    <link rel="import" href="paper-ripple.html">
+  </template>
+
+</x-meta>
--- a/bower_components/paper-ripple/paper-ripple.html
+++ b/bower_components/paper-ripple/paper-ripple.html
--- a/bower_components/paper-ripple/raw.html
+++ b/bower_components/paper-ripple/raw.html
--- a/bower_components/paper-tabs/.bower.json
+++ b/bower_components/paper-tabs/.bower.json
+{
+  "name": "paper-tabs",
+  "private": true,
+  "dependencies": {
+    "core-icons": "Polymer/core-icons#^0.4.0",
+    "core-selector": "Polymer/core-selector#^0.4.0",
+    "core-toolbar": "Polymer/core-toolbar#^0.4.0",
+    "font-roboto": "Polymer/font-roboto#^0.4.0",
+    "paper-icon-button": "Polymer/paper-icon-button#^0.4.0",
+    "paper-ripple": "Polymer/paper-ripple#^0.4.0"
+  },
+  "homepage": "https://github.com/Polymer/paper-tabs",
+  "version": "0.4.1",
+  "_release": "0.4.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.4.1",
+    "commit": "c4ab5a81bd0c9bf96f9d24eb45b53a31910f210f"
+  },
+  "_source": "git://github.com/Polymer/paper-tabs.git",
+  "_target": "~0.4.0",
+  "_originalSource": "Polymer/paper-tabs"
+}
\ No newline at end of file
--- a/bower_components/paper-tabs/README.md
+++ b/bower_components/paper-tabs/README.md
+paper-tabs
+============
+
+See the [component page](http://www.polymer-project.org/docs/elements/paper-elements.html#paper-tabs) for more information.
--- a/bower_components/paper-tabs/bower.json
+++ b/bower_components/paper-tabs/bower.json
+{
+  "name": "paper-tabs",
+  "private": true,
+  "dependencies": {
+    "core-icons": "Polymer/core-icons#^0.4.0",
+    "core-selector": "Polymer/core-selector#^0.4.0",
+    "core-toolbar": "Polymer/core-toolbar#^0.4.0",
+    "font-roboto": "Polymer/font-roboto#^0.4.0",
+    "paper-icon-button": "Polymer/paper-icon-button#^0.4.0",
+    "paper-ripple": "Polymer/paper-ripple#^0.4.0"
+  }
+}
\ No newline at end of file
--- a/bower_components/paper-tabs/demo.html
+++ b/bower_components/paper-tabs/demo.html
+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<!doctype html>
+<html>
+<head>
+  <title>paper-tabs</title>
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
+  <script src="../platform/platform.js"></script>
+  
+  <link rel="import" href="../core-icons/core-icons.html">
+  <link rel="import" href="paper-tabs.html">
+  <link rel="import" href="../core-toolbar/core-toolbar.html">
+  <link rel="import" href="../paper-icon-button/paper-icon-button.html">
+  <link rel="import" href="../font-roboto/roboto.html">
+  
+  <style shim-shadowdom>
+  
+    body {
+      font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
+      margin: 0;
+      padding: 24px;
+      color: #333;
+      -webkit-user-select: none;
+      -moz-user-select: none;
+      -ms-user-select: none;
+      user-select: none;
+      -webkit-tap-highlight-color: rgba(0,0,0,0);
+      -webkit-touch-callout: none;
+    }
+    
+    paper-tabs, core-toolbar {
+      background-color: #00bcd4;
+      color: #fff;
+      box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.2);
+    }
+    
+    core-toolbar paper-tabs {
+      box-shadow: none;
+    }
+    
+    paper-tabs[noink][nobar] paper-tab.core-selected {
+      color: #ffff8d;
+    }
+    
+    paper-tabs.transparent-teal {
+      background-color: transparent;
+      color: #00bcd4;
+      box-shadow: none;
+    }
+    
+    paper-tabs.transparent-teal::shadow #selectionBar {
+      background-color: #00bcd4;
+    }
+    
+    paper-tabs.transparent-teal paper-tab::shadow #ink {
+      color: #00bcd4;
+    }
+    
+    h3 {
+      font-size: 16px;
+      font-weight: 400;
+    }
+    
+  </style>
+  
+</head>
+<body unresolved>
+
+  <h3>A. No ink effect and no sliding bar</h3>
+  
+  <paper-tabs selected="0" noink nobar>
+  
+    <paper-tab>ITEM ONE</paper-tab>
+    <paper-tab>ITEM TWO</paper-tab>
+    <paper-tab>ITEM THREE</paper-tab>
+    
+  </paper-tabs>
+  
+  <br>
+  <br>
+
+  <h3>B. The bar slides to the selected tab</h3>
+  
+  <paper-tabs selected="0" noink>
+  
+    <paper-tab>ITEM ONE</paper-tab>
+    <paper-tab>ITEM TWO</paper-tab>
+    <paper-tab>ITEM THREE</paper-tab>
+    
+  </paper-tabs>
+  
+  <br>
+  <br>
+  
+  <h3>C. Inky Tabs</h3>
+  
+  <paper-tabs selected="0">
+  
+    <paper-tab>ITEM ONE</paper-tab>
+    <paper-tab>ITEM TWO</paper-tab>
+    <paper-tab>ITEM THREE</paper-tab>
+    
+  </paper-tabs>
+  
+  <br>
+  <br>
+  
+  <paper-tabs selected="0" class="transparent-teal">
+  
+    <paper-tab>ITEM ONE</paper-tab>
+    <paper-tab>ITEM TWO</paper-tab>
+    <paper-tab>ITEM THREE</paper-tab>
+    
+  </paper-tabs>
+  
+  <br>
+  <br>
+  
+  <core-toolbar class="medium-tall">
+  
+    <paper-icon-button icon="menu"></paper-icon-button>
+    <div flex>Title</div>
+    <paper-icon-button icon="search"></paper-icon-button>
+    <paper-icon-button icon="more-vert"></paper-icon-button>
+    
+    <div class="bottom fit" horizontal layout>
+    
+      <paper-tabs selected="0" flex style="max-width: 600px;">
+    
+        <paper-tab>ITEM ONE</paper-tab>
+        <paper-tab>ITEM TWO</paper-tab>
+        <paper-tab>ITEM THREE</paper-tab>
+        
+      </paper-tabs>
+      
+    </div>
+  
+  </core-toolbar>
+  
+  <br>
+  <br>
+  
+  <core-toolbar class="tall">
+  
+    <paper-tabs selected="0" class="bottom indent" style="width: 200px;" self-end>
+  
+      <paper-tab>ITEM ONE</paper-tab>
+      <paper-tab>ITEM TWO</paper-tab>
+      
+    </paper-tabs>
+    
+    <div class="bottom" flex></div>
+    
+    <paper-icon-button class="bottom" icon="search"></paper-icon-button>
+      
+  </core-toolbar>
+  
+</body>
+</html>
--- a/bower_components/paper-tabs/index.html
+++ b/bower_components/paper-tabs/index.html
+<!doctype html>
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE
+The complete set of authors may be found at http://polymer.github.io/AUTHORS
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS
+-->
+<html>
+<head>
+
+  <script src="../platform/platform.js"></script>
+  <link rel="import" href="../core-component-page/core-component-page.html">
+
+</head>
+<body unresolved>
+
+  <core-component-page sources='["paper-tabs.html", "paper-tab.html"]'></core-component-page>
+
+</body>
+</html>
--- a/bower_components/paper-tabs/metadata.html
+++ b/bower_components/paper-tabs/metadata.html
+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<x-meta id="paper-tabs" label="Tabs" group="Paper" isContainer>
+
+  <template>
+    <paper-tabs selected="0" style="width: 480px; background-color: #00bcd4; color: #fff; box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.2);">
+      <paper-tab>ITEM ONE</paper-tab>
+      <paper-tab>ITEM TWO</paper-tab>
+      <paper-tab>ITEM THREE</paper-tab>
+      <paper-tab>ITEM FOUR</paper-tab>
+      <paper-tab>ITEM FIVE</paper-tab>
+    </paper-tabs>
+  </template>
+  
+  <template id="imports">
+    <link rel="import" href="paper-tabs.html">
+  </template>
+  
+</x-meta>
+
+
+<x-meta id="paper-tab" label="Tab" group="Paper">
+
+  <template>
+    <paper-tab style="width: 120px; height: 40px;">TAB</paper-tab>
+  </template>
+  
+  <template id="imports">
+    <link rel="import" href="paper-tab.html">
+  </template>
+  
+</x-meta>
+
+<x-meta id="paper-tab-panel" label="Panel with Tabs" group="Paper" isContainer>
+
+	<template>
+		<section layout vertical style="width:420px;height:630px;border:5px solid #ccc;">
+      <paper-tabs selected="0" noink nobar style="background-color:#00bcd4; color:#fff;box-shadow:0px 3px 2px rgba(0, 0, 0, 0.2);">
+        <paper-tab>ITEM ONE</paper-tab>
+        <paper-tab>ITEM TWO</paper-tab>
+      </paper-tabs>
+      <section flex relative>
+      </section>
+		</section>
+	</template>
+
+  <template id="imports">
+    <link rel="import" href="paper-tabs.html">
+  </template>
+
+</x-meta>
--- a/bower_components/paper-tabs/paper-tab.css
+++ b/bower_components/paper-tabs/paper-tab.css
+/*
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/
+
+:host {
+  display: block;
+  position: relative;
+  overflow: hidden;
+}
+
+#tabContainer {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+.tab-content {
+  transition: opacity .1s cubic-bezier(0.4, 0.0, 1, 1), color .1s cubic-bezier(0.4, 0.0, 1, 1);
+  cursor: default;
+  pointer-events: none;
+}
+
+:host(:not(.core-selected)) .tab-content {
+  opacity: 0.6;
+}
+
+#ink {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  color: #ffff8d;
+}
+
+:host[noink] #ink {
+  pointer-events: none;
+}
+
+:host-context(paper-tabs[noink]) #ink {
+  pointer-events: none;
+}
--- a/bower_components/paper-tabs/paper-tab.html
+++ b/bower_components/paper-tabs/paper-tab.html
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<!--
+`paper-tab` is styled to look like a tab.  It should be used in conjunction with
+`paper-tabs`.
+
+Example:
+
+    <paper-tabs selected="0">
+      <paper-tab>TAB 1</paper-tab>
+      <paper-tab>TAB 2</paper-tab>
+      <paper-tab>TAB 3</paper-tab>
+    </paper-tabs>
+    
+Styling tab:
+
+To change the ink color:
+
+    .pink paper-tab::shadow #ink {
+      color: #ff4081;
+    }
+
+@group Paper Elements
+@element paper-tab
+@homepage github.io
+-->
+
+<link rel="import" href="../paper-ripple/paper-ripple.html">
+
+<polymer-element name="paper-tab" attributes="noink" role="tab">
+<template>
+
+  <link rel="stylesheet" href="paper-tab.css">
+  
+  <div id="tabContainer" center-justified center horizontal layout>
+  
+    <div class="tab-content"><content></content></div>
+    <paper-ripple id="ink" initialOpacity="0.95" opacityDecayVelocity="0.98"></paper-ripple>
+    
+  </div>
+  
+</template>
+<script>
+
+  Polymer('paper-tab', {
+    
+    /**
+     * If true, ink ripple effect is disabled.
+     *
+     * @attribute noink
+     * @type boolean
+     * @default false
+     */
+    noink: false
+    
+  });
+  
+</script>
+</polymer-element>
--- a/bower_components/paper-tabs/paper-tabs.css
+++ b/bower_components/paper-tabs/paper-tabs.css
+/*
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/
+
+:host {
+  display: block;
+  position: relative;
+  font-size: 14px;
+  font-weight: 500;
+  height: 48px;
+  overflow: hidden;
+}
+
+#tabsContainer {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  white-space: nowrap;
+}
+
+#selectionBar {
+  position: absolute;
+  height: 2px;
+  bottom: 0;
+  left: 0;
+  width: 0;
+  background-color: #ffff8d;
+  transition: width, left;
+}
+
+#selectionBar[hidden] {
+  display: hidden;
+}
+
+#selectionBar.expand {
+  transition-duration: 0.15s;
+  transition-timing-function: cubic-bezier(0.4, 0.0, 1, 1);
+}
+
+#selectionBar.contract {
+  transition-duration: 0.18s;
+  transition-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
+}
+
+polyfill-next-selector { content: '#tabsContainer > *:not(#selectionBar)'; }
+::content > * {
+  -ms-flex: 1;
+  -webkit-flex: 1;
+  flex: 1;
+}
--- a/bower_components/paper-tabs/paper-tabs.html
+++ b/bower_components/paper-tabs/paper-tabs.html
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<!--
+`paper-tabs` is a `core-selector` styled to look like tabs. Tabs make it easy to 
+explore and switch between different views or functional aspects of an app, or 
+to browse categorized data sets.
+
+Use `selected` property to get or set the selected tab.
+
+Example:
+
+    <paper-tabs selected="0">
+      <paper-tab>TAB 1</paper-tab>
+      <paper-tab>TAB 2</paper-tab>
+      <paper-tab>TAB 3</paper-tab>
+    </paper-tabs>
+
+See <a href="#paper-tab">paper-tab</a> for more information about 
+`paper-tab`.
+
+Styling tabs:
+
+To change the sliding bar color:
+
+    paper-tabs.pink::shadow #selectionBar {
+      background-color: #ff4081;
+    }
+
+@group Paper Elements
+@element paper-tabs
+@extends core-selector
+@homepage github.io
+-->
+
+<link rel="import" href="../core-selector/core-selector.html">
+<link rel="import" href="paper-tab.html">
+
+<polymer-element name="paper-tabs" extends="core-selector" attributes="noink nobar" role="tablist">
+<template>
+
+  <link rel="stylesheet" href="paper-tabs.css">
+  
+  <div id="tabsContainer" horizontal layout>
+  
+    <shadow></shadow>
+    <div id="selectionBar" hidden?="{{nobar}}" on-transitionend="{{barTransitionEnd}}"></div>
+    
+  </div>
+    
+</template>
+<script>
+
+  Polymer('paper-tabs', {
+    
+    /**
+     * If true, ink effect is disabled.
+     *
+     * @attribute noink
+     * @type boolean
+     * @default false
+     */
+    noink: false,
+    
+    /**
+     * If true, the bottom bar to indicate the selected tab will not be shown.
+     *
+     * @attribute nobar
+     * @type boolean
+     * @default false
+     */
+    nobar: false,
+    
+    activateEvent: 'down',
+    
+    nostretch: false,
+    
+    selectedIndexChanged: function(old) {
+      var s = this.$.selectionBar.style;
+      
+      if (!this.selectedItem) {
+        s.width = 0;
+        s.left = 0;
+        return;
+      } 
+      
+      var w = 100 / this.items.length;
+      
+      if (this.nostretch || old === null || old === -1) {
+        s.width = w + '%';
+        s.left = this.selectedIndex * w + '%';
+        return;
+      }
+      
+      var m = 5;
+      this.$.selectionBar.classList.add('expand');
+      if (old < this.selectedIndex) {
+        s.width = w + w * (this.selectedIndex - old) - m + '%';
+        this._transitionCounter = 1;
+      } else {
+        s.width = w + w * (old - this.selectedIndex) - m + '%';
+        s.left = this.selectedIndex * w + m + '%';
+        this._transitionCounter = 2;
+      }
+    },
+    
+    barTransitionEnd: function(e) {
+      this._transitionCounter--;
+      var cl = this.$.selectionBar.classList;
+      if (cl.contains('expand') && !this._transitionCounter) {
+        cl.remove('expand');
+        cl.add('contract');
+        var s = this.$.selectionBar.style;
+        var w = 100 / this.items.length;
+        s.width = w + '%';
+        s.left = this.selectedIndex * w + '%';
+      } else if (cl.contains('contract')) {
+        cl.remove('contract');
+      }
+    }
+    
+  });
+  
+</script>
+</polymer-element>
--- a/bower_components/platform/platform.js
+++ b/bower_components/platform/platform.js
--- a/bower_components/polymer/.bower.json
+++ b/bower_components/polymer/.bower.json
+{
+  "name": "polymer",
+  "private": true,
+  "dependencies": {
+    "platform": "Polymer/platform#^0.4.0",
+    "core-component-page": "Polymer/core-component-page#^0.4.0"
+  },
+  "homepage": "https://github.com/Polymer/polymer",
+  "version": "0.4.1",
+  "_release": "0.4.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.4.1",
+    "commit": "c0c8865f5a8f51d48712621f222ac97f00427f66"
+  },
+  "_source": "git://github.com/Polymer/polymer.git",
+  "_target": "^0.4.0",
+  "_originalSource": "Polymer/polymer"
+}
\ No newline at end of file
--- a/bower_components/polymer/README.md
+++ b/bower_components/polymer/README.md
+# Polymer
+
+[![Analytics](https://ga-beacon.appspot.com/UA-39334307-2/Polymer/polymer/README)](https://github.com/igrigorik/ga-beacon)
+
+Build Status: [http://build.chromium.org/p/client.polymer/waterfall](http://build.chromium.org/p/client.polymer/waterfall)
+
+## Brief Overview
+
+For more detailed info goto [http://polymer-project.org/](http://polymer-project.org/).
+
+Polymer is a new type of library for the web, designed to leverage the existing browser infrastructure to provide the encapsulation and extendability currently only available in JS libraries.
+
+Polymer is based on a set of future technologies, including [Shadow DOM](https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html), [Custom Elements](https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/custom/index.html) and Model Driven Views. Currently these technologies are implemented as polyfills or shims, but as browsers adopt these features natively, the platform code that drives Polymer evacipates, leaving only the value-adds.
+
+## Tools & Testing
+
+For running tests or building minified files, consult the [tooling information](http://www.polymer-project.org/resources/tooling-strategy.html).
--- a/bower_components/polymer/bower.json
+++ b/bower_components/polymer/bower.json
+{
+  "name": "polymer",
+  "private": true,
+  "dependencies": {
+    "platform": "Polymer/platform#^0.4.0",
+    "core-component-page": "Polymer/core-component-page#^0.4.0"
+  }
+}
\ No newline at end of file
--- a/bower_components/polymer/build.log
+++ b/bower_components/polymer/build.log
+BUILD LOG
+---------
+Build Time: 2014-09-18T12:47:15
+
+NODEJS INFORMATION
+==================
+nodejs: v0.10.32
+chai: 1.9.1
+grunt: 0.4.5
+grunt-audit: 0.0.3
+grunt-concat-sourcemap: 0.4.3
+grunt-contrib-concat: 0.4.0
+grunt-contrib-uglify: 0.5.1
+grunt-karma: 0.8.3
+grunt-string-replace: 0.2.7
+karma: 0.12.23
+karma-crbot-reporter: 0.0.4
+karma-ie-launcher: 0.1.5
+karma-mocha: 0.1.9
+karma-firefox-launcher: 0.1.3
+karma-safari-launcher: 0.1.1
+karma-script-launcher: 0.1.0
+mocha: 1.21.4
+
+REPO REVISIONS
+==============
+polymer-expressions: a1c43d70986be0031206b68f3e17cbf11dbc56e2
+polymer-gestures: 1257576a2fe1d7bb507b0c491d30b464eb03311e
+polymer-dev: 1d45ec8e7de4495d26610f2dd73b81bfad2a381f
+
+BUILD HASHES
+============
+build/polymer.js: c80909695c132ccf1700bae8e9c51e78ede0cc74
\ No newline at end of file
--- a/bower_components/polymer/layout.html
+++ b/bower_components/polymer/layout.html
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<style shim-shadowdom>
+/*******************************
+          Flex Layout
+*******************************/
+
+html /deep/ [layout][horizontal], html /deep/ [layout][vertical] {
+  display: -ms-flexbox;
+  display: -webkit-flex;
+  display: flex;
+}
+
+html /deep/ [layout][horizontal][inline], html /deep/ [layout][vertical][inline] {
+  display: -ms-inline-flexbox;
+  display: -webkit-inline-flex;
+  display: inline-flex;
+}
+
+html /deep/ [layout][horizontal] {
+  -ms-flex-direction: row;
+  -webkit-flex-direction: row;
+  flex-direction: row;
+}
+
+html /deep/ [layout][horizontal][reverse] {
+  -ms-flex-direction: row-reverse;
+  -webkit-flex-direction: row-reverse;
+  flex-direction: row-reverse;
+}
+
+html /deep/ [layout][vertical] {
+  -ms-flex-direction: column;
+  -webkit-flex-direction: column;
+  flex-direction: column;
+}
+
+html /deep/ [layout][vertical][reverse] {
+  -ms-flex-direction: column-reverse;
+  -webkit-flex-direction: column-reverse;
+  flex-direction: column-reverse;
+}
+
+html /deep/ [layout][wrap] {
+  -ms-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  flex-wrap: wrap;
+}
+
+html /deep/ [layout][wrap-reverse] {
+  -ms-flex-wrap: wrap-reverse;
+  -webkit-flex-wrap: wrap-reverse;
+  flex-wrap: wrap-reverse;
+}
+
+html /deep/ [flex] {
+  -ms-flex: 1 1 0.000000001px;
+  -webkit-flex: 1;
+  flex: 1;
+  -webkit-flex-basis: 0.000000001px;
+  flex-basis: 0.000000001px;
+}
+
+html /deep/ [vertical][layout] > [flex][auto-vertical], html /deep/ [vertical][layout]::shadow [flex][auto-vertical] {
+  -ms-flex: 1 1 auto;
+  -webkit-flex-basis: auto;
+  flex-basis: auto;
+}
+
+html /deep/ [flex][auto] {
+  -ms-flex: 1 1 auto;
+  -webkit-flex-basis: auto;
+  flex-basis: auto;
+}
+
+html /deep/ [flex][none] {
+  -ms-flex: none;
+  -webkit-flex: none;
+  flex: none;
+}
+
+html /deep/ [flex][one] {
+  -ms-flex: 1;
+  -webkit-flex: 1;
+  flex: 1;
+}
+
+html /deep/ [flex][two] {
+  -ms-flex: 2;
+  -webkit-flex: 2;
+  flex: 2;
+}
+
+html /deep/ [flex][three] {
+  -ms-flex: 3;
+  -webkit-flex: 3;
+  flex: 3;
+}
+
+html /deep/ [flex][four] {
+  -ms-flex: 4;
+  -webkit-flex: 4;
+  flex: 4;
+}
+
+html /deep/ [flex][five] {
+  -ms-flex: 5;
+  -webkit-flex: 5;
+  flex: 5;
+}
+
+html /deep/ [flex][six] {
+  -ms-flex: 6;
+  -webkit-flex: 6;
+  flex: 6;
+}
+
+html /deep/ [flex][seven] {
+  -ms-flex: 7;
+  -webkit-flex: 7;
+  flex: 7;
+}
+
+html /deep/ [flex][eight] {
+  -ms-flex: 8;
+  -webkit-flex: 8;
+  flex: 8;
+}
+
+html /deep/ [flex][nine] {
+  -ms-flex: 9;
+  -webkit-flex: 9;
+  flex: 9;
+}
+
+html /deep/ [flex][ten] {
+  -ms-flex: 10;
+  -webkit-flex: 10;
+  flex: 10;
+}
+
+html /deep/ [flex][eleven] {
+  -ms-flex: 11;
+  -webkit-flex: 11;
+  flex: 11;
+}
+
+html /deep/ [flex][twelve] {
+  -ms-flex: 12;
+  -webkit-flex: 12;
+  flex: 12;
+}
+
+/* alignment in cross axis */
+
+html /deep/ [layout][start] {
+  -ms-flex-align: start;
+  -webkit-align-items: flex-start;
+  align-items: flex-start;
+}
+
+html /deep/ [layout][center], html /deep/ [layout][center-center] {
+  -ms-flex-align: center;
+  -webkit-align-items: center;
+  align-items: center;
+}
+
+html /deep/ [layout][end] {
+  -ms-flex-align: end;
+  -webkit-align-items: flex-end;
+  align-items: flex-end;
+}
+
+/* alignment in main axis */
+
+html /deep/ [layout][start-justified] {
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+}
+
+html /deep/ [layout][center-justified], html /deep/ [layout][center-center] {
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+}
+
+html /deep/ [layout][end-justified] {
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+html /deep/ [layout][around-justified] {
+  -ms-flex-pack: distribute;
+  -webkit-justify-content: space-around;
+  justify-content: space-around;
+}
+
+html /deep/ [layout][justified] {
+  -ms-flex-pack: justify;
+  -webkit-justify-content: space-between;
+  justify-content: space-between;
+}
+
+/* self alignment */
+
+html /deep/ [self-start] {
+  -ms-align-self: flex-start;
+  -webkit-align-self: flex-start;
+  align-self: flex-start;
+}
+
+html /deep/ [self-center] {
+  -ms-align-self: center;
+  -webkit-align-self: center;
+  align-self: center;
+}
+
+html /deep/ [self-end] {
+  -ms-align-self: flex-end;
+  -webkit-align-self: flex-end;
+  align-self: flex-end;
+}
+
+html /deep/ [self-stretch] {
+  -ms-align-self: stretch;
+  -webkit-align-self: stretch;
+  align-self: stretch;
+}
+
+/*******************************
+          Other Layout
+*******************************/
+
+html /deep/ [block] {
+  display: block;
+}
+
+/* ie support for hidden */
+html /deep/ [hidden] {
+  display: none !important;
+}
+
+html /deep/ [relative] {
+  position: relative;
+}
+
+html /deep/ [fit] {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}
+
+body[fullbleed] {
+  margin: 0;
+  height: 100vh;
+}
+
+/*******************************
+            Other
+*******************************/
+
+html /deep/ [segment], html /deep/ segment {
+  display: block;
+  position: relative;
+  -webkit-box-sizing: border-box;
+  -ms-box-sizing: border-box;
+  box-sizing: border-box;
+  margin: 1em 0.5em;
+  padding: 1em;
+  background-color: white;
+  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  border-radius: 5px 5px 5px 5px;
+}
+
+</style>
\ No newline at end of file
--- a/bower_components/polymer/polymer.html
+++ b/bower_components/polymer/polymer.html
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<link rel="import" href="layout.html">
+
+<script src="polymer.js"></script>
+<!--<link rel="import" href="../polymer-dev/polymer.html">--> 
\ No newline at end of file
--- a/bower_components/polymer/polymer.js
+++ b/bower_components/polymer/polymer.js
--- a/bower_components/polymer/polymer.js.map
+++ b/bower_components/polymer/polymer.js.map