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

Side by Side Diff: ui/webui/resources/js/cr/ui/position_util.js

Issue 2597013002: Run clang-format on ui/webui/resources (Closed)
Patch Set: remove cr_shared_menu.js Created 4 years 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 // Copyright (c) 2012 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * @fileoverview This file provides utility functions for position popups. 6 * @fileoverview This file provides utility functions for position popups.
7 */ 7 */
8 8
9 cr.exportPath('cr.ui'); 9 cr.exportPath('cr.ui');
10 10
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after
50 var AnchorType = cr.ui.AnchorType; 50 var AnchorType = cr.ui.AnchorType;
51 51
52 /** 52 /**
53 * Helper function for positionPopupAroundElement and positionPopupAroundRect. 53 * Helper function for positionPopupAroundElement and positionPopupAroundRect.
54 * @param {!cr.ui.Rect} anchorRect The rect for the anchor. 54 * @param {!cr.ui.Rect} anchorRect The rect for the anchor.
55 * @param {!HTMLElement} popupElement The element used for the popup. 55 * @param {!HTMLElement} popupElement The element used for the popup.
56 * @param {cr.ui.AnchorType} type The type of anchoring to do. 56 * @param {cr.ui.AnchorType} type The type of anchoring to do.
57 * @param {boolean=} opt_invertLeftRight Whether to invert the right/left 57 * @param {boolean=} opt_invertLeftRight Whether to invert the right/left
58 * alignment. 58 * alignment.
59 */ 59 */
60 function positionPopupAroundRect(anchorRect, popupElement, type, 60 function positionPopupAroundRect(
61 opt_invertLeftRight) { 61 anchorRect, popupElement, type, opt_invertLeftRight) {
62 var popupRect = popupElement.getBoundingClientRect(); 62 var popupRect = popupElement.getBoundingClientRect();
63 var availRect; 63 var availRect;
64 var ownerDoc = popupElement.ownerDocument; 64 var ownerDoc = popupElement.ownerDocument;
65 var cs = ownerDoc.defaultView.getComputedStyle(popupElement); 65 var cs = ownerDoc.defaultView.getComputedStyle(popupElement);
66 var docElement = ownerDoc.documentElement; 66 var docElement = ownerDoc.documentElement;
67 67
68 if (cs.position == 'fixed') { 68 if (cs.position == 'fixed') {
69 // For 'fixed' positioned popups, the available rectangle should be based 69 // For 'fixed' positioned popups, the available rectangle should be based
70 // on the viewport rather than the document. 70 // on the viewport rather than the document.
71 availRect = { 71 availRect = {
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
154 154
155 // Secondary direction 155 // Secondary direction
156 switch (type) { 156 switch (type) {
157 case AnchorType.BELOW: 157 case AnchorType.BELOW:
158 case AnchorType.ABOVE: 158 case AnchorType.ABOVE:
159 if (opt_invertLeftRight) { 159 if (opt_invertLeftRight) {
160 // align right edges 160 // align right edges
161 if (anchorRect.right - popupRect.width >= 0) { 161 if (anchorRect.right - popupRect.width >= 0) {
162 style.right = availRect.width - anchorRect.right + 'px'; 162 style.right = availRect.width - anchorRect.right + 'px';
163 163
164 // align left edges 164 // align left edges
165 } else if (anchorRect.left + popupRect.width <= availRect.width) { 165 } else if (anchorRect.left + popupRect.width <= availRect.width) {
166 style.left = anchorRect.left + 'px'; 166 style.left = anchorRect.left + 'px';
167 167
168 // not enough room on either side 168 // not enough room on either side
169 } else { 169 } else {
170 style.right = '0'; 170 style.right = '0';
171 } 171 }
172 } else { 172 } else {
173 // align left edges 173 // align left edges
174 if (anchorRect.left + popupRect.width <= availRect.width) { 174 if (anchorRect.left + popupRect.width <= availRect.width) {
175 style.left = anchorRect.left + 'px'; 175 style.left = anchorRect.left + 'px';
176 176
177 // align right edges 177 // align right edges
178 } else if (anchorRect.right - popupRect.width >= 0) { 178 } else if (anchorRect.right - popupRect.width >= 0) {
179 style.right = availRect.width - anchorRect.right + 'px'; 179 style.right = availRect.width - anchorRect.right + 'px';
180 180
181 // not enough room on either side 181 // not enough room on either side
182 } else { 182 } else {
183 style.left = '0'; 183 style.left = '0';
184 } 184 }
185 } 185 }
186 break; 186 break;
187 187
188 case AnchorType.AFTER: 188 case AnchorType.AFTER:
189 case AnchorType.BEFORE: 189 case AnchorType.BEFORE:
190 // align top edges 190 // align top edges
191 if (anchorRect.top + popupRect.height <= availRect.height) { 191 if (anchorRect.top + popupRect.height <= availRect.height) {
192 style.top = anchorRect.top + 'px'; 192 style.top = anchorRect.top + 'px';
193 193
194 // align bottom edges 194 // align bottom edges
195 } else if (anchorRect.bottom - popupRect.height >= 0) { 195 } else if (anchorRect.bottom - popupRect.height >= 0) {
196 style.bottom = availRect.height - anchorRect.bottom + 'px'; 196 style.bottom = availRect.height - anchorRect.bottom + 'px';
197 197
198 // not enough room on either side 198 // not enough room on either side
199 } else { 199 } else {
200 style.top = '0'; 200 style.top = '0';
201 } 201 }
202 break; 202 break;
203 } 203 }
204 } 204 }
205 205
206 /** 206 /**
207 * Positions a popup element relative to an anchor element. The popup element 207 * Positions a popup element relative to an anchor element. The popup element
208 * should have position set to absolute and it should be a child of the body 208 * should have position set to absolute and it should be a child of the body
209 * element. 209 * element.
210 * @param {!HTMLElement} anchorElement The element that the popup is anchored 210 * @param {!HTMLElement} anchorElement The element that the popup is anchored
211 * to. 211 * to.
212 * @param {!HTMLElement} popupElement The popup element we are positioning. 212 * @param {!HTMLElement} popupElement The popup element we are positioning.
213 * @param {cr.ui.AnchorType} type The type of anchoring we want. 213 * @param {cr.ui.AnchorType} type The type of anchoring we want.
214 * @param {boolean=} opt_invertLeftRight Whether to invert the right/left 214 * @param {boolean=} opt_invertLeftRight Whether to invert the right/left
215 * alignment. 215 * alignment.
216 */ 216 */
217 function positionPopupAroundElement(anchorElement, popupElement, type, 217 function positionPopupAroundElement(
218 opt_invertLeftRight) { 218 anchorElement, popupElement, type, opt_invertLeftRight) {
219 var anchorRect = anchorElement.getBoundingClientRect(); 219 var anchorRect = anchorElement.getBoundingClientRect();
220 positionPopupAroundRect(anchorRect, popupElement, type, 220 positionPopupAroundRect(
221 !!opt_invertLeftRight); 221 anchorRect, popupElement, type, !!opt_invertLeftRight);
222 } 222 }
223 223
224 /** 224 /**
225 * Positions a popup around a point. 225 * Positions a popup around a point.
226 * @param {number} x The client x position. 226 * @param {number} x The client x position.
227 * @param {number} y The client y position. 227 * @param {number} y The client y position.
228 * @param {!HTMLElement} popupElement The popup element we are positioning. 228 * @param {!HTMLElement} popupElement The popup element we are positioning.
229 * @param {cr.ui.AnchorType=} opt_anchorType The type of anchoring we want. 229 * @param {cr.ui.AnchorType=} opt_anchorType The type of anchoring we want.
230 */ 230 */
231 function positionPopupAtPoint(x, y, popupElement, opt_anchorType) { 231 function positionPopupAtPoint(x, y, popupElement, opt_anchorType) {
232 var rect = { 232 var rect = {left: x, top: y, width: 0, height: 0, right: x, bottom: y};
233 left: x,
234 top: y,
235 width: 0,
236 height: 0,
237 right: x,
238 bottom: y
239 };
240 233
241 var anchorType = opt_anchorType || AnchorType.BELOW; 234 var anchorType = opt_anchorType || AnchorType.BELOW;
242 positionPopupAroundRect(rect, popupElement, anchorType); 235 positionPopupAroundRect(rect, popupElement, anchorType);
243 } 236 }
244 237
245 // Export 238 // Export
246 return { 239 return {
247 positionPopupAroundElement: positionPopupAroundElement, 240 positionPopupAroundElement: positionPopupAroundElement,
248 positionPopupAtPoint: positionPopupAtPoint 241 positionPopupAtPoint: positionPopupAtPoint
249 }; 242 };
250 }); 243 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698