/*
	Copyright (c) 2006-2007, ePages GmbH
	All Rights Reserved.

	epages.cartridges.de_epages.design.widget.Toolfont $Revision: 1.23 $

*/
dojo.provide("epages.cartridges.de_epages.design.widget.Toolfont");

dojo.require("epages.widget.LocalizedWidget");
dojo.require('epages.lang.hash');
dojo.require('epages.browser');
dojo.require('epages.cartridges.de_epages.presentation.widget.Toolcolor');
dojo.require("epages.event");
dojo.require("epages.format");

dojo.declare(
	"epages.cartridges.de_epages.design.widget.Toolfont",
	[epages.widget.LocalizedWidget],
	{
		/**
		 * public properties
		 */
		label               : '',
		label_formatted     : '',
		size                : '',
		color               : '',
		isBold              : '',
		isItalic            : '',
		isUnderline         : '',
		isBoldInactive      : '',
		isItalicInactive    : '',
		isUnderlineInactive : '',
		isSizeInactive      : '',
		isSizeVisible       : '1',
		fontType            : '', /* Headline, Paragraph, Link, ... */
		objectId            : '',
		/**
		 * private properties
		 */
		_inputMapping   : undefined,
		_buttonMapping  : undefined,
		/**
		 * constants
		 */
		COLORPICKER_OFFSET_X: 18,
		COLORPICKER_OFFSET_Y: 0,
		/**
		 * widget properties
		 */
		declaredClass   : 'epages.design.Toolfont',
		templatePath    : dojo.moduleUrl('epages.cartridges.de_epages.design.widget','templates/Toolfont.html'),
		translationName : dojo.moduleUrl('epages.cartridges.de_epages.design.widget','templates/translation'),
		widgetsInTemplate : true,

		postMixInProperties: function() {
			this.inherited("postMixInProperties", arguments);
			this.label_formatted = epages.format.slice(this.label, 15);
		},

		postCreate  : function() {
			// summary: Initialize widget: disable inactive buttons, set button state, add button events
			this.inherited("postCreate", arguments);

			this.boldDivNode.inputmappingkey='bold';
			this.italicDivNode.inputmappingkey='italic';
			this.underlineDivNode.inputmappingkey='underline';

			this._inputMapping = new epages.lang.Hash({
				bold     : this.boldInputNode,
				italic   : this.italicInputNode,
				underline: this.underlineInputNode
			});
			this._buttonMapping = new epages.lang.Hash({
				bold     : this.boldDivNode,
				italic   : this.italicDivNode,
				underline: this.underlineDivNode
			});

			if(this.label_formatted !== this.label){
				this.labelNode.title = this.label;
			}

			this._disableInactiveElements();
			this._displayButtonState();
			this._appendEvents();
		},

		/**
		 * private methods
		 */

		_appendEvents: function() {
		// summary: append events to buttons (bold, italic, underline)

			// add value handler
			this.connect(this.boldDivNode,      'onclick', '_toggleValue');
			this.connect(this.italicDivNode,    'onclick', '_toggleValue');
			this.connect(this.underlineDivNode, 'onclick', '_toggleValue');

			// add display handler
			this.connect(this.boldInputNode,      'onchange', '_displayButtonState');
			this.connect(this.italicInputNode,    'onchange', '_displayButtonState');
			this.connect(this.underlineInputNode, 'onchange', '_displayButtonState');
		},


		_disableInactiveElements: function() {
		// summary: disable inactive elements (buttons/inputfields)

			if(this.isSizeVisible=='0') {
				this.fontSizeColumnNode.style.display='none';
			}

			if(this.isSizeInactive=='1') {
				this.fontSizeWidget.domNode.style.display='none';
				this.fontSizeWidget.domNode.disabled=true;
			}
			if(this.isBoldInactive=='1') {
				this.boldDivNode.style.display='none';
				this.boldInputNode.disabled=true;
			}
			if(this.isItalicInactive=='1') {
				this.italicDivNode.style.display='none';
				this.italicInputNode.disabled=true;
			}
			if(this.isUnderlineInactive=='1') {
				this.underlineDivNode.style.display='none';
				this.underlineInputNode.disabled=true;
			}
		},

		_displayButtonState: function() {
		// summary: display button state (pressed, not pressed)

			var me=this;
			var Iterator = function(pair) {
				var ButtonInput=me._inputMapping.get(pair.key);
				var ButtonDiv=me._buttonMapping.get(pair.key);
				if(ButtonInput.value=='1') {
					ButtonDiv.className=ButtonDiv.className.replace('FontAttributeInactiveBox','FontAttributeBox');
				} else {
					ButtonDiv.className=ButtonDiv.className.replace('FontAttributeBox','FontAttributeInactiveBox');
				}
			};
			this._inputMapping.each(Iterator);
		},

		_toggleValue: function(/*Event*/evt) {
		// summary: event handler for button values (bold, italic, underline)
		// description: Toggles between values '0' and '1' of button input fields and throws an onchange event
		//    on the input field. (This triggers the display handler)

			var InputMappingKey=evt.currentTarget.inputmappingkey;
			var InputField=this._inputMapping.get(InputMappingKey);

			// toggle button value
			if(InputField.value=='1') {
				InputField.value='0';
			} else {
				InputField.value='1';
			}

			// throw change event on input field
			epages.event.fire(InputField,"change");
		}
	}
);