JSTab.js

Summary

No overview generated for 'JSTab.js'


/**
 * Window tab
 * @constructor
 * @param {JSWindow} jsWindow  Tab title
 * @param {Element} contents  Element to wrap
 * @param {string} title  Tab title
 * @param {string} icon  Tab icon uri
 */
var JSTab = Class.create();
JSTab.prototype.initialize = function(jsWindow, contents, title, icon)
{
	var _this = this;
	this.jsWindow = jsWindow;
	this.contents = contents;
	this.contents.className = 'JSWM_window_tab';
	this.tabButton = document.createElement('LI');
	Element.extend(this.tabButton);
	this.tabButton.className = 'JSWM_tabButton';
	this.tabButton.jsTab = this;

	this.tabLabel = this.tabButton.appendChild(document.createElement('DIV'));
	var closeButton = this.tabLabel.appendChild(new ImageButton(function() { _this.close(); }, JSWMImages.closeTab, 'x', 'close', JSWMImagesHover.closeTab));
	closeButton.className = 'JSWM_tabClose';
	
	this.titleLabel = this.tabLabel.appendChild(document.createElement('DIV'));
	Element.extend(this.titleLabel);
	this.setTitle(title, icon);
	this.tabLabel.className = 'JSWM_tabLabel';
	Event.observe(this.tabButton, 'mousedown', function() { _this.setActive(); _this.jsWindow.setActive(); })

	var drag = new Draggable(this.tabButton, {
		snap: function (x, y) { return _this.moveTab(x, y); },
		constraint: 'horizontal',
		starteffect: function(item) { _this.jsWindow.dragTabStart(item); },
		endeffect: null,
		revert: true
	});
	drag.jsTab = this;
};

/**
 * Reorder tabs based on drag offset
 * @method
 * @param {int} xOffset  x coordinate offset
 * @param {int} yOffset  y coordinate offset
 */
JSTab.prototype.moveTab = function(xOffset, yOffset)
{
	var tabSize = this.tabButton.getWidth();
	var tabGap = tabSize / 2;
	var isForward = xOffset > tabGap;
	var isBackward = xOffset < -tabGap;
	if(isForward || isBackward)
	{
		for(var i = this.jsWindow.tabPositions.length - 1; i >= 0; i--)
		{
			var offset = this.jsWindow.tabPositions[i];
			var start = this.jsWindow.start;
			if(i != this.i && offset[0] - tabGap < xOffset + start[0])
			{
				// i: first box positioned before this
				var oldOffset = Position.positionedOffset(this.tabButton);
				if(i + 1 == this.jsWindow.tabPositions.length)
				{
					if(!isForward)
						break;
					this.jsWindow.tabList.appendChild(this.tabButton);
				}
				else if(i > this.i)
				{
					if(!isForward)
						break;
					this.jsWindow.tabList.insertBefore(this.tabButton, this.jsWindow.tabs[i + 1].tabButton);
				}
				else
				{
					if(!isBackward)
						break;
					this.jsWindow.tabList.insertBefore(this.tabButton, this.jsWindow.tabs[i].tabButton);
				}
				var newOffset = Position.positionedOffset(this.tabButton);

				// prevent "jumping" effect
				xOffset -= newOffset[0] - oldOffset[0];

				var items = this.jsWindow.tabList.getElementsByTagName('LI');
				for(var j = 0; j < items.length; j++)
				{
					this.jsWindow.tabs[j] = items[j].jsTab;
					this.jsWindow.tabs[j].i = j;
				}
				this.jsWindow.start = [offset[0], offset[1]];

				break;
			}
		}
	}
	xOffset = Math.max(JSWMTabMargins - 1, xOffset + this.jsWindow.start[0]) - this.jsWindow.start[0];
	xOffset = Math.min(xOffset + this.jsWindow.start[0], this.jsWindow.tabList.getWidth() - tabSize) - this.jsWindow.start[0];
	return [xOffset, yOffset];
};

/**
 * Set the tab title
 * @method
 * @param {string} title  The new title
 * @param {string} icon  Tab icon uri
 */
JSTab.prototype.setTitle = function(title, icon)
{
	this.title = title;
 	this.titleLabel.removeChildren();
 	var span = this.titleLabel.appendChild(document.createElement('SPAN'));
	span.appendChild(document.createTextNode(this.title));
	Element.extend(span);
	var titleSpace = this.titleLabel.getWidth() - 20;
	JSWMtruncate(title, span, this.tabButton, titleSpace, 25);
	this.titleLabel.title = title;
	this.icon = icon;
	this.tabLabel.style.backgroundImage = 'url("' + this.icon + '")';
};

/**
 * Set tab as active, shortcut to JSWindow.setActiveTab()
 * @method
 */
JSTab.prototype.setActive = function()
{
	this.jsWindow.setActiveTab(this);
};

/**
 * Return the tab button HTML object
 * @method
 * @return {Element}  The tab button
 */
JSTab.prototype.getButton = function()
{
	return this.tabButton;
};

/**
 * Close the tab
 * @method
 */
JSTab.prototype.close = function()
{
	this.jsWindow.contents.removeChild(this.contents); // remove contents
	this.tabButton.parentNode.removeChild(this.tabButton); // remove button
	this.jsWindow.tabs = this.jsWindow.tabs.without(this); // remove array entry
	if(this.jsWindow.lastActiveTab == this && this.jsWindow.tabs.length)
		this.jsWindow.tabs[0].setActive();
	this.jsWindow.redrawTabList();
};

/**
 * Write object state data for serialisation
 * @method
 * @returns {Object} serialData  Object serialisation data
 */
JSTab.prototype.writeObject = function()
{
	var serialData = new Object();
	serialData.title = this.title;
	serialData.icon = this.icon;
	serialData.innerHTML = this.contents.innerHTML;
	return serialData;
};

/**
 * Read serialised object state data into the tab
 * @method
 * @param {String} serialData  Object serialisation data
 */
JSTab.prototype.readObject = function(serialData)
{
	this.setTitle(serialData.title, serialData.icon)
	this.contents.innerHTML = serialData.innerHTML;
};


Documentation generated by JSDoc on Sun May 6 13:35:11 2007