Index: third_party/polymer/components/core-animated-pages/demos/grid.html |
diff --git a/third_party/polymer/components/core-animated-pages/demos/grid.html b/third_party/polymer/components/core-animated-pages/demos/grid.html |
deleted file mode 100644 |
index f7b0e96ff31f62dbc52737c5b54a0bff21785dd2..0000000000000000000000000000000000000000 |
--- a/third_party/polymer/components/core-animated-pages/demos/grid.html |
+++ /dev/null |
@@ -1,104 +0,0 @@ |
-<!doctype html> |
-<html> |
-<head> |
- |
- <script src="../../platform/platform.js"></script> |
- |
- <link href="../../core-icons/core-icons.html" rel="import"> |
- <link href="../../core-icon-button/core-icon-button.html" rel="import"> |
- <link href="../../core-toolbar/core-toolbar.html" rel="import"> |
- <link href="../core-animated-pages.html" rel="import"> |
- |
- <style> |
- body { |
- font-family: sans-serif; |
- } |
- |
- .toolbar { |
- background-color: steelblue; |
- } |
- |
- #container { |
- overflow: auto; |
- } |
- |
- .card { |
- position: relative; |
- height: 150px; |
- width: 150px; |
- font-size: 50px; |
- margin: 8px; |
- background-color: tomato; |
- border-radius: 4px; |
- cursor: default; |
- } |
- |
- .view { |
- font-size: 250px; |
- background-color: tomato; |
- } |
- |
- </style> |
- |
-</head> |
-<body unresolved fullbleed vertical layout> |
- <template is="auto-binding"> |
- <core-toolbar class="toolbar"> |
- <core-icon-button icon="{{$.pages.selected != 0 ? 'arrow-back' : 'menu'}}" on-tap="{{back}}"></core-icon-button> |
- <div flex>Stuff</div> |
- <core-icon-button icon="more-vert"></core-icon-button> |
- </core-toolbar> |
- <core-animated-pages id="pages" flex selected="0" on-core-animated-pages-transition-end="{{transitionend}}" transitions="cross-fade-all hero-transition"> |
- |
- <section vertical layout> |
- |
- <div id="container" flex horizontal wrap around-justified layout hero-p> |
- <template repeat="{{item in items}}"> |
- <div class="card" vertical center center-justified layout hero-id="item-{{item}}" hero?="{{$.pages.selected === item + 1 || lastSelected === item + 1}}" on-tap="{{selectView}}"><span cross-fade>{{item}}</span></div> |
- </template> |
- </div> |
- |
- </section> |
- |
- <template repeat="{{item in items}}"> |
- <section vertical layout> |
- <div class="view" flex vertical center center-justified layout hero-id="item-{{item}}" hero?="{{$.pages.selected === item + 1 || $.pages.selected === 0}}"><span cross-fade>{{item}}</span></div> |
- </section> |
- </template> |
- |
- </core-animated-pages> |
- </template> |
- |
- <script> |
- |
- addEventListener('template-bound', function(e) { |
- var scope = e.target; |
- var items = [], count=50; |
- for (var i=0; i < count; i++) { |
- items.push(i); |
- } |
- |
- scope.items = items; |
- |
- scope.selectView = function(e) { |
- var i = e.target.templateInstance.model.item; |
- this.$.pages.selected = i+1; |
- } |
- |
- scope.back = function() { |
- this.lastSelected = this.$.pages.selected; |
- console.log(this.lastSelected); |
- this.$.pages.selected = 0; |
- } |
- |
- scope.transitionend = function() { |
- if (this.lastSelected) { |
- this.lastSelected = null; |
- } |
- } |
- }) |
- |
- </script> |
- |
-</body> |
-</html> |