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

Side by Side Diff: Source/devtools/front_end/SplitView.js

Issue 185943004: DevTools: Do not save split view size on show mode changes. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Rebaselined Created 6 years, 9 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
« no previous file with comments | « Source/devtools/front_end/InspectedPagePlaceholder.js ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
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
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
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
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
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
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
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
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 }
OLDNEW
« no previous file with comments | « Source/devtools/front_end/InspectedPagePlaceholder.js ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698