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-shadow/demo.html
+++ b/bower_components/paper-shadow/demo.html
@@ -0,0 +1,134 @@
+<!doctype html>
+<!--
+Copyright 2013 The Polymer Authors. All rights reserved.
+Use of this source code is governed by a BSD-style
+license that can be found in the LICENSE file.
+-->
+<html>
+<head>
+  <title>paper-shadow</title>
+
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+  <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
+
+  <script src="../webcomponentsjs/webcomponents.js"></script>
+  <link href="paper-shadow.html" rel="import">
+
+  <style>
+      body {
+      font-family: RobotoDraft, 'Helvetica Neue', Helvetica, Arial;
+      font-size: 14px;
+      margin: 0;
+      padding: 24px;
+      -webkit-tap-highlight-color: rgba(0,0,0,0);
+      -webkit-touch-callout: none;
+    }
+
+    section {
+      padding: 20px 0;
+    }
+
+    section > div {
+      padding: 14px;
+      font-size: 16px;
+    }
+
+    .card {
+      display: inline-block;
+      background: white;
+      box-sizing: border-box;
+      width: 100px;
+      height: 100px;
+      margin: 16px;
+      padding: 16px;
+      border-radius: 2px;
+    }
+
+    .fab {
+      display: inline-block;
+      background: white;
+      box-sizing: border-box;
+      width: 56px;
+      height: 56px;
+      margin: 16px;
+      padding: 16px;
+      border-radius: 50%;
+      text-align: center;
+    }
+
+  </style>
+</head>
+<body unresolved>
+
+<template is="auto-binding">
+
+  <section>
+
+    <div>Shadows</div>
+
+    <paper-shadow class="card" z="0">
+      z = 0
+    </paper-shadow>
+
+    <paper-shadow class="card" z="1">
+      z = 1
+    </paper-shadow>
+
+    <paper-shadow class="card" z="2">
+      z = 2
+    </paper-shadow>
+
+    <paper-shadow class="card" z="3">
+      z = 3
+    </paper-shadow>
+
+    <paper-shadow class="card" z="4">
+      z = 4
+    </paper-shadow>
+
+    <paper-shadow class="card" z="5">
+      z = 5
+    </paper-shadow>
+
+  </section>
+
+  <section on-tap="{{tapAction}}">
+
+    <div>Animated</div>
+
+    <paper-shadow class="card" z="0" animated>
+      tap
+    </paper-shadow>
+
+    <paper-shadow class="fab" z="0" animated layout center-center>
+      tap
+    </paper-shadow>
+
+  </section>
+
+</template>
+
+<script>
+
+  var scope = document.querySelector('template[is=auto-binding]');
+
+  scope.tapAction = function(e) {
+    var target = e.target;
+    if (!target.down) {
+      target.setZ(target.z + 1);
+      if (target.z === 5) {
+        target.down = true;
+      }
+    } else {
+      target.setZ(target.z - 1);
+      if (target.z === 0) {
+        target.down = false;
+      }
+    }
+  };
+
+</script>
+
+</body>
+</html>