added tests with paper-slider

2015-01-03 03:44:50 +00:00
parent e73829f73b
commit 17a752c93e
158 changed files with 9702 additions and 7 deletions
--- a/bower_components/paper-progress/.bower.json
+++ b/bower_components/paper-progress/.bower.json
@@ -0,0 +1,19 @@
+{
+  "name": "paper-progress",
+  "private": true,
+  "dependencies": {
+    "core-range": "Polymer/core-range#^0.5.0",
+    "paper-button": "Polymer/paper-button#^0.5.0"
+  },
+  "version": "0.5.2",
+  "homepage": "https://github.com/Polymer/paper-progress",
+  "_release": "0.5.2",
+  "_resolution": {
+    "type": "version",
+    "tag": "0.5.2",
+    "commit": "3dfcacf0695a23f8ab56c95f2dfa2597fc5595ab"
+  },
+  "_source": "git://github.com/Polymer/paper-progress.git",
+  "_target": "^0.5.0",
+  "_originalSource": "Polymer/paper-progress"
+}
--- a/bower_components/paper-progress/README.md
+++ b/bower_components/paper-progress/README.md
@@ -0,0 +1,4 @@
+paper-progress
+===================
+
+See the [component page](http://www.polymer-project.org/docs/elements/paper-elements.html#paper-progress) for more information.
--- a/bower_components/paper-progress/bower.json
+++ b/bower_components/paper-progress/bower.json
@@ -0,0 +1,9 @@
+{
+  "name": "paper-progress",
+  "private": true,
+  "dependencies": {
+    "core-range": "Polymer/core-range#^0.5.0",
+    "paper-button": "Polymer/paper-button#^0.5.0"
+  },
+  "version": "0.5.2"
+}
--- a/bower_components/paper-progress/demo.html
+++ b/bower_components/paper-progress/demo.html
@@ -0,0 +1,113 @@
+<!--
+    @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-progress</title>
+  
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  
+  <script src="../webcomponentsjs/webcomponents.js"></script>
+  
+  <link rel="import" href="paper-progress.html">
+  <link rel="import" href="../paper-button/paper-button.html">
+  
+  <style shim-shadowdom>
+  
+    body {
+      font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
+      margin: 0;
+      padding: 24px;
+    }
+    
+    paper-progress {
+      display: block;
+      width: 100%;
+      padding: 25px 0;
+    }
+    
+    paper-progress.pink::shadow #activeProgress {
+      background-color: #e91e63;
+    }
+    
+    paper-progress.pink::shadow #secondaryProgress {
+      background-color: #f8bbd0;
+    }
+    
+  </style>
+  
+</head>
+<body unresolved>
+
+  <paper-progress></paper-progress>
+
+  <paper-button raised onclick="startProgress();">Start</paper-button>
+  
+  <br><br><br>
+  
+  <paper-progress></paper-progress><br>
+  
+  <paper-progress value="40"></paper-progress><br>
+  
+  <paper-progress value="800" min="100" max="1000"></paper-progress><br>
+  
+  <paper-progress value="40" secondaryProgress="80"></paper-progress><br>
+  
+  <paper-progress value="200" max="200"></paper-progress><br>
+  
+  <paper-progress indeterminate></paper-progress><br>
+
+  <paper-progress class="pink" value="80"></paper-progress><br>
+  
+  <paper-progress class="pink" value="40" secondaryProgress="80"></paper-progress><br>
+  
+  <paper-progress class="pink" indeterminate></paper-progress><br>
+
+  <script>
+    
+    var progress = document.querySelector('paper-progress');
+    var button = document.querySelector('paper-button');
+    
+    var repeat, maxRepeat = 5, animating = false;
+    
+    function nextProgress() {
+      animating = true;
+      if (progress.value < progress.max) {
+        progress.value += (progress.step || 1);
+      } else {
+        if (++repeat >= maxRepeat) {
+          animating = false;
+          button.disabled = false;
+          return;
+        }
+        progress.value = progress.min;
+      }
+      progress.async(nextProgress);
+    }
+    
+    function startProgress() {
+      repeat = 0;
+      progress.value = progress.min;
+      button.disabled = true;
+      if (!animating) {
+        nextProgress();
+      }
+    }
+    
+    addEventListener('polymer-ready', function() {
+      startProgress();
+    });
+    
+  </script>
+  
+</body>
+</html>
--- a/bower_components/paper-progress/index.html
+++ b/bower_components/paper-progress/index.html
@@ -0,0 +1,22 @@
+<!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="../webcomponentsjs/webcomponents.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-progress/metadata.html
+++ b/bower_components/paper-progress/metadata.html
@@ -0,0 +1,17 @@
+<!--
+    @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-progress" label="Progress" group="Paper">
+  <template>
+    <paper-progress></paper-progress>
+  </template>
+  <template id="imports">
+    <link rel="import" href="paper-progress.html">
+  </template>
+</x-meta>
--- a/bower_components/paper-progress/paper-progress.css
+++ b/bower_components/paper-progress/paper-progress.css
@@ -0,0 +1,68 @@
+/*
+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: inline-block;
+  width: 200px;
+  height: 4px;
+}
+
+#progressContainer {
+  position: relative;
+  height: 100%;
+  background-color: #c8c8c8;
+  overflow: hidden;
+}
+
+#activeProgress,
+#secondaryProgress {
+  -webkit-transform-origin: left center;
+  transform-origin: left center;
+  -webkit-transform: scaleX(0);
+  transform: scaleX(0);
+}
+
+#activeProgress {
+  background-color: #0f9d58;
+}
+
+#secondaryProgress {
+  background-color: #87ceac;
+}
+
+#activeProgress.indeterminate {
+  -webkit-transform-origin: center center;
+  transform-origin: center center;
+  -webkit-animation: indeterminate-bar 1s linear infinite;
+  animation: indeterminate-bar 1s linear infinite;
+}
+
+@-webkit-keyframes indeterminate-bar {
+  0% {
+    -webkit-transform: translate(-50%) scaleX(0);
+  }
+  50% {
+    -webkit-transform: translate(0%) scaleX(0.3);
+  }
+  100% {
+    -webkit-transform: translate(50%) scaleX(0);
+  }
+}
+
+@keyframes indeterminate-bar {
+  0% {
+    transform: translate(-50%) scaleX(0);
+  }
+  50% {
+    transform: translate(0%) scaleX(0.3);
+  }
+  100% {
+    transform: translate(50%) scaleX(0);
+  }
+}
--- a/bower_components/paper-progress/paper-progress.html
+++ b/bower_components/paper-progress/paper-progress.html
@@ -0,0 +1,124 @@
+<!--
+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
+-->
+
+<!--
+The progress bars are for situations where the percentage completed can be 
+determined. They give users a quick sense of how much longer an operation 
+will take.
+
+Example:
+
+    <paper-progress value="10"></paper-progress>
+    
+There is also a secondary progress which is useful for displaying intermediate 
+progress, such as the buffer level during a streaming playback progress bar.
+
+Example:
+
+    <paper-progress value="10" secondaryProgesss="30"></paper-progress>
+
+Styling progress bar:
+
+To change the active progress bar color:
+
+    paper-progress::shadow #activeProgress {
+      background-color: #e91e63;
+    }
+
+To change the secondary progress bar color:
+
+    paper-progress::shadow #secondaryProgress {
+      background-color: #f8bbd0;
+    }
+    
+To change the progress bar background color:
+
+    paper-progress::shadow #progressContainer {
+      background-color: #64ffda;
+    }
+
+@group Paper Elements
+@element paper-progress
+@extends core-range
+@homepage github.io
+-->
+
+<link rel="import" href="../core-range/core-range.html">
+
+<polymer-element name="paper-progress" extends="core-range" attributes="secondaryProgress indeterminate">
+
+  <template>
+  
+    <link rel="stylesheet" href="paper-progress.css">
+  
+    <div id="progressContainer" role="progressbar" aria-valuenow="{{value}}" aria-valuemin="{{min}}" aria-valuemax="{{max}}">
+    
+      <div id="secondaryProgress" fit></div>
+      <div id="activeProgress" fit></div>
+      
+    </div>
+    
+  </template>
+  
+  <script>
+  
+    Polymer('paper-progress', {
+      
+      /**
+       * The number that represents the current secondary progress.
+       *
+       * @attribute secondaryProgress
+       * @type number
+       * @default 0
+       */
+      secondaryProgress: 0,
+      
+      /**
+       * Use an indeterminate progress indicator.
+       *
+       * @attribute indeterminate
+       * @type boolean
+       * @default false
+       */
+      indeterminate: false,
+
+      step: 0,
+      
+      observe: {
+        'value secondaryProgress min max indeterminate': 'update'
+      },
+      
+      update: function() {
+        this.super();
+        this.secondaryProgress = this.clampValue(this.secondaryProgress);
+        this.secondaryRatio = this.calcRatio(this.secondaryProgress) * 100;
+
+        // If we use attribute/class binding, the animation sometimes doesn't translate properly
+        // on Safari 7.1. So instead, we toggle the class here in the update method.
+        this.$.activeProgress.classList.toggle('indeterminate', this.indeterminate);
+      },
+
+      transformProgress: function(progress, ratio) {
+        var transform = 'scaleX(' + (ratio / 100) + ')';
+        progress.style.transform = progress.style.webkitTransform = transform;
+      },
+
+      ratioChanged: function() {
+        this.transformProgress(this.$.activeProgress, this.ratio);
+      },
+
+      secondaryRatioChanged: function() {
+        this.transformProgress(this.$.secondaryProgress, this.secondaryRatio);
+      }
+      
+    });
+    
+  </script>
+  
+</polymer-element>