• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1<!--
2@license
3Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
4This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
5The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
7Code distributed by Google as part of the polymer project is also
8subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
9-->
10<link rel="import" href="../iron-resizable-behavior.html">
11
12<script>
13
14  Polymer({
15
16    is: 'x-resizer-parent',
17
18    behaviors: [
19      Polymer.IronResizableBehavior
20    ],
21
22    listeners: {
23      'core-resize': 'resizeHandler'
24    },
25
26    resizeHandler: function() {
27    }
28
29  });
30
31</script>
32
33<script>
34
35  Polymer({
36
37    is: 'x-resizer-parent-filtered',
38
39    active: null,
40
41    behaviors: [
42      Polymer.IronResizableBehavior
43    ],
44
45    listeners: {
46      'core-resize': 'resizeHandler'
47    },
48
49    resizeHandler: function() {
50    },
51
52    resizerShouldNotify: function(el) {
53      return (el == this.active);
54    }
55
56  });
57
58</script>
59
60<script>
61
62  Polymer({
63
64    is: 'x-resizable',
65
66    behaviors: [
67      Polymer.IronResizableBehavior
68    ],
69
70    listeners: {
71      'core-resize': 'resizeHandler'
72    },
73
74    resizeHandler: function() {
75    }
76
77  });
78
79</script>
80
81<dom-module id="x-resizable-in-shadow">
82
83  <template>
84
85    <div>
86      <x-resizable id="resizable"></x-resizable>
87    </div>
88
89  </template>
90
91</dom-module>
92
93<script>
94
95  Polymer({
96
97    is: 'x-resizable-in-shadow'
98
99  });
100
101</script>
102
103<dom-module id='test-element'>
104
105  <template>
106
107    <!-- Normal resizable parent with child resizables -->
108    <x-resizer-parent id="parent">
109      <x-resizable id="child1a"></x-resizable>
110      <div>
111        <x-resizable id="child1b"></x-resizable>
112      </div>
113      <x-resizable-in-shadow id="shadow1c"></x-resizable-in-shadow>
114      <div>
115        <x-resizable-in-shadow id="shadow1d"></x-resizable-in-shadow>
116      </div>
117    </x-resizer-parent>
118
119    <!-- Resizable parent using resizerShouldNotify, with child resizables -->
120    <x-resizer-parent-filtered id="parentFiltered">
121      <x-resizable id="child2a"></x-resizable>
122      <div>
123        <x-resizable id="child2b"></x-resizable>
124      </div>
125      <x-resizable-in-shadow id="shadow2c"></x-resizable-in-shadow>
126      <div>
127        <x-resizable-in-shadow id="shadow2d"></x-resizable-in-shadow>
128      </div>
129    </x-resizer-parent-filtered>
130
131  </template>
132
133</dom-module>
134
135<script>
136
137  Polymer({
138
139    is: 'test-element'
140
141  });
142
143</script>
144<script>
145  /** @polymerBehavior */
146  Polymer.ObserveIronResizeBehavior = {
147    properties: {
148      ironResizeCount: {
149        type: Number,
150        value: 0
151      }
152    },
153
154    listeners: {
155      'iron-resize': '_incrementIronResizeCount'
156    },
157
158    _incrementIronResizeCount: function() {
159      this.ironResizeCount++;
160    }
161  };
162</script>
163<dom-module id="x-shadow-resizable">
164  <template>
165    <div></div>
166  </template>
167</dom-module>
168<script>
169  Polymer({
170    is: 'x-shadow-resizable',
171
172    behaviors: [
173      Polymer.IronResizableBehavior,
174      Polymer.ObserveIronResizeBehavior
175    ]
176  });
177</script>
178
179<dom-module id="x-light-resizable">
180  <template>
181    <x-shadow-resizable id="childResizable1"></x-shadow-resizable>
182    <x-shadow-resizable id="childResizable2"></x-shadow-resizable>
183  </template>
184</dom-module>
185<script>
186  Polymer({
187    is: 'x-light-resizable',
188
189    behaviors: [
190      Polymer.IronResizableBehavior,
191      Polymer.ObserveIronResizeBehavior
192    ]
193  });
194</script>
195