| OLD | NEW |
|---|
| (Empty) | |
| 1 <!-- |
| 2 Copyright 2013 The Polymer Authors. All rights reserved. |
| 3 Use of this source code is governed by a BSD-style |
| 4 license that can be found in the LICENSE file. |
| 5 --> |
| 6 |
| 7 <!-- |
| 8 /** |
| 9 * Polymer UI Elements |
| 10 * |
| 11 * @module Polymer UI Elements |
| 12 */ |
| 13 /** |
| 14 * @class polymer-ui-scaffold |
| 15 */ |
| 16 --> |
| 17 <link rel="import" href="../polymer/polymer.html"> |
| 18 <link rel="import" href="../polymer-grid-layout/polymer-grid-layout.html"> |
| 19 <link rel="import" href="../polymer-ui-toolbar/polymer-ui-toolbar.html"> |
| 20 <link rel="import" href="../polymer-ui-icon-button/polymer-ui-icon-button.html"> |
| 21 |
| 22 <polymer-element name="polymer-ui-scaffold" attributes="menuActive hideMenuButto
n"> |
| 23 <template> |
| 24 <link rel="stylesheet" href="polymer-ui-scaffold.css"> |
| 25 <polymer-grid-layout id="grid"></polymer-grid-layout> |
| 26 <section class="animate" offscreen="basement"> |
| 27 <content select="[navigation]"></content> |
| 28 </section> |
| 29 <polymer-ui-toolbar class="animate"> |
| 30 <polymer-ui-icon-button icon="menu" hidden?="{{hideMenuButton}}" on-tap="{
{menuActionTap}}" active="{{menuActive}}"></polymer-ui-icon-button> |
| 31 <content select="[tool]"></content> |
| 32 </polymer-ui-toolbar> |
| 33 <section class="animate"> |
| 34 <content select="*"></content> |
| 35 </section> |
| 36 </template> |
| 37 <script> |
| 38 (function() { |
| 39 Polymer('polymer-ui-scaffold', { |
| 40 menuActive: false, |
| 41 hideMenuButton: false, |
| 42 layouts: { |
| 43 main:[ |
| 44 [2, 2], |
| 45 [3, 3], |
| 46 [3, 3] |
| 47 ], |
| 48 menu: [ |
| 49 [1, 2, 2], |
| 50 [1, 3, 3], |
| 51 [1, 3, 3] |
| 52 ] |
| 53 }, |
| 54 ready: function() { |
| 55 this.$.grid.layout = this.layouts.main; |
| 56 }, |
| 57 menuActionTap: function() { |
| 58 this.menuActive = !this.menuActive; |
| 59 Platform.flush(); |
| 60 }, |
| 61 menuActiveChanged: function() { |
| 62 this.$.grid.layout = this.layouts[this.menuActive ? 'menu' : 'main']; |
| 63 } |
| 64 }); |
| 65 })(); |
| 66 </script> |
| 67 </polymer-element> |
| 68 |
| 69 <polymer-element name="polymer-ui-scaffold2" attributes=""> |
| 70 <template> |
| 71 <link rel="stylesheet" href="polymer-ui-scaffold.css"> |
| 72 <polymer-grid-layout id="grid"></polymer-grid-layout> |
| 73 <section> |
| 74 <content select="[navigation]"></content> |
| 75 </section> |
| 76 <polymer-ui-toolbar class="animate"> |
| 77 <content select="[tool]"></content> |
| 78 </polymer-ui-toolbar> |
| 79 <section class="animate"> |
| 80 <content select="[main]"></content> |
| 81 </section> |
| 82 </template> |
| 83 <script> |
| 84 (function() { |
| 85 Polymer('polymer-ui-scaffold2', { |
| 86 menuActive: false, |
| 87 layouts: { |
| 88 main:[ |
| 89 [3, 3, 1], |
| 90 [3, 3, 1], |
| 91 [2, 2, 1] |
| 92 ] |
| 93 }, |
| 94 ready: function() { |
| 95 this.$.grid.layout = this.layouts.main; |
| 96 }, |
| 97 }); |
| 98 })(); |
| 99 </script> |
| 100 </polymer-element> |
| 101 |
| 102 <polymer-element name="polymer-ui-scaffold3" attributes="menuActive hideMenuButt
on"> |
| 103 <template> |
| 104 <link rel="stylesheet" href="polymer-ui-scaffold.css"> |
| 105 <polymer-grid-layout id="grid"></polymer-grid-layout> |
| 106 <section class="animate" style="z-index: 10;" offscreen="left"> |
| 107 <content select="[navigation]"></content> |
| 108 </section> |
| 109 <section id="scrim" on-tap="{{menuActionTap}}" offscreen="right"></section> |
| 110 <polymer-ui-toolbar offscreen="basement"> |
| 111 <polymer-ui-icon-button icon="menu" hidden?="{{hideMenuButton}}" on-tap="{
{menuActionTap}}" active="{{menuActive}}"></polymer-ui-icon-button> |
| 112 <content select="[tool]"></content> |
| 113 </polymer-ui-toolbar> |
| 114 <section offscreen="basement"> |
| 115 <content select="*"></content> |
| 116 </section> |
| 117 </template> |
| 118 <script> |
| 119 (function() { |
| 120 Polymer('polymer-ui-scaffold3', { |
| 121 menuActive: false, |
| 122 hideMenuButton: false, |
| 123 layouts: { |
| 124 main:[ |
| 125 [3, 3], |
| 126 [4, 4], |
| 127 [4, 4] |
| 128 ], |
| 129 menu: [ |
| 130 [1, 2], |
| 131 [1, 2], |
| 132 [1, 2] |
| 133 ] |
| 134 }, |
| 135 ready: function() { |
| 136 this.$.grid.layout = this.layouts.main; |
| 137 }, |
| 138 menuActionTap: function() { |
| 139 this.menuActive = !this.menuActive; |
| 140 Platform.flush(); |
| 141 }, |
| 142 menuActiveChanged: function() { |
| 143 this.$.grid.layout = this.layouts[this.menuActive ? 'menu' : 'main']; |
| 144 } |
| 145 }); |
| 146 })(); |
| 147 </script> |
| 148 </polymer-element> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 175443005:
[polymer] import all elements (Closed)
Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart