1d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)// Copyright 2014 The Chromium Authors. All rights reserved. 2d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)// Use of this source code is governed by a BSD-style license that can be 3d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)// found in the LICENSE file. 4d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 5d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)/** 6d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) * @constructor 7d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) * @extends {WebInspector.View} 8d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) */ 9d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)WebInspector.InspectedPagePlaceholder = function() 10d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles){ 11d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) WebInspector.View.call(this); 12d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this.element.classList.add("white-background"); 13f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) WebInspector.zoomManager.addEventListener(WebInspector.ZoomManager.Events.ZoomChanged, this._scheduleUpdate, this); 14d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._margins = { top: 0, right: 0, bottom: 0, left: 0 }; 15d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this.restoreMinimumSizeAndMargins(); 16f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles)}; 17f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) 18f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles)WebInspector.InspectedPagePlaceholder.Events = { 19f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) Update: "Update" 20d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)}; 21d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 22d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)WebInspector.InspectedPagePlaceholder.MarginValue = 3; 23d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 24d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)WebInspector.InspectedPagePlaceholder.prototype = { 25d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) _findMargins: function() 26d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 27d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var margins = { top: 0, right: 0, bottom: 0, left: 0 }; 28d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 29d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) if (this._useMargins) { 30d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var adjacent = { top: true, right: true, bottom: true, left: true }; 31d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var view = this; 32d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) while (view.parentView()) { 33d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var parent = view.parentView(); 34d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) // This view assumes it's always inside the main split view element, not a sidebar. 35d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) // Every parent which is not a split view, must be of the same size as this view. 36d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) if (parent instanceof WebInspector.SplitView) { 37d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var side = parent.sidebarSide(); 38d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) if (adjacent[side] && !parent.hasCustomResizer() && parent.isResizable()) 39d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) margins[side] = WebInspector.InspectedPagePlaceholder.MarginValue; 40d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) adjacent[side] = false; 41d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) } 42d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) view = parent; 43d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) } 44d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) } 45d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 46d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) if (this._margins.top !== margins.top || this._margins.left !== margins.left || this._margins.right !== margins.right || this._margins.bottom !== margins.bottom) { 47d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._margins = margins; 48d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._scheduleUpdate(); 49d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) } 50d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 51d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 52d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) onResize: function() 53d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 54d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._findMargins(); 55d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._scheduleUpdate(); 56d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 57d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 58d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) _scheduleUpdate: function() 59d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 60f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) if (this._updateId) 61f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) window.cancelAnimationFrame(this._updateId); 62f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) this._updateId = window.requestAnimationFrame(this.update.bind(this)); 63d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 64d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 65d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) /** 66d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) * @return {!Size} 67d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) */ 68d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) dipPageSize: function() 69d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 70d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var rect = this._dipPageRect(); 71d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) return new Size(Math.round(rect.width), Math.round(rect.height)); 72d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 73d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 74d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) /** 75d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) * @return {!Size} 76d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) */ 77d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) cssElementSize: function() 78d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 79d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var zoomFactor = WebInspector.zoomManager.zoomFactor(); 80d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var rect = this.element.getBoundingClientRect(); 81d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var width = rect.width - (this._margins.left + this._margins.right) / zoomFactor; 82d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var height = rect.height - (this._margins.top + this._margins.bottom) / zoomFactor; 83d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) return new Size(width, height); 84d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 85d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 86d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) restoreMinimumSizeAndMargins: function() 87d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 88d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._useMargins = true; 89d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this.setMinimumSize(50, 50); 90d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._findMargins(); 91d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 92d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 93d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) clearMinimumSizeAndMargins: function() 94d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 95d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._useMargins = false; 96d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this.setMinimumSize(1, 1); 97d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) this._findMargins(); 98d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 99d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 100d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) _dipPageRect: function() 101d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 102d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var zoomFactor = WebInspector.zoomManager.zoomFactor(); 103d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var rect = this.element.getBoundingClientRect(); 104d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var bodyRect = document.body.getBoundingClientRect(); 105d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 106d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var left = Math.max(rect.left * zoomFactor + this._margins.left, bodyRect.left * zoomFactor); 107d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var top = Math.max(rect.top * zoomFactor + this._margins.top, bodyRect.top * zoomFactor); 108d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var bottom = Math.min(rect.bottom * zoomFactor - this._margins.bottom, bodyRect.bottom * zoomFactor); 109d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var right = Math.min(rect.right * zoomFactor - this._margins.right, bodyRect.right * zoomFactor); 110d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 111d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) return { x: left, y: top, width: right - left, height: bottom - top }; 112d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 113d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 114f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) update: function() 115d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) { 116d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) delete this._updateId; 117d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) var rect = this._dipPageRect(); 118197021e6b966cfb06891637935ef33fff06433d1Ben Murdoch var bounds = { x: Math.round(rect.x), y: Math.round(rect.y), height: Math.max(1, Math.round(rect.height)), width: Math.max(1, Math.round(rect.width)) }; 119f6b7aed3f7ce69aca0d7a032d144cbd088b04393Torne (Richard Coles) this.dispatchEventToListeners(WebInspector.InspectedPagePlaceholder.Events.Update, bounds); 120d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) }, 121d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) 122d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles) __proto__: WebInspector.View.prototype 123d6cdb82654e8f3343a693ca752d5c4cee0324e17Torne (Richard Coles)}; 124