Changeset View
Changeset View
Standalone View
Standalone View
webroot/rsrc/js/phuix/PHUIXFormationColumnView.js
| Show All 11 Lines | JX.install('PHUIXFormationColumnView', { | ||||
| properties: { | properties: { | ||||
| isRightAligned: false, | isRightAligned: false, | ||||
| isVisible: true, | isVisible: true, | ||||
| expanderNode: null, | expanderNode: null, | ||||
| resizerItem: null, | resizerItem: null, | ||||
| resizerControl: null, | resizerControl: null, | ||||
| width: null, | width: null, | ||||
| widthSettingKey: null, | |||||
| visibleSettingKey: null, | |||||
| minimumWidth: null, | |||||
| maximumWidth: null, | |||||
| flank: null | flank: null | ||||
| }, | }, | ||||
| members: { | members: { | ||||
| _node: null, | _node: null, | ||||
| _resizingWidth: null, | _resizingWidth: null, | ||||
| _resizingBarPosition: null, | _resizingBarPosition: null, | ||||
| _dragging: null, | _dragging: null, | ||||
| ▲ Show 20 Lines • Show All 50 Lines • ▼ Show 20 Lines | _onresizemove: function(e) { | ||||
| var width; | var width; | ||||
| if (this.getIsRightAligned()) { | if (this.getIsRightAligned()) { | ||||
| width = this.getWidth() - dx; | width = this.getWidth() - dx; | ||||
| } else { | } else { | ||||
| width = this.getWidth() + dx; | width = this.getWidth() + dx; | ||||
| } | } | ||||
| // TODO: Make these configurable? | var min_width = this.getMinimumWidth(); | ||||
| width = Math.max(width, 150); | if (min_width) { | ||||
| width = Math.min(width, 512); | width = Math.max(width, min_width); | ||||
| } | |||||
| var max_width = this.getMaximumWidth(); | |||||
| if (max_width) { | |||||
| width = Math.min(width, max_width); | |||||
| } | |||||
| this._resizingWidth = width; | this._resizingWidth = width; | ||||
| this._node.style.width = this._resizingWidth + 'px'; | this._node.style.width = this._resizingWidth + 'px'; | ||||
| var adjust_x = (this._resizingWidth - this.getWidth()); | var adjust_x = (this._resizingWidth - this.getWidth()); | ||||
| if (this.getIsRightAligned()) { | if (this.getIsRightAligned()) { | ||||
| adjust_x = -adjust_x; | adjust_x = -adjust_x; | ||||
| Show All 12 Lines | members: { | ||||
| _onresizeend: function(e) { | _onresizeend: function(e) { | ||||
| if (!this._dragging) { | if (!this._dragging) { | ||||
| return; | return; | ||||
| } | } | ||||
| this.setWidth(this._resizingWidth); | this.setWidth(this._resizingWidth); | ||||
| JX.log('new width is ' + this.getWidth()); | |||||
| JX.DOM.alterClass(document.body, 'jx-drag-col', false); | JX.DOM.alterClass(document.body, 'jx-drag-col', false); | ||||
| this._dragging = null; | this._dragging = null; | ||||
| // TODO: Save new width setting. | var width_key = this.getWidthSettingKey(); | ||||
| if (width_key) { | |||||
| // new JX.Request('/settings/adjust/', JX.bag) | this._adjustSetting(width_key, this.getWidth()); | ||||
| // .setData( | } | ||||
| // { | |||||
| // key: 'filetree.width', | |||||
| // value: get_width() | |||||
| // }) | |||||
| // .send(); | |||||
| }, | }, | ||||
| _setVisibility: function(visible, e) { | _setVisibility: function(visible, e) { | ||||
| e.kill(); | e.kill(); | ||||
| // TODO: Save the visibility setting. | |||||
| this.setIsVisible(visible); | this.setIsVisible(visible); | ||||
| this.repaint(); | this.repaint(); | ||||
| var visible_key = this.getVisibleSettingKey(); | |||||
| if (visible_key) { | |||||
| this._adjustSetting(visible_key, visible ? 1 : 0); | |||||
| } | |||||
| }, | |||||
| _adjustSetting: function(key, value) { | |||||
| new JX.Request('/settings/adjust/', JX.bag) | |||||
| .setData( | |||||
| { | |||||
| key: key, | |||||
| value: value | |||||
| }) | |||||
| .send(); | |||||
| }, | }, | ||||
| repaint: function() { | repaint: function() { | ||||
| var resizer = this.getResizerItem(); | var resizer = this.getResizerItem(); | ||||
| var expander = this.getExpanderNode(); | var expander = this.getExpanderNode(); | ||||
| if (this.getIsVisible()) { | if (this.getIsVisible()) { | ||||
| JX.DOM.show(this._node); | JX.DOM.show(this._node); | ||||
| Show All 26 Lines | |||||