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

Side by Side Diff: chrome/browser/resources/net_internals/resizableverticalsplitview.js

Issue 7531005: Rename the net_internals file names to include hyphens. (Closed) Base URL: svn://chrome-svn/chrome/trunk/src/
Patch Set: Add some missing files Created 9 years, 4 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 | Annotate | Revision Log
OLDNEW
(Empty)
1 // Copyright (c) 2011 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.
4
5 /**
6 * This view implements a vertically split display with a draggable divider.
7 *
8 * <<-- sizer -->>
9 *
10 * +----------------------++----------------+
11 * | || |
12 * | || |
13 * | || |
14 * | || |
15 * | leftView || rightView |
16 * | || |
17 * | || |
18 * | || |
19 * | || |
20 * | || |
21 * +----------------------++----------------+
22 *
23 * @param {!View} leftView The widget to position on the left.
24 * @param {!View} rightView The widget to position on the right.
25 * @param {!DivView} sizerView The widget that will serve as draggable divider.
26 * @constructor
27 */
28 function ResizableVerticalSplitView(leftView, rightView, sizerView) {
29 View.call(this);
30
31 this.leftView_ = leftView;
32 this.rightView_ = rightView;
33 this.sizerView_ = sizerView;
34
35 // Setup the "sizer" so it can be dragged left/right to reposition the
36 // vertical split.
37 sizerView.getNode().addEventListener(
38 'mousedown', this.onDragSizerStart_.bind(this), true);
39 }
40
41 inherits(ResizableVerticalSplitView, View);
42
43 // Minimum width to size panels to, in pixels.
44 ResizableVerticalSplitView.MIN_PANEL_WIDTH = 50;
45
46 /**
47 * Sets the width of the left view.
48 * @param {Integer} px The number of pixels
49 */
50 ResizableVerticalSplitView.prototype.setLeftSplit = function(px) {
51 this.leftSplit_ = px;
52 };
53
54 /**
55 * Repositions all of the elements to fit the window.
56 */
57 ResizableVerticalSplitView.prototype.setGeometry = function(
58 left, top, width, height) {
59 ResizableVerticalSplitView.superClass_.setGeometry.call(
60 this, left, top, width, height);
61
62 // If this is the first setGeometry(), initialize the split point at 50%.
63 if (!this.leftSplit_)
64 this.leftSplit_ = parseInt((width / 2).toFixed(0));
65
66 // Calculate the horizontal split points.
67 var leftboxWidth = this.leftSplit_;
68 var sizerWidth = this.sizerView_.getWidth();
69 var rightboxWidth = width - (leftboxWidth + sizerWidth);
70
71 // Don't let the right pane get too small.
72 if (rightboxWidth < ResizableVerticalSplitView.MIN_PANEL_WIDTH) {
73 rightboxWidth = ResizableVerticalSplitView.MIN_PANEL_WIDTH;
74 leftboxWidth = width - (sizerWidth + rightboxWidth);
75 }
76
77 // Position the boxes using calculated split points.
78 this.leftView_.setGeometry(left, top, leftboxWidth, height);
79 this.sizerView_.setGeometry(this.leftView_.getRight(), top,
80 sizerWidth, height);
81 this.rightView_.setGeometry(this.sizerView_.getRight(), top,
82 rightboxWidth, height);
83 };
84
85 ResizableVerticalSplitView.prototype.show = function(isVisible) {
86 ResizableVerticalSplitView.superClass_.show.call(this, isVisible);
87 this.leftView_.show(isVisible);
88 this.sizerView_.show(isVisible);
89 this.rightView_.show(isVisible);
90 };
91
92 /**
93 * Called once we have clicked into the sizer. Starts capturing the mouse
94 * position to implement dragging.
95 */
96 ResizableVerticalSplitView.prototype.onDragSizerStart_ = function(event) {
97 this.sizerMouseMoveListener_ = this.onDragSizer.bind(this);
98 this.sizerMouseUpListener_ = this.onDragSizerEnd.bind(this);
99
100 window.addEventListener('mousemove', this.sizerMouseMoveListener_, true);
101 window.addEventListener('mouseup', this.sizerMouseUpListener_, true);
102
103 event.preventDefault();
104 };
105
106 /**
107 * Called when the mouse has moved after dragging started.
108 */
109 ResizableVerticalSplitView.prototype.onDragSizer = function(event) {
110 // Convert from page coordinates, to view coordinates.
111 this.leftSplit_ = (event.pageX - this.getLeft());
112
113 // Avoid shrinking the left box too much.
114 this.leftSplit_ = Math.max(
115 this.leftSplit_, ResizableVerticalSplitView.MIN_PANEL_WIDTH);
116 // Avoid shrinking the right box too much.
117 this.leftSplit_ = Math.min(
118 this.leftSplit_,
119 this.getWidth() - ResizableVerticalSplitView.MIN_PANEL_WIDTH);
120
121 // Force a layout with the new |leftSplit_|.
122 this.setGeometry(
123 this.getLeft(), this.getTop(), this.getWidth(), this.getHeight());
124 };
125
126 /**
127 * Called once the mouse has been released, and the dragging is over.
128 */
129 ResizableVerticalSplitView.prototype.onDragSizerEnd = function(event) {
130 window.removeEventListener('mousemove', this.sizerMouseMoveListener_, true);
131 window.removeEventListener('mouseup', this.sizerMouseUpListener_, true);
132
133 this.sizerMouseMoveListener_ = null;
134 this.sizerMouseUpListener_ = null;
135
136 event.preventDefault();
137 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698