OLD | NEW |
1 /* | 1 /* |
2 * Copyright (C) 2012 Google Inc. All rights reserved. | 2 * Copyright (C) 2012 Google Inc. All rights reserved. |
3 * | 3 * |
4 * Redistribution and use in source and binary forms, with or without | 4 * Redistribution and use in source and binary forms, with or without |
5 * modification, are permitted provided that the following conditions are | 5 * modification, are permitted provided that the following conditions are |
6 * met: | 6 * met: |
7 * | 7 * |
8 * 1. Redistributions of source code must retain the above copyright | 8 * 1. Redistributions of source code must retain the above copyright |
9 * notice, this list of conditions and the following disclaimer. | 9 * notice, this list of conditions and the following disclaimer. |
10 * | 10 * |
(...skipping 50 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
61 this._sidebarView.show(this.element); | 61 this._sidebarView.show(this.element); |
62 this._mainView.show(this.element); | 62 this._mainView.show(this.element); |
63 } | 63 } |
64 | 64 |
65 this._onDragStartBound = this._onDragStart.bind(this); | 65 this._onDragStartBound = this._onDragStart.bind(this); |
66 this._resizerElements = []; | 66 this._resizerElements = []; |
67 | 67 |
68 this._resizable = true; | 68 this._resizable = true; |
69 this._useDip = !!useDip; | 69 this._useDip = !!useDip; |
70 | 70 |
71 this._savedSidebarWidth = defaultSidebarWidth || 200; | 71 this._defaultSidebarWidth = defaultSidebarWidth || 200; |
72 this._savedSidebarHeight = defaultSidebarHeight || this._savedSidebarWidth; | 72 this._defaultSidebarHeight = defaultSidebarHeight || this._defaultSidebarWid
th; |
73 | 73 |
74 if (0 < this._savedSidebarWidth && this._savedSidebarWidth < 1 && | 74 if (0 < this._defaultSidebarWidth && this._defaultSidebarWidth < 1 && |
75 0 < this._savedSidebarHeight && this._savedSidebarHeight < 1) | 75 0 < this._defaultSidebarHeight && this._defaultSidebarHeight < 1) |
76 this._useFraction = true; | 76 this._useFraction = true; |
77 | 77 |
78 this._settingName = settingName; | 78 this._settingName = settingName; |
79 | 79 |
80 this.setSecondIsSidebar(secondIsSidebar); | 80 this.setSecondIsSidebar(secondIsSidebar); |
81 | 81 |
82 this._innerSetVertical(isVertical); | 82 this._innerSetVertical(isVertical); |
83 this._showMode = WebInspector.SplitView.ShowMode.Both; | 83 this._showMode = WebInspector.SplitView.ShowMode.Both; |
84 | 84 |
85 // Should be called after isVertical has the right value. | 85 // Should be called after isVertical has the right value. |
(...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
129 /** | 129 /** |
130 * @param {boolean} isVertical | 130 * @param {boolean} isVertical |
131 */ | 131 */ |
132 _innerSetVertical: function(isVertical) | 132 _innerSetVertical: function(isVertical) |
133 { | 133 { |
134 this.element.classList.remove(this._isVertical ? "hbox" : "vbox"); | 134 this.element.classList.remove(this._isVertical ? "hbox" : "vbox"); |
135 this._isVertical = isVertical; | 135 this._isVertical = isVertical; |
136 this.element.classList.add(this._isVertical ? "hbox" : "vbox"); | 136 this.element.classList.add(this._isVertical ? "hbox" : "vbox"); |
137 delete this._resizerElementSize; | 137 delete this._resizerElementSize; |
138 this._sidebarSize = -1; | 138 this._sidebarSize = -1; |
| 139 this._restoreSidebarSizeFromSettings(); |
| 140 if (this._shouldSaveShowMode) |
| 141 this._restoreAndApplyShowModeFromSettings(); |
139 }, | 142 }, |
140 | 143 |
141 /** | 144 /** |
142 * @param {boolean=} animate | 145 * @param {boolean=} animate |
143 */ | 146 */ |
144 _updateLayout: function(animate) | 147 _updateLayout: function(animate) |
145 { | 148 { |
146 delete this._totalSize; // Lazy update. | 149 delete this._totalSize; // Lazy update. |
147 this._innerSetSidebarSize(this._lastSidebarSize(), false, animate); | 150 this._innerSetSidebarSize(this._preferredSidebarSize(), false, animate); |
148 }, | 151 }, |
149 | 152 |
150 /** | 153 /** |
151 * @return {!Element} | 154 * @return {!Element} |
152 */ | 155 */ |
153 mainElement: function() | 156 mainElement: function() |
154 { | 157 { |
155 return this._mainElement; | 158 return this._mainElement; |
156 }, | 159 }, |
157 | 160 |
158 /** | 161 /** |
159 * @return {!Element} | 162 * @return {!Element} |
160 */ | 163 */ |
161 sidebarElement: function() | 164 sidebarElement: function() |
162 { | 165 { |
163 return this._sidebarElement; | 166 return this._sidebarElement; |
164 }, | 167 }, |
165 | 168 |
166 /** | 169 /** |
167 * @return {boolean} | 170 * @return {boolean} |
168 */ | 171 */ |
169 isSidebarSecond: function() | 172 isSidebarSecond: function() |
170 { | 173 { |
171 return this._secondIsSidebar; | 174 return this._secondIsSidebar; |
172 }, | 175 }, |
173 | 176 |
174 enableShowModeSaving: function() | 177 enableShowModeSaving: function() |
175 { | 178 { |
176 this._shouldSaveShowMode = true; | 179 this._shouldSaveShowMode = true; |
177 var savedShowMode = this._savedShowMode(); | 180 this._restoreAndApplyShowModeFromSettings(); |
178 switch (savedShowMode) { | |
179 case WebInspector.SplitView.ShowMode.Both: | |
180 this.showBoth(); | |
181 break; | |
182 case WebInspector.SplitView.ShowMode.OnlyMain: | |
183 this.hideSidebar(); | |
184 break; | |
185 case WebInspector.SplitView.ShowMode.OnlySidebar: | |
186 this.hideMain(); | |
187 break; | |
188 } | |
189 }, | 181 }, |
190 | 182 |
191 /** | 183 /** |
192 * @return {string} | 184 * @return {string} |
193 */ | 185 */ |
194 showMode: function() | 186 showMode: function() |
195 { | 187 { |
196 return this._showMode; | 188 return this._showMode; |
197 }, | 189 }, |
198 | 190 |
(...skipping 27 matching lines...) Expand all Loading... |
226 if (this._isShowingOne) | 218 if (this._isShowingOne) |
227 return null; | 219 return null; |
228 return this._isVertical ? | 220 return this._isVertical ? |
229 (this._secondIsSidebar ? "right" : "left") : | 221 (this._secondIsSidebar ? "right" : "left") : |
230 (this._secondIsSidebar ? "bottom" : "top"); | 222 (this._secondIsSidebar ? "bottom" : "top"); |
231 }, | 223 }, |
232 | 224 |
233 /** | 225 /** |
234 * @return {number} | 226 * @return {number} |
235 */ | 227 */ |
236 desiredSidebarSize: function() | 228 preferredSidebarSize: function() |
237 { | 229 { |
238 return this._lastSidebarSize(); | 230 return this._preferredSidebarSize(); |
239 }, | 231 }, |
240 | 232 |
241 /** | 233 /** |
242 * @return {!Element} | 234 * @return {!Element} |
243 */ | 235 */ |
244 resizerElement: function() | 236 resizerElement: function() |
245 { | 237 { |
246 return this._resizerElement; | 238 return this._resizerElement; |
247 }, | 239 }, |
248 | 240 |
(...skipping 95 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
344 this._resizable = resizable; | 336 this._resizable = resizable; |
345 this._resizerElement.classList.toggle("hidden", !resizable); | 337 this._resizerElement.classList.toggle("hidden", !resizable); |
346 }, | 338 }, |
347 | 339 |
348 /** | 340 /** |
349 * @param {number} size | 341 * @param {number} size |
350 */ | 342 */ |
351 setSidebarSize: function(size) | 343 setSidebarSize: function(size) |
352 { | 344 { |
353 this._innerSetSidebarSize(size); | 345 this._innerSetSidebarSize(size); |
354 this._saveSetting(); | 346 this._saveSidebarSizeToSettings(); |
355 }, | 347 }, |
356 | 348 |
357 /** | 349 /** |
358 * @return {number} | 350 * @return {number} |
359 */ | 351 */ |
360 sidebarSize: function() | 352 sidebarSize: function() |
361 { | 353 { |
362 return Math.max(0, this._sidebarSize); | 354 return Math.max(0, this._sidebarSize); |
363 }, | 355 }, |
364 | 356 |
365 /** | 357 /** |
366 * @return {number} | 358 * @return {number} |
367 */ | 359 */ |
368 totalSize: function() | 360 totalSize: function() |
369 { | 361 { |
370 if (!this._totalSize) | 362 if (!this._totalSize) |
371 this._totalSize = this._isVertical ? this.element.offsetWidth : this
.element.offsetHeight; | 363 this._totalSize = this._isVertical ? this.element.offsetWidth : this
.element.offsetHeight; |
372 return this._totalSize; | 364 return this._totalSize; |
373 }, | 365 }, |
374 | 366 |
375 /** | 367 /** |
376 * @param {string} showMode | 368 * @param {string} showMode |
377 */ | 369 */ |
378 _updateShowMode: function(showMode) | 370 _updateShowMode: function(showMode) |
379 { | 371 { |
380 this._showMode = showMode; | 372 this._showMode = showMode; |
381 this._saveSetting(); | 373 this._saveShowModeToSettings(); |
382 this._updateShowHideSidebarButton(); | 374 this._updateShowHideSidebarButton(); |
383 this.dispatchEventToListeners(WebInspector.SplitView.Events.ShowModeChan
ged, showMode); | 375 this.dispatchEventToListeners(WebInspector.SplitView.Events.ShowModeChan
ged, showMode); |
384 }, | 376 }, |
385 | 377 |
386 /** | 378 /** |
387 * @param {number} size | 379 * @param {number} size |
388 * @param {boolean=} ignoreConstraints | 380 * @param {boolean=} ignoreConstraints |
389 * @param {boolean=} animate | 381 * @param {boolean=} animate |
390 */ | 382 */ |
391 _innerSetSidebarSize: function(size, ignoreConstraints, animate) | 383 _innerSetSidebarSize: function(size, ignoreConstraints, animate) |
(...skipping 229 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
621 | 613 |
622 /** | 614 /** |
623 * @param {!MouseEvent} event | 615 * @param {!MouseEvent} event |
624 * @return {boolean} | 616 * @return {boolean} |
625 */ | 617 */ |
626 _startResizerDragging: function(event) | 618 _startResizerDragging: function(event) |
627 { | 619 { |
628 if (!this._resizable) | 620 if (!this._resizable) |
629 return false; | 621 return false; |
630 | 622 |
631 this._saveSetting(); | |
632 this._dragOffset = (this._secondIsSidebar ? this.totalSize() - this._sid
ebarSize : this._sidebarSize) - (this._isVertical ? event.pageX : event.pageY); | 623 this._dragOffset = (this._secondIsSidebar ? this.totalSize() - this._sid
ebarSize : this._sidebarSize) - (this._isVertical ? event.pageX : event.pageY); |
633 return true; | 624 return true; |
634 }, | 625 }, |
635 | 626 |
636 /** | 627 /** |
637 * @param {!MouseEvent} event | 628 * @param {!MouseEvent} event |
638 */ | 629 */ |
639 _resizerDragging: function(event) | 630 _resizerDragging: function(event) |
640 { | 631 { |
641 var newOffset = (this._isVertical ? event.pageX : event.pageY) + this._d
ragOffset; | 632 var newOffset = (this._isVertical ? event.pageX : event.pageY) + this._d
ragOffset; |
642 var newSize = (this._secondIsSidebar ? this.totalSize() - newOffset : ne
wOffset); | 633 var newSize = (this._secondIsSidebar ? this.totalSize() - newOffset : ne
wOffset); |
643 this.setSidebarSize(newSize); | 634 this.setSidebarSize(newSize); |
644 event.preventDefault(); | 635 event.preventDefault(); |
645 }, | 636 }, |
646 | 637 |
647 /** | 638 /** |
648 * @param {!MouseEvent} event | 639 * @param {!MouseEvent} event |
649 */ | 640 */ |
650 _endResizerDragging: function(event) | 641 _endResizerDragging: function(event) |
651 { | 642 { |
652 delete this._dragOffset; | 643 delete this._dragOffset; |
653 this._saveSetting(); | 644 this._saveSidebarSizeToSettings(); |
654 }, | 645 }, |
655 | 646 |
656 hideDefaultResizer: function() | 647 hideDefaultResizer: function() |
657 { | 648 { |
658 this.element.classList.add("split-view-no-resizer"); | 649 this.element.classList.add("split-view-no-resizer"); |
659 }, | 650 }, |
660 | 651 |
661 /** | 652 /** |
662 * @param {!Element} resizerElement | 653 * @param {!Element} resizerElement |
663 */ | 654 */ |
(...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
721 */ | 712 */ |
722 _settingForOrientation: function() | 713 _settingForOrientation: function() |
723 { | 714 { |
724 var state = this._setting() ? this._setting().get() : {}; | 715 var state = this._setting() ? this._setting().get() : {}; |
725 return this._isVertical ? state.vertical : state.horizontal; | 716 return this._isVertical ? state.vertical : state.horizontal; |
726 }, | 717 }, |
727 | 718 |
728 /** | 719 /** |
729 * @return {number} | 720 * @return {number} |
730 */ | 721 */ |
731 _lastSidebarSize: function() | 722 _preferredSidebarSize: function() |
732 { | 723 { |
733 var settingForOrientation = this._settingForOrientation(); | 724 var size = this._savedSidebarSize; |
734 var size = settingForOrientation ? settingForOrientation.size : 0; | |
735 if (!size) | |
736 size = this._isVertical ? this._savedSidebarWidth : this._savedSide
barHeight; | |
737 if (this._useFraction) | 725 if (this._useFraction) |
738 size *= this.totalSize(); | 726 size *= this.totalSize(); |
739 return size; | 727 return size; |
740 }, | 728 }, |
741 | 729 |
742 /** | 730 _restoreSidebarSizeFromSettings: function() |
743 * @return {string} | 731 { |
744 */ | 732 var settingForOrientation = this._settingForOrientation(); |
745 _savedShowMode: function() | 733 var size = settingForOrientation ? settingForOrientation.size : 0; |
| 734 if (!size) |
| 735 size = this._isVertical ? this._defaultSidebarWidth : this._default
SidebarHeight; |
| 736 this._savedSidebarSize = size; |
| 737 }, |
| 738 |
| 739 _restoreAndApplyShowModeFromSettings: function() |
746 { | 740 { |
747 var orientationState = this._settingForOrientation(); | 741 var orientationState = this._settingForOrientation(); |
748 return orientationState ? orientationState.showMode : ""; | 742 this._savedShowMode = orientationState ? orientationState.showMode : Web
Inspector.SplitView.ShowMode.Both; |
| 743 this._showMode = this._savedShowMode; |
| 744 |
| 745 switch (this._savedShowMode) { |
| 746 case WebInspector.SplitView.ShowMode.Both: |
| 747 this.showBoth(); |
| 748 break; |
| 749 case WebInspector.SplitView.ShowMode.OnlyMain: |
| 750 this.hideSidebar(); |
| 751 break; |
| 752 case WebInspector.SplitView.ShowMode.OnlySidebar: |
| 753 this.hideMain(); |
| 754 break; |
| 755 } |
749 }, | 756 }, |
750 | 757 |
751 _sizeToSave: function() | 758 _saveSidebarSizeToSettings: function() |
752 { | 759 { |
| 760 if (this._sidebarSize < 0) |
| 761 return; |
| 762 |
753 var size = this._sidebarSize; | 763 var size = this._sidebarSize; |
754 if (size < 0) | |
755 return -1; | |
756 | |
757 if (this._useFraction) | 764 if (this._useFraction) |
758 size /= this.totalSize(); | 765 size /= this.totalSize(); |
759 return size; | 766 this._savedSidebarSize = size; |
| 767 this._saveSetting(); |
| 768 }, |
| 769 |
| 770 _saveShowModeToSettings: function() |
| 771 { |
| 772 this._savedShowMode = this._showMode; |
| 773 this._saveSetting(); |
760 }, | 774 }, |
761 | 775 |
762 _saveSetting: function() | 776 _saveSetting: function() |
763 { | 777 { |
764 var size = this._sizeToSave(); | |
765 | |
766 if (size !== -1) { | |
767 if (this._isVertical) | |
768 this._savedSidebarWidth = size; | |
769 else | |
770 this._savedSidebarHeight = size; | |
771 } | |
772 | |
773 var setting = this._setting(); | 778 var setting = this._setting(); |
774 if (!setting) | 779 if (!setting) |
775 return; | 780 return; |
776 var state = setting.get(); | 781 var state = setting.get(); |
777 var orientationState = (this._isVertical ? state.vertical : state.horizo
ntal) || {}; | 782 var orientationState = (this._isVertical ? state.vertical : state.horizo
ntal) || {}; |
778 if (size !== -1) | 783 |
779 orientationState.size = size; | 784 orientationState.size = this._savedSidebarSize; |
780 if (this._shouldSaveShowMode) | 785 if (this._shouldSaveShowMode) |
781 orientationState.showMode = this._showMode; | 786 orientationState.showMode = this._savedShowMode; |
| 787 |
782 if (this._isVertical) | 788 if (this._isVertical) |
783 state.vertical = orientationState; | 789 state.vertical = orientationState; |
784 else | 790 else |
785 state.horizontal = orientationState; | 791 state.horizontal = orientationState; |
786 setting.set(state); | 792 setting.set(state); |
787 }, | 793 }, |
788 | 794 |
789 /** | 795 /** |
790 * @param {!WebInspector.Event} event | 796 * @param {!WebInspector.Event} event |
791 */ | 797 */ |
792 _onZoomChanged: function(event) | 798 _onZoomChanged: function(event) |
793 { | 799 { |
794 var data = /** @type {{from: number, to: number}} */ (event.data); | 800 var data = /** @type {{from: number, to: number}} */ (event.data); |
795 this._innerSetSidebarSize(this.sidebarSize() * data.from / data.to, true
); | 801 this._innerSetSidebarSize(this.sidebarSize() * data.from / data.to, true
); |
796 this._saveSetting(); | 802 this._saveSidebarSizeToSettings(); |
797 }, | 803 }, |
798 | 804 |
799 /** | 805 /** |
800 * @param {string} title | 806 * @param {string} title |
801 * @param {string} className | 807 * @param {string} className |
802 * @return {!WebInspector.StatusBarButton} | 808 * @return {!WebInspector.StatusBarButton} |
803 */ | 809 */ |
804 createShowHideSidebarButton: function(title, className) | 810 createShowHideSidebarButton: function(title, className) |
805 { | 811 { |
806 console.assert(this.isVertical(), "Buttons for split view with horizonta
l split are not supported yet."); | 812 console.assert(this.isVertical(), "Buttons for split view with horizonta
l split are not supported yet."); |
(...skipping 22 matching lines...) Expand all Loading... |
829 _updateShowHideSidebarButton: function() | 835 _updateShowHideSidebarButton: function() |
830 { | 836 { |
831 if (!this._showHideSidebarButton) | 837 if (!this._showHideSidebarButton) |
832 return; | 838 return; |
833 this._showHideSidebarButton.state = this._isShowingOne === this.isSideba
rSecond() ? "left" : "right"; | 839 this._showHideSidebarButton.state = this._isShowingOne === this.isSideba
rSecond() ? "left" : "right"; |
834 this._showHideSidebarButton.title = this._isShowingOne ? WebInspector.UI
String("Show %s", this._showHideSidebarButtonTitle) : WebInspector.UIString("Hid
e %s", this._showHideSidebarButtonTitle); | 840 this._showHideSidebarButton.title = this._isShowingOne ? WebInspector.UI
String("Show %s", this._showHideSidebarButtonTitle) : WebInspector.UIString("Hid
e %s", this._showHideSidebarButtonTitle); |
835 }, | 841 }, |
836 | 842 |
837 __proto__: WebInspector.View.prototype | 843 __proto__: WebInspector.View.prototype |
838 } | 844 } |
OLD | NEW |