• 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  Polymer.ObserveIronResizeBehavior = {
146    properties: {
147      ironResizeCount: {
148        type: Number,
149        value: 0
150      }
151    },
152
153    listeners: {
154      'iron-resize': '_incrementIronResizeCount'
155    },
156
157    _incrementIronResizeCount: function() {
158      this.ironResizeCount++;
159    }
160  };
161</script>
162<dom-module id="x-shadow-resizable">
163  <template>
164    <div></div>
165  </template>
166</dom-module>
167<script>
168  Polymer({
169    is: 'x-shadow-resizable',
170
171    behaviors: [
172      Polymer.IronResizableBehavior,
173      Polymer.ObserveIronResizeBehavior
174    ]
175  });
176</script>
177
178<dom-module id="x-light-resizable">
179  <template>
180    <x-shadow-resizable id="childResizable1"></x-shadow-resizable>
181    <x-shadow-resizable id="childResizable2"></x-shadow-resizable>
182  </template>
183</dom-module>
184<script>
185  Polymer({
186    is: 'x-light-resizable',
187
188    behaviors: [
189      Polymer.IronResizableBehavior,
190      Polymer.ObserveIronResizeBehavior
191    ]
192  });
193</script>
194