OLD | NEW |
---|---|
1 // Copyright 2017 The Chromium Authors. All rights reserved. | 1 // Copyright 2017 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 UI.GlassPane = class { | 5 UI.GlassPane = class { |
6 constructor() { | 6 constructor() { |
7 this._widget = new UI.Widget(true); | 7 this._widget = new UI.Widget(true); |
8 this._widget.markAsRoot(); | 8 this._widget.markAsRoot(); |
9 this.element = this._widget.element; | 9 this.element = this._widget.element; |
10 this.contentElement = this._widget.contentElement; | 10 this.contentElement = this._widget.contentElement; |
(...skipping 183 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
194 | 194 |
195 if (behavior === UI.GlassPane.AnchorBehavior.PreferTop || behavior === UI. GlassPane.AnchorBehavior.PreferBottom) { | 195 if (behavior === UI.GlassPane.AnchorBehavior.PreferTop || behavior === UI. GlassPane.AnchorBehavior.PreferBottom) { |
196 var top = anchorBox.y - 2 * gutterSize; | 196 var top = anchorBox.y - 2 * gutterSize; |
197 var bottom = containerHeight - anchorBox.y - anchorBox.height - 2 * gutt erSize; | 197 var bottom = containerHeight - anchorBox.y - anchorBox.height - 2 * gutt erSize; |
198 if (behavior === UI.GlassPane.AnchorBehavior.PreferTop && top < height & & bottom > top) | 198 if (behavior === UI.GlassPane.AnchorBehavior.PreferTop && top < height & & bottom > top) |
199 behavior = UI.GlassPane.AnchorBehavior.PreferBottom; | 199 behavior = UI.GlassPane.AnchorBehavior.PreferBottom; |
200 if (behavior === UI.GlassPane.AnchorBehavior.PreferBottom && bottom < he ight && top > bottom) | 200 if (behavior === UI.GlassPane.AnchorBehavior.PreferBottom && bottom < he ight && top > bottom) |
201 behavior = UI.GlassPane.AnchorBehavior.PreferTop; | 201 behavior = UI.GlassPane.AnchorBehavior.PreferTop; |
202 | 202 |
203 var arrowY; | 203 var arrowY; |
204 var enoughHeight = true; | |
204 if (behavior === UI.GlassPane.AnchorBehavior.PreferTop) { | 205 if (behavior === UI.GlassPane.AnchorBehavior.PreferTop) { |
205 positionY = Math.max(gutterSize, anchorBox.y - height - gutterSize); | 206 positionY = Math.max(gutterSize, anchorBox.y - height - gutterSize); |
206 var spaceTop = anchorBox.y - positionY - gutterSize; | 207 var spaceTop = anchorBox.y - positionY - gutterSize; |
207 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { | 208 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { |
208 if (height < measuredHeight) | 209 if (height < measuredHeight) |
209 width += scrollbarSize; | 210 width += scrollbarSize; |
210 if (height > spaceTop) | 211 if (height > spaceTop) { |
211 this._arrowElement.classList.add('arrow-none'); | 212 this._arrowElement.classList.add('arrow-none'); |
213 enoughHeight = false; | |
214 } | |
212 } else { | 215 } else { |
213 height = Math.min(height, spaceTop); | 216 height = Math.min(height, spaceTop); |
214 } | 217 } |
215 this._arrowElement.setIconType('mediumicon-arrow-bottom'); | 218 this._arrowElement.setIconType('mediumicon-arrow-bottom'); |
216 this._arrowElement.classList.add('arrow-bottom'); | 219 this._arrowElement.classList.add('arrow-bottom'); |
217 arrowY = anchorBox.y - gutterSize; | 220 arrowY = anchorBox.y - gutterSize; |
218 } else { | 221 } else { |
219 positionY = anchorBox.y + anchorBox.height + gutterSize; | 222 positionY = anchorBox.y + anchorBox.height + gutterSize; |
220 var spaceBottom = containerHeight - positionY - gutterSize; | 223 var spaceBottom = containerHeight - positionY - gutterSize; |
221 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { | 224 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { |
222 if (height < measuredHeight) | 225 if (height < measuredHeight) |
223 width += scrollbarSize; | 226 width += scrollbarSize; |
224 if (height > spaceBottom) { | 227 if (height > spaceBottom) { |
225 this._arrowElement.classList.add('arrow-none'); | 228 this._arrowElement.classList.add('arrow-none'); |
226 positionY = containerHeight - gutterSize - height; | 229 positionY = containerHeight - gutterSize - height; |
230 enoughHeight = false; | |
227 } | 231 } |
228 } else { | 232 } else { |
229 height = Math.min(height, spaceBottom); | 233 height = Math.min(height, spaceBottom); |
230 } | 234 } |
231 this._arrowElement.setIconType('mediumicon-arrow-top'); | 235 this._arrowElement.setIconType('mediumicon-arrow-top'); |
232 this._arrowElement.classList.add('arrow-top'); | 236 this._arrowElement.classList.add('arrow-top'); |
233 arrowY = anchorBox.y + anchorBox.height + gutterSize; | 237 arrowY = anchorBox.y + anchorBox.height + gutterSize; |
234 } | 238 } |
235 | 239 |
236 positionX = Math.max(gutterSize, Math.min(anchorBox.x, containerWidth - width - gutterSize)); | 240 positionX = Math.max(gutterSize, Math.min(anchorBox.x, containerWidth - width - gutterSize)); |
237 if (this._showArrow && positionX - arrowSize >= gutterSize) | 241 if (enoughHeight && this._showArrow && positionX - arrowSize >= gutterSi ze) |
238 positionX -= arrowSize; | 242 positionX -= arrowSize; |
243 else if (!enoughHeight) | |
caseq
2017/03/22 23:30:03
This is somehow unfortunate considering we already
dgozman
2017/03/23 00:41:36
Done.
| |
244 positionX += arrowSize; | |
239 width = Math.min(width, containerWidth - positionX - gutterSize); | 245 width = Math.min(width, containerWidth - positionX - gutterSize); |
240 if (2 * arrowSize >= width) { | 246 if (2 * arrowSize >= width) { |
241 this._arrowElement.classList.add('arrow-none'); | 247 this._arrowElement.classList.add('arrow-none'); |
242 } else { | 248 } else { |
243 var arrowX = anchorBox.x + Math.min(50, Math.floor(anchorBox.width / 2 )); | 249 var arrowX = anchorBox.x + Math.min(50, Math.floor(anchorBox.width / 2 )); |
244 arrowX = Number.constrain(arrowX, positionX + arrowSize, positionX + w idth - arrowSize); | 250 arrowX = Number.constrain(arrowX, positionX + arrowSize, positionX + w idth - arrowSize); |
245 this._arrowElement.positionAt(arrowX, arrowY, container); | 251 this._arrowElement.positionAt(arrowX, arrowY, container); |
246 } | 252 } |
247 } else { | 253 } else { |
248 var left = anchorBox.x - 2 * gutterSize; | 254 var left = anchorBox.x - 2 * gutterSize; |
249 var right = containerWidth - anchorBox.x - anchorBox.width - 2 * gutterS ize; | 255 var right = containerWidth - anchorBox.x - anchorBox.width - 2 * gutterS ize; |
250 if (behavior === UI.GlassPane.AnchorBehavior.PreferLeft && left < width && right > left) | 256 if (behavior === UI.GlassPane.AnchorBehavior.PreferLeft && left < width && right > left) |
251 behavior = UI.GlassPane.AnchorBehavior.PreferRight; | 257 behavior = UI.GlassPane.AnchorBehavior.PreferRight; |
252 if (behavior === UI.GlassPane.AnchorBehavior.PreferRight && right < widt h && left > right) | 258 if (behavior === UI.GlassPane.AnchorBehavior.PreferRight && right < widt h && left > right) |
253 behavior = UI.GlassPane.AnchorBehavior.PreferLeft; | 259 behavior = UI.GlassPane.AnchorBehavior.PreferLeft; |
254 | 260 |
255 var arrowX; | 261 var arrowX; |
262 var enoughWidth = true; | |
256 if (behavior === UI.GlassPane.AnchorBehavior.PreferLeft) { | 263 if (behavior === UI.GlassPane.AnchorBehavior.PreferLeft) { |
257 positionX = Math.max(gutterSize, anchorBox.x - width - gutterSize); | 264 positionX = Math.max(gutterSize, anchorBox.x - width - gutterSize); |
258 var spaceLeft = anchorBox.x - positionX - gutterSize; | 265 var spaceLeft = anchorBox.x - positionX - gutterSize; |
259 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { | 266 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { |
260 if (width < measuredWidth) | 267 if (width < measuredWidth) |
261 height += scrollbarSize; | 268 height += scrollbarSize; |
262 if (width > spaceLeft) | 269 if (width > spaceLeft) { |
263 this._arrowElement.classList.add('arrow-none'); | 270 this._arrowElement.classList.add('arrow-none'); |
271 enoughWidth = false; | |
272 } | |
264 } else { | 273 } else { |
265 width = Math.min(width, spaceLeft); | 274 width = Math.min(width, spaceLeft); |
266 } | 275 } |
267 this._arrowElement.setIconType('mediumicon-arrow-right'); | 276 this._arrowElement.setIconType('mediumicon-arrow-right'); |
268 this._arrowElement.classList.add('arrow-right'); | 277 this._arrowElement.classList.add('arrow-right'); |
269 arrowX = anchorBox.x - gutterSize; | 278 arrowX = anchorBox.x - gutterSize; |
270 } else { | 279 } else { |
271 positionX = anchorBox.x + anchorBox.width + gutterSize; | 280 positionX = anchorBox.x + anchorBox.width + gutterSize; |
272 var spaceRight = containerWidth - positionX - gutterSize; | 281 var spaceRight = containerWidth - positionX - gutterSize; |
273 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { | 282 if (this._sizeBehavior === UI.GlassPane.SizeBehavior.MeasureContent) { |
274 if (width < measuredWidth) | 283 if (width < measuredWidth) |
275 height += scrollbarSize; | 284 height += scrollbarSize; |
276 if (width > spaceRight) { | 285 if (width > spaceRight) { |
277 this._arrowElement.classList.add('arrow-none'); | 286 this._arrowElement.classList.add('arrow-none'); |
278 positionX = containerWidth - gutterSize - width; | 287 positionX = containerWidth - gutterSize - width; |
288 enoughWidth = false; | |
279 } | 289 } |
280 } else { | 290 } else { |
281 width = Math.min(width, spaceRight); | 291 width = Math.min(width, spaceRight); |
282 } | 292 } |
283 this._arrowElement.setIconType('mediumicon-arrow-left'); | 293 this._arrowElement.setIconType('mediumicon-arrow-left'); |
284 this._arrowElement.classList.add('arrow-left'); | 294 this._arrowElement.classList.add('arrow-left'); |
285 arrowX = anchorBox.x + anchorBox.width + gutterSize; | 295 arrowX = anchorBox.x + anchorBox.width + gutterSize; |
286 } | 296 } |
287 | 297 |
288 positionY = Math.max(gutterSize, Math.min(anchorBox.y, containerHeight - height - gutterSize)); | 298 positionY = Math.max(gutterSize, Math.min(anchorBox.y, containerHeight - height - gutterSize)); |
289 if (this._showArrow && positionY - arrowSize >= gutterSize) | 299 if (enoughWidth && this._showArrow && positionY - arrowSize >= gutterSiz e) |
290 positionY -= arrowSize; | 300 positionY -= arrowSize; |
301 else if (!enoughWidth) | |
caseq
2017/03/22 23:30:03
ditto.
| |
302 positionY += arrowSize; | |
291 height = Math.min(height, containerHeight - positionY - gutterSize); | 303 height = Math.min(height, containerHeight - positionY - gutterSize); |
292 if (2 * arrowSize >= height) { | 304 if (2 * arrowSize >= height) { |
293 this._arrowElement.classList.add('arrow-none'); | 305 this._arrowElement.classList.add('arrow-none'); |
294 } else { | 306 } else { |
295 var arrowY = anchorBox.y + Math.min(50, Math.floor(anchorBox.height / 2)); | 307 var arrowY = anchorBox.y + Math.min(50, Math.floor(anchorBox.height / 2)); |
296 arrowY = Number.constrain(arrowY, positionY + arrowSize, positionY + h eight - arrowSize); | 308 arrowY = Number.constrain(arrowY, positionY + arrowSize, positionY + h eight - arrowSize); |
297 this._arrowElement.positionAt(arrowX, arrowY, container); | 309 this._arrowElement.positionAt(arrowX, arrowY, container); |
298 } | 310 } |
299 } | 311 } |
300 } else { | 312 } else { |
(...skipping 65 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
366 UI.GlassPane.SizeBehavior = { | 378 UI.GlassPane.SizeBehavior = { |
367 SetExactSize: Symbol('SetExactSize'), | 379 SetExactSize: Symbol('SetExactSize'), |
368 SetExactWidthMaxHeight: Symbol('SetExactWidthMaxHeight'), | 380 SetExactWidthMaxHeight: Symbol('SetExactWidthMaxHeight'), |
369 MeasureContent: Symbol('MeasureContent') | 381 MeasureContent: Symbol('MeasureContent') |
370 }; | 382 }; |
371 | 383 |
372 /** @type {!Map<!Document, !Element>} */ | 384 /** @type {!Map<!Document, !Element>} */ |
373 UI.GlassPane._containers = new Map(); | 385 UI.GlassPane._containers = new Map(); |
374 /** @type {!Set<!UI.GlassPane>} */ | 386 /** @type {!Set<!UI.GlassPane>} */ |
375 UI.GlassPane._panes = new Set(); | 387 UI.GlassPane._panes = new Set(); |
OLD | NEW |