mirror of
https://github.com/dart-lang/sdk
synced 2024-11-02 12:24:24 +00:00
[polymer] import all elements
Imports polymer-elements and polymer-ui-elements into (for now) the polymer package. This will allow us to begin to reuse the JavaScript custom elements. Notes: In an ideal world we would have some way of importing these straight from Bower, probably via Pub. However we don't have support for that. It would also be nice to have separate Pub packages, at least for polymer-elements and polymer-ui-elements (the lovely Dart ports @ http://pub.dartlang.org/packages/polymer_elements follow this pattern). However that too depends on some kind of Pub+Bower integration, as they use (at least) the convention of "components/" for dependencies instead of "packages/" or "assets/". So for now, we'll import them into package:polymer. R=sigmund@google.com Review URL: https://codereview.chromium.org//175443005 git-svn-id: https://dart.googlecode.com/svn/branches/bleeding_edge/dart@33183 260f80e4-7a28-3924-810f-c04153c831b5
This commit is contained in:
parent
45d2c5edc7
commit
bde74b4050
810 changed files with 58488 additions and 0 deletions
25
pkg/polymer/lib/elements/platform/.bower.json
Normal file
25
pkg/polymer/lib/elements/platform/.bower.json
Normal file
|
@ -0,0 +1,25 @@
|
|||
{
|
||||
"name": "platform",
|
||||
"main": "platform.js",
|
||||
"homepage": "https://github.com/Polymer/platform",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"description": "Integrate platform polyfills: load, build, test",
|
||||
"keywords": [
|
||||
"polymer",
|
||||
"web",
|
||||
"components"
|
||||
],
|
||||
"license": "BSD",
|
||||
"private": true,
|
||||
"_release": "5800a7ad75",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "5800a7ad75d3f8531ec11949a5404444d90a665e"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/platform.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/platform"
|
||||
}
|
9
pkg/polymer/lib/elements/platform/AUTHORS
Normal file
9
pkg/polymer/lib/elements/platform/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
73
pkg/polymer/lib/elements/platform/CONTRIBUTING.md
Normal file
73
pkg/polymer/lib/elements/platform/CONTRIBUTING.md
Normal file
|
@ -0,0 +1,73 @@
|
|||
# Contributing
|
||||
|
||||
Want to contribute to Polymer? Great!
|
||||
|
||||
We are more than happy to accept external contributions to the project in the form of [feedback](https://groups.google.com/forum/?fromgroups=#!forum/polymer-dev), [bug reports](../../issues), and pull requests.
|
||||
|
||||
## Contributor License Agreement
|
||||
|
||||
Before we can accept patches, there's a quick web form you need to fill out.
|
||||
|
||||
- If you're contributing as an individual (e.g. you own the intellectual property), fill out [this form](http://code.google.com/legal/individual-cla-v1.0.html).
|
||||
- If you're contributing under a company, fill out [this form](http://code.google.com/legal/corporate-cla-v1.0.html) instead.
|
||||
|
||||
This CLA asserts that contributions are owned by you and that we can license all work under our [license](LICENSE).
|
||||
|
||||
Other projects require a similar agreement: jQuery, Firefox, Apache, Node, and many more.
|
||||
|
||||
[More about CLAs](https://www.google.com/search?q=Contributor%20License%20Agreement)
|
||||
|
||||
## Initial setup
|
||||
|
||||
Here's an easy guide that should get you up and running:
|
||||
|
||||
1. Setup Grunt: `sudo npm install -g grunt-cli`
|
||||
1. Fork the project on github and pull down your copy.
|
||||
> replace the {{ username }} with your username and {{ repository }} with the repository name
|
||||
|
||||
git clone git@github.com:{{ username }}/{{ repository }}.git --recursive
|
||||
|
||||
Note the `--recursive`. This is necessary for submodules to initialize properly. If you don't do a recursive clone, you'll have to init them manually:
|
||||
|
||||
git submodule init
|
||||
git submodule update
|
||||
|
||||
Download and run the `pull-all.sh` script to install the sibling dependencies.
|
||||
|
||||
git clone git://github.com/Polymer/tools.git && tools/bin/pull-all.sh
|
||||
|
||||
1. Test your change
|
||||
> in the repo you've made changes to, run the tests:
|
||||
|
||||
cd $REPO
|
||||
npm install
|
||||
grunt test
|
||||
|
||||
1. Commit your code and make a pull request.
|
||||
|
||||
That's it for the one time setup. Now you're ready to make a change.
|
||||
|
||||
## Submitting a pull request
|
||||
|
||||
We iterate fast! To avoid potential merge conflicts, it's a good idea to pull from the main project before making a change and submitting a pull request. The easiest way to do this is setup a remote called `upstream` and do a pull before working on a change:
|
||||
|
||||
git remote add upstream git://github.com/Polymer/{{ repository }}.git
|
||||
|
||||
Then before making a change, do a pull from the upstream `master` branch:
|
||||
|
||||
git pull upstream master
|
||||
|
||||
To make life easier, add a "pull upstream" alias in your `.gitconfig`:
|
||||
|
||||
[alias]
|
||||
pu = !"git fetch origin -v; git fetch upstream -v; git merge upstream/master"
|
||||
|
||||
That will pull in changes from your forked repo, the main (upstream) repo, and merge the two. Then it's just a matter of running `git pu` before a change and pushing to your repo:
|
||||
|
||||
git checkout master
|
||||
git pu
|
||||
# make change
|
||||
git commit -a -m 'Awesome things.'
|
||||
git push
|
||||
|
||||
Lastly, don't forget to submit the pull request.
|
27
pkg/polymer/lib/elements/platform/LICENSE
Normal file
27
pkg/polymer/lib/elements/platform/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/platform/PATENTS
Normal file
23
pkg/polymer/lib/elements/platform/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
6
pkg/polymer/lib/elements/platform/README.md
Normal file
6
pkg/polymer/lib/elements/platform/README.md
Normal file
|
@ -0,0 +1,6 @@
|
|||
Platform
|
||||
========
|
||||
|
||||
Aggregated polyfills the Polymer platform.
|
||||
|
||||
[![Analytics](https://ga-beacon.appspot.com/UA-39334307-2/Polymer/platform/README)](https://github.com/igrigorik/ga-beacon)
|
16
pkg/polymer/lib/elements/platform/bower.json
Normal file
16
pkg/polymer/lib/elements/platform/bower.json
Normal file
|
@ -0,0 +1,16 @@
|
|||
{
|
||||
"name": "platform",
|
||||
"main": "platform.js",
|
||||
"homepage": "https://github.com/Polymer/platform",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"description": "Integrate platform polyfills: load, build, test",
|
||||
"keywords": [
|
||||
"polymer",
|
||||
"web",
|
||||
"components"
|
||||
],
|
||||
"license": "BSD",
|
||||
"private": true
|
||||
}
|
48
pkg/polymer/lib/elements/platform/build.log
Normal file
48
pkg/polymer/lib/elements/platform/build.log
Normal file
|
@ -0,0 +1,48 @@
|
|||
BUILD LOG
|
||||
---------
|
||||
Build Time: 2014-02-14T15:57:20
|
||||
|
||||
NODEJS INFORMATION
|
||||
==================
|
||||
nodejs: v0.10.25
|
||||
chai: 1.9.0
|
||||
grunt: 0.4.2
|
||||
grunt-audit: 0.0.2
|
||||
grunt-concat-sourcemap: 0.4.1
|
||||
grunt-contrib-concat: 0.3.0
|
||||
grunt-contrib-uglify: 0.3.2
|
||||
grunt-contrib-yuidoc: 0.5.0
|
||||
grunt-karma: 0.6.2
|
||||
karma: 0.10.9
|
||||
karma-chrome-launcher: 0.1.2
|
||||
karma-coffee-preprocessor: 0.1.2
|
||||
karma-crbot-reporter: 0.0.4
|
||||
karma-firefox-launcher: 0.1.3
|
||||
karma-html2js-preprocessor: 0.1.0
|
||||
karma-ie-launcher: 0.1.1
|
||||
karma-jasmine: 0.1.5
|
||||
karma-mocha: 0.1.1
|
||||
karma-phantomjs-launcher: 0.1.2
|
||||
karma-requirejs: 0.2.1
|
||||
karma-safari-launcher: 0.1.1
|
||||
karma-script-launcher: 0.1.0
|
||||
mocha: 1.17.1
|
||||
requirejs: 2.1.10
|
||||
|
||||
REPO REVISIONS
|
||||
==============
|
||||
CustomElements: 18efac1ed0fa054536a9efae2ddea678ddb986b1
|
||||
HTMLImports: 69486ed9670afe6da872ed673e8a8d0448db16a8
|
||||
NodeBind: eb5ee7941f712cbee755da24ab7553e2d90fb99d
|
||||
PointerEvents: 1d551ce7af420577f150f5c922fc54b97f04c84d
|
||||
PointerGestures: 0cded24896294ebecdfdad47583468f714a0a34e
|
||||
ShadowDOM: 308a7c2e67032f746b5e52f4e27320ffe3a57ecd
|
||||
TemplateBinding: 279934127f6777bdfb9f752e98eb0da172fbca1b
|
||||
WeakMap: a0947a9a0f58f5733f464755c3b86de624b00a5d
|
||||
observe-js: 3ba9aeec73f7864d519fb13c6f38cb10923cdfd9
|
||||
platform: 6460c3d51b30b50d311eb1d7b055f29affa26f74
|
||||
polymer-expressions: 470cced7cf167bd164f0b924ceb088dd7a8240b9
|
||||
|
||||
BUILD HASHES
|
||||
============
|
||||
build/platform.js: d0831d90d53d03c34a5382fdace5432599c97850
|
38
pkg/polymer/lib/elements/platform/platform.js
Normal file
38
pkg/polymer/lib/elements/platform/platform.js
Normal file
File diff suppressed because one or more lines are too long
1
pkg/polymer/lib/elements/platform/platform.js.map
Normal file
1
pkg/polymer/lib/elements/platform/platform.js.map
Normal file
File diff suppressed because one or more lines are too long
17
pkg/polymer/lib/elements/polymer-ajax/.bower.json
Normal file
17
pkg/polymer/lib/elements/polymer-ajax/.bower.json
Normal file
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "polymer-ajax",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
},
|
||||
"homepage": "https://github.com/Polymer/polymer-ajax",
|
||||
"_release": "b650628b4b",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "b650628b4b281c1673e4dfde3ee5bbeb2524e8e4"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-ajax.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-ajax"
|
||||
}
|
9
pkg/polymer/lib/elements/polymer-ajax/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-ajax/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
1
pkg/polymer/lib/elements/polymer-ajax/CONTRIBUTING.md
Normal file
1
pkg/polymer/lib/elements/polymer-ajax/CONTRIBUTING.md
Normal file
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-ajax/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-ajax/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-ajax/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-ajax/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
7
pkg/polymer/lib/elements/polymer-ajax/bower.json
Normal file
7
pkg/polymer/lib/elements/polymer-ajax/bower.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"name": "polymer-ajax",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
}
|
||||
}
|
30
pkg/polymer/lib/elements/polymer-ajax/demo.html
Normal file
30
pkg/polymer/lib/elements/polymer-ajax/demo.html
Normal file
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer-ajax</title>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="polymer-ajax.html">
|
||||
</head>
|
||||
<body>
|
||||
<polymer-ajax auto url="http://gdata.youtube.com/feeds/api/videos/"
|
||||
params='{"alt":"json", "q":"chrome"}'
|
||||
handleAs="json"></polymer-ajax>
|
||||
|
||||
<template repeat="{{response.feed.entry}}">
|
||||
<div>{{title.$t}}</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
document.addEventListener('polymer-ready', function() {
|
||||
var ajax = document.querySelector("polymer-ajax");
|
||||
ajax.addEventListener("polymer-response",
|
||||
function(e) {
|
||||
document.querySelector('template').model = {
|
||||
response: e.detail.response
|
||||
};
|
||||
}
|
||||
);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
245
pkg/polymer/lib/elements/polymer-ajax/docs.json
Normal file
245
pkg/polymer/lib/elements/polymer-ajax/docs.json
Normal file
|
@ -0,0 +1,245 @@
|
|||
{
|
||||
"project": {
|
||||
"name": "Docs",
|
||||
"description": "Docs"
|
||||
},
|
||||
"files": {
|
||||
"..\\..\\polymer-ajax\\polymer-ajax.html": {
|
||||
"name": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"modules": {
|
||||
"Polymer Elements": 1
|
||||
},
|
||||
"classes": {
|
||||
"polymer-ajax": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
},
|
||||
"..\\..\\polymer-ajax\\polymer-xhr.html": {
|
||||
"name": "..\\..\\polymer-ajax\\polymer-xhr.html",
|
||||
"modules": {},
|
||||
"classes": {
|
||||
"polymer-xhr": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
}
|
||||
},
|
||||
"modules": {
|
||||
"Polymer Elements": {
|
||||
"name": "Polymer Elements",
|
||||
"submodules": {},
|
||||
"classes": {
|
||||
"polymer-ajax": 1,
|
||||
"polymer-xhr": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {},
|
||||
"tag": "module",
|
||||
"file": "..\\..\\polymer-ajax\\polymer-xhr.html",
|
||||
"line": 10
|
||||
}
|
||||
},
|
||||
"classes": {
|
||||
"polymer-ajax": {
|
||||
"name": "polymer-ajax",
|
||||
"shortname": "polymer-ajax",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Polymer Elements",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 10,
|
||||
"description": "polymer-ajax can be used to perform XMLHttpRequests.\n\nExample:\n\n <polymer-ajax auto url=\"http://gdata.youtube.com/feeds/api/videos/\" \n params='{\"alt\":\"json\", \"q\":\"chrome\"}'\n handleAs=\"json\"\n on-polymer-response=\"{{handleResponse}}\">\n </polymer-ajax>"
|
||||
},
|
||||
"polymer-xhr": {
|
||||
"name": "polymer-xhr",
|
||||
"shortname": "polymer-xhr",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Polymer Elements",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-ajax\\polymer-xhr.html",
|
||||
"line": 10,
|
||||
"description": "polymer-xhr can be used to perform XMLHttpRequests.\n\nExample:\n\n <polymer-xhr id=\"xhr\"></polymer-xhr>\n ...\n this.$.xhr.request({url: url, params: params, callback: callback});"
|
||||
}
|
||||
},
|
||||
"classitems": [
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 23,
|
||||
"description": "Fired when a response is received.",
|
||||
"itemtype": "event",
|
||||
"name": "polymer-response",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 28,
|
||||
"description": "Fired when an error is received.",
|
||||
"itemtype": "event",
|
||||
"name": "polymer-error",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 33,
|
||||
"description": "Fired whenever a response or an error is received.",
|
||||
"itemtype": "event",
|
||||
"name": "polymer-complete",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 45,
|
||||
"description": "The URL target of the request.",
|
||||
"itemtype": "attribute",
|
||||
"name": "url",
|
||||
"type": "string",
|
||||
"default": "''",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 53,
|
||||
"description": "Specifies what data to store in the 'response' property, and\nto deliver as 'event.response' in 'response' events.\n\nOne of:\n\n `text`: uses XHR.responseText\n \n `xml`: uses XHR.responseXML\n \n `json`: uses XHR.responseText parsed as JSON",
|
||||
"itemtype": "attribute",
|
||||
"name": "handleAs",
|
||||
"type": "string",
|
||||
"default": "'text'",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 70,
|
||||
"description": "If true, automatically performs an Ajax request when either url or params has changed.",
|
||||
"itemtype": "attribute",
|
||||
"name": "auto",
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 78,
|
||||
"description": "Parameters to send to the specified URL, as JSON.",
|
||||
"itemtype": "attribute",
|
||||
"name": "params",
|
||||
"type": "string (JSON)",
|
||||
"default": "''",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 86,
|
||||
"description": "Returns the response object.",
|
||||
"itemtype": "attribute",
|
||||
"name": "response",
|
||||
"type": "Object",
|
||||
"default": "null",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 94,
|
||||
"description": "The HTTP method to use such as 'GET', 'POST', 'PUT', 'DELETE'.\nDefault is 'GET'.",
|
||||
"itemtype": "attribute",
|
||||
"name": "method",
|
||||
"type": "string",
|
||||
"default": "''",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-ajax.html",
|
||||
"line": 172,
|
||||
"description": "Performs an Ajax request to the url specified.",
|
||||
"itemtype": "method",
|
||||
"name": "go",
|
||||
"class": "polymer-ajax",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-ajax\\polymer-xhr.html",
|
||||
"line": 59,
|
||||
"description": "Sends a HTTP request to the server and returns the XHR object.",
|
||||
"itemtype": "method",
|
||||
"name": "request",
|
||||
"params": [
|
||||
{
|
||||
"name": "inOptions",
|
||||
"description": "",
|
||||
"type": "Object",
|
||||
"props": [
|
||||
{
|
||||
"name": "url",
|
||||
"description": "The url to which the request is sent.",
|
||||
"type": "String"
|
||||
},
|
||||
{
|
||||
"name": "method",
|
||||
"description": "The HTTP method to use, default is GET.",
|
||||
"type": "String"
|
||||
},
|
||||
{
|
||||
"name": "sync",
|
||||
"description": "By default, all requests are sent asynchronously.\n To send synchronous requests, set to true.",
|
||||
"type": "Boolean"
|
||||
},
|
||||
{
|
||||
"name": "params",
|
||||
"description": "Data to be sent to the server.",
|
||||
"type": "Object"
|
||||
},
|
||||
{
|
||||
"name": "body",
|
||||
"description": "The content for the request body for POST method.",
|
||||
"type": "Object"
|
||||
},
|
||||
{
|
||||
"name": "headers",
|
||||
"description": "HTTP request headers.",
|
||||
"type": "Object"
|
||||
},
|
||||
{
|
||||
"name": "responseType",
|
||||
"description": "The response type. Default is 'text'.",
|
||||
"type": "String"
|
||||
},
|
||||
{
|
||||
"name": "callback",
|
||||
"description": "Called when request is completed.",
|
||||
"type": "Object"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"return": {
|
||||
"description": "XHR object.",
|
||||
"type": "Object"
|
||||
},
|
||||
"class": "polymer-xhr",
|
||||
"module": "Polymer Elements"
|
||||
}
|
||||
],
|
||||
"warnings": [
|
||||
{
|
||||
"message": "replacing incorrect tag: returns with return",
|
||||
"line": " ..\\..\\polymer-ajax\\polymer-xhr.html:59"
|
||||
}
|
||||
]
|
||||
}
|
64
pkg/polymer/lib/elements/polymer-ajax/index.html
Normal file
64
pkg/polymer/lib/elements/polymer-ajax/index.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer api</title>
|
||||
<style>
|
||||
html, body {
|
||||
font-family: Arial, sans-serif;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
[noviewer] [ifnoviewer] {
|
||||
display: block;
|
||||
}
|
||||
[detector], [ifnoviewer], [noviewer] [ifviewer] {
|
||||
display: none;
|
||||
}
|
||||
[ifviewer], [ifnoviewer] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
iframe {
|
||||
border: none;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#remote {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="../polymer-home-page/polymer-home-page.html">
|
||||
</head>
|
||||
<body>
|
||||
<img detector src="../polymer-home-page/bowager-logo.png" onerror="noviewer()">
|
||||
<polymer-home-page ifviewer></polymer-home-page>
|
||||
<div ifnoviewer>
|
||||
<span id="remote">[remote]</span>
|
||||
<iframe></iframe>
|
||||
</div>
|
||||
<!-- -->
|
||||
<script>
|
||||
var remoteDocs = 'http://turbogadgetry.com/bowertopia/components/';
|
||||
// if no local info viewer, load it remotely
|
||||
function noviewer() {
|
||||
document.body.setAttribute('noviewer', '');
|
||||
var path = location.pathname.split('/');
|
||||
var module = path.pop() || path.pop();
|
||||
document.querySelector('iframe').src = remoteDocs + module;
|
||||
document.querySelector('title').textContent = module;
|
||||
}
|
||||
// for testing only
|
||||
var opts = window.location.search;
|
||||
if (opts.indexOf('noviewer') >= 0) {
|
||||
noviewer();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
256
pkg/polymer/lib/elements/polymer-ajax/polymer-ajax.html
Normal file
256
pkg/polymer/lib/elements/polymer-ajax/polymer-ajax.html
Normal file
|
@ -0,0 +1,256 @@
|
|||
<!--
|
||||
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.
|
||||
-->
|
||||
<!--
|
||||
/**
|
||||
* @module Polymer Elements
|
||||
*/
|
||||
|
||||
/**
|
||||
* The `polymer-ajax` element performs `XMLHttpRequest`s.
|
||||
*
|
||||
* You can trigger a request explicitly by calling `go` on the
|
||||
* element.
|
||||
*
|
||||
* With `auto` set to `true`, the element performs a request whenever
|
||||
* its `url` or `params` properties are changed.
|
||||
*
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* <polymer-ajax auto url="http://gdata.youtube.com/feeds/api/videos/"
|
||||
* params='{"alt":"json", "q":"chrome"}'
|
||||
* handleAs="json"
|
||||
* on-polymer-response="{{handleResponse}}">
|
||||
* </polymer-ajax>
|
||||
*
|
||||
* Note: The `params` attribute must be double quoted JSON.
|
||||
*
|
||||
* @class polymer-ajax
|
||||
* @status beta
|
||||
* @homepage github.io
|
||||
*
|
||||
*/
|
||||
|
||||
/**
|
||||
* Fired when a response is received.
|
||||
*
|
||||
* @event polymer-response
|
||||
*/
|
||||
|
||||
/**
|
||||
* Fired when an error is received.
|
||||
*
|
||||
* @event polymer-error
|
||||
*/
|
||||
|
||||
/**
|
||||
* Fired whenever a response or an error is received.
|
||||
*
|
||||
* @event polymer-complete
|
||||
*/
|
||||
|
||||
-->
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="polymer-xhr.html">
|
||||
|
||||
<polymer-element name="polymer-ajax" attributes="url handleAs auto params response method headers body contentType">
|
||||
<script>
|
||||
Polymer('polymer-ajax', {
|
||||
/**
|
||||
* The URL target of the request.
|
||||
*
|
||||
* @attribute url
|
||||
* @type string
|
||||
* @default ''
|
||||
*/
|
||||
url: '',
|
||||
/**
|
||||
* Specifies what data to store in the `response` property, and
|
||||
* to deliver as `event.response` in `response` events.
|
||||
*
|
||||
* One of:
|
||||
*
|
||||
* `text`: uses `XHR.responseText`.
|
||||
*
|
||||
* `xml`: uses `XHR.responseXML`.
|
||||
*
|
||||
* `json`: uses `XHR.responseText` parsed as JSON.
|
||||
*
|
||||
* @attribute handleAs
|
||||
* @type string
|
||||
* @default 'text'
|
||||
*/
|
||||
handleAs: '',
|
||||
/**
|
||||
* If true, automatically performs an Ajax request when either `url` or `params` changes.
|
||||
*
|
||||
* @attribute auto
|
||||
* @type boolean
|
||||
* @default false
|
||||
*/
|
||||
auto: false,
|
||||
/**
|
||||
* Parameters to send to the specified URL, as JSON.
|
||||
*
|
||||
* @attribute params
|
||||
* @type string (JSON)
|
||||
* @default ''
|
||||
*/
|
||||
params: '',
|
||||
/**
|
||||
* Returns the response object.
|
||||
*
|
||||
* @attribute response
|
||||
* @type Object
|
||||
* @default null
|
||||
*/
|
||||
response: null,
|
||||
/**
|
||||
* The HTTP method to use such as 'GET', 'POST', 'PUT', or 'DELETE'.
|
||||
* Default is 'GET'.
|
||||
*
|
||||
* @attribute method
|
||||
* @type string
|
||||
* @default ''
|
||||
*/
|
||||
method: '',
|
||||
/**
|
||||
* HTTP request headers to send.
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* <polymer-ajax auto url="http://somesite.com"
|
||||
* headers='{"X-Requested-With": "XMLHttpRequest"}'
|
||||
* handleAs="json"
|
||||
* on-polymer-response="{{handleResponse}}">
|
||||
* </polymer-ajax>
|
||||
*
|
||||
* @attribute headers
|
||||
* @type Object
|
||||
* @default null
|
||||
*/
|
||||
headers: null,
|
||||
/**
|
||||
* Optional raw body content to send when method === "POST".
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* <polymer-ajax method="POST" auto url="http://somesite.com"
|
||||
* body='{"foo":1, "bar":2}'>
|
||||
* </polymer-ajax>
|
||||
*
|
||||
* @attribute body
|
||||
* @type Object
|
||||
* @default null
|
||||
*/
|
||||
body: null,
|
||||
/**
|
||||
* Content type to use when sending data.
|
||||
*
|
||||
* @attribute contentType
|
||||
* @type string
|
||||
* @default 'application/x-www-form-urlencoded'
|
||||
*/
|
||||
contentType: 'application/x-www-form-urlencoded',
|
||||
ready: function() {
|
||||
this.xhr = document.createElement('polymer-xhr');
|
||||
},
|
||||
receive: function(response, xhr) {
|
||||
if (this.isSuccess(xhr)) {
|
||||
this.processResponse(xhr);
|
||||
} else {
|
||||
this.error(xhr);
|
||||
}
|
||||
this.complete(xhr);
|
||||
},
|
||||
isSuccess: function(xhr) {
|
||||
var status = xhr.status || 0;
|
||||
return !status || (status >= 200 && status < 300);
|
||||
},
|
||||
processResponse: function(xhr) {
|
||||
var response = this.evalResponse(xhr);
|
||||
this.response = response;
|
||||
this.fire('polymer-response', {response: response, xhr: xhr});
|
||||
},
|
||||
error: function(xhr) {
|
||||
var response = xhr.status + ': ' + xhr.responseText;
|
||||
this.fire('polymer-error', {response: response, xhr: xhr});
|
||||
},
|
||||
complete: function(xhr) {
|
||||
this.fire('polymer-complete', {response: xhr.status, xhr: xhr});
|
||||
},
|
||||
evalResponse: function(xhr) {
|
||||
return this[(this.handleAs || 'text') + 'Handler'](xhr);
|
||||
},
|
||||
xmlHandler: function(xhr) {
|
||||
return xhr.responseXML;
|
||||
},
|
||||
textHandler: function(xhr) {
|
||||
return xhr.responseText;
|
||||
},
|
||||
jsonHandler: function(xhr) {
|
||||
var r = xhr.responseText;
|
||||
try {
|
||||
return JSON.parse(r);
|
||||
} catch (x) {
|
||||
return r;
|
||||
}
|
||||
},
|
||||
urlChanged: function() {
|
||||
if (!this.handleAs) {
|
||||
var ext = String(this.url).split('.').pop();
|
||||
switch (ext) {
|
||||
case 'json':
|
||||
this.handleAs = 'json';
|
||||
break;
|
||||
}
|
||||
}
|
||||
this.autoGo();
|
||||
},
|
||||
paramsChanged: function() {
|
||||
this.autoGo();
|
||||
},
|
||||
autoChanged: function() {
|
||||
this.autoGo();
|
||||
},
|
||||
// TODO(sorvell): multiple side-effects could call autoGo
|
||||
// during one micro-task, use a job to have only one action
|
||||
// occur
|
||||
autoGo: function() {
|
||||
if (this.auto) {
|
||||
this.goJob = this.job(this.goJob, this.go, 0);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Performs an Ajax request to the specified URL.
|
||||
*
|
||||
* @method go
|
||||
*/
|
||||
go: function() {
|
||||
var args = this.xhrArgs || {};
|
||||
// TODO(sjmiles): alternatively, we could force POST if body is set
|
||||
if (this.method === 'POST') {
|
||||
args.body = this.body || args.body;
|
||||
}
|
||||
args.params = this.params || args.params;
|
||||
if (args.params && typeof(args.params) == 'string') {
|
||||
args.params = JSON.parse(args.params);
|
||||
}
|
||||
args.headers = this.headers || args.headers || {};
|
||||
if (args.headers && typeof(args.headers) == 'string') {
|
||||
args.headers = JSON.parse(args.headers);
|
||||
}
|
||||
if (this.contentType) {
|
||||
args.headers['content-type'] = this.contentType;
|
||||
}
|
||||
args.callback = this.receive.bind(this);
|
||||
args.url = this.url;
|
||||
args.method = this.method;
|
||||
return args.url && this.xhr.request(args);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
96
pkg/polymer/lib/elements/polymer-ajax/polymer-xhr.html
Normal file
96
pkg/polymer/lib/elements/polymer-ajax/polymer-xhr.html
Normal file
|
@ -0,0 +1,96 @@
|
|||
<!--
|
||||
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.
|
||||
-->
|
||||
<!--
|
||||
/**
|
||||
* @module Polymer Elements
|
||||
*/
|
||||
/**
|
||||
* polymer-xhr can be used to perform XMLHttpRequests.
|
||||
|
||||
* Example:
|
||||
*
|
||||
* <polymer-xhr id="xhr"></polymer-xhr>
|
||||
* ...
|
||||
* this.$.xhr.request({url: url, params: params, callback: callback});
|
||||
*
|
||||
* @class polymer-xhr
|
||||
*/
|
||||
-->
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<polymer-element name="polymer-xhr">
|
||||
<template>
|
||||
<style>
|
||||
:host {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('polymer-xhr', {
|
||||
makeReadyStateHandler: function(xhr, callback) {
|
||||
xhr.onreadystatechange = function() {
|
||||
if (xhr.readyState == 4) {
|
||||
callback && callback.call(null, xhr.response, xhr);
|
||||
}
|
||||
};
|
||||
},
|
||||
setRequestHeaders: function(xhr, headers) {
|
||||
if (headers) {
|
||||
for (var name in headers) {
|
||||
xhr.setRequestHeader(name, headers[name]);
|
||||
}
|
||||
}
|
||||
},
|
||||
toQueryString: function(params) {
|
||||
var r = [];
|
||||
for (var n in params) {
|
||||
var v = params[n];
|
||||
n = encodeURIComponent(n);
|
||||
r.push(v == null ? n : (n + '=' + encodeURIComponent(v)));
|
||||
}
|
||||
return r.join('&');
|
||||
},
|
||||
/**
|
||||
* Sends a HTTP request to the server and returns the XHR object.
|
||||
*
|
||||
* @method request
|
||||
* @param {Object} inOptions
|
||||
* @param {String} inOptions.url The url to which the request is sent.
|
||||
* @param {String} inOptions.method The HTTP method to use, default is GET.
|
||||
* @param {boolean} inOptions.sync By default, all requests are sent asynchronously.
|
||||
* To send synchronous requests, set to true.
|
||||
* @param {Object} inOptions.params Data to be sent to the server.
|
||||
* @param {Object} inOptions.body The content for the request body for POST method.
|
||||
* @param {Object} inOptions.headers HTTP request headers.
|
||||
* @param {String} inOptions.responseType The response type. Default is 'text'.
|
||||
* @param {Object} inOptions.callback Called when request is completed.
|
||||
* @returns {Object} XHR object.
|
||||
*/
|
||||
request: function(options) {
|
||||
var xhr = new XMLHttpRequest();
|
||||
var url = options.url;
|
||||
var method = options.method || 'GET';
|
||||
var async = !options.sync;
|
||||
var params = this.toQueryString(options.params);
|
||||
if (params && method == 'GET') {
|
||||
url += (url.indexOf('?') > 0 ? '&' : '?') + params;
|
||||
}
|
||||
xhr.open(method, url, async);
|
||||
if (options.responseType) {
|
||||
xhr.responseType = options.responseType;
|
||||
}
|
||||
this.makeReadyStateHandler(xhr, options.callback);
|
||||
this.setRequestHeaders(xhr, options.headers);
|
||||
xhr.send(method == 'POST' ? (options.body || params) : null);
|
||||
if (!async) {
|
||||
xhr.onreadystatechange(xhr);
|
||||
}
|
||||
return xhr;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,30 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer-ajax</title>
|
||||
<script src="../../../platform/platform.js"></script>
|
||||
<script src="../../../tools/test/htmltest.js"></script>
|
||||
<script src="../../../tools/test/chai/chai.js"></script>
|
||||
<link rel="import" href="../../polymer-ajax.html">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<polymer-ajax
|
||||
url="http://gdata.youtube.com/feeds/api/videos/"
|
||||
params='{"alt":"json", "q":"chrome"}'
|
||||
handleAs="json"
|
||||
auto
|
||||
></polymer-ajax>
|
||||
|
||||
<script>
|
||||
var assert = chai.assert;
|
||||
document.addEventListener('polymer-ready', function() {
|
||||
var ajax = document.querySelector('polymer-ajax');
|
||||
ajax.addEventListener("polymer-response", function(event) {
|
||||
assert.isTrue(event.detail.response.feed.entry.length > 0);
|
||||
done();
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
htmlSuite('polymer-ajax', function() {
|
||||
htmlTest('html/polymer-ajax.html');
|
||||
});
|
31
pkg/polymer/lib/elements/polymer-ajax/test/runner.html
Normal file
31
pkg/polymer/lib/elements/polymer-ajax/test/runner.html
Normal file
|
@ -0,0 +1,31 @@
|
|||
<!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>polymer-ajax Test Runner (Mocha)</title>
|
||||
<meta charset="UTF-8">
|
||||
<!-- -->
|
||||
<link rel="stylesheet" href="../../tools/test/mocha/mocha.css" />
|
||||
<script src="../../tools/test/mocha/mocha.js"></script>
|
||||
<script src="../../tools/test/chai/chai.js"></script>
|
||||
<script src="../../tools/test/mocha-htmltest.js"></script>
|
||||
<!-- -->
|
||||
<script src="../../platform/platform.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="mocha"></div>
|
||||
<script>
|
||||
mocha.setup({ui: 'tdd', slow: 1000, htmlbase: ''});
|
||||
</script>
|
||||
<!-- -->
|
||||
<script src="js/polymer-ajax.js"></script>
|
||||
<!-- -->
|
||||
<script>
|
||||
mocha.run();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
17
pkg/polymer/lib/elements/polymer-anchor-point/.bower.json
Normal file
17
pkg/polymer/lib/elements/polymer-anchor-point/.bower.json
Normal file
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "polymer-anchor-point",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
},
|
||||
"homepage": "https://github.com/Polymer/polymer-anchor-point",
|
||||
"_release": "9fe2994f94",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "9fe2994f9444da025c20d8b9f82ecf35c7e83cc5"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-anchor-point.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-anchor-point"
|
||||
}
|
9
pkg/polymer/lib/elements/polymer-anchor-point/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-anchor-point/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-anchor-point/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-anchor-point/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-anchor-point/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-anchor-point/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
7
pkg/polymer/lib/elements/polymer-anchor-point/bower.json
Normal file
7
pkg/polymer/lib/elements/polymer-anchor-point/bower.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"name": "polymer-anchor-point",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
}
|
||||
}
|
96
pkg/polymer/lib/elements/polymer-anchor-point/demo.html
Normal file
96
pkg/polymer/lib/elements/polymer-anchor-point/demo.html
Normal file
|
@ -0,0 +1,96 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer-anchor-point</title>
|
||||
<link rel="import" href="../polymer-ui-icon-button/polymer-ui-icon-button.html">
|
||||
<link rel="import" href="../polymer-ui-toolbar/polymer-ui-toolbar.html">
|
||||
<link rel="import" href="polymer-anchor-point.html">
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="stylesheet" href="../polymer-ui-base/base.css">
|
||||
<style>
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
html, body, #container {
|
||||
height: 100%;
|
||||
}
|
||||
#target {
|
||||
padding: 5px;
|
||||
border: 1px solid black;
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: -99999px;
|
||||
}
|
||||
#target.active {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="polymer-ui-body-text">
|
||||
<div id="container">
|
||||
<polymer-flex-layout vertical="true"></polymer-flex-layout>
|
||||
<polymer-ui-toolbar theme="polymer-ui-light-theme" onclick="toggle(event)">
|
||||
<polymer-ui-icon-button icon="menu" anchor-point="bottom left" target-anchor-point="top left"></polymer-ui-icon-button>
|
||||
<div flex></div>
|
||||
<polymer-ui-icon-button icon="refresh" anchor-point="bottom center" target-anchor-point="top center"></polymer-ui-icon-button>
|
||||
<div flex></div>
|
||||
<polymer-ui-icon-button icon="add" anchor-point="bottom right" target-anchor-point="top right"></polymer-ui-icon-button>
|
||||
</polymer-ui-toolbar>
|
||||
<div flex></div>
|
||||
<div style="text-align:center">
|
||||
<p><strong>Click icon buttons in the toolbars or enter custom <a href="http://dev.w3.org/csswg/css-backgrounds/#the-background-position" target="_blank">anchor-points</a> below.</strong></p>
|
||||
<br>
|
||||
anchor-point: <input id="customAnchorPt" value="bottom">
|
||||
target anchor-point: <input id="customTargetAnchorPt" value="center -10px">
|
||||
<br><br>
|
||||
Click <polymer-ui-icon-button icon="settings" onclick="toggleCustom(event)"></polymer-ui-icon-button> for custom
|
||||
</div>
|
||||
<div flex></div>
|
||||
<polymer-ui-toolbar theme="polymer-ui-light-theme" onclick="toggle(event)">
|
||||
<polymer-ui-icon-button icon="drawer" anchor-point="top left" target-anchor-point="bottom left"></polymer-ui-icon-button>
|
||||
<polymer-ui-icon-button icon="dots" anchor-point="top center" target-anchor-point="bottom center"></polymer-ui-icon-button>
|
||||
<div flex></div>
|
||||
<polymer-ui-icon-button icon="search" anchor-point="top right" target-anchor-point="bottom right"></polymer-ui-icon-button>
|
||||
</polymer-ui-toolbar>
|
||||
</div>
|
||||
<div id="target" onclick="toggle(event)"></div>
|
||||
<polymer-anchor-point id="anchorable"></polymer-anchor-point>
|
||||
<script>
|
||||
function toggle(e) {
|
||||
var anchorable = document.querySelector('#anchorable');
|
||||
var target = document.querySelector('#target');
|
||||
var anchor = e.target;
|
||||
if (target.classList.contains('active')) {
|
||||
target.classList.remove('active');
|
||||
} else {
|
||||
var targetAnchorPt = anchor.getAttribute('target-anchor-point');
|
||||
target.setAttribute('anchor-point', targetAnchorPt);
|
||||
target.innerHTML = 'anchor-point: ' + anchor.getAttribute('anchor-point') + '<br>' + 'target anchor-point: ' + targetAnchorPt;
|
||||
anchorable.target = target;
|
||||
anchorable.anchor = anchor;
|
||||
target.classList.add('active');
|
||||
anchorable.apply();
|
||||
}
|
||||
};
|
||||
function toggleCustom(e) {
|
||||
var anchorable = document.querySelector('#anchorable');
|
||||
var target = document.querySelector('#target');
|
||||
var anchor = e.target;
|
||||
if (target.classList.contains('active')) {
|
||||
target.classList.remove('active');
|
||||
} else {
|
||||
var anchorPt = document.querySelector('#customAnchorPt').value;
|
||||
anchor.setAttribute('anchor-point', anchorPt);
|
||||
var targetAnchorPt = document.querySelector('#customTargetAnchorPt').value;
|
||||
target.setAttribute('anchor-point', targetAnchorPt);
|
||||
target.innerHTML = 'anchor-point: ' + anchorPt + '<br>' + 'target anchor-point: ' + targetAnchorPt;
|
||||
anchorable.target = target;
|
||||
anchorable.anchor = anchor;
|
||||
target.classList.add('active');
|
||||
anchorable.apply();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
72
pkg/polymer/lib/elements/polymer-anchor-point/docs.json
Normal file
72
pkg/polymer/lib/elements/polymer-anchor-point/docs.json
Normal file
|
@ -0,0 +1,72 @@
|
|||
{
|
||||
"project": {
|
||||
"name": "Docs",
|
||||
"description": "Docs"
|
||||
},
|
||||
"files": {
|
||||
"..\\..\\polymer-anchor-point\\polymer-anchor-point.html": {
|
||||
"name": "..\\..\\polymer-anchor-point\\polymer-anchor-point.html",
|
||||
"modules": {
|
||||
"Polymer Elements": 1
|
||||
},
|
||||
"classes": {
|
||||
"polymer-anchor-point": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
}
|
||||
},
|
||||
"modules": {
|
||||
"Polymer Elements": {
|
||||
"name": "Polymer Elements",
|
||||
"submodules": {},
|
||||
"classes": {
|
||||
"polymer-anchor-point": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {},
|
||||
"tag": "module",
|
||||
"file": "..\\..\\polymer-anchor-point\\polymer-anchor-point.html",
|
||||
"line": 5
|
||||
}
|
||||
},
|
||||
"classes": {
|
||||
"polymer-anchor-point": {
|
||||
"name": "polymer-anchor-point",
|
||||
"shortname": "polymer-anchor-point",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Polymer Elements",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-anchor-point\\polymer-anchor-point.html",
|
||||
"line": 5,
|
||||
"description": "polymer-anchor-point can be used to align two nodes. The node to\nuse as the reference position is the anchor node, and the node to\nbe positioned is the target node.\n\nBoth the anchor and target nodes should have an anchor-point\nattribute. The target node is positioned such that its anchor-point\naligns with the anchor node's anchor-point.\n\nNote: The target node is positioned with position: fixed, and will not\nscroll with the page.\n\nNote: This is meant to polyfill the `<dialog>` positioning behavior when\nan anchor is provided. Spec: http://www.whatwg.org/specs/web-apps/current-work/multipage/commands.html#the-dialog-element\n\nExample:\n\n <div id=\"anchor\" anchor-point=\"bottom left\"></div>\n <div id=\"target\" anchor-point=\"top left\"></div>\n <polymer-anchor-point id=\"anchor-helper\"></polymer-anchor-point>\n <script>\n var helper = document.querySelector('#anchor-helper');\n helper.anchor = document.querySelector('#anchor');\n helper.target = document.querySelector('#target');\n helper.apply();\n </script>"
|
||||
}
|
||||
},
|
||||
"classitems": [
|
||||
{
|
||||
"file": "..\\..\\polymer-anchor-point\\polymer-anchor-point.html",
|
||||
"line": 156,
|
||||
"description": "The node to be positioned.",
|
||||
"itemtype": "attribute",
|
||||
"name": "target",
|
||||
"type": "Node",
|
||||
"class": "polymer-anchor-point",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-anchor-point\\polymer-anchor-point.html",
|
||||
"line": 162,
|
||||
"description": "The node to align the target to.",
|
||||
"itemtype": "attribute",
|
||||
"name": "anchor",
|
||||
"type": "node",
|
||||
"class": "polymer-anchor-point",
|
||||
"module": "Polymer Elements"
|
||||
}
|
||||
],
|
||||
"warnings": []
|
||||
}
|
64
pkg/polymer/lib/elements/polymer-anchor-point/index.html
Normal file
64
pkg/polymer/lib/elements/polymer-anchor-point/index.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer api</title>
|
||||
<style>
|
||||
html, body {
|
||||
font-family: Arial, sans-serif;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
[noviewer] [ifnoviewer] {
|
||||
display: block;
|
||||
}
|
||||
[detector], [ifnoviewer], [noviewer] [ifviewer] {
|
||||
display: none;
|
||||
}
|
||||
[ifviewer], [ifnoviewer] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
iframe {
|
||||
border: none;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#remote {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="../polymer-home-page/polymer-home-page.html">
|
||||
</head>
|
||||
<body>
|
||||
<img detector src="../polymer-home-page/bowager-logo.png" onerror="noviewer()">
|
||||
<polymer-home-page ifviewer></polymer-home-page>
|
||||
<div ifnoviewer>
|
||||
<span id="remote">[remote]</span>
|
||||
<iframe></iframe>
|
||||
</div>
|
||||
<!-- -->
|
||||
<script>
|
||||
var remoteDocs = 'http://turbogadgetry.com/bowertopia/components/';
|
||||
// if no local info viewer, load it remotely
|
||||
function noviewer() {
|
||||
document.body.setAttribute('noviewer', '');
|
||||
var path = location.pathname.split('/');
|
||||
var module = path.pop() || path.pop();
|
||||
document.querySelector('iframe').src = remoteDocs + module;
|
||||
document.querySelector('title').textContent = module;
|
||||
}
|
||||
// for testing only
|
||||
var opts = window.location.search;
|
||||
if (opts.indexOf('noviewer') >= 0) {
|
||||
noviewer();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,196 @@
|
|||
<!--
|
||||
/**
|
||||
* @module Polymer Elements
|
||||
*/
|
||||
/**
|
||||
* polymer-anchor-point can be used to align two nodes. The node to
|
||||
* use as the reference position is the anchor node, and the node to
|
||||
* be positioned is the target node.
|
||||
*
|
||||
* Both the anchor and target nodes should have an anchor-point
|
||||
* attribute. The target node is positioned such that its anchor-point
|
||||
* aligns with the anchor node's anchor-point.
|
||||
*
|
||||
* Note: The target node is positioned with position: fixed, and will not
|
||||
* scroll with the page.
|
||||
*
|
||||
* Note: This is meant to polyfill the `<dialog>` positioning behavior when
|
||||
* an anchor is provided. Spec: http://www.whatwg.org/specs/web-apps/current-work/multipage/commands.html#the-dialog-element
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* <div id="anchor" anchor-point="bottom left"></div>
|
||||
* <div id="target" anchor-point="top left"></div>
|
||||
* <polymer-anchor-point id="anchor-helper"></polymer-anchor-point>
|
||||
* <script>
|
||||
* var helper = document.querySelector('#anchor-helper');
|
||||
* helper.anchor = document.querySelector('#anchor');
|
||||
* helper.target = document.querySelector('#target');
|
||||
* helper.apply();
|
||||
* </script>
|
||||
*
|
||||
* @class polymer-anchor-point
|
||||
*/
|
||||
-->
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<polymer-element name="polymer-anchor-point" attributes="target anchor">
|
||||
<script>
|
||||
(function() {
|
||||
var DEFAULT_ANCHOR_POINT = 'center center';
|
||||
|
||||
function getAnchorPoint(node) {
|
||||
var anchorPt = node.getAttribute('anchor-point');
|
||||
if (!anchorPt || anchorPt === 'none') {
|
||||
anchorPt = DEFAULT_ANCHOR_POINT;
|
||||
}
|
||||
return anchorPt;
|
||||
};
|
||||
|
||||
function lengthIsPx(length) {
|
||||
return length.slice(-2) === 'px';
|
||||
};
|
||||
|
||||
function lengthIsPercent(length) {
|
||||
return length.slice(-1) === '%';
|
||||
};
|
||||
|
||||
function computeLength(length, ref) {
|
||||
var computed = 0;
|
||||
if (lengthIsPx(length)) {
|
||||
computed = length.slice(0, -2);
|
||||
} else if (lengthIsPercent(length)) {
|
||||
computed = ref * length.slice(0, -1) / 100;
|
||||
}
|
||||
return computed;
|
||||
};
|
||||
|
||||
function partIsX(part) {
|
||||
return part === 'left' || part === 'right' || part === 'center';
|
||||
};
|
||||
|
||||
function partIsY(part) {
|
||||
return part === 'top' || part === 'bottom' || part === 'center';
|
||||
};
|
||||
|
||||
function partIsKeyword(part) {
|
||||
return part.slice(-1) !== '%' && part.slice(-2) !== 'px';
|
||||
};
|
||||
|
||||
function parsePosition(position) {
|
||||
var parsed = {};
|
||||
var parts = position.split(' ');
|
||||
var i = 0;
|
||||
var lastEdgeX = true;
|
||||
do {
|
||||
if (partIsX(parts[i])) {
|
||||
parsed.x = parts[i];
|
||||
lastEdgeX = parts[i] !== 'center';
|
||||
} else if (partIsY(parts[i])) {
|
||||
parsed.y = parts[i];
|
||||
lastEdgeX = false;
|
||||
} else if (lastEdgeX) {
|
||||
parsed.xOffset = parts[i];
|
||||
lastEdgeX = false;
|
||||
} else {
|
||||
parsed.yOffset = parts[i];
|
||||
}
|
||||
} while (++i < parts.length);
|
||||
return parsed;
|
||||
};
|
||||
|
||||
function computeAnchorOffset(rect, anchorPt) {
|
||||
var offset = {
|
||||
left: 0,
|
||||
top: 0
|
||||
};
|
||||
var parsed = parsePosition(anchorPt);
|
||||
if (!parsed.x && !parsed.xOffset) {
|
||||
offset.left = rect.width / 2;
|
||||
} else if (parsed.x && !parsed.xOffset) {
|
||||
switch (parsed.x) {
|
||||
case 'left':
|
||||
offset.left = 0;
|
||||
break;
|
||||
case 'right':
|
||||
offset.left = rect.width;
|
||||
break;
|
||||
case 'center':
|
||||
offset.left = rect.width / 2;
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
var computed = computeLength(parsed.xOffset, rect.width);
|
||||
if (parsed.x === 'right') {
|
||||
offset.left = rect.width - computed;
|
||||
} else if (!parsed.x || parsed.x === 'left') {
|
||||
offset.left = computed;
|
||||
}
|
||||
}
|
||||
if (!parsed.y && !parsed.yOffset) {
|
||||
offset.top = rect.height / 2;
|
||||
} else if (parsed.y && !parsed.yOffset) {
|
||||
switch (parsed.y) {
|
||||
case 'top':
|
||||
offset.top = 0;
|
||||
break;
|
||||
case 'bottom':
|
||||
offset.top = rect.height;
|
||||
break;
|
||||
case 'center':
|
||||
offset.top = rect.height / 2;
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
var computed = computeLength(parsed.yOffset, rect.height);
|
||||
if (parsed.y === 'bottom') {
|
||||
offset.top = rect.height - computed;
|
||||
} else if (!parsed.y || parsed.y === 'top') {
|
||||
offset.top = computed;
|
||||
}
|
||||
}
|
||||
return offset;
|
||||
};
|
||||
|
||||
Polymer('polymer-anchor-point', {
|
||||
/**
|
||||
* The node to be positioned.
|
||||
* @attribute target
|
||||
* @type Node
|
||||
*/
|
||||
target: null,
|
||||
/**
|
||||
* The node to align the target to.
|
||||
* @attribute anchor
|
||||
* @type node
|
||||
*/
|
||||
anchor: null,
|
||||
canPosition: function() {
|
||||
return this.target && this.anchor;
|
||||
},
|
||||
apply: function() {
|
||||
if (!this.canPosition()) {
|
||||
return;
|
||||
}
|
||||
var pos = this.computePosition();
|
||||
this.target.style.position = 'fixed';
|
||||
this.target.style.top = pos.top + 'px';
|
||||
this.target.style.left = pos.left + 'px';
|
||||
},
|
||||
computePosition: function() {
|
||||
var rect = this.anchor.getBoundingClientRect();
|
||||
var anchorPt = getAnchorPoint(this.anchor);
|
||||
var anchorOffset = computeAnchorOffset(rect, anchorPt);
|
||||
var targetRect = this.target.getBoundingClientRect();
|
||||
var targetAnchorPt = getAnchorPoint(this.target);
|
||||
var targetOffset = computeAnchorOffset(targetRect, targetAnchorPt);
|
||||
var pos = {
|
||||
left: rect.left + anchorOffset.left - targetOffset.left,
|
||||
top: rect.top + anchorOffset.top - targetOffset.top
|
||||
};
|
||||
return pos;
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</polymer-element>
|
18
pkg/polymer/lib/elements/polymer-animation/.bower.json
Normal file
18
pkg/polymer/lib/elements/polymer-animation/.bower.json
Normal file
|
@ -0,0 +1,18 @@
|
|||
{
|
||||
"name": "polymer-animation",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master",
|
||||
"web-animations-js": "web-animations/web-animations-js#master"
|
||||
},
|
||||
"homepage": "https://github.com/Polymer/polymer-animation",
|
||||
"_release": "7620c26c5a",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "7620c26c5a0fdd2027329151485b01fd1caf3520"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-animation.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-animation"
|
||||
}
|
9
pkg/polymer/lib/elements/polymer-animation/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-animation/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-animation/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-animation/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-animation/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-animation/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
8
pkg/polymer/lib/elements/polymer-animation/bower.json
Normal file
8
pkg/polymer/lib/elements/polymer-animation/bower.json
Normal file
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"name": "polymer-animation",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master",
|
||||
"web-animations-js": "web-animations/web-animations-js#master"
|
||||
}
|
||||
}
|
123
pkg/polymer/lib/elements/polymer-animation/demo.html
Normal file
123
pkg/polymer/lib/elements/polymer-animation/demo.html
Normal file
|
@ -0,0 +1,123 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Polymer Animation Components</title>
|
||||
<link rel="import" href="polymer-animation.html">
|
||||
<link rel="import" href="polymer-animation-group.html">
|
||||
<link rel="import" href="polymer-blink.html">
|
||||
<link rel="import" href="polymer-bounce.html">
|
||||
<link rel="import" href="polymer-fadein.html">
|
||||
<link rel="import" href="polymer-fadeout.html">
|
||||
<link rel="import" href="polymer-flip.html">
|
||||
<link rel="import" href="polymer-shake.html">
|
||||
<script src="../platform/platform.js"></script>
|
||||
<style>
|
||||
body {
|
||||
text-align: center;
|
||||
font-family: Helvetica, sans-serif;
|
||||
}
|
||||
div#target {
|
||||
display: inline-block;
|
||||
background-color: dimgrey;
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
margin: 50px;
|
||||
font-size: 30px;
|
||||
color: white;
|
||||
}
|
||||
div.animations > * {
|
||||
display: inline-block;
|
||||
background-color: darkgrey;
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
margin: 5px;
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="target">animated!</div>
|
||||
<div class="animations">
|
||||
<polymer-animation duration="1">
|
||||
raw
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="1">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="0.3">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="1">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
<polymer-animation-group type="seq">
|
||||
raw group
|
||||
<polymer-animation duration="0.3">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="1">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="0.3">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="1">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
<polymer-animation duration="0.3">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="scale(1)">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="scale(1.2)">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="scale(1)">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
</polymer-animation-group>
|
||||
<polymer-animation id="sample-animation" duration="0.5">sample</polymer-animation>
|
||||
<polymer-bounce duration="1">bounce</polymer-bounce>
|
||||
<polymer-shake>shake</polymer-shake>
|
||||
<!--<polymer-shake duration="Infinity">shake forever</polymer-shake>//-->
|
||||
<polymer-flip>flip X</polymer-flip>
|
||||
<polymer-flip axis="y">flip Y</polymer-flip>
|
||||
<polymer-blink>blink</polymer-blink>
|
||||
<polymer-fadein>fade in</polymer-fadein>
|
||||
<polymer-fadeout>fade out (with event)</polymer-fadeout>
|
||||
</div>
|
||||
<script>
|
||||
var sampleAnimationFn = function(timeFraction, currentIteration, animationTarget, underlyingValue) {
|
||||
if (timeFraction < 1) {
|
||||
animationTarget.textContent = timeFraction;
|
||||
} else {
|
||||
animationTarget.textContent = 'animated!';
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener('polymer-ready', function() {
|
||||
document.querySelector('.animations').addEventListener('click',
|
||||
function(e) {
|
||||
var animation = e.target;
|
||||
if (animation.id === 'sample-animation') {
|
||||
animation.sample = sampleAnimationFn;
|
||||
}
|
||||
animation.target = target;
|
||||
animation.play();
|
||||
});
|
||||
document.querySelector('polymer-fadeout').addEventListener(
|
||||
'complete', function(e) {
|
||||
alert('complete!');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
356
pkg/polymer/lib/elements/polymer-animation/docs.json
Normal file
356
pkg/polymer/lib/elements/polymer-animation/docs.json
Normal file
|
@ -0,0 +1,356 @@
|
|||
{
|
||||
"project": {
|
||||
"name": "Docs",
|
||||
"description": "Docs"
|
||||
},
|
||||
"files": {
|
||||
"..\\..\\polymer-animation\\polymer-animation-group.html": {
|
||||
"name": "..\\..\\polymer-animation\\polymer-animation-group.html",
|
||||
"modules": {
|
||||
"Animation": 1
|
||||
},
|
||||
"classes": {
|
||||
"polymer-animation-group": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
},
|
||||
"..\\..\\polymer-animation\\polymer-animation-keyframe.html": {
|
||||
"name": "..\\..\\polymer-animation\\polymer-animation-keyframe.html",
|
||||
"modules": {},
|
||||
"classes": {
|
||||
"polymer-animation-keyframe": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
},
|
||||
"..\\..\\polymer-animation\\polymer-animation-prop.html": {
|
||||
"name": "..\\..\\polymer-animation\\polymer-animation-prop.html",
|
||||
"modules": {},
|
||||
"classes": {
|
||||
"polymer-animation-prop": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
},
|
||||
"..\\..\\polymer-animation\\polymer-animation.html": {
|
||||
"name": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"modules": {},
|
||||
"classes": {
|
||||
"polymer-animation": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
}
|
||||
},
|
||||
"modules": {
|
||||
"Animation": {
|
||||
"name": "Animation",
|
||||
"submodules": {},
|
||||
"classes": {
|
||||
"polymer-animation-group": 1,
|
||||
"polymer-animation-keyframe": 1,
|
||||
"polymer-animation-prop": 1,
|
||||
"polymer-animation": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {},
|
||||
"tag": "module",
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 33,
|
||||
"itemtype": "main",
|
||||
"example": [
|
||||
" toolkitchen/labs/animation2/grid-fade.html",
|
||||
" toolkitchen/labs/animation2/group.html"
|
||||
]
|
||||
}
|
||||
},
|
||||
"classes": {
|
||||
"polymer-animation-group": {
|
||||
"name": "polymer-animation-group",
|
||||
"shortname": "polymer-animation-group",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Animation",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-group.html",
|
||||
"line": 14,
|
||||
"description": "Component for a group of animations."
|
||||
},
|
||||
"polymer-animation-keyframe": {
|
||||
"name": "polymer-animation-keyframe",
|
||||
"shortname": "polymer-animation-keyframe",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Animation",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-keyframe.html",
|
||||
"line": 5,
|
||||
"description": "Defines a keyframe in an animation. Its children should be\n`<polymer-animation-prop>` elements specifying the css\nproperty value at the keyframe."
|
||||
},
|
||||
"polymer-animation-prop": {
|
||||
"name": "polymer-animation-prop",
|
||||
"shortname": "polymer-animation-prop",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Animation",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-prop.html",
|
||||
"line": 5,
|
||||
"description": "A CSS property and value to use in a `<polymer-animation-keyframe>`."
|
||||
},
|
||||
"polymer-animation": {
|
||||
"name": "polymer-animation",
|
||||
"shortname": "polymer-animation",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Animation",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 33,
|
||||
"description": "Component for a single animation.\n\nA animation component to fade out an element:\n\n <polymer-animation id=\"fadeout\">\n <polymer-animation-keyframe offset=\"0\">\n <polymer-animation-prop name=\"opacity\" value=\"0\">\n </polymer-animation-keyframe>\n </polymer-animation-keyframe>\n <polymer-animation-keyframe offset=\"1\">\n <polymer-animation-prop name=\"opacity\" value=\"1\">\n <polymer-animation-prop>\n </polymer-animation-keyframe>\n </polymer-animation>"
|
||||
}
|
||||
},
|
||||
"classitems": [
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-group.html",
|
||||
"line": 20,
|
||||
"description": "If specified the target will be assigned to all child animations.",
|
||||
"itemtype": "property",
|
||||
"name": "target",
|
||||
"type": "HTMLElement|Node",
|
||||
"default": "null",
|
||||
"class": "polymer-animation-group",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-group.html",
|
||||
"line": 27,
|
||||
"description": "If specified and not \"auto\" the duration will apply to the group\nand propagate to any child animations that is not a group and does\nnot specify a duration.",
|
||||
"itemtype": "property",
|
||||
"name": "duration",
|
||||
"type": "number",
|
||||
"default": "\"auto\"",
|
||||
"class": "polymer-animation-group",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-group.html",
|
||||
"line": 36,
|
||||
"description": "Group type. 'par' for parallel and 'seq' for sequence.",
|
||||
"itemtype": "property",
|
||||
"name": "type",
|
||||
"type": "String",
|
||||
"default": "'par'",
|
||||
"class": "polymer-animation-group",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-keyframe.html",
|
||||
"line": 12,
|
||||
"description": "From 0 to 1.",
|
||||
"itemtype": "property",
|
||||
"name": "offset",
|
||||
"type": "Number",
|
||||
"class": "polymer-animation-keyframe",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-prop.html",
|
||||
"line": 10,
|
||||
"description": "CSS property name.",
|
||||
"itemtype": "property",
|
||||
"name": "name",
|
||||
"type": "String",
|
||||
"required": 1,
|
||||
"class": "polymer-animation-prop",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation-prop.html",
|
||||
"line": 16,
|
||||
"description": "CSS property value.",
|
||||
"itemtype": "property",
|
||||
"name": "value",
|
||||
"required": 1,
|
||||
"class": "polymer-animation-prop",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 50,
|
||||
"description": "Fired when the animation starts",
|
||||
"itemtype": "event",
|
||||
"name": "polymer-animation-change",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 62,
|
||||
"description": "One or more nodes to animate.",
|
||||
"itemtype": "property",
|
||||
"name": "target",
|
||||
"type": "HTMLElement|Node|Array<HTMLElement|Node>",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 68,
|
||||
"description": "Selector for the node being animated.",
|
||||
"itemtype": "property",
|
||||
"name": "targetSelector",
|
||||
"type": "String",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 75,
|
||||
"description": "Animation keyframes specified as an array of dictionaries of\n<css properties>:<array of values> pairs. For example,",
|
||||
"itemtype": "property",
|
||||
"name": "keyframes",
|
||||
"type": "Object",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 82,
|
||||
"description": "A custom animation function. Either provide this or keyframes.",
|
||||
"itemtype": "property",
|
||||
"name": "sample",
|
||||
"type": "Function",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 89,
|
||||
"description": "The composition behavior. \"replace\", \"add\" or \"merge\".",
|
||||
"itemtype": "property",
|
||||
"name": "composite",
|
||||
"type": "\"replace\"|\"add\"|\"merge\"",
|
||||
"default": "\"replace\"",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 97,
|
||||
"description": "Animation duration in milliseconds, 'infinity' or 'auto'. 'auto'\nmeans use the animation's intrinsic duration.",
|
||||
"itemtype": "property",
|
||||
"name": "duration",
|
||||
"type": "Number|\"Infinity\"|\"auto\"",
|
||||
"default": "\"auto\"",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 105,
|
||||
"description": "\"none\", \"forwards\", \"backwards\", \"both\" or \"auto\". When set to\n\"auto\", the fillMode is \"none\" for a polymer-animation and \"both\"\nfor a polymer-animation-group.",
|
||||
"itemtype": "property",
|
||||
"name": "fillMode",
|
||||
"type": "\"none\"|\"forwards\"|\"backwards\"|\"both\"|\"auto\"",
|
||||
"default": "\"auto\"",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 114,
|
||||
"description": "A transition timing function.",
|
||||
"itemtype": "property",
|
||||
"name": "easing",
|
||||
"type": "\"linear\"|\"ease\"|\"ease-in\"|\"ease-out\"|\"ease-in-out\"|\n \"step-start\"|\"step-middle\"|\"step-end\"",
|
||||
"default": "\"linear\"",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 122,
|
||||
"description": "Number of iterations into the timed item in which to begin\nthe animation. e.g. 0.5 will cause the animation to begin\nhalfway through the first iteration.",
|
||||
"itemtype": "property",
|
||||
"name": "iterationStart",
|
||||
"type": "Number",
|
||||
"default": "0",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 131,
|
||||
"itemtype": "property",
|
||||
"name": "iterationCount",
|
||||
"type": "Number|'Infinity'",
|
||||
"default": "1",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 137,
|
||||
"description": "Delay in milliseconds.",
|
||||
"itemtype": "property",
|
||||
"name": "delay",
|
||||
"type": "Number",
|
||||
"default": "0",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 144,
|
||||
"itemtype": "property",
|
||||
"name": "direction",
|
||||
"type": "\"normal\"|\"reverse\"|\"alternate\"|\"alternate-reverse\"",
|
||||
"default": "\"normal\"",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 150,
|
||||
"itemtype": "property",
|
||||
"name": "autoplay",
|
||||
"type": "Boolean",
|
||||
"default": "false",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 173,
|
||||
"description": "Plays the animation.",
|
||||
"itemtype": "method",
|
||||
"name": "play",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-animation\\polymer-animation.html",
|
||||
"line": 184,
|
||||
"description": "Stops the animation.",
|
||||
"itemtype": "method",
|
||||
"name": "cancel",
|
||||
"class": "polymer-animation",
|
||||
"module": "Animation"
|
||||
}
|
||||
],
|
||||
"warnings": []
|
||||
}
|
64
pkg/polymer/lib/elements/polymer-animation/index.html
Normal file
64
pkg/polymer/lib/elements/polymer-animation/index.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer api</title>
|
||||
<style>
|
||||
html, body {
|
||||
font-family: Arial, sans-serif;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
[noviewer] [ifnoviewer] {
|
||||
display: block;
|
||||
}
|
||||
[detector], [ifnoviewer], [noviewer] [ifviewer] {
|
||||
display: none;
|
||||
}
|
||||
[ifviewer], [ifnoviewer] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
iframe {
|
||||
border: none;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#remote {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="../polymer-home-page/polymer-home-page.html">
|
||||
</head>
|
||||
<body>
|
||||
<img detector src="../polymer-home-page/bowager-logo.png" onerror="noviewer()">
|
||||
<polymer-home-page ifviewer></polymer-home-page>
|
||||
<div ifnoviewer>
|
||||
<span id="remote">[remote]</span>
|
||||
<iframe></iframe>
|
||||
</div>
|
||||
<!-- -->
|
||||
<script>
|
||||
var remoteDocs = 'http://turbogadgetry.com/bowertopia/components/';
|
||||
// if no local info viewer, load it remotely
|
||||
function noviewer() {
|
||||
document.body.setAttribute('noviewer', '');
|
||||
var path = location.pathname.split('/');
|
||||
var module = path.pop() || path.pop();
|
||||
document.querySelector('iframe').src = remoteDocs + module;
|
||||
document.querySelector('title').textContent = module;
|
||||
}
|
||||
// for testing only
|
||||
var opts = window.location.search;
|
||||
if (opts.indexOf('noviewer') >= 0) {
|
||||
noviewer();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
8
pkg/polymer/lib/elements/polymer-animation/metadata.html
Normal file
8
pkg/polymer/lib/elements/polymer-animation/metadata.html
Normal file
|
@ -0,0 +1,8 @@
|
|||
<x-meta id="polymer-animation">
|
||||
<property name="composite" kind="select" options="replace, add, merge"></property>
|
||||
<property name="fillMode" kind="select" options="none, forwards, backwards, both, auto"></property>
|
||||
</x-meta>
|
||||
|
||||
<x-meta id="polymer-animation-group">
|
||||
<property name="type" kind="select" options="seq, par"></property>
|
||||
</x-meta>
|
|
@ -0,0 +1,117 @@
|
|||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="polymer-animation.html">
|
||||
|
||||
<polymer-element name="polymer-animation-group" extends="polymer-animation" attributes="type">
|
||||
<script>
|
||||
(function() {
|
||||
var ANIMATION_GROUPS = {
|
||||
'par': ParGroup,
|
||||
'seq': SeqGroup
|
||||
};
|
||||
/**
|
||||
* @module Animation
|
||||
*/
|
||||
/**
|
||||
* Component for a group of animations.
|
||||
*
|
||||
* @class polymer-animation-group
|
||||
*/
|
||||
Polymer('polymer-animation-group', {
|
||||
/**
|
||||
* If specified the target will be assigned to all child animations.
|
||||
* @property target
|
||||
* @type HTMLElement|Node
|
||||
* @default null
|
||||
*/
|
||||
targetSelector: '',
|
||||
/**
|
||||
* If specified and not "auto" the duration will apply to the group
|
||||
* and propagate to any child animations that is not a group and does
|
||||
* not specify a duration.
|
||||
* @property duration
|
||||
* @type number
|
||||
* @default "auto"
|
||||
*/
|
||||
duration: 'auto',
|
||||
/**
|
||||
* Group type. 'par' for parallel and 'seq' for sequence.
|
||||
* @property type
|
||||
* @type String
|
||||
* @default 'par'
|
||||
*/
|
||||
type: 'par',
|
||||
typeChanged: function() {
|
||||
this.apply();
|
||||
},
|
||||
targetChanged: function() {
|
||||
// Only propagate target to children animations if it's defined.
|
||||
if (this.target) {
|
||||
this.doOnChildren(function(c) {
|
||||
c.target = this.target;
|
||||
}.bind(this));
|
||||
}
|
||||
},
|
||||
durationChanged: function() {
|
||||
if (this.duration && this.duration !== 'auto') {
|
||||
this.doOnChildren(function(c) {
|
||||
// Propagate to children that is not a group and has no
|
||||
// duration specified.
|
||||
if (!c.type && (!c.duration || c.duration === 'auto')) {
|
||||
c.duration = this.duration;
|
||||
}
|
||||
}.bind(this));
|
||||
}
|
||||
},
|
||||
doOnChildren: function(inFn) {
|
||||
var children = this.children;
|
||||
if (!children.length) {
|
||||
children = this.webkitShadowRoot ? this.webkitShadowRoot.childNodes : [];
|
||||
}
|
||||
Array.prototype.forEach.call(children, function(c) {
|
||||
// TODO <template> in the way
|
||||
c.apply && inFn(c);
|
||||
}, this);
|
||||
},
|
||||
makeAnimation: function() {
|
||||
return new ANIMATION_GROUPS[this.type](this.childAnimations, this.timingProps);
|
||||
},
|
||||
hasTarget: function() {
|
||||
var ht = this.target !== null;
|
||||
if (!ht) {
|
||||
this.doOnChildren(function(c) {
|
||||
ht = ht || c.hasTarget();
|
||||
}.bind(this));
|
||||
}
|
||||
return ht;
|
||||
},
|
||||
apply: function() {
|
||||
// Propagate target and duration to child animations first.
|
||||
this.durationChanged();
|
||||
this.targetChanged();
|
||||
this.doOnChildren(function(c) {
|
||||
c.apply();
|
||||
});
|
||||
return this.super();
|
||||
},
|
||||
get childAnimationElements() {
|
||||
var list = [];
|
||||
this.doOnChildren(function(c) {
|
||||
if (c.makeAnimation) {
|
||||
list.push(c);
|
||||
}
|
||||
});
|
||||
return list;
|
||||
},
|
||||
get childAnimations() {
|
||||
var list = [];
|
||||
this.doOnChildren(function(c) {
|
||||
if (c.animation) {
|
||||
list.push(c.animation);
|
||||
}
|
||||
});
|
||||
return list;
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,32 @@
|
|||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<polymer-element name="polymer-animation-keyframe" attributes="offset value easing">
|
||||
<script>
|
||||
/**
|
||||
* Defines a keyframe in an animation. Its children should be
|
||||
* `<polymer-animation-prop>` elements specifying the css
|
||||
* property value at the keyframe.
|
||||
*
|
||||
* @class polymer-animation-keyframe
|
||||
*/
|
||||
/**
|
||||
* From 0 to 1.
|
||||
* @property offset
|
||||
* @type Number
|
||||
*/
|
||||
Polymer('polymer-animation-keyframe', {
|
||||
get properties() {
|
||||
var props = {};
|
||||
var children = this.querySelectorAll('polymer-animation-prop');
|
||||
Array.prototype.forEach.call(children, function(c) {
|
||||
props[c.name] = c.value;
|
||||
});
|
||||
if (this.offset !== null) {
|
||||
props.offset = this.offset;
|
||||
}
|
||||
return props;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<polymer-element name="polymer-animation-prop" attributes="name value">
|
||||
<script>
|
||||
/**
|
||||
* A CSS property and value to use in a `<polymer-animation-keyframe>`.
|
||||
*
|
||||
* @class polymer-animation-prop
|
||||
*/
|
||||
/**
|
||||
* CSS property name.
|
||||
* @property name
|
||||
* @type String
|
||||
* @required
|
||||
*/
|
||||
/**
|
||||
* CSS property value.
|
||||
* @property value
|
||||
* @required
|
||||
*/
|
||||
Polymer('polymer-animation-prop');
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,301 @@
|
|||
<link rel="import" href="../polymer/polymer.html">
|
||||
<link rel="import" href="web-animations.html">
|
||||
<link rel="import" href="polymer-animation-keyframe.html">
|
||||
<link rel="import" href="polymer-animation-prop.html">
|
||||
|
||||
<polymer-element name="polymer-animation" attributes="target keyframes sample composite duration fill easing iterationStart iterationCount delay direction autoplay targetSelector">
|
||||
<script>
|
||||
(function() {
|
||||
function findTarget(inSelector, inNode) {
|
||||
var p = inNode;
|
||||
var target;
|
||||
while (p && !p.host && p !== document) {
|
||||
p = p.parentNode;
|
||||
}
|
||||
if (p) {
|
||||
target = p.querySelector(inSelector);
|
||||
}
|
||||
if (!target && p && p.host) {
|
||||
target = findTarget(inSelector, p.host);
|
||||
}
|
||||
return target;
|
||||
};
|
||||
function toNumber(value, allowInfinity) {
|
||||
return (allowInfinity && value === 'Infinity') ? Number.POSITIVE_INFINITY : Number(value);
|
||||
};
|
||||
/**
|
||||
* WebAnimations module.
|
||||
* @module Animation
|
||||
* @main animation
|
||||
* @example toolkitchen/labs/animation2/grid-fade.html
|
||||
* @example toolkitchen/labs/animation2/group.html
|
||||
*/
|
||||
/**
|
||||
* Component for a single animation.
|
||||
*
|
||||
* A animation component to fade out an element:
|
||||
*
|
||||
* <polymer-animation id="fadeout">
|
||||
* <polymer-animation-keyframe offset="0">
|
||||
* <polymer-animation-prop name="opacity" value="0">
|
||||
* </polymer-animation-prop>
|
||||
* </polymer-animation-keyframe>
|
||||
* <polymer-animation-keyframe offset="1">
|
||||
* <polymer-animation-prop name="opacity" value="1">
|
||||
* </polymer-animation-prop>
|
||||
* </polymer-animation-keyframe>
|
||||
* </polymer-animation>
|
||||
* @class polymer-animation
|
||||
*/
|
||||
/**
|
||||
* Fired when the animation starts
|
||||
* @event polymer-animation-start
|
||||
*
|
||||
* Fired when the animation completes
|
||||
* @event polymer-animation-end
|
||||
*
|
||||
* Fired when the web animation object changes.
|
||||
* @event polymer-animation-change
|
||||
*
|
||||
*/
|
||||
Polymer('polymer-animation', {
|
||||
/**
|
||||
* One or more nodes to animate.
|
||||
* @property target
|
||||
* @type HTMLElement|Node|Array<HTMLElement|Node>
|
||||
*/
|
||||
target: null,
|
||||
/**
|
||||
* Selector for the node being animated.
|
||||
* @property targetSelector
|
||||
* @type String
|
||||
*/
|
||||
targetSelector: '',
|
||||
// animation
|
||||
/**
|
||||
* Animation keyframes specified as an array of dictionaries of
|
||||
* <css properties>:<array of values> pairs. For example,
|
||||
* @property keyframes
|
||||
* @type Object
|
||||
*/
|
||||
keyframes: null,
|
||||
/**
|
||||
* A custom animation function. Either provide this or keyframes.
|
||||
* @property sample
|
||||
* @type Function
|
||||
*/
|
||||
sample: null,
|
||||
//accumulate: null, // not working in polyfill
|
||||
/**
|
||||
* The composition behavior. "replace", "add" or "merge".
|
||||
* @property composite
|
||||
* @type "replace"|"add"|"merge"
|
||||
* @default "replace"
|
||||
*/
|
||||
composite: 'replace',
|
||||
// timing
|
||||
/**
|
||||
* Animation duration in milliseconds, 'infinity' or 'auto'. 'auto'
|
||||
* means use the animation's intrinsic duration.
|
||||
* @property duration
|
||||
* @type Number|"Infinity"|"auto"
|
||||
* @default "auto"
|
||||
*/
|
||||
duration: 'auto',
|
||||
/**
|
||||
* "none", "forwards", "backwards", "both" or "auto". When set to
|
||||
* "auto", the fill is "none" for a polymer-animation and "both"
|
||||
* for a polymer-animation-group.
|
||||
* @property fill
|
||||
* @type "none"|"forwards"|"backwards"|"both"|"auto"
|
||||
* @default "auto"
|
||||
*/
|
||||
fill: 'auto',
|
||||
/**
|
||||
* A transition timing function.
|
||||
* @property easing
|
||||
* @type "linear"|"ease"|"ease-in"|"ease-out"|"ease-in-out"|
|
||||
* "step-start"|"step-middle"|"step-end"
|
||||
* @default "linear"
|
||||
*/
|
||||
easing: 'linear',
|
||||
/**
|
||||
* Number of iterations into the timed item in which to begin
|
||||
* the animation. e.g. 0.5 will cause the animation to begin
|
||||
* halfway through the first iteration.
|
||||
* @property iterationStart
|
||||
* @type Number
|
||||
* @default 0
|
||||
*/
|
||||
iterationStart: 0,
|
||||
/**
|
||||
* @property iterationCount
|
||||
* @type Number|'Infinity'
|
||||
* @default 1
|
||||
*/
|
||||
iterationCount: 1,
|
||||
/**
|
||||
* Delay in milliseconds.
|
||||
* @property delay
|
||||
* @type Number
|
||||
* @default 0
|
||||
*/
|
||||
delay: 0,
|
||||
/**
|
||||
* @property direction
|
||||
* @type "normal"|"reverse"|"alternate"|"alternate-reverse"
|
||||
* @default "normal"
|
||||
*/
|
||||
direction: 'normal',
|
||||
/**
|
||||
* @property autoplay
|
||||
* @type Boolean
|
||||
* @default false
|
||||
*/
|
||||
autoplay: false,
|
||||
animation: false,
|
||||
observe: {
|
||||
target: 'apply',
|
||||
keyframes: 'apply',
|
||||
sample: 'apply',
|
||||
composite: 'apply',
|
||||
duration: 'apply',
|
||||
fill: 'apply',
|
||||
easing: 'apply',
|
||||
iterationCount: 'apply',
|
||||
delay: 'apply',
|
||||
direction: 'apply',
|
||||
autoplay: 'apply'
|
||||
},
|
||||
ready: function() {
|
||||
this.apply();
|
||||
},
|
||||
/**
|
||||
* Plays the animation.
|
||||
* @method play
|
||||
*/
|
||||
play: function() {
|
||||
this.apply();
|
||||
if (this.animation && !this.autoplay) {
|
||||
this.bindAnimationEvents();
|
||||
this.player = document.timeline.play(this.animation);
|
||||
return this.player;
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Stops the animation.
|
||||
* @method cancel
|
||||
*/
|
||||
cancel: function() {
|
||||
if (this.player) {
|
||||
this.player.source = null;
|
||||
}
|
||||
},
|
||||
hasTarget: function() {
|
||||
return this.target !== null;
|
||||
},
|
||||
apply: function() {
|
||||
this.animation = null;
|
||||
this.animation = this.makeAnimation();
|
||||
if (this.autoplay && this.animation) {
|
||||
this.play();
|
||||
}
|
||||
return this.animation;
|
||||
},
|
||||
makeSingleAnimation: function(target) {
|
||||
// XXX(yvonne): for selecting all the animated elements.
|
||||
target.classList.add('polymer-animation-target');
|
||||
return new Animation(target, this.animationEffect, this.timingProps);
|
||||
},
|
||||
makeAnimation: function() {
|
||||
// this.target && console.log('makeAnimation target', this.target, 'animation', this.animationEffect, 'timing', this.timingProps);
|
||||
if (!this.target) {
|
||||
return null;
|
||||
}
|
||||
var animation;
|
||||
if (Array.isArray(this.target)) {
|
||||
var array = [];
|
||||
this.target.forEach(function(t) {
|
||||
array.push(this.makeSingleAnimation(t));
|
||||
}.bind(this));
|
||||
animation = new ParGroup(array);
|
||||
} else {
|
||||
animation = this.makeSingleAnimation(this.target);
|
||||
}
|
||||
return animation;
|
||||
},
|
||||
animationChanged: function() {
|
||||
// TODO: attributes are not case sensitive.
|
||||
// TODO: Sending 'this' with the event because if the children is
|
||||
// in ShadowDOM the sender becomes the shadow host.
|
||||
this.fire('polymer-animation-change', this);
|
||||
},
|
||||
targetSelectorChanged: function() {
|
||||
if (this.targetSelector) {
|
||||
this.target = findTarget(this.targetSelector, this);
|
||||
}
|
||||
},
|
||||
targetChanged: function(old) {
|
||||
if (old) {
|
||||
old.classList.remove('polymer-animation-target');
|
||||
}
|
||||
},
|
||||
get timingProps() {
|
||||
var props = {};
|
||||
var timing = {
|
||||
fill: {},
|
||||
easing: {},
|
||||
delay: {isNumber: true},
|
||||
iterationCount: {isNumber: true, allowInfinity: true},
|
||||
direction: {},
|
||||
duration: {isNumber: true}
|
||||
};
|
||||
for (t in timing) {
|
||||
if (this[t] !== null) {
|
||||
var name = timing[t].property || t;
|
||||
props[name] = timing[t].isNumber && this[t] !== 'auto' ?
|
||||
toNumber(this[t], timing[t].allowInfinity) : this[t];
|
||||
}
|
||||
}
|
||||
return props;
|
||||
},
|
||||
get animationEffect() {
|
||||
var props = {};
|
||||
var frames = [];
|
||||
var effect;
|
||||
if (this.keyframes) {
|
||||
frames = this.keyframes;
|
||||
} else if (!this.sample) {
|
||||
var children = this.querySelectorAll('polymer-animation-keyframe');
|
||||
if (children.length === 0) {
|
||||
children = this.shadowRoot.querySelectorAll('polymer-animation-keyframe');
|
||||
}
|
||||
Array.prototype.forEach.call(children, function(c) {
|
||||
frames.push(c.properties);
|
||||
});
|
||||
}
|
||||
if (this.sample) {
|
||||
effect = {sample: this.sample};
|
||||
} else {
|
||||
effect = new KeyframeEffect(frames, this.composite);
|
||||
}
|
||||
return effect;
|
||||
},
|
||||
bindAnimationEvents: function() {
|
||||
if (!this.animation.onstart) {
|
||||
this.animation.onstart = this.animationStartHandler.bind(this);
|
||||
}
|
||||
if (!this.animation.onend) {
|
||||
this.animation.onend = this.animationEndHandler.bind(this);
|
||||
}
|
||||
},
|
||||
animationStartHandler: function() {
|
||||
this.fire('polymer-animation-start');
|
||||
},
|
||||
animationEndHandler: function() {
|
||||
this.fire('polymer-animation-end');
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,15 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-blink" extends="polymer-animation">
|
||||
<script>
|
||||
Polymer('polymer-blink', {
|
||||
targetSelector: '',
|
||||
duration: 0.7,
|
||||
iterationCount: 'Infinity',
|
||||
easing: 'cubic-bezier(1.0,0,0,1.0)',
|
||||
keyframes: [
|
||||
{opacity: 1},
|
||||
{opacity: 0}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,29 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-bounce" extends="polymer-animation">
|
||||
<script>
|
||||
Polymer('polymer-bounce', {
|
||||
targetSelector: '',
|
||||
duration: 1,
|
||||
magnitude: '-30px',
|
||||
ready: function() {
|
||||
this.super();
|
||||
this.magnitudeChanged();
|
||||
},
|
||||
magnitudeChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
generate: function() {
|
||||
var parsed = this.magnitude.match(/([\-0-9]+)(.*)/);
|
||||
this.keyframes = [
|
||||
{offset: 0, transform: 'translateY(0)'},
|
||||
{offset: 0.2, transform: 'translateY(0)'},
|
||||
{offset: 0.4, transform: 'translateY(' + this.magnitude + ')'},
|
||||
{offset: 0.5, transform: 'translateY(0)'},
|
||||
{offset: 0.6, transform:'translateY(' + Number(parsed[1]) / 2 + parsed[2] + ')'},
|
||||
{offset: 0.8, transform: 'translateY(0)'},
|
||||
{offset: 1, transform: 'translateY(0)'}
|
||||
];
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,17 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-fadein" extends="polymer-animation" duration="0.5">
|
||||
<template>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="0">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="opacity" value="1">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<content></content>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('polymer-fadein');
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,11 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-fadeout" extends="polymer-animation" duration="0.5">
|
||||
<script>
|
||||
Polymer('polymer-fadeout', {
|
||||
keyframes: [
|
||||
{opacity: 1},
|
||||
{opacity: 0}
|
||||
]
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
36
pkg/polymer/lib/elements/polymer-animation/polymer-flip.html
Normal file
36
pkg/polymer/lib/elements/polymer-animation/polymer-flip.html
Normal file
|
@ -0,0 +1,36 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-flip" extends="polymer-animation" attributes="axis">
|
||||
<script>
|
||||
Polymer('polymer-flip', {
|
||||
axis: 'x',
|
||||
duration: 0.5,
|
||||
ready: function() {
|
||||
this.generate();
|
||||
},
|
||||
axisChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
generate: function() {
|
||||
var isY = this.axis === 'y' || this.axis === 'Y';
|
||||
var rotate = isY ? 'rotateY' : 'rotateX';
|
||||
var transZ = isY ? '150px' : '50px';
|
||||
this.keyframes = [{
|
||||
offset: 0,
|
||||
transform: 'perspective(400px) translateZ(0px) ' + rotate + '(0deg) scale(1)'
|
||||
}, {
|
||||
offset: 0.4,
|
||||
transform: 'perspective(400px) translateZ(' + transZ + ') ' + rotate + '(170deg) scale(1)'
|
||||
}, {
|
||||
offset: 0.5,
|
||||
transform: 'perspective(400px) translateZ(' + transZ + ') ' + rotate + '(190deg) scale(1)'
|
||||
}, {
|
||||
offset: 0.8,
|
||||
transform: 'perspective(400px) translateZ(0px) ' + rotate + '(360deg) scale(.95)'
|
||||
}, {
|
||||
offset: 1,
|
||||
transform: 'perspective(400px) translateZ(0px) ' + rotate + '(360deg) scale(1)'
|
||||
}];
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,31 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-scale" extends="polymer-animation" attributes="fromX fromY toX toY">
|
||||
<template>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('polymer-scale', {
|
||||
fromX: '1',
|
||||
fromY: '1',
|
||||
toX: '1',
|
||||
toY: '1',
|
||||
fromXChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
fromYChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
toXChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
toYChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
generate: function() {
|
||||
this.keyframes = [
|
||||
{transform: 'scale(' + this.fromX + ',' + this.fromY + ')'},
|
||||
{transform: 'scale(' + this.toX + ',' + this.toY + ')'}
|
||||
];
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,74 @@
|
|||
<link rel="import" href="polymer-animation-group.html">
|
||||
<polymer-element name="polymer-shake" extends="polymer-animation-group">
|
||||
<template>
|
||||
<polymer-animation duration="{{period}}">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="translateX(0px)">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="{{negTransform}}">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
<polymer-animation duration="{{shakeDuration}}" iterationCount="{{shakeIterations}}">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="{{negTransform}}">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="{{posTransform}}">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="{{negTransform}}">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
<polymer-animation duration="{{period}}">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="{{negTransform}}">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="translateX(0px)">
|
||||
</polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
<content></content>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('polymer-shake', {
|
||||
type: 'seq',
|
||||
targetSelector: '',
|
||||
duration: 0.3,
|
||||
magnitude: '10px',
|
||||
period: 0.1,
|
||||
easing: 'ease-in',
|
||||
ready: function() {
|
||||
this.super();
|
||||
this.magnitudeChanged();
|
||||
this.periodChanged();
|
||||
},
|
||||
durationChanged: function() {
|
||||
this.super();
|
||||
this.generate();
|
||||
},
|
||||
magnitudeChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
periodChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
generate: function() {
|
||||
this.negTransform = 'translateX(-' + this.magnitude + ')';
|
||||
this.posTransform = 'translateX(' + this.magnitude + ')';
|
||||
this.shakeDuration = this.period * 2;
|
||||
this.shakeIterations = this.duration === 'Infinity' ? this.duration : Math.ceil(this.duration / this.shakeDuration);
|
||||
},
|
||||
get timingProps() {
|
||||
return {};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,31 @@
|
|||
<link rel="import" href="polymer-animation.html">
|
||||
<polymer-element name="polymer-translate" extends="polymer-animation" attributes="fromX fromY toX toY">
|
||||
<template>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('polymer-translate', {
|
||||
fromX: '0',
|
||||
fromY: '0',
|
||||
toX: '0',
|
||||
toY: '0',
|
||||
fromXChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
fromYChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
toXChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
toYChanged: function() {
|
||||
this.generate();
|
||||
},
|
||||
generate: function() {
|
||||
this.keyframes = [
|
||||
{transform: 'translate3d(' + this.fromX + ',' + this.fromY + ', 0)'},
|
||||
{transform: 'translate3d(' + this.toX + ',' + this.toY + ', 0)'}
|
||||
];
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
42
pkg/polymer/lib/elements/polymer-animation/test.html
Normal file
42
pkg/polymer/lib/elements/polymer-animation/test.html
Normal file
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<script src="../../polymer/polymer.js"></script>
|
||||
<link rel="import" href="polymer-animation-group.html">
|
||||
</head>
|
||||
<body>
|
||||
<polymer-element name="transition-hslide-scale-out" extends="polymer-animation-group" noscript>
|
||||
<template>
|
||||
<polymer-animation id="scale-out" duration="0.5">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="scale(1)"></polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="scale(0.8)"></polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
<polymer-animation id="hslide-in" duration="0.5">
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="translateX(100%)"></polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
<polymer-animation-keyframe>
|
||||
<polymer-animation-prop name="transform" value="translateX(0)"></polymer-animation-prop>
|
||||
</polymer-animation-keyframe>
|
||||
</polymer-animation>
|
||||
</template>
|
||||
</polymer-element>
|
||||
|
||||
<transition-hslide-scale-out></transition-hslide-scale-out>
|
||||
<div>Hi!</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('polymer-ready', function() {
|
||||
var a = document.querySelector('transition-hslide-scale-out');
|
||||
a.target = document.querySelector('div');
|
||||
setTimeout(function() {
|
||||
a.play();
|
||||
}, 50);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1 @@
|
|||
<script src="../web-animations-js/web-animations.js"></script>
|
17
pkg/polymer/lib/elements/polymer-collapse/.bower.json
Normal file
17
pkg/polymer/lib/elements/polymer-collapse/.bower.json
Normal file
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "polymer-collapse",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
},
|
||||
"homepage": "https://github.com/Polymer/polymer-collapse",
|
||||
"_release": "4852d16b3e",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "4852d16b3ecb5b54f37f8db89c1cfdd3175ae3de"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-collapse.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-collapse"
|
||||
}
|
9
pkg/polymer/lib/elements/polymer-collapse/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-collapse/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-collapse/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-collapse/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-collapse/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-collapse/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
7
pkg/polymer/lib/elements/polymer-collapse/bower.json
Normal file
7
pkg/polymer/lib/elements/polymer-collapse/bower.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"name": "polymer-collapse",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
}
|
||||
}
|
52
pkg/polymer/lib/elements/polymer-collapse/demo.html
Normal file
52
pkg/polymer/lib/elements/polymer-collapse/demo.html
Normal file
|
@ -0,0 +1,52 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer-collapse</title>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="polymer-collapse.html">
|
||||
<style>
|
||||
.box {
|
||||
background: #eee;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body unresolved>
|
||||
<section style="background: blue; width: 800px;">
|
||||
<button onclick="document.querySelector('#collapse1').toggle()">toggle collapse</button>
|
||||
<div id="box1" class="box" style="height: 300px;">
|
||||
<div class="content">Forma temperiemque cornua sidera dissociata cornua recessit innabilis ligavit: solidumque coeptis nullus caelum sponte phoebe di regat mentisque tanta austro capacius amphitrite sui quin postquam semina fossae liquidum umor galeae coeptis caligine liberioris quin liquidum matutinis invasit posset: flexi glomeravit radiis certis invasit oppida postquam onerosior inclusum dominari opifex terris pace finxit quam aquae nunc sine altae auroram quam habentem homo totidemque scythiam in pondus ensis tegit caecoque poena lapidosos humanas coeperunt poena aetas totidem nec natura aethera locavit caelumque distinxit animalibus phoebe cingebant moderantum porrexerat terrae possedit sua sole diu summaque obliquis melioris orbem</div>
|
||||
</div>
|
||||
<polymer-collapse id="collapse1" closed fixedSize targetId="box1"></polymer-collapse>
|
||||
</section>
|
||||
<section style="background: green; width: 800px;">
|
||||
<button onclick="document.querySelector('#collapse2').toggle()">toggle collapse</button>
|
||||
<div id="box2" class="box">
|
||||
<div class="content">Coercuit iunctarum vix sic aberant spisso imagine litem cetera nubes ambitae tanta usu circumfuso fulminibus umentia rectumque iuga pluviaque meis semina regat ne campoque meis coeperunt nix cura iunctarum ligavit: secant ventos seductaque permisit sic iunctarum locoque his coeptis tum terras animalia recepta aethera cornua invasit tollere videre tonitrua humanas otia tuba alta dissociata sanctius adsiduis inclusum caesa ita onus sine pluviaque litem manebat fixo extendi ubi inposuit cum sublime membra undas orba forma deducite aethera turba coercuit retinebat obliquis bracchia nisi mentisque origine peregrinum manebat</div>
|
||||
<section style="background: lightgreen;">
|
||||
<button onclick="document.querySelector('#collapse3').toggle()">toggle collapse</button>
|
||||
<div id="box3" class="box">
|
||||
<div class="content">Forma temperiemque cornua sidera dissociata cornua recessit innabilis ligavit: solidumque coeptis nullus caelum sponte phoebe di regat mentisque tanta austro capacius amphitrite sui quin postquam semina fossae liquidum umor galeae coeptis caligine liberioris quin liquidum matutinis invasit posset: flexi glomeravit radiis certis invasit oppida postquam onerosior inclusum dominari opifex terris pace finxit quam aquae nunc sine altae auroram quam habentem homo totidemque scythiam in pondus ensis tegit caecoque poena lapidosos humanas coeperunt poena aetas totidem nec natura aethera locavit caelumque distinxit animalibus phoebe cingebant moderantum porrexerat terrae possedit sua sole diu summaque obliquis melioris orbem</div>
|
||||
<section style="background: #00FF99;">
|
||||
<button onclick="document.querySelector('#collapse4').toggle()">toggle collapse</button>
|
||||
<div id="box4" class="box">
|
||||
<div class="content">Forma temperiemque cornua sidera dissociata cornua recessit innabilis ligavit: solidumque coeptis nullus caelum sponte phoebe di regat mentisque tanta austro capacius amphitrite sui quin postquam semina fossae liquidum umor galeae coeptis caligine liberioris quin liquidum matutinis invasit posset: flexi glomeravit radiis certis invasit oppida postquam onerosior inclusum dominari opifex terris pace finxit quam aquae nunc sine altae auroram quam habentem homo totidemque scythiam in pondus ensis tegit caecoque poena lapidosos humanas coeperunt poena aetas totidem nec natura aethera locavit caelumque distinxit animalibus phoebe cingebant moderantum porrexerat terrae possedit sua sole diu summaque obliquis melioris orbem</div>
|
||||
</div>
|
||||
<polymer-collapse id="collapse4" closed targetId="box4"></polymer-collapse>
|
||||
</section>
|
||||
</div>
|
||||
<polymer-collapse id="collapse3" targetId="box3"></polymer-collapse>
|
||||
</section>
|
||||
<div class="content">Obstabatque cingebant nitidis rapidisque cepit moderantum discordia habentia frigore solidumque fert inter caecoque sine coeperunt corpore quarum fluminaque coercuit vultus animal austro quem os sectamque animus origo solidumque quoque melioris adspirate recepta utramque rapidisque caelumque orba unus pluviaque erant mutastis gravitate illic quisque alta calidis speciem mixtam ante contraria duae</div>
|
||||
</div>
|
||||
<polymer-collapse id="collapse2" closed targetId="box2"></polymer-collapse>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
127
pkg/polymer/lib/elements/polymer-collapse/docs.json
Normal file
127
pkg/polymer/lib/elements/polymer-collapse/docs.json
Normal file
|
@ -0,0 +1,127 @@
|
|||
{
|
||||
"project": {
|
||||
"name": "Docs",
|
||||
"description": "Docs"
|
||||
},
|
||||
"files": {
|
||||
"..\\..\\polymer-collapse\\polymer-collapse.html": {
|
||||
"name": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"modules": {
|
||||
"Polymer Elements": 1
|
||||
},
|
||||
"classes": {
|
||||
"polymer-collapse": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {}
|
||||
}
|
||||
},
|
||||
"modules": {
|
||||
"Polymer Elements": {
|
||||
"name": "Polymer Elements",
|
||||
"submodules": {},
|
||||
"classes": {
|
||||
"polymer-collapse": 1
|
||||
},
|
||||
"fors": {},
|
||||
"namespaces": {},
|
||||
"tag": "module",
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 10
|
||||
}
|
||||
},
|
||||
"classes": {
|
||||
"polymer-collapse": {
|
||||
"name": "polymer-collapse",
|
||||
"shortname": "polymer-collapse",
|
||||
"classitems": [],
|
||||
"plugins": [],
|
||||
"extensions": [],
|
||||
"plugin_for": [],
|
||||
"extension_for": [],
|
||||
"module": "Polymer Elements",
|
||||
"namespace": "",
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 10,
|
||||
"description": "polymer-collapse is used to add collapsible behavior to the\ntarget element. It adjusts the height or width of the target element\nto make the element collapse and expand.\n\nExample:\n\n <button on-click=\"{{toggle}}\">toggle collapse</button>\n <div id=\"demo\">\n ...\n </div>\n <polymer-collapse id=\"collapse\" targetId=\"demo\"></polymer-collapse>\n\n ...\n\n toggle: function() {\n this.$.collapse.toggle();\n }"
|
||||
}
|
||||
},
|
||||
"classitems": [
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 48,
|
||||
"description": "The id of the target element.",
|
||||
"itemtype": "attribute",
|
||||
"name": "targetId",
|
||||
"type": "string",
|
||||
"default": "''",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 56,
|
||||
"description": "The target element.",
|
||||
"itemtype": "attribute",
|
||||
"name": "target",
|
||||
"type": "object",
|
||||
"default": "null",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 64,
|
||||
"description": "If true, the orientation is horizontal; otherwise is vertical.",
|
||||
"itemtype": "attribute",
|
||||
"name": "horizontal",
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 72,
|
||||
"description": "If true, the target element is hidden/collapsed.",
|
||||
"itemtype": "attribute",
|
||||
"name": "closed",
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 80,
|
||||
"description": "Collapsing/expanding animation duration in second.",
|
||||
"itemtype": "attribute",
|
||||
"name": "duration",
|
||||
"type": "number",
|
||||
"default": "0.33",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 88,
|
||||
"description": "If true, the size of the target element is fixed and is set\non the element. Otherwise it will try to \nuse auto to determine the natural size to use\nfor collapsing/expanding.",
|
||||
"itemtype": "attribute",
|
||||
"name": "fixedSize",
|
||||
"type": "boolean",
|
||||
"default": "false",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
},
|
||||
{
|
||||
"file": "..\\..\\polymer-collapse\\polymer-collapse.html",
|
||||
"line": 150,
|
||||
"description": "Toggle the closed state of the collapsible.",
|
||||
"itemtype": "method",
|
||||
"name": "toggle",
|
||||
"class": "polymer-collapse",
|
||||
"module": "Polymer Elements"
|
||||
}
|
||||
],
|
||||
"warnings": []
|
||||
}
|
64
pkg/polymer/lib/elements/polymer-collapse/index.html
Normal file
64
pkg/polymer/lib/elements/polymer-collapse/index.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer api</title>
|
||||
<style>
|
||||
html, body {
|
||||
font-family: Arial, sans-serif;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
[noviewer] [ifnoviewer] {
|
||||
display: block;
|
||||
}
|
||||
[detector], [ifnoviewer], [noviewer] [ifviewer] {
|
||||
display: none;
|
||||
}
|
||||
[ifviewer], [ifnoviewer] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
iframe {
|
||||
border: none;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#remote {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="../polymer-home-page/polymer-home-page.html">
|
||||
</head>
|
||||
<body>
|
||||
<img detector src="../polymer-home-page/bowager-logo.png" onerror="noviewer()">
|
||||
<polymer-home-page ifviewer></polymer-home-page>
|
||||
<div ifnoviewer>
|
||||
<span id="remote">[remote]</span>
|
||||
<iframe></iframe>
|
||||
</div>
|
||||
<!-- -->
|
||||
<script>
|
||||
var remoteDocs = 'http://turbogadgetry.com/bowertopia/components/';
|
||||
// if no local info viewer, load it remotely
|
||||
function noviewer() {
|
||||
document.body.setAttribute('noviewer', '');
|
||||
var path = location.pathname.split('/');
|
||||
var module = path.pop() || path.pop();
|
||||
document.querySelector('iframe').src = remoteDocs + module;
|
||||
document.querySelector('title').textContent = module;
|
||||
}
|
||||
// for testing only
|
||||
var opts = window.location.search;
|
||||
if (opts.indexOf('noviewer') >= 0) {
|
||||
noviewer();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,8 @@
|
|||
/*
|
||||
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.
|
||||
*/
|
||||
.polymer-collapse-closed {
|
||||
display: none;
|
||||
}
|
240
pkg/polymer/lib/elements/polymer-collapse/polymer-collapse.html
Normal file
240
pkg/polymer/lib/elements/polymer-collapse/polymer-collapse.html
Normal file
|
@ -0,0 +1,240 @@
|
|||
<!--
|
||||
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.
|
||||
-->
|
||||
<!--
|
||||
/**
|
||||
* @module Polymer Elements
|
||||
*/
|
||||
/**
|
||||
* polymer-collapse is used to add collapsible behavior to the
|
||||
* target element. It adjusts the height or width of the target element
|
||||
* to make the element collapse and expand.
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* <button on-click="{{toggle}}">toggle collapse</button>
|
||||
* <div id="demo">
|
||||
* ...
|
||||
* </div>
|
||||
* <polymer-collapse id="collapse" targetId="demo"></polymer-collapse>
|
||||
*
|
||||
* ...
|
||||
*
|
||||
* toggle: function() {
|
||||
* this.$.collapse.toggle();
|
||||
* }
|
||||
*
|
||||
* @class polymer-collapse
|
||||
*/
|
||||
-->
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<polymer-element name="polymer-collapse" attributes="targetId target horizontal closed duration fixedSize size">
|
||||
<template>
|
||||
<link rel="stylesheet" polymer-scope="controller" href="polymer-collapse.css">
|
||||
<link rel="stylesheet" href="polymer-collapse.css">
|
||||
<style>
|
||||
:host {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('polymer-collapse', {
|
||||
/**
|
||||
* The id of the target element.
|
||||
*
|
||||
* @attribute targetId
|
||||
* @type string
|
||||
* @default ''
|
||||
*/
|
||||
targetId: '',
|
||||
/**
|
||||
* The target element.
|
||||
*
|
||||
* @attribute target
|
||||
* @type object
|
||||
* @default null
|
||||
*/
|
||||
target: null,
|
||||
/**
|
||||
* If true, the orientation is horizontal; otherwise is vertical.
|
||||
*
|
||||
* @attribute horizontal
|
||||
* @type boolean
|
||||
* @default false
|
||||
*/
|
||||
horizontal: false,
|
||||
/**
|
||||
* If true, the target element is hidden/collapsed.
|
||||
*
|
||||
* @attribute closed
|
||||
* @type boolean
|
||||
* @default false
|
||||
*/
|
||||
closed: false,
|
||||
/**
|
||||
* Collapsing/expanding animation duration in second.
|
||||
*
|
||||
* @attribute duration
|
||||
* @type number
|
||||
* @default 0.33
|
||||
*/
|
||||
duration: 0.33,
|
||||
/**
|
||||
* If true, the size of the target element is fixed and is set
|
||||
* on the element. Otherwise it will try to
|
||||
* use auto to determine the natural size to use
|
||||
* for collapsing/expanding.
|
||||
*
|
||||
* @attribute fixedSize
|
||||
* @type boolean
|
||||
* @default false
|
||||
*/
|
||||
fixedSize: false,
|
||||
size: null,
|
||||
attached: function() {
|
||||
this.installControllerStyles();
|
||||
this.inDocument = true;
|
||||
this.async(function() {
|
||||
this.afterInitialUpdate = true;
|
||||
});
|
||||
},
|
||||
detached: function() {
|
||||
if (this.target) {
|
||||
this.removeListeners(this.target);
|
||||
}
|
||||
},
|
||||
targetIdChanged: function() {
|
||||
var p = this.parentNode;
|
||||
while (p.parentNode) {
|
||||
p = p.parentNode;
|
||||
}
|
||||
this.target = p.querySelector('#' + this.targetId);
|
||||
},
|
||||
targetChanged: function(old) {
|
||||
if (old) {
|
||||
this.removeListeners(old);
|
||||
}
|
||||
this.horizontalChanged();
|
||||
this.isTargetReady = !!this.target;
|
||||
if (this.target) {
|
||||
this.target.style.overflow = 'hidden';
|
||||
this.addListeners(this.target);
|
||||
// set polymer-collapse-closed class initially to hide the target
|
||||
this.toggleClosedClass(true);
|
||||
}
|
||||
// don't need to update if the size is already set and it's opened
|
||||
if (!this.fixedSize || !this.closed) {
|
||||
this.update();
|
||||
}
|
||||
},
|
||||
addListeners: function(node) {
|
||||
this.transitionEndListener = this.transitionEndListener ||
|
||||
this.transitionEnd.bind(this);
|
||||
node.addEventListener('webkitTransitionEnd', this.transitionEndListener);
|
||||
node.addEventListener('transitionend', this.transitionEndListener);
|
||||
},
|
||||
removeListeners: function(node) {
|
||||
node.removeEventListener('webkitTransitionEnd', this.transitionEndListener);
|
||||
node.removeEventListener('transitionend', this.transitionEndListener);
|
||||
},
|
||||
horizontalChanged: function() {
|
||||
this.dimension = this.horizontal ? 'width' : 'height';
|
||||
},
|
||||
closedChanged: function() {
|
||||
this.update();
|
||||
},
|
||||
/**
|
||||
* Toggle the closed state of the collapsible.
|
||||
*
|
||||
* @method toggle
|
||||
*/
|
||||
toggle: function() {
|
||||
this.closed = !this.closed;
|
||||
},
|
||||
setTransitionDuration: function(duration) {
|
||||
var s = this.target.style;
|
||||
s.webkitTransition = s.transition = duration ?
|
||||
(this.dimension + ' ' + duration + 's') : null;
|
||||
if (duration === 0) {
|
||||
this.async('transitionEnd');
|
||||
}
|
||||
},
|
||||
transitionEnd: function() {
|
||||
if (!this.closed && !this.fixedSize) {
|
||||
this.updateSize('auto', null);
|
||||
}
|
||||
this.setTransitionDuration(null);
|
||||
this.toggleClosedClass(this.closed);
|
||||
},
|
||||
toggleClosedClass: function(add) {
|
||||
this.hasClosedClass = add;
|
||||
this.target.classList.toggle('polymer-collapse-closed', add);
|
||||
},
|
||||
updateSize: function(size, duration, forceEnd) {
|
||||
if (duration) {
|
||||
this.calcSize();
|
||||
}
|
||||
this.setTransitionDuration(duration);
|
||||
var s = this.target.style;
|
||||
var nochange = s[this.dimension] === size;
|
||||
s[this.dimension] = size;
|
||||
// transitonEnd will not be called if the size has not changed
|
||||
if (forceEnd && nochange) {
|
||||
this.transitionEnd();
|
||||
}
|
||||
},
|
||||
update: function() {
|
||||
if (!this.target || !this.inDocument) {
|
||||
return;
|
||||
}
|
||||
if (!this.isTargetReady) {
|
||||
this.targetChanged();
|
||||
}
|
||||
this.horizontalChanged();
|
||||
this[this.closed ? 'hide' : 'show']();
|
||||
},
|
||||
calcSize: function() {
|
||||
return this.target.getBoundingClientRect()[this.dimension] + 'px';
|
||||
},
|
||||
getComputedSize: function() {
|
||||
return getComputedStyle(this.target)[this.dimension];
|
||||
},
|
||||
show: function() {
|
||||
this.toggleClosedClass(false);
|
||||
// for initial update, skip the expanding animation to optimize
|
||||
// performance e.g. skip calcSize
|
||||
if (!this.afterInitialUpdate) {
|
||||
this.transitionEnd();
|
||||
return;
|
||||
}
|
||||
if (!this.fixedSize) {
|
||||
this.updateSize('auto', null);
|
||||
var s = this.calcSize();
|
||||
this.updateSize(0, null);
|
||||
}
|
||||
this.async(function() {
|
||||
this.updateSize(this.size || s, this.duration, true);
|
||||
});
|
||||
},
|
||||
hide: function() {
|
||||
// don't need to do anything if it's already hidden
|
||||
if (this.hasClosedClass && !this.fixedSize) {
|
||||
return;
|
||||
}
|
||||
if (this.fixedSize) {
|
||||
// save the size before hiding it
|
||||
this.size = this.getComputedSize();
|
||||
} else {
|
||||
this.updateSize(this.calcSize(), null);
|
||||
}
|
||||
this.async(function() {
|
||||
this.updateSize(0, this.duration);
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
|
@ -0,0 +1,57 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer-collapse</title>
|
||||
<script src="../../../platform/platform.js"></script>
|
||||
<script src="../../../tools/test/htmltest.js"></script>
|
||||
<script src="../../../tools/test/chai/chai.js"></script>
|
||||
<link rel="import" href="../../polymer-collapse.html">
|
||||
</head>
|
||||
<body>
|
||||
<button onclick="document.querySelector('#collapse').toggle()">toggle collapse</button>
|
||||
<div id="box">
|
||||
Forma temperiemque cornua sidera dissociata cornua recessit innabilis ligavit: solidumque coeptis nullus caelum sponte phoebe di regat mentisque tanta austro capacius amphitrite sui quin postquam semina fossae liquidum umor galeae coeptis caligine liberioris quin liquidum matutinis invasit posset: flexi glomeravit radiis certis invasit oppida postquam onerosior inclusum dominari opifex terris pace finxit quam aquae nunc sine altae auroram quam habentem homo totidemque scythiam in pondus ensis tegit caecoque poena lapidosos humanas coeperunt poena aetas totidem nec natura aethera locavit caelumque distinxit animalibus phoebe cingebant moderantum porrexerat terrae possedit sua sole diu summaque obliquis melioris orbem
|
||||
</div>
|
||||
<polymer-collapse id="collapse" targetId="box" duration="0.1"></polymer-collapse>
|
||||
|
||||
<script>
|
||||
var assert = chai.assert;
|
||||
var delay = 200;
|
||||
document.addEventListener('polymer-ready', function() {
|
||||
var c = document.querySelector('#collapse');
|
||||
assert.equal(c.closed, false);
|
||||
Platform.flush();
|
||||
setTimeout(function() {
|
||||
var origH = getBoxComputedHeight();
|
||||
assert.notEqual(origH, 0);
|
||||
c.closed = true;
|
||||
Platform.flush();
|
||||
setTimeout(function() {
|
||||
// after closed, height is 0
|
||||
assert.equal(getBoxComputedHeight(), 0);
|
||||
// should be set to display: none
|
||||
assert.equal(getBoxComputedStyle().display, 'none');
|
||||
c.closed = false;
|
||||
Platform.flush();
|
||||
setTimeout(function() {
|
||||
// verify computed height
|
||||
assert.equal(getBoxComputedHeight(), origH);
|
||||
// after opened, height is set to 'auto'
|
||||
assert.equal(document.querySelector('#box').style.height, 'auto');
|
||||
done();
|
||||
}, delay);
|
||||
}, delay);
|
||||
}, delay);
|
||||
});
|
||||
|
||||
function getBoxComputedStyle() {
|
||||
var b = document.querySelector('#box');
|
||||
return getComputedStyle(b);
|
||||
}
|
||||
|
||||
function getBoxComputedHeight() {
|
||||
return parseInt(getBoxComputedStyle().height);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,9 @@
|
|||
/*
|
||||
* 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.
|
||||
*/
|
||||
|
||||
htmlSuite('polymer-collapse', function() {
|
||||
htmlTest('html/polymer-collapse.html');
|
||||
});
|
31
pkg/polymer/lib/elements/polymer-collapse/test/runner.html
Normal file
31
pkg/polymer/lib/elements/polymer-collapse/test/runner.html
Normal file
|
@ -0,0 +1,31 @@
|
|||
<!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>polymer-collapse Test Runner (Mocha)</title>
|
||||
<meta charset="UTF-8">
|
||||
<!-- -->
|
||||
<link rel="stylesheet" href="../../tools/test/mocha/mocha.css" />
|
||||
<script src="../../tools/test/mocha/mocha.js"></script>
|
||||
<script src="../../tools/test/chai/chai.js"></script>
|
||||
<script src="../../tools/test/mocha-htmltest.js"></script>
|
||||
<!-- -->
|
||||
<script src="../../platform/platform.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="mocha"></div>
|
||||
<script>
|
||||
mocha.setup({ui: 'tdd', slow: 1000, htmlbase: ''});
|
||||
</script>
|
||||
<!-- -->
|
||||
<script src="js/polymer-collapse.js"></script>
|
||||
<!-- -->
|
||||
<script>
|
||||
mocha.run();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
17
pkg/polymer/lib/elements/polymer-cookie/.bower.json
Normal file
17
pkg/polymer/lib/elements/polymer-cookie/.bower.json
Normal file
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "polymer-cookie",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
},
|
||||
"homepage": "https://github.com/Polymer/polymer-cookie",
|
||||
"_release": "cf78e8e822",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "cf78e8e8221bfd232dffdadc7a4251f632692c8a"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-cookie.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-cookie"
|
||||
}
|
9
pkg/polymer/lib/elements/polymer-cookie/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-cookie/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
1
pkg/polymer/lib/elements/polymer-cookie/CONTRIBUTING.md
Normal file
1
pkg/polymer/lib/elements/polymer-cookie/CONTRIBUTING.md
Normal file
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-cookie/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-cookie/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-cookie/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-cookie/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
7
pkg/polymer/lib/elements/polymer-cookie/bower.json
Normal file
7
pkg/polymer/lib/elements/polymer-cookie/bower.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"name": "polymer-cookie",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
}
|
||||
}
|
11
pkg/polymer/lib/elements/polymer-cookie/docs.json
Normal file
11
pkg/polymer/lib/elements/polymer-cookie/docs.json
Normal file
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"project": {
|
||||
"name": "Docs",
|
||||
"description": "Docs"
|
||||
},
|
||||
"files": {},
|
||||
"modules": {},
|
||||
"classes": {},
|
||||
"classitems": [],
|
||||
"warnings": []
|
||||
}
|
64
pkg/polymer/lib/elements/polymer-cookie/index.html
Normal file
64
pkg/polymer/lib/elements/polymer-cookie/index.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer api</title>
|
||||
<style>
|
||||
html, body {
|
||||
font-family: Arial, sans-serif;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
[noviewer] [ifnoviewer] {
|
||||
display: block;
|
||||
}
|
||||
[detector], [ifnoviewer], [noviewer] [ifviewer] {
|
||||
display: none;
|
||||
}
|
||||
[ifviewer], [ifnoviewer] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
iframe {
|
||||
border: none;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#remote {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="../polymer-home-page/polymer-home-page.html">
|
||||
</head>
|
||||
<body>
|
||||
<img detector src="../polymer-home-page/bowager-logo.png" onerror="noviewer()">
|
||||
<polymer-home-page ifviewer></polymer-home-page>
|
||||
<div ifnoviewer>
|
||||
<span id="remote">[remote]</span>
|
||||
<iframe></iframe>
|
||||
</div>
|
||||
<!-- -->
|
||||
<script>
|
||||
var remoteDocs = 'http://turbogadgetry.com/bowertopia/components/';
|
||||
// if no local info viewer, load it remotely
|
||||
function noviewer() {
|
||||
document.body.setAttribute('noviewer', '');
|
||||
var path = location.pathname.split('/');
|
||||
var module = path.pop() || path.pop();
|
||||
document.querySelector('iframe').src = remoteDocs + module;
|
||||
document.querySelector('title').textContent = module;
|
||||
}
|
||||
// for testing only
|
||||
var opts = window.location.search;
|
||||
if (opts.indexOf('noviewer') >= 0) {
|
||||
noviewer();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
82
pkg/polymer/lib/elements/polymer-cookie/polymer-cookie.html
Normal file
82
pkg/polymer/lib/elements/polymer-cookie/polymer-cookie.html
Normal file
|
@ -0,0 +1,82 @@
|
|||
<!--
|
||||
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.
|
||||
-->
|
||||
<link rel="import" href="../polymer/polymer.html">
|
||||
|
||||
<polymer-element name="polymer-cookie" attributes="name value expires secure domain path max-age">
|
||||
<template>
|
||||
<style>
|
||||
:host { display: none; }
|
||||
</style>
|
||||
</template>
|
||||
<script>
|
||||
(function() {
|
||||
var EXPIRE_NOW = 'Thu, 01 Jan 1970 00:00:00 GMT';
|
||||
var FOREVER = 'Fri, 31 Dec 9999 23:59:59 GMT';
|
||||
var cookieProps = ['expires', 'secure', 'max-age', 'domain', 'path'];
|
||||
Polymer('polymer-cookie', {
|
||||
expires: FOREVER,
|
||||
ready: function() {
|
||||
this.load();
|
||||
},
|
||||
parseCookie: function() {
|
||||
var pairs = document.cookie.split(/\s*;\s*/);
|
||||
var map = pairs.map(function(kv) {
|
||||
var eq = kv.indexOf('=');
|
||||
return {
|
||||
name: unescape(kv.slice(0, eq)),
|
||||
value: unescape(kv.slice(eq + 1))
|
||||
};
|
||||
});
|
||||
var nom = this.name;
|
||||
return map.filter(function(kv){ return kv.name === nom; })[0];
|
||||
},
|
||||
load: function() {
|
||||
var kv = this.parseCookie();
|
||||
this.value = kv && kv.value;
|
||||
},
|
||||
valueChanged: function() {
|
||||
this.expire = FOREVER;
|
||||
this.save();
|
||||
},
|
||||
// TODO(dfreedman): collapse these when 'multiple props -> single change function' exists in Polymer
|
||||
expiresChanged: function() {
|
||||
this.save();
|
||||
},
|
||||
secureChanged: function() {
|
||||
this.save();
|
||||
},
|
||||
domainChanged: function() {
|
||||
this.save();
|
||||
},
|
||||
pathChanged: function() {
|
||||
this.save();
|
||||
},
|
||||
maxAgeChanged: function() {
|
||||
this.save();
|
||||
},
|
||||
isCookieStored: function() {
|
||||
return Boolean(this.parseCookie());
|
||||
},
|
||||
deleteCookie: function() {
|
||||
this.expires = EXPIRE_NOW;
|
||||
},
|
||||
prepareProperties: function() {
|
||||
var prepared = '';
|
||||
for (var i = 0, k; i < cookieProps.length; i++) {
|
||||
k = cookieProps[i];
|
||||
if (this[k]) {
|
||||
prepared += (';' + k + '=' + this[k]);
|
||||
}
|
||||
}
|
||||
return prepared;
|
||||
},
|
||||
save: function() {
|
||||
document.cookie = escape(this.name) + '=' + escape(this.value) + this.prepareProperties();
|
||||
}
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</polymer-element>
|
44
pkg/polymer/lib/elements/polymer-elements/.bower.json
Normal file
44
pkg/polymer/lib/elements/polymer-elements/.bower.json
Normal file
|
@ -0,0 +1,44 @@
|
|||
{
|
||||
"name": "polymer-elements",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"dependencies": {
|
||||
"polymer-ajax": "Polymer/polymer-ajax#master",
|
||||
"polymer-anchor-point": "Polymer/polymer-anchor-point#master",
|
||||
"polymer-animation": "Polymer/polymer-animation#master",
|
||||
"polymer-collapse": "Polymer/polymer-collapse#master",
|
||||
"polymer-cookie": "Polymer/polymer-cookie#master",
|
||||
"polymer-file": "Polymer/polymer-file#master",
|
||||
"polymer-flex-layout": "Polymer/polymer-flex-layout#master",
|
||||
"polymer-google-jsapi": "Polymer/polymer-google-jsapi#master",
|
||||
"polymer-grid-layout": "Polymer/polymer-grid-layout#master",
|
||||
"polymer-jsonp": "Polymer/polymer-jsonp#master",
|
||||
"polymer-key-helper": "Polymer/polymer-key-helper#master",
|
||||
"polymer-layout": "Polymer/polymer-layout#master",
|
||||
"polymer-localstorage": "Polymer/polymer-localstorage#master",
|
||||
"polymer-media-query": "Polymer/polymer-media-query#master",
|
||||
"polymer-meta": "Polymer/polymer-meta#master",
|
||||
"polymer-mock-data": "Polymer/polymer-mock-data#master",
|
||||
"polymer-overlay": "Polymer/polymer-overlay#master",
|
||||
"polymer-page": "Polymer/polymer-page#master",
|
||||
"polymer-scrub": "Polymer/polymer-scrub#master",
|
||||
"polymer-selection": "Polymer/polymer-selection#master",
|
||||
"polymer-selector": "Polymer/polymer-selector#master",
|
||||
"polymer-shared-lib": "Polymer/polymer-shared-lib#master",
|
||||
"polymer-signals": "Polymer/polymer-signals#master",
|
||||
"polymer-view-source-link": "Polymer/polymer-view-source-link#master"
|
||||
},
|
||||
"license": "BSD",
|
||||
"private": true,
|
||||
"homepage": "https://github.com/Polymer/polymer-elements",
|
||||
"_release": "7dd1490e83",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "7dd1490e8339cc325588167d3932113856cc7c69"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-elements.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-elements"
|
||||
}
|
4
pkg/polymer/lib/elements/polymer-elements/.gitignore
vendored
Normal file
4
pkg/polymer/lib/elements/polymer-elements/.gitignore
vendored
Normal file
|
@ -0,0 +1,4 @@
|
|||
/node_modules
|
||||
/docs
|
||||
|
||||
/build.bat
|
9
pkg/polymer/lib/elements/polymer-elements/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-elements/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-elements/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-elements/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-elements/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-elements/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
34
pkg/polymer/lib/elements/polymer-elements/bower.json
Normal file
34
pkg/polymer/lib/elements/polymer-elements/bower.json
Normal file
|
@ -0,0 +1,34 @@
|
|||
{
|
||||
"name": "polymer-elements",
|
||||
"authors": [
|
||||
"The Polymer Authors"
|
||||
],
|
||||
"dependencies": {
|
||||
"polymer-ajax": "Polymer/polymer-ajax#master",
|
||||
"polymer-anchor-point": "Polymer/polymer-anchor-point#master",
|
||||
"polymer-animation": "Polymer/polymer-animation#master",
|
||||
"polymer-collapse": "Polymer/polymer-collapse#master",
|
||||
"polymer-cookie": "Polymer/polymer-cookie#master",
|
||||
"polymer-file": "Polymer/polymer-file#master",
|
||||
"polymer-flex-layout": "Polymer/polymer-flex-layout#master",
|
||||
"polymer-google-jsapi": "Polymer/polymer-google-jsapi#master",
|
||||
"polymer-grid-layout": "Polymer/polymer-grid-layout#master",
|
||||
"polymer-jsonp": "Polymer/polymer-jsonp#master",
|
||||
"polymer-key-helper": "Polymer/polymer-key-helper#master",
|
||||
"polymer-layout": "Polymer/polymer-layout#master",
|
||||
"polymer-localstorage": "Polymer/polymer-localstorage#master",
|
||||
"polymer-media-query": "Polymer/polymer-media-query#master",
|
||||
"polymer-meta": "Polymer/polymer-meta#master",
|
||||
"polymer-mock-data": "Polymer/polymer-mock-data#master",
|
||||
"polymer-overlay": "Polymer/polymer-overlay#master",
|
||||
"polymer-page": "Polymer/polymer-page#master",
|
||||
"polymer-scrub": "Polymer/polymer-scrub#master",
|
||||
"polymer-selection": "Polymer/polymer-selection#master",
|
||||
"polymer-selector": "Polymer/polymer-selector#master",
|
||||
"polymer-shared-lib": "Polymer/polymer-shared-lib#master",
|
||||
"polymer-signals": "Polymer/polymer-signals#master",
|
||||
"polymer-view-source-link": "Polymer/polymer-view-source-link#master"
|
||||
},
|
||||
"license": "BSD",
|
||||
"private": true
|
||||
}
|
11
pkg/polymer/lib/elements/polymer-elements/docs.json
Normal file
11
pkg/polymer/lib/elements/polymer-elements/docs.json
Normal file
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"project": {
|
||||
"name": "Docs",
|
||||
"description": "Docs"
|
||||
},
|
||||
"files": {},
|
||||
"modules": {},
|
||||
"classes": {},
|
||||
"classitems": [],
|
||||
"warnings": []
|
||||
}
|
24
pkg/polymer/lib/elements/polymer-elements/elements.html
Normal file
24
pkg/polymer/lib/elements/polymer-elements/elements.html
Normal file
|
@ -0,0 +1,24 @@
|
|||
<link rel="import" href="../polymer-ajax/polymer-ajax.html">
|
||||
<link rel="import" href="../polymer-anchor-point/polymer-anchor-point.html">
|
||||
<link rel="import" href="../polymer-animation/polymer-animation.html">
|
||||
<link rel="import" href="../polymer-collapse/polymer-collapse.html">
|
||||
<link rel="import" href="../polymer-cookie/polymer-cookie.html">
|
||||
<link rel="import" href="../polymer-file/polymer-file.html">
|
||||
<link rel="import" href="../polymer-flex-layout/polymer-flex-layout.html">
|
||||
<link rel="import" href="../polymer-google-jsapi/polymer-google-jsapi.html">
|
||||
<link rel="import" href="../polymer-grid-layout/polymer-grid-layout.html">
|
||||
<link rel="import" href="../polymer-jsonp/polymer-jsonp.html">
|
||||
<link rel="import" href="../polymer-key-helper/polymer-key-helper.html">
|
||||
<link rel="import" href="../polymer-layout/polymer-layout.html">
|
||||
<link rel="import" href="../polymer-localstorage/polymer-localstorage.html">
|
||||
<link rel="import" href="../polymer-media-query/polymer-media-query.html">
|
||||
<link rel="import" href="../polymer-meta/polymer-meta.html">
|
||||
<link rel="import" href="../polymer-mock-data/polymer-mock-data.html">
|
||||
<link rel="import" href="../polymer-overlay/polymer-overlay.html">
|
||||
<link rel="import" href="../polymer-page/polymer-page.html">
|
||||
<link rel="import" href="../polymer-scrub/polymer-scrub.html">
|
||||
<link rel="import" href="../polymer-selection/polymer-selection.html">
|
||||
<link rel="import" href="../polymer-selector/polymer-selector.html">
|
||||
<link rel="import" href="../polymer-shared-lib/polymer-shared-lib.html">
|
||||
<link rel="import" href="../polymer-signals/polymer-signals.html">
|
||||
<link rel="import" href="../polymer-view-source-link/polymer-view-source-link.html">
|
64
pkg/polymer/lib/elements/polymer-elements/index.html
Normal file
64
pkg/polymer/lib/elements/polymer-elements/index.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer api</title>
|
||||
<style>
|
||||
html, body {
|
||||
font-family: Arial, sans-serif;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
[noviewer] [ifnoviewer] {
|
||||
display: block;
|
||||
}
|
||||
[detector], [ifnoviewer], [noviewer] [ifviewer] {
|
||||
display: none;
|
||||
}
|
||||
[ifviewer], [ifnoviewer] {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
iframe {
|
||||
border: none;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#remote {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<script src="../platform/platform.js"></script>
|
||||
<link rel="import" href="../polymer-home-page/polymer-home-page.html">
|
||||
</head>
|
||||
<body>
|
||||
<img detector src="../polymer-home-page/bowager-logo.png" onerror="noviewer()">
|
||||
<polymer-home-page ifviewer></polymer-home-page>
|
||||
<div ifnoviewer>
|
||||
<span id="remote">[remote]</span>
|
||||
<iframe></iframe>
|
||||
</div>
|
||||
<!-- -->
|
||||
<script>
|
||||
var remoteDocs = 'http://turbogadgetry.com/bowertopia/components/';
|
||||
// if no local info viewer, load it remotely
|
||||
function noviewer() {
|
||||
document.body.setAttribute('noviewer', '');
|
||||
var path = location.pathname.split('/');
|
||||
var module = path.pop() || path.pop();
|
||||
document.querySelector('iframe').src = remoteDocs + module;
|
||||
document.querySelector('title').textContent = module;
|
||||
}
|
||||
// for testing only
|
||||
var opts = window.location.search;
|
||||
if (opts.indexOf('noviewer') >= 0) {
|
||||
noviewer();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
25
pkg/polymer/lib/elements/polymer-elements/metadata.html
Normal file
25
pkg/polymer/lib/elements/polymer-elements/metadata.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<link rel="import" href="../polymer-grid-layout/metadata.html">
|
||||
|
||||
<!--
|
||||
<x-meta id="polymer-ajax" label="Polymer Ajax"></x-meta>
|
||||
<x-meta id="polymer-animation" label="Polymer Animation"></x-meta>
|
||||
<x-meta id="polymer-collapse" label="Polymer Collapse"></x-meta>
|
||||
<x-meta id="polymer-file" label="Polymer File"></x-meta>
|
||||
<x-meta id="polymer-flex-layout" label="Polymer Flex Layout"></x-meta>
|
||||
<x-meta id="polymer-google-jsapi" label="Polymer Google JsApi"></x-meta>
|
||||
<x-meta id="polymer-grid-layout" label="Polymer Grid Layout">
|
||||
<property name="layout" kind="json"></property>
|
||||
</x-meta>
|
||||
<x-meta id="polymer-jsonp" label="Polymer JSONP"></x-meta>
|
||||
<x-meta id="polymer-key-helper" label="Polymer Key Helper"></x-meta>
|
||||
<x-meta id="polymer-layout" label="Polymer Layout"></x-meta>
|
||||
<x-meta id="polymer-localstorage" label="Polymer Local Storage"></x-meta>
|
||||
<x-meta id="polymer-media-query" label="Polymer Media Query"></x-meta>
|
||||
<x-meta id="polymer-meta" label="Polymer Meta"></x-meta>
|
||||
<x-meta id="polymer-mock-data" label="Polymer Mock Data"></x-meta>
|
||||
<x-meta id="polymer-overlay" label="Polymer Overlay"></x-meta>
|
||||
<x-meta id="polymer-page" label="Polymer Page"></x-meta>
|
||||
<x-meta id="polymer-selector" label="Polymer Selector"></x-meta>
|
||||
<x-meta id="polymer-shared-lib" label="Polymer Shared Lib"></x-meta>
|
||||
<x-meta id="polymer-view-source-link" label="Polymer View-Source Link"></x-meta>
|
||||
-->
|
|
@ -0,0 +1,37 @@
|
|||
<!--
|
||||
/**
|
||||
*
|
||||
* Single import for loading the standard set of `polymer-*` elements.
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* <!-- load numerous polymer elements -->
|
||||
* <link rel="import" href="components/polymer-elements/polymer-elements.html">
|
||||
*
|
||||
* @class polymer-elements
|
||||
*/
|
||||
-->
|
||||
<link rel="import" href="../polymer-ajax/polymer-ajax.html">
|
||||
<link rel="import" href="../polymer-anchor-point/polymer-anchor-point.html">
|
||||
<link rel="import" href="../polymer-animation/polymer-animation.html">
|
||||
<link rel="import" href="../polymer-collapse/polymer-collapse.html">
|
||||
<link rel="import" href="../polymer-cookie/polymer-cookie.html">
|
||||
<link rel="import" href="../polymer-file/polymer-file.html">
|
||||
<link rel="import" href="../polymer-flex-layout/polymer-flex-layout.html">
|
||||
<link rel="import" href="../polymer-google-jsapi/polymer-google-jsapi.html">
|
||||
<link rel="import" href="../polymer-grid-layout/polymer-grid-layout.html">
|
||||
<link rel="import" href="../polymer-jsonp/polymer-jsonp.html">
|
||||
<link rel="import" href="../polymer-key-helper/polymer-key-helper.html">
|
||||
<link rel="import" href="../polymer-layout/polymer-layout.html">
|
||||
<link rel="import" href="../polymer-localstorage/polymer-localstorage.html">
|
||||
<link rel="import" href="../polymer-media-query/polymer-media-query.html">
|
||||
<link rel="import" href="../polymer-meta/polymer-meta.html">
|
||||
<link rel="import" href="../polymer-mock-data/polymer-mock-data.html">
|
||||
<link rel="import" href="../polymer-overlay/polymer-overlay.html">
|
||||
<link rel="import" href="../polymer-page/polymer-page.html">
|
||||
<link rel="import" href="../polymer-scrub/polymer-scrub.html">
|
||||
<link rel="import" href="../polymer-selection/polymer-selection.html">
|
||||
<link rel="import" href="../polymer-selector/polymer-selector.html">
|
||||
<link rel="import" href="../polymer-shared-lib/polymer-shared-lib.html">
|
||||
<link rel="import" href="../polymer-signals/polymer-signals.html">
|
||||
<link rel="import" href="../polymer-view-source-link/polymer-view-source-link.html">
|
130
pkg/polymer/lib/elements/polymer-elements/smoke.html
Normal file
130
pkg/polymer/lib/elements/polymer-elements/smoke.html
Normal file
|
@ -0,0 +1,130 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>polymer-flex-layout</title>
|
||||
<script src="../../polymer/polymer.js"></script>
|
||||
<link rel="import" href="polymer-flex-layout.html">
|
||||
<link rel="import" href="polymer-flex-panel.html">
|
||||
<style>
|
||||
body {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
flex-css, flex-container, flex-nonvisual {
|
||||
height: 300px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<polymer-element name="flex-css">
|
||||
<template>
|
||||
<link rel="stylesheet" href="polymer-flex-layout.css">
|
||||
<style>
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
border: 2px solid #ccc;
|
||||
}
|
||||
</style>
|
||||
<div class="flexbox" flex>
|
||||
<div>Hi I'm some content</div>
|
||||
<div class="flexbox column" flex>
|
||||
<div class="flexbox align-center">
|
||||
<h3>Title</h3>
|
||||
<button>hello</button>
|
||||
</div>
|
||||
<div class="flexbox" flex>
|
||||
<div flex>Main content</div>
|
||||
<div>Sidebar content</div>
|
||||
</div>
|
||||
<div>Some more stuffs...</div>
|
||||
<div class="flexbox justify-end">
|
||||
<b>Footer</b>
|
||||
</div>
|
||||
</div>
|
||||
<div>A last bit, like a panel</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
Polymer('flex-css', {
|
||||
ready: function() {
|
||||
this.classList.add('flexbox');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</polymer-element>
|
||||
|
||||
<polymer-element name="flex-container" noscript extends="polymer-flex-panel">
|
||||
<template>
|
||||
<style>
|
||||
div, polymer-flex-panel {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
border: 2px solid #ccc;
|
||||
}
|
||||
</style>
|
||||
<div>Hi I'm some content</div>
|
||||
<polymer-flex-panel vertical flex>
|
||||
<polymer-flex-panel align="center">
|
||||
<h3>Title</h3>
|
||||
<button>hello</button>
|
||||
</polymer-flex-panel>
|
||||
<polymer-flex-panel flex>
|
||||
<div flex>Main content</div>
|
||||
<div>Sidebar content</div>
|
||||
</polymer-flex-panel>
|
||||
<div>Some more stuffs...</div>
|
||||
<polymer-flex-panel justify="end">
|
||||
<b>Footer</b>
|
||||
</polymer-flex-panel>
|
||||
</polymer-flex-panel>
|
||||
<div>A last bit, like a panel</div>
|
||||
</template>
|
||||
</polymer-element>
|
||||
|
||||
<polymer-element name="flex-nonvisual" noscript>
|
||||
<template>
|
||||
<style>
|
||||
div {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
border: 2px solid #ccc;
|
||||
}
|
||||
</style>
|
||||
<polymer-flex-layout></polymer-flex-layout>
|
||||
<div flex>
|
||||
<polymer-flex-layout></polymer-flex-layout>
|
||||
<div>Hi I'm some content</div>
|
||||
<div flex>
|
||||
<polymer-flex-layout vertical></polymer-flex-layout>
|
||||
<div>
|
||||
<polymer-flex-layout align="center"></polymer-flex-layout>
|
||||
<h3>Title</h3>
|
||||
<button>hello</button>
|
||||
</div>
|
||||
<div flex>
|
||||
<polymer-flex-layout></polymer-flex-layout>
|
||||
<div flex>Main content</div>
|
||||
<div>Sidebar content</div>
|
||||
</div>
|
||||
<div>Some more stuffs...</div>
|
||||
<div>
|
||||
<polymer-flex-layout justify="end"></polymer-flex-layout>
|
||||
<b>Footer</b>
|
||||
</div>
|
||||
</div>
|
||||
<div>A last bit, like a panel</div>
|
||||
</div>
|
||||
</template>
|
||||
</polymer-element>
|
||||
|
||||
<h3>polymer-flex-layout.css</h3>
|
||||
<flex-css></flex-css>
|
||||
<br>
|
||||
<h3>polymer-flex-panel element</h3>
|
||||
<flex-container></flex-container>
|
||||
<br>
|
||||
<h3>polymer-flex-layout element</h3>
|
||||
<flex-nonvisual></flex-nonvisual>
|
||||
</body>
|
||||
</html>
|
17
pkg/polymer/lib/elements/polymer-file/.bower.json
Normal file
17
pkg/polymer/lib/elements/polymer-file/.bower.json
Normal file
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"name": "polymer-file",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
},
|
||||
"homepage": "https://github.com/Polymer/polymer-file",
|
||||
"_release": "d9bdf637a4",
|
||||
"_resolution": {
|
||||
"type": "branch",
|
||||
"branch": "master",
|
||||
"commit": "d9bdf637a4c8a7d663912c0b66b7dcfb3ac65335"
|
||||
},
|
||||
"_source": "git://github.com/Polymer/polymer-file.git",
|
||||
"_target": "master",
|
||||
"_originalSource": "Polymer/polymer-file"
|
||||
}
|
9
pkg/polymer/lib/elements/polymer-file/AUTHORS
Normal file
9
pkg/polymer/lib/elements/polymer-file/AUTHORS
Normal file
|
@ -0,0 +1,9 @@
|
|||
# Names should be added to this file with this pattern:
|
||||
#
|
||||
# For individuals:
|
||||
# Name <email address>
|
||||
#
|
||||
# For organizations:
|
||||
# Organization <fnmatch pattern>
|
||||
#
|
||||
Google Inc. <*@google.com>
|
1
pkg/polymer/lib/elements/polymer-file/CONTRIBUTING.md
Normal file
1
pkg/polymer/lib/elements/polymer-file/CONTRIBUTING.md
Normal file
|
@ -0,0 +1 @@
|
|||
See https://github.com/Polymer/polymer/blob/master/CONTRIBUTING.md
|
27
pkg/polymer/lib/elements/polymer-file/LICENSE
Normal file
27
pkg/polymer/lib/elements/polymer-file/LICENSE
Normal file
|
@ -0,0 +1,27 @@
|
|||
// Copyright (c) 2012 The Polymer Authors. All rights reserved.
|
||||
//
|
||||
// Redistribution and use in source and binary forms, with or without
|
||||
// modification, are permitted provided that the following conditions are
|
||||
// met:
|
||||
//
|
||||
// * Redistributions of source code must retain the above copyright
|
||||
// notice, this list of conditions and the following disclaimer.
|
||||
// * Redistributions in binary form must reproduce the above
|
||||
// copyright notice, this list of conditions and the following disclaimer
|
||||
// in the documentation and/or other materials provided with the
|
||||
// distribution.
|
||||
// * Neither the name of Google Inc. nor the names of its
|
||||
// contributors may be used to endorse or promote products derived from
|
||||
// this software without specific prior written permission.
|
||||
//
|
||||
// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
|
||||
// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
|
||||
// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
|
||||
// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
|
||||
// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
|
||||
// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
|
||||
// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
|
||||
// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
|
||||
// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
|
||||
// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
23
pkg/polymer/lib/elements/polymer-file/PATENTS
Normal file
23
pkg/polymer/lib/elements/polymer-file/PATENTS
Normal file
|
@ -0,0 +1,23 @@
|
|||
Additional IP Rights Grant (Patents)
|
||||
|
||||
"This implementation" means the copyrightable works distributed by
|
||||
Google as part of the Polymer project.
|
||||
|
||||
Google hereby grants to You a perpetual, worldwide, non-exclusive,
|
||||
no-charge, royalty-free, irrevocable (except as stated in this section)
|
||||
patent license to make, have made, use, offer to sell, sell, import,
|
||||
transfer and otherwise run, modify and propagate the contents of this
|
||||
implementation of Polymer, where such license applies only to those
|
||||
patent claims, both currently owned or controlled by Google and acquired
|
||||
in the future, licensable by Google that are necessarily infringed by
|
||||
this implementation of Polymer. This grant does not include claims
|
||||
that would be infringed only as a consequence of further modification of
|
||||
this implementation. If you or your agent or exclusive licensee
|
||||
institute or order or agree to the institution of patent litigation
|
||||
against any entity (including a cross-claim or counterclaim in a
|
||||
lawsuit) alleging that this implementation of Polymer or any code
|
||||
incorporated within this implementation of Polymer constitutes
|
||||
direct or contributory patent infringement, or inducement of patent
|
||||
infringement, then any patent rights granted to you under this License
|
||||
for this implementation of Polymer shall terminate as of the date
|
||||
such litigation is filed.
|
7
pkg/polymer/lib/elements/polymer-file/bower.json
Normal file
7
pkg/polymer/lib/elements/polymer-file/bower.json
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"name": "polymer-file",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"polymer": "Polymer/polymer#master"
|
||||
}
|
||||
}
|
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue