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

Side by Side Diff: third_party/polymer/v1_0/components/iron-fit-behavior/iron-fit-behavior.html

Issue 1221923003: Update bower.json for Polymer elements and add PRESUBMIT.py (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Created 5 years, 5 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 unified diff | Download patch
OLDNEW
1 <!-- 1 <!--
2 @license 2 @license
3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt 4 This code may only be used under the BSD style license found at http://polymer.g ithub.io/LICENSE.txt
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt 6 The complete set of contributors may be found at http://polymer.github.io/CONTRI BUTORS.txt
7 Code distributed by Google as part of the polymer project is also 7 Code distributed by Google as part of the polymer project is also
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt 8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN TS.txt
9 --> 9 -->
10 10
(...skipping 21 matching lines...) Expand all
32 */ 32 */
33 33
34 Polymer.IronFitBehavior = { 34 Polymer.IronFitBehavior = {
35 35
36 properties: { 36 properties: {
37 37
38 /** 38 /**
39 * The element that will receive a `max-height`/`width`. By default it is the same as `this`, 39 * The element that will receive a `max-height`/`width`. By default it is the same as `this`,
40 * but it can be set to a child element. This is useful, for example, for implementing a 40 * but it can be set to a child element. This is useful, for example, for implementing a
41 * scrolling region inside the element. 41 * scrolling region inside the element.
42 * @type {!Element}
42 */ 43 */
43 sizingTarget: { 44 sizingTarget: {
44 type: Object, 45 type: Object,
45 value: function() { 46 value: function() {
46 return this; 47 return this;
47 } 48 }
48 }, 49 },
49 50
50 /** 51 /**
51 * The element to fit `this` into. 52 * The element to fit `this` into.
52 */ 53 */
53 fitInto: { 54 fitInto: {
54 type: Object, 55 type: Object,
55 value: window 56 value: window
56 }, 57 },
57 58
58 /** 59 /**
59 * Set to true to auto-fit on attach. 60 * Set to true to auto-fit on attach.
60 */ 61 */
61 autoFitOnAttach: { 62 autoFitOnAttach: {
62 type: Boolean, 63 type: Boolean,
63 value: false 64 value: false
64 }, 65 },
65 66
67 /** @type {?Object} */
66 _fitInfo: { 68 _fitInfo: {
67 type: Object 69 type: Object
68 } 70 }
69 71
70 }, 72 },
71 73
72 get _fitWidth() { 74 get _fitWidth() {
73 var fitWidth; 75 var fitWidth;
74 if (this.fitInto === window) { 76 if (this.fitInto === window) {
75 fitWidth = this.fitInto.innerWidth; 77 fitWidth = this.fitInto.innerWidth;
76 } else { 78 } else {
77 fitWidth = this.fitInto.getBoundingClientRect().width; 79 fitWidth = this.fitInto.getBoundingClientRect().width;
78 } 80 }
79 return fitWidth; 81 return fitWidth;
80 }, 82 },
81 83
82 get _fitHeight() { 84 get _fitHeight() {
83 var fitHeight; 85 var fitHeight;
84 if (this.fitInto === window) { 86 if (this.fitInto === window) {
85 fitHeight = this.fitInto.innerHeight; 87 fitHeight = this.fitInto.innerHeight;
86 } else { 88 } else {
87 fitHeight = this.fitInto.getBoundingClientRect().height; 89 fitHeight = this.fitInto.getBoundingClientRect().height;
88 } 90 }
89 return fitHeight; 91 return fitHeight;
90 }, 92 },
91 93
94 get _fitLeft() {
95 var fitLeft;
96 if (this.fitInto === window) {
97 fitLeft = 0;
98 } else {
99 fitLeft = this.fitInto.getBoundingClientRect().left;
100 }
101 return fitLeft;
102 },
103
104 get _fitTop() {
105 var fitTop;
106 if (this.fitInto === window) {
107 fitTop = 0;
108 } else {
109 fitTop = this.fitInto.getBoundingClientRect().top;
110 }
111 return fitTop;
112 },
113
92 attached: function() { 114 attached: function() {
93 if (this.autoFitOnAttach) { 115 if (this.autoFitOnAttach) {
94 if (window.getComputedStyle(this).display === 'none') { 116 if (window.getComputedStyle(this).display === 'none') {
95 setTimeout(function() { 117 setTimeout(function() {
96 this.fit(); 118 this.fit();
97 }.bind(this)); 119 }.bind(this));
98 } else { 120 } else {
99 this.fit(); 121 this.fit();
100 } 122 }
101 } 123 }
(...skipping 11 matching lines...) Expand all
113 /** 135 /**
114 * Memoize information needed to position and size the target element. 136 * Memoize information needed to position and size the target element.
115 */ 137 */
116 _discoverInfo: function() { 138 _discoverInfo: function() {
117 if (this._fitInfo) { 139 if (this._fitInfo) {
118 return; 140 return;
119 } 141 }
120 var target = window.getComputedStyle(this); 142 var target = window.getComputedStyle(this);
121 var sizer = window.getComputedStyle(this.sizingTarget); 143 var sizer = window.getComputedStyle(this.sizingTarget);
122 this._fitInfo = { 144 this._fitInfo = {
145 inlineStyle: {
146 top: this.style.top || '',
147 left: this.style.left || ''
148 },
123 positionedBy: { 149 positionedBy: {
124 vertically: target.top !== 'auto' ? 'top' : (target.bottom !== 'auto' ? 150 vertically: target.top !== 'auto' ? 'top' : (target.bottom !== 'auto' ?
125 'bottom' : null), 151 'bottom' : null),
126 horizontally: target.left !== 'auto' ? 'left' : (target.right !== 'aut o' ? 152 horizontally: target.left !== 'auto' ? 'left' : (target.right !== 'aut o' ?
127 'right' : null), 153 'right' : null),
128 css: target.position 154 css: target.position
129 }, 155 },
130 sizedBy: { 156 sizedBy: {
131 height: sizer.maxHeight !== 'none', 157 height: sizer.maxHeight !== 'none',
132 width: sizer.maxWidth !== 'none' 158 width: sizer.maxWidth !== 'none'
133 }, 159 },
134 margin: { 160 margin: {
135 top: parseInt(target.marginTop, 10) || 0, 161 top: parseInt(target.marginTop, 10) || 0,
136 right: parseInt(target.marginRight, 10) || 0, 162 right: parseInt(target.marginRight, 10) || 0,
137 bottom: parseInt(target.marginBottom, 10) || 0, 163 bottom: parseInt(target.marginBottom, 10) || 0,
138 left: parseInt(target.marginLeft, 10) || 0 164 left: parseInt(target.marginLeft, 10) || 0
139 } 165 }
140 }; 166 };
141 }, 167 },
142 168
143 /** 169 /**
144 * Resets the target element's position and size constraints, and clear 170 * Resets the target element's position and size constraints, and clear
145 * the memoized data. 171 * the memoized data.
146 */ 172 */
147 resetFit: function() { 173 resetFit: function() {
148 if (!this._fitInfo || !this._fitInfo.sizedBy.height) { 174 if (!this._fitInfo || !this._fitInfo.sizedBy.height) {
149 this.sizingTarget.style.maxHeight = ''; 175 this.sizingTarget.style.maxHeight = '';
150 this.style.top = ''; 176 this.style.top = this._fitInfo ? this._fitInfo.inlineStyle.top : '';
151 } 177 }
152 if (!this._fitInfo || !this._fitInfo.sizedBy.width) { 178 if (!this._fitInfo || !this._fitInfo.sizedBy.width) {
153 this.sizingTarget.style.maxWidth = ''; 179 this.sizingTarget.style.maxWidth = '';
154 this.style.left = ''; 180 this.style.left = this._fitInfo ? this._fitInfo.inlineStyle.left : '';
155 } 181 }
156 if (this._fitInfo) { 182 if (this._fitInfo) {
157 this.style.position = this._fitInfo.positionedBy.css; 183 this.style.position = this._fitInfo.positionedBy.css;
158 } 184 }
159 this._fitInfo = null; 185 this._fitInfo = null;
160 }, 186 },
161 187
162 /** 188 /**
163 * Equivalent to calling `resetFit()` and `fit()`. Useful to call this after the element, 189 * Equivalent to calling `resetFit()` and `fit()`. Useful to call this after the element,
164 * the window, or the `fitInfo` element has been resized. 190 * the window, or the `fitInfo` element has been resized.
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after
207 /** 233 /**
208 * Centers horizontally and vertically if not already positioned. This also sets 234 * Centers horizontally and vertically if not already positioned. This also sets
209 * `position:fixed`. 235 * `position:fixed`.
210 */ 236 */
211 center: function() { 237 center: function() {
212 if (!this._fitInfo.positionedBy.vertically || !this._fitInfo.positionedBy. horizontally) { 238 if (!this._fitInfo.positionedBy.vertically || !this._fitInfo.positionedBy. horizontally) {
213 // need position:fixed to center 239 // need position:fixed to center
214 this.style.position = 'fixed'; 240 this.style.position = 'fixed';
215 } 241 }
216 if (!this._fitInfo.positionedBy.vertically) { 242 if (!this._fitInfo.positionedBy.vertically) {
217 var top = (this._fitHeight - this.offsetHeight) / 2; 243 var top = (this._fitHeight - this.offsetHeight) / 2 + this._fitTop;
218 top -= this._fitInfo.margin.top; 244 top -= this._fitInfo.margin.top;
219 this.style.top = top + 'px'; 245 this.style.top = top + 'px';
220 } 246 }
221 if (!this._fitInfo.positionedBy.horizontally) { 247 if (!this._fitInfo.positionedBy.horizontally) {
222 var left = (this._fitWidth - this.offsetWidth) / 2; 248 var left = (this._fitWidth - this.offsetWidth) / 2 + this._fitLeft;
223 left -= this._fitInfo.margin.left; 249 left -= this._fitInfo.margin.left;
224 this.style.left = left + 'px'; 250 this.style.left = left + 'px';
225 } 251 }
226 } 252 }
227 253
228 }; 254 };
229 255
230 </script> 256 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698