BookmarkManager: Fix 'new folder text field size changes on clicking it' issue.
[chromium-blink-merge.git] / chrome / browser / resources / net_internals / view.js
blobab2db5a773e5da958df570fb3a368bb0c41d0393
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
3 // found in the LICENSE file.
5 /**
6  * Base class to represent a "view". A view is an absolutely positioned box on
7  * the page.
8  */
9 var View = (function() {
10   'use strict';
12   /**
13    * @constructor
14    */
15   function View() {
16     this.isVisible_ = true;
17   }
19   View.prototype = {
20     /**
21      * Called to reposition the view on the page. Measurements are in pixels.
22      */
23     setGeometry: function(left, top, width, height) {
24       this.left_ = left;
25       this.top_ = top;
26       this.width_ = width;
27       this.height_ = height;
28     },
30     /**
31      * Called to show/hide the view.
32      */
33     show: function(isVisible) {
34       this.isVisible_ = isVisible;
35     },
37     isVisible: function() {
38       return this.isVisible_;
39     },
41     /**
42      * Method of the observer class.
43      *
44      * Called to check if an observer needs the data it is
45      * observing to be actively updated.
46      */
47     isActive: function() {
48       return this.isVisible();
49     },
51     getLeft: function() {
52       return this.left_;
53     },
55     getTop: function() {
56       return this.top_;
57     },
59     getWidth: function() {
60       return this.width_;
61     },
63     getHeight: function() {
64       return this.height_;
65     },
67     getRight: function() {
68       return this.getLeft() + this.getWidth();
69     },
71     getBottom: function() {
72       return this.getTop() + this.getHeight();
73     },
75     setParameters: function(params) {},
77     /**
78      * Called when loading a log file, after clearing all events, but before
79      * loading the new ones.  |polledData| contains the data from all
80      * PollableData helpers.  |tabData| contains the data for the particular
81      * tab.  |logDump| is the entire log dump, which includes the other two
82      * values.  It's included separately so most views don't have to depend on
83      * its specifics.
84      */
85     onLoadLogStart: function(polledData, tabData, logDump) {
86     },
88     /**
89      * Called as the final step of loading a log file.  Arguments are the same
90      * as onLoadLogStart.  Returns true to indicate the tab should be shown,
91      * false otherwise.
92      */
93     onLoadLogFinish: function(polledData, tabData, logDump) {
94       return false;
95     }
96   };
98   return View;
99 })();
101 //-----------------------------------------------------------------------------
104  * DivView is an implementation of View that wraps a DIV.
105  */
106 var DivView = (function() {
107   'use strict';
109   // We inherit from View.
110   var superClass = View;
112   /**
113    * @constructor
114    */
115   function DivView(divId) {
116     // Call superclass's constructor.
117     superClass.call(this);
119     this.node_ = $(divId);
120     if (!this.node_)
121       throw new Error('Element ' + divId + ' not found');
123     // Initialize the default values to those of the DIV.
124     this.width_ = this.node_.offsetWidth;
125     this.height_ = this.node_.offsetHeight;
126     this.isVisible_ = this.node_.style.display != 'none';
127   }
129   DivView.prototype = {
130     // Inherit the superclass's methods.
131     __proto__: superClass.prototype,
133     setGeometry: function(left, top, width, height) {
134       superClass.prototype.setGeometry.call(this, left, top, width, height);
136       this.node_.style.position = 'absolute';
137       setNodePosition(this.node_, left, top, width, height);
138     },
140     show: function(isVisible) {
141       superClass.prototype.show.call(this, isVisible);
142       setNodeDisplay(this.node_, isVisible);
143     },
145     /**
146      * Returns the wrapped DIV
147      */
148     getNode: function() {
149       return this.node_;
150     }
151   };
153   return DivView;
154 })();
157 //-----------------------------------------------------------------------------
160  * Implementation of View that sizes its child to fit the entire window.
162  * @param {!View} childView The child view.
163  */
164 var WindowView = (function() {
165   'use strict';
167   // We inherit from View.
168   var superClass = View;
170   /**
171    * @constructor
172    */
173   function WindowView(childView) {
174     // Call superclass's constructor.
175     superClass.call(this);
177     this.childView_ = childView;
178     window.addEventListener('resize', this.resetGeometry.bind(this), true);
179   }
181   WindowView.prototype = {
182     // Inherit the superclass's methods.
183     __proto__: superClass.prototype,
185     setGeometry: function(left, top, width, height) {
186       superClass.prototype.setGeometry.call(this, left, top, width, height);
187       this.childView_.setGeometry(left, top, width, height);
188     },
190     show: function() {
191       superClass.prototype.show.call(this, isVisible);
192       this.childView_.show(isVisible);
193     },
195     resetGeometry: function() {
196       this.setGeometry(0, 0, window.innerWidth, window.innerHeight);
197     }
198   };
200   return WindowView;
201 })();
204  * View that positions two views vertically. The top view should be
205  * fixed-height, and the bottom view will fill the remainder of the space.
207  *  +-----------------------------------+
208  *  |            topView                |
209  *  +-----------------------------------+
210  *  |                                   |
211  *  |                                   |
212  *  |                                   |
213  *  |          bottomView               |
214  *  |                                   |
215  *  |                                   |
216  *  |                                   |
217  *  |                                   |
218  *  +-----------------------------------+
219  */
220 var VerticalSplitView = (function() {
221   'use strict';
223   // We inherit from View.
224   var superClass = View;
226   /**
227    * @param {!View} topView The top view.
228    * @param {!View} bottomView The bottom view.
229    * @constructor
230    */
231   function VerticalSplitView(topView, bottomView) {
232     // Call superclass's constructor.
233     superClass.call(this);
235     this.topView_ = topView;
236     this.bottomView_ = bottomView;
237   }
239   VerticalSplitView.prototype = {
240     // Inherit the superclass's methods.
241     __proto__: superClass.prototype,
243     setGeometry: function(left, top, width, height) {
244       superClass.prototype.setGeometry.call(this, left, top, width, height);
246       var fixedHeight = this.topView_.getHeight();
247       this.topView_.setGeometry(left, top, width, fixedHeight);
249       this.bottomView_.setGeometry(
250           left, top + fixedHeight, width, height - fixedHeight);
251     },
253     show: function(isVisible) {
254       superClass.prototype.show.call(this, isVisible);
256       this.topView_.show(isVisible);
257       this.bottomView_.show(isVisible);
258     }
259   };
261   return VerticalSplitView;
262 })();
265  * View that positions two views horizontally. The left view should be
266  * fixed-width, and the right view will fill the remainder of the space.
268  *  +----------+--------------------------+
269  *  |          |                          |
270  *  |          |                          |
271  *  |          |                          |
272  *  | leftView |       rightView          |
273  *  |          |                          |
274  *  |          |                          |
275  *  |          |                          |
276  *  |          |                          |
277  *  |          |                          |
278  *  |          |                          |
279  *  |          |                          |
280  *  +----------+--------------------------+
281  */
282 var HorizontalSplitView = (function() {
283   'use strict';
285   // We inherit from View.
286   var superClass = View;
288   /**
289    * @param {!View} leftView The left view.
290    * @param {!View} rightView The right view.
291    * @constructor
292    */
293   function HorizontalSplitView(leftView, rightView) {
294     // Call superclass's constructor.
295     superClass.call(this);
297     this.leftView_ = leftView;
298     this.rightView_ = rightView;
299   }
301   HorizontalSplitView.prototype = {
302     // Inherit the superclass's methods.
303     __proto__: superClass.prototype,
305     setGeometry: function(left, top, width, height) {
306       superClass.prototype.setGeometry.call(this, left, top, width, height);
308       var fixedWidth = this.leftView_.getWidth();
309       this.leftView_.setGeometry(left, top, fixedWidth, height);
311       this.rightView_.setGeometry(
312           left + fixedWidth, top, width - fixedWidth, height);
313     },
315     show: function(isVisible) {
316       superClass.prototype.show.call(this, isVisible);
318       this.leftView_.show(isVisible);
319       this.rightView_.show(isVisible);
320     }
321   };
323   return HorizontalSplitView;
324 })();