/*

Copyright 2008-2011 Clipperz Srl

This file is part of Clipperz Community Edition.
Clipperz Community Edition is an online password manager.
For further information about its features and functionalities please
refer to http://www.clipperz.com.

* Clipperz Community Edition is free software: you can redistribute
  it and/or modify it under the terms of the GNU Affero General Public
  License as published by the Free Software Foundation, either version
  3 of the License, or (at your option) any later version.

* Clipperz Community Edition is distributed in the hope that it will
  be useful, but WITHOUT ANY WARRANTY; without even the implied
  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
  See the GNU Affero General Public License for more details.

* You should have received a copy of the GNU Affero General Public
  License along with Clipperz Community Edition.  If not, see
  <http://www.gnu.org/licenses/>.

*/

Clipperz.Base.module('Clipperz.PM.UI.Common.Components');

//#############################################################################

var _Clipperz_PM_Components_base_id_ = 0;

//#############################################################################

Clipperz.PM.UI.Common.Components.BaseComponent = function(args) {
	args = args || {};
	Clipperz.PM.UI.Common.Components.BaseComponent.superclass.constructor.call(this, args);

	this._element = args.element || null;
	this._ids = {};

	this._slots = {};
	this._slotComponents = {};

	this._components = {};

	this._cachedSlots = {};

	this._isModal = false;
	
	this._isActive = false;
	this._elementUsedToEnterModalState;

	this._isFullyRendered = false;
	this._renderingWaitingQueue = [];

//	this._slots = {
//		'header':	'header',
//		'body':		'body',
//		'footer':	'footer'
//	};

	return this;
}

//=============================================================================

//TODO get back to MochiKit.Base.update as we are not extending anything
//MochiKit.Base.update(Clipperz.PM.UI.Common.Components.BaseComponent.prototype, {
Clipperz.Base.extend(Clipperz.PM.UI.Common.Components.BaseComponent, /*Ext.Component*/ Object, {

	'isClipperzPMComponent': true,
	
	//-------------------------------------------------------------------------

	'toString': function () {
		return "Clipperz.PM.UI.Common.Components.BaseComponent component";
	},

	'componentId': function () {
		return this.getId('_id_');
	},

	//-------------------------------------------------------------------------
/*
	'slots': function() {
		return this._slots;
	},
*/
	'slotComponents': function() {
		return this._slotComponents;
	},

	//-------------------------------------------------------------------------

	'components': function () {
		return this._components;
	},

	'addComponent': function (aComponent) {
		this.components()[aComponent.componentId()] = aComponent;
	},
	
	'removeComponent': function (aComponent) {
		var componentId;
		
		componentId = aComponent.componentId();
		this.components()[componentId].remove();
		delete this.components()[componentId];
	},

	//-------------------------------------------------------------------------
/*
	'domHelper': function() {
		return Clipperz.YUI.DomHelper;
	},
*/	
	//-------------------------------------------------------------------------
/*
	'domHelperAppend': function(aValue) {
		Clipperz.YUI.DomHelper.append(this.element().dom, aValue);
	},
*/	
	//-------------------------------------------------------------------------

	'element': function() {
//MochiKit.Logging.logDebug(">>> BaseComponent.element");
		return MochiKit.DOM.getElement(this._element);
	},
	
	'setElement': function(aNode) {
		this._element = aNode;
	},

	//-----------------------------------------------------

	'displayElement': function() {
		return this.element();
	},

	//-------------------------------------------------------------------------

	'renderInNode': function(aDomNode) {
		this.setElement(aDomNode);
		this.render();
	},

	'render': function() {
		this.clear();
		this.renderSelf();
		this.renderComponents();
		if (this.shouldShowTranslationHints()) {
			this.renderTranslationHints();
		}
		if (this.shouldShowElementWhileRendering()) {
			MochiKit.Style.showElement(this.displayElement());
		};

		this._isFullyRendered = true;
	
		MochiKit.Iter.forEach(this.renderingWaitingQueue(), MochiKit.Base.methodcaller('callback'));
		this.resetRenderingWaitingQueue();
	},

	'renderSelf': function() {
		throw Clipperz.Base.exception.AbstractMethod;
	},

	'renderComponents': function() {
		var	slotName;
		
		for (slotName in this.slotComponents()) {
			this.slotComponents()[slotName].renderInNode(this.elementForSlotNamed(slotName));
		}
	},

	//.........................................................................

	'isFullyRendered': function () {
		return this._isFullyRendered;
	},

	//.........................................................................

	'renderingWaitingQueue': function () {
		return this._renderingWaitingQueue;
	},
	
	'resetRenderingWaitingQueue': function () {
		this._renderingWaitingQueue = [];
	},

	//.........................................................................

	'waitUntilFullyRendered': function () {
		var deferredResult;

		if (this.isFullyRendered() == true) {
			deferredResult = MochiKit.Async.succeed
		} else {
			deferredResult = new Clipperz.Async.Deferred("BaseComponent.waitUntilFullyRendered", {trace:false});
			this.renderingWaitingQueue().push(deferredResult);
		}

		return deferredResult;
	},

	//-----------------------------------------------------

	'renderTranslationHints': function () {
		var	translatableItems;
		
		translatableItems = MochiKit.Selector.findChildElements(this.displayElement(), ['[stringID]']);
		MochiKit.Iter.forEach(translatableItems, MochiKit.Base.method(this, 'enhanceTranslatableElement'))
	},

	'enhanceTranslatableElement': function (anElement) {
//Clipperz.log(">>> enhanceTranslatableElement", anElement);
//		new Clipperz.PM.UI.Common.Components.TranslatorWidget({
//			'element':	anElement
//		});

		MochiKit.Signal.connect(anElement, 'onmouseenter', MochiKit.Base.partial(Clipperz.PM.UI.Common.Components.TranslatorWidget.show, anElement, MochiKit.DOM.getNodeAttribute(anElement, 'stringID')));
		MochiKit.Signal.connect(anElement, 'onmouseleave', Clipperz.PM.UI.Common.Components.TranslatorWidget.hide);
//Clipperz.log("<<< enhanceTranslatableElement");
	},

	//-----------------------------------------------------

	'update': function(args) {
		throw Clipperz.Base.exception.AbstractMethod;
	},
	
	'updateSelf': function(args) {
		throw Clipperz.Base.exception.AbstractMethod;
	},
	
	'updateComponents': function(args) {
		throw Clipperz.Base.exception.AbstractMethod;
	},

	//-----------------------------------------------------

	'refresh': function() {
		throw Clipperz.Base.exception.AbstractMethod;
	},

	'refreshSelf': function() {
		throw Clipperz.Base.exception.AbstractMethod;
	},

	'refreshComponents': function(args) {
		throw Clipperz.Base.exception.AbstractMethod;
	},

	//-----------------------------------------------------

	'checkSlotNamed': function(aSlotName) {
		if (typeof(this._slots[aSlotName]) == 'undefined') {
			throw new Error("undefined slot");
		};
	},

	//-----------------------------------------------------

	'cachedSlots': function() {
		return this._cachedSlots;
	},
	
	'slotNamed': function(aSlotName) {
		var result;

		this.checkSlotNamed(aSlotName);
		if (typeof(this.cachedSlots()[aSlotName]) == 'undefined') {
			this.cachedSlots()[aSlotName] = new Clipperz.PM.UI.Common.Components.ComponentSlot(this,aSlotName);
		}
		
		result = this.cachedSlots()[aSlotName];
		
		return result;
	},

	//-----------------------------------------------------

	'elementForSlotNamed': function(aSlotName) {
		return MochiKit.DOM.getElement(this._slots[aSlotName]);
	},

	//-----------------------------------------------------

	'componentForSlotNamed': function(aSlotName) {
		return this.slotComponents()[aSlotName];
	},

	'setComponentForSlotNamed': function(aComponent, aSlotName) {
		var domNode;

		this.checkSlotNamed(aSlotName);

		if (this.slotComponents()[aSlotName] != null) {
			this.slotComponents()[aSlotName].remove();
		}

		this.slotComponents()[aSlotName] = aComponent;

//		domNode = MochiKit.DOM.getElement(this.slotNamed(aSlotName));
		domNode = this.elementForSlotNamed(aSlotName);

		if (domNode != null) {
			aComponent.renderInNode(domNode);
		}
	},

	//-----------------------------------------------------
/*
	'purgeListeners': function() {
//MochiKit.Logging.logDebug(">>> Clipperz.PM.UI.Common.Components.BaseComponent.purgeListeners [" + this + "]");
//MochiKit.Logging.logDebug("--- " + this + ".purgeListeners");
		Clipperz.NotificationCenter.unregister(this);
		MochiKit.Signal.disconnectAllTo(this);
//MochiKit.Logging.logDebug("<<< Clipperz.PM.UI.Common.Components.BaseComponent.purgeListeners");
	},
*/	
	//-----------------------------------------------------

	'clear': function() {
		var	slotName;
		var componentId;

		MochiKit.Signal.disconnectAllTo(this);

		for (slotName in this.slotComponents()) {
			this.slotComponents()[slotName].clear();
		}

		for (componentId in this.components()) {
			this.components()[componentId].clear();
		}

//		if (this.element() != null) {
//			this.element().innerHTML = "";
//		}

		if (this.displayElement() != null) {
			if (this.element() != this.displayElement()) {
				MochiKit.DOM.removeElement(this.displayElement());
			} else {
				this.displayElement().innerHTML = "";
			}
		}
		
		if (this.isModal()) {
			//	TODO: cleanup when the closed element was shown modally.
		}
	},


	'remove': function() {
		var	slotName;
		var componentId;

		for (slotName in this.slotComponents()) {
			this.slotComponents()[slotName].remove();
			delete this.slotComponents()[slotName];
		}

		for (componentId in this.components()) {
			this.components()[componentId].remove();
			delete this.components()[componentId];
		}

		this.clear();
		MochiKit.Signal.disconnectAll(this);
	},

	'append': function(aNode, aValue) {
		return Clipperz.DOM.Helper.append(aNode, aValue);		
	},
	
	'insertBefore': function (aNode, aValue) {
		return Clipperz.DOM.Helper.insertBefore(aNode, aValue);
	},

	'insertAfter': function (aNode, aValue) {
		return Clipperz.DOM.Helper.insertAfter(aNode, aValue);
	},

	//-------------------------------------------------------------------------

	'getId': function(aValue) {
		var	result;

		if (typeof(aValue) != 'undefined') {
			result = this._ids[aValue];

			if (typeof(result) == 'undefined') {
				_Clipperz_PM_Components_base_id_ ++;

				result = "Clipperz_PM_Components_" + aValue + "_" + _Clipperz_PM_Components_base_id_;
				this._ids[aValue] = result;
			}
		} else {
//			result = Clipperz.PM.UI.Common.Components.BaseComponent.superclass.getId.call(this);
			throw "call to BaseComponent.getId with an undefined value";
		}
	
		return result;
	},

	'getAnchor': function (aValue) {
		return '#' + this.getId(aValue);
	},

	//-------------------------------------------------------------------------

	'getElement': function(aValue) {
		return Clipperz.DOM.get(this.getId(aValue));
	},

	//-------------------------------------------------------------------------

	'hideElement': function(anElementName) {
		MochiKit.Style.hideElement(this.getElement(anElementName));
	},

	'showElement': function(anElementName) {
		MochiKit.Style.showElement(this.getElement(anElementName));
	},

	//-------------------------------------------------------------------------
	
	'activate': function () {
		this._isActive = true;
	},
	
	'deactivate': function () {
		this._isActive = false;
	},
	
	'isActive': function () {
		return this._isActive;
	},
	
	//-------------------------------------------------------------------------

	'hideSlot': function(aSlotName) {
		if (this.componentForSlotNamed(aSlotName)) {
			this.componentForSlotNamed(aSlotName).deactivate();
		}
		MochiKit.Style.hideElement(this.elementForSlotNamed(aSlotName));
	},

	'showSlot': function(aSlotName) {
		if (this.componentForSlotNamed(aSlotName)) {
			this.componentForSlotNamed(aSlotName).activate();
		}
		MochiKit.Style.showElement(this.elementForSlotNamed(aSlotName));
	},
	
	//-------------------------------------------------------------------------

	'shouldShowTranslationHints': function () {
		return false;
	},
	
	'shouldShowElementWhileRendering': function() {
		return true;
	},

//	'shouldRemoveElementWhenClearningUp': function () {
//		return true;
//	},

	//-------------------------------------------------------------------------

	'isModal': function() {
		return this._isModal;
	},

	'setIsModal': function(aValue) {
		this._isModal = aValue;
	},

	//-------------------------------------------------------------------------

	'elementUsedToEnterModalState': function () {
		return this._elementUsedToEnterModalState;
	},

	'setElementUsedToEnterModalState': function (aValue) {
		this._elementUsedToEnterModalState = aValue;
	},

	//-------------------------------------------------------------------------

	'modalDialogMask': function () {
		return 'modalDialogMask';
	},
	
	'modalDialog': function () {
		return 'modalDialog';
	},
	
	'modalDialogFrame': function() {
		return 'modalDialogFrame'
	},

	//-------------------------------------------------------------------------

	'deferredShowModal': function(args) {
		var deferredResult;

		deferredResult = new Clipperz.Async.Deferred("BaseComponent.deferredShowModal", {trace:false});

		deferredResult.addMethod(this, 'setIsModal', true);
		deferredResult.addCallback(MochiKit.Style.showElement, this.modalDialogMask());
		deferredResult.addCallback(MochiKit.Base.bind(function(someArgs) {
			var result;
			var duration;
			var from;
			var to;

			duration = someArgs.duration || 0.4;

			this.setElementUsedToEnterModalState(someArgs.openFromElement);
			from = Clipperz.Style.getSizeAndPosition(someArgs.openFromElement);
			this.renderInNode(this.modalDialog());
			MochiKit.DOM.addElementClass(this.modalDialog(), 'fixed');
			to = Clipperz.Style.getSizeAndPosition(this.displayElement());
			Clipperz.PM.UI.Common.Components.BaseComponent.targetModalDimensionsAndPosition = Clipperz.Base.deepClone(to);

			MochiKit.Style.hideElement(this.displayElement());
			MochiKit.Style.showElement(this.modalDialogFrame());
			
			result = {from:from, to:to, duration:duration};
			return result;
		}, this, args));
		deferredResult.addCallback(Clipperz.Visual.deferredResize, this.modalDialogFrame());
		deferredResult.addCallback(MochiKit.Base.bind(function(someArgs) {
			MochiKit.Style.hideElement(this.modalDialogFrame());
			MochiKit.Style.showElement(this.displayElement());
		}, this));
		deferredResult.addCallback(MochiKit.Async.succeed, arguments[arguments.length - 1]);
		deferredResult.callback();

		return deferredResult;
	},

	//-------------------------------------------------------------------------

	'deferredHideModal': function(args) {
		var deferredResult;

		args = args || {};

		deferredResult = new Clipperz.Async.Deferred("BaseComponent.deferredHideModal", {trace:false});
		deferredResult.addCallback(MochiKit.Base.bind(function(someArgs) {
			var result;
			var from;
			var toElement;
			var to;
			var duration;

			toElement = args.closeToElement || this.elementUsedToEnterModalState();
			duration = someArgs.duration || 0.4;
			from = Clipperz.Style.getSizeAndPosition(this.displayElement());
			to = Clipperz.Style.getSizeAndPosition(toElement);

			MochiKit.Style.hideElement(this.displayElement());
			MochiKit.Style.showElement(this.modalDialogFrame());

			result = {from:from, to:to, duration:duration};
			return result;
		}, this, args));
		deferredResult.addCallback(Clipperz.Visual.deferredResize, this.modalDialogFrame());
		deferredResult.addCallback(MochiKit.Base.bind(function() {
			MochiKit.Style.hideElement(this.modalDialogFrame());
			MochiKit.Style.hideElement(this.modalDialogMask());
		}, this));
		deferredResult.addMethod(this, 'setIsModal', false);
		deferredResult.addMethod(this, 'clear');	//	##############
		deferredResult.addCallback(MochiKit.Async.succeed, arguments[arguments.length - 1]);
		deferredResult.callback();

		return deferredResult;
	},

	//-------------------------------------------------------------------------

	__syntaxFix__: "syntax fix"
	
});

Clipperz.PM.UI.Common.Components.BaseComponent_modalDialog = function() {
	Clipperz.DOM.Helper.append(MochiKit.DOM.currentDocument().body,
		{tag:'div', id:'modalDialogWrapper', cls:'modalDialogWrapper', children:[
			{tag:'div', id:'modalDialogMask', cls:'modalDialogMask'},
			{tag:'div', id:'modalDialogFrame', cls:'modalDialogFrame' /*, html:"modal dialog frame"*/},
			{tag:'div', id:'modalDialog', cls:'modalDialog'}
//			{tag:'div', id:'modalDialog', cls:'modalDialog', children:[{tag:'div'}]}
		]}
	);
	
//	MochiKit.Style.hideElement('modalDialogWrapper');
	MochiKit.Style.hideElement('modalDialogMask');
	MochiKit.Style.hideElement('modalDialogFrame');
//	MochiKit.Style.hideElement('modalDialog');

};

//Clipperz.PM.UI.Common.Components.BaseComponent.targetModalDimensionsAndPosition = {'x':'X', 'y':'Y'};

MochiKit.DOM.addLoadEvent(Clipperz.PM.UI.Common.Components.BaseComponent_modalDialog);