added tests with paper-slider
This commit is contained in:
21
bower_components/paper-shadow/.bower.json
vendored
Normal file
21
bower_components/paper-shadow/.bower.json
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
{
|
||||
"name": "paper-shadow",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#^0.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"web-component-tester": "Polymer/web-component-tester#^1.1.4"
|
||||
},
|
||||
"version": "0.5.2",
|
||||
"homepage": "https://github.com/Polymer/paper-shadow",
|
||||
"_release": "0.5.2",
|
||||
"_resolution": {
|
||||
"type": "version",
|
||||
"tag": "0.5.2",
|
||||
"commit": "93d17c572223383944db8ac5c117d492add4651c"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/paper-shadow.git",
|
||||
"_target": "^0.5.0",
|
||||
"_originalSource": "Polymer/paper-shadow"
|
||||
}
|
||||
4
bower_components/paper-shadow/README.md
vendored
Normal file
4
bower_components/paper-shadow/README.md
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
paper-shadow
|
||||
============
|
||||
|
||||
See the [component page](http://polymer-project.org/docs/elements/paper-elements.html#paper-shadow) for more information.
|
||||
11
bower_components/paper-shadow/bower.json
vendored
Normal file
11
bower_components/paper-shadow/bower.json
vendored
Normal file
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"name": "paper-shadow",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#^0.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"web-component-tester": "Polymer/web-component-tester#^1.1.4"
|
||||
},
|
||||
"version": "0.5.2"
|
||||
}
|
||||
134
bower_components/paper-shadow/demo.html
vendored
Normal file
134
bower_components/paper-shadow/demo.html
vendored
Normal file
@@ -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>
|
||||
22
bower_components/paper-shadow/index.html
vendored
Normal file
22
bower_components/paper-shadow/index.html
vendored
Normal file
@@ -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>
|
||||
17
bower_components/paper-shadow/metadata.html
vendored
Normal file
17
bower_components/paper-shadow/metadata.html
vendored
Normal file
@@ -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-shadow" label="Shadow" group="Paper" isContainer>
|
||||
<template>
|
||||
<paper-shadow style="width:200px; height:200px;"></paper-shadow>
|
||||
</template>
|
||||
<template id="imports">
|
||||
<link rel="import" href="paper-shadow.html">
|
||||
</template>
|
||||
</x-meta>
|
||||
66
bower_components/paper-shadow/paper-shadow.css
vendored
Normal file
66
bower_components/paper-shadow/paper-shadow.css
vendored
Normal file
@@ -0,0 +1,66 @@
|
||||
/*
|
||||
* @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
|
||||
*/
|
||||
|
||||
html /deep/ paper-shadow,
|
||||
html /deep/ paper-animated-shadow {
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
html /deep/ paper-shadow::shadow #shadow-bottom,
|
||||
html /deep/ paper-shadow::shadow #shadow-top {
|
||||
border-radius: inherit;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
html /deep/ paper-shadow::shadow #shadow-bottom[animated],
|
||||
html /deep/ paper-shadow::shadow #shadow-top[animated] {
|
||||
transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-top-z-1 {
|
||||
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-bottom-z-1 {
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-top-z-2 {
|
||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.19);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-bottom-z-2 {
|
||||
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-top-z-3 {
|
||||
box-shadow: 0 17px 50px 0 rgba(0, 0, 0, 0.19);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-bottom-z-3 {
|
||||
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-top-z-4 {
|
||||
box-shadow: 0 25px 55px 0 rgba(0, 0, 0, 0.21);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-bottom-z-4 {
|
||||
box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-top-z-5 {
|
||||
box-shadow: 0 40px 77px 0 rgba(0, 0, 0, 0.22);
|
||||
}
|
||||
|
||||
html /deep/ .paper-shadow-bottom-z-5 {
|
||||
box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
86
bower_components/paper-shadow/paper-shadow.html
vendored
Normal file
86
bower_components/paper-shadow/paper-shadow.html
vendored
Normal file
@@ -0,0 +1,86 @@
|
||||
<!--
|
||||
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-shadow` is a container that renders two shadows on top of each other to
|
||||
create the effect of a lifted piece of paper.
|
||||
|
||||
Example:
|
||||
|
||||
<paper-shadow z="1">
|
||||
... card content ...
|
||||
</paper-shadow>
|
||||
|
||||
@group Paper Elements
|
||||
@class paper-shadow
|
||||
-->
|
||||
|
||||
<link href="../polymer/polymer.html" rel="import">
|
||||
|
||||
<link href="paper-shadow.css" rel="stylesheet" shim-shadowdom>
|
||||
|
||||
<polymer-element name="paper-shadow">
|
||||
|
||||
<template>
|
||||
|
||||
<div id="shadow-bottom" fit animated?="[[animated]]" class="paper-shadow-bottom-z-[[z]]"></div>
|
||||
<div id="shadow-top" fit animated?="[[animated]]" class="paper-shadow-top-z-[[z]]"></div>
|
||||
|
||||
<content></content>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
Polymer({
|
||||
|
||||
publish: {
|
||||
|
||||
/**
|
||||
* The z-depth of this shadow, from 0-5. Setting this property
|
||||
* after element creation has no effect. Use `setZ()` instead.
|
||||
*
|
||||
* @attribute z
|
||||
* @type number
|
||||
* @default 1
|
||||
*/
|
||||
z: 1,
|
||||
|
||||
/**
|
||||
* Set this to true to animate the shadow when setting a new
|
||||
* `z` value.
|
||||
*
|
||||
* @attribute animated
|
||||
* @type boolean
|
||||
* @default false
|
||||
*/
|
||||
animated: false
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Set the z-depth of the shadow. This should be used after element
|
||||
* creation instead of setting the z property directly.
|
||||
*
|
||||
* @method setZ
|
||||
* @param {Number} newZ
|
||||
*/
|
||||
setZ: function(newZ) {
|
||||
if (this.z !== newZ) {
|
||||
this.$['shadow-bottom'].classList.remove('paper-shadow-bottom-z-' + this.z);
|
||||
this.$['shadow-bottom'].classList.add('paper-shadow-bottom-z-' + newZ);
|
||||
this.$['shadow-top'].classList.remove('paper-shadow-top-z-' + this.z);
|
||||
this.$['shadow-top'].classList.add('paper-shadow-top-z-' + newZ);
|
||||
this.z = newZ;
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
||||
62
bower_components/paper-shadow/test/basic.html
vendored
Normal file
62
bower_components/paper-shadow/test/basic.html
vendored
Normal file
@@ -0,0 +1,62 @@
|
||||
<!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>
|
||||
<meta charset="UTF-8">
|
||||
<title>paper-shadow basic tests</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
||||
|
||||
<script src="../../webcomponentsjs/webcomponents.js"></script>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
<script src="../../polymer-gestures/test/js/fake.js"></script>
|
||||
|
||||
<link href="../paper-shadow.html" rel="import">
|
||||
|
||||
<style>
|
||||
.card {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<paper-shadow id="s1" class="card"></paper-shadow>
|
||||
|
||||
<paper-shadow id="s2" class="card">
|
||||
<div id="foo">hi!</div>
|
||||
</paper-shadow>
|
||||
|
||||
<script>
|
||||
|
||||
var s1 = document.getElementById('s1');
|
||||
|
||||
var fake = new Fake();
|
||||
|
||||
test('default', function() {
|
||||
assert.notEqual(getComputedStyle(s1.$['shadow-top'])['box-shadow'], 'none');
|
||||
});
|
||||
|
||||
test('shadows are pointer-events: none', function(done) {
|
||||
var foo = document.getElementById('foo');
|
||||
PolymerGestures.addEventListener(document, 'tap', function(e) {
|
||||
assert.strictEqual(e.target, foo);
|
||||
done();
|
||||
});
|
||||
fake.downOnNode(foo, function() {
|
||||
fake.upOnNode(foo);
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
24
bower_components/paper-shadow/test/index.html
vendored
Normal file
24
bower_components/paper-shadow/test/index.html
vendored
Normal file
@@ -0,0 +1,24 @@
|
||||
<!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>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
|
||||
<title>paper-shadow tests</title>
|
||||
<script src="../../web-component-tester/browser.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
WCT.loadSuites([
|
||||
'basic.html'
|
||||
]);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user