(function (_super) { /** * A dock * @param {Object} The options * @constructor */ hui.ui.Dock = function(options) { this.options = options; this.element = hui.get(options.element); this.name = options.name; _super.call(this, options); this._attach(); }; hui.ui.Dock.prototype = { nodes : { iframe: '.hui_dock_frame', resizer: '.hui_dock_sidebar_line', sidebar: '.hui_dock_sidebar', main: '.hui_dock_main' }, _attach : function() { if (hui.browser.msie) { hui.cls.add(this.element,'hui-is-legacy'); } hui.ui.listen({ $frameLoaded : function(win) { if (win == hui.frame.getWindow(this.nodes.iframe)) { this._setBusy(false); } }.bind(this) }); hui.listen(this.nodes.iframe,'load',this._load.bind(this)); if (this.nodes.resizer) { hui.drag.register({ element : this.nodes.resizer, onStart : function() { this.hasDragged = false; hui.cls.add(this.element,'hui-is-resizing'); }.bind(this), onMove : function(e) { var left = e.getLeft(); if (left<10) { left=10; } this._updateSidebarWidth(left); if (!this.hasDragged) { hui.cls.remove(this.element,'hui-is-collapsed'); } this.hasDragged = true; }.bind(this), onEnd : function() { if (!this.hasDragged) { this.toggle(); } else if (this.latestWidth==10) { this.collapse(); } else { this.latestExpandedWidth = this.latestWidth; } hui.cls.remove(this.element,'hui-is-resizing'); hui.ui.callVisible(this); hui.ui.reLayout(); }.bind(this) }); } }, _updateSidebarWidth : function(width) { this.latestWidth = width; this.nodes.sidebar.style.width = (width-1)+'px'; this.nodes.main.style.left = width+'px'; this.nodes.resizer.style.left = (width-5)+'px'; }, /** Change the url of the iframe * @param {String} url The url to change the iframe to */ setUrl : function(url) { this._setBusy(true); hui.frame.getDocument(this.nodes.iframe).location.href=url; }, collapse : function() { hui.cls.add(this.element,'hui-is-collapsed'); this._updateSidebarWidth(10); hui.ui.callVisible(this); }, expand : function() { hui.cls.remove(this.element,'hui-is-collapsed'); this._updateSidebarWidth(this.latestExpandedWidth || 200); hui.ui.callVisible(this); }, toggle : function() { if (hui.cls.has(this.element,'hui-is-collapsed')) { this.expand(); } else { this.collapse(); } }, _load : function() { this._setBusy(false); }, _setBusy : function(busy) { hui.cls.set(this.element, 'hui-is-busy', busy); } }; hui.extend(hui.ui.Dock, _super); hui.define('hui.ui.Dock', hui.ui.Dock); })(hui.ui.Component);