Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(2045)

Unified Diff: third_party/polymer/components-chromium/core-animated-pages/demos/list.html

Issue 592593002: Inline scripts were extracted from Polymer elements. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: s/echo ""/echo/ Created 6 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/polymer/components-chromium/core-animated-pages/demos/list.html
diff --git a/third_party/polymer/components-chromium/core-animated-pages/demos/list.html b/third_party/polymer/components-chromium/core-animated-pages/demos/list.html
new file mode 100644
index 0000000000000000000000000000000000000000..90ed8a300679add5cf9932724b26d0e5a531c212
--- /dev/null
+++ b/third_party/polymer/components-chromium/core-animated-pages/demos/list.html
@@ -0,0 +1,117 @@
+<!doctype html>
+<html>
+<head>
+
+ <script src="../../platform/platform.js"></script>
+ <link href="../core-animated-pages.html" rel="import">
+
+ <style>
+ body {
+ font-family: Roboto, 'Helvetica Neue', Helvetica, Arial, sans-serif;
+ margin: 0;
+ }
+
+ </style>
+
+</head>
+<body unresolved>
+
+ <polymer-element name="list-demo">
+ <template>
+
+ <style>
+ p {
+ margin: 8px;
+ }
+
+ .item {
+ background: #e7e7e7;
+ padding: 16px;
+ margin: 8px;
+ border-radius: 3px;
+ box-sizing: border-box;
+ position: relative;
+ }
+ </style>
+
+ <p>Tap to move to top</p>
+
+ <core-animated-pages id="pages" on-tap="{{reorder}}" selected="{{selected}}" on-core-animated-pages-transition-end="{{done}}" transitions="hero-transition">
+
+ <section>
+ <template repeat="{{items}}">
+ <div hero-id="{{h}}" hero class="item">{{v}}</div>
+ </template>
+ </section>
+
+ <section>
+ <template repeat="{{items2}}">
+ <div hero-id="{{h}}" hero class="item">{{v}}</div>
+ </template>
+ </section>
+
+ </core-animated-pages>
+
+ </template>
+
+ <script>
+
+ Polymer('list-demo', {
+
+ selected: 0,
+
+ items: [
+ {h: 'matt', v: 'Matt McNulty'},
+ {h: 'scott', v: 'Scott Miles'},
+ {h: 'steve', v: 'Steve Orvell'},
+ {h: 'frankie', v: 'Frankie Fu'},
+ {h: 'daniel', v: 'Daniel Freedman'},
+ {h: 'yvonne', v: 'Yvonne Yip'},
+ ],
+
+ items2: [
+ {h: 'matt', v: 'Matt McNulty'},
+ {h: 'scott', v: 'Scott Miles'},
+ {h: 'steve', v: 'Steve Orvell'},
+ {h: 'frankie', v: 'Frankie Fu'},
+ {h: 'daniel', v: 'Daniel Freedman'},
+ {h: 'yvonne', v: 'Yvonne Yip'},
+ ],
+
+ reorder: function(e) {
+ if (this.$.pages.transitioning.length) {
+ return;
+ }
+
+ this.lastMoved = e.target;
+ this.lastMoved.style.zIndex = 10005;
+ var item = e.target.templateInstance.model;
+ var items = this.selected ? this.items : this.items2;
+ var i = this.selected ? this.items2.indexOf(item) : this.items.indexOf(item);
+ if (i != 0) {
+ items.splice(0, 0, item);
+ items.splice(i + 1, 1);
+ }
+
+ this.lastIndex = i;
+ this.selected = this.selected ? 0 : 1;
+ },
+
+ done: function() {
+ var i = this.lastIndex;
+ var items = this.selected ? this.items : this.items2;
+ var item = items[i];
+ items.splice(0, 0, item);
+ items.splice(i + 1, 1);
+ this.lastMoved.style.zIndex = null;
+ }
+ });
+
+ </script>
+
+ </polymer-element>
+
+ <list-demo></list-demo>
+
+</body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698