/*
@version $Id: editor.js 270 2009-12-28 13:24:34Z roosit $
@copyright Copyright (C) 2008 Abricos. All rights reserved.
@license http://www.gnu.org/copyleft/gpl.html GNU/GPL, see LICENSE.php
*/

/**
 * @module Sys
 * @namespace Brick.widget
 */

Brick.namespace('widget');

var Component = new Brick.Component({
	buildTemplate: false
});
Component.requires = { 
	yahoo: ['element', 'button'] 
};
Component.entryPoint = function(){
	
	var Dom = YAHOO.util.Dom,
		E = YAHOO.util.Event,
		L = YAHOO.lang;

	var TM = this.template,
		BU = Brick.util;

(function(){
	
	/**
	 * Менеджер визуальных редакторов.
	 * <p>
	 * В момент инициализации менеджера, выполняется метод
	 * EditorManager.findEditors, который осуществляет поиск в имеющихся модулях, 
	 * компонент с именем <b>v_editor</b>. Менеджер предполагает,
	 * что именно в компонентах с таким именем описана реализация
	 * визуального редактора. Например, модуль TinyMCE.
	 * </p>
	 * @class EditorManager
	 * @static
	 */
	var EditorManager = {
	
		/**
		 * Имя компонента содержащий реализацию визуального редактора.
		 * 
		 * @property VEDITOR_NAME
		 * @static
		 * @type String
		 * @default v_editor
		 */
		VEDITOR_NAME: 'v_editor',
		
		/**
		 * Массив имен модулей имеющих компонент с именем указанным в VEDITOR_NAME
		 * 
		 * @property editors
		 * @static
		 * @type Object
		 */
		editors: {},
		
		/**
		 * Хеш таблица зарегистрированных движков визуального редактора.
		 * 
		 * @property engines
		 * @static
		 * @type Object
		 */
		engines: {},

		/**
		 * В существующих модулях осуществить поиск компонентов 
		 * имеющих имя VEDITOR_NAME.
		 * Результат поиска занести в editors.
		 * 
		 * @method findEditors
		 * @static
		 */
		findEditors: function(){
			for (var modName in Brick.Modules){
				if (Brick.componentExists(modName, EditorManager.VEDITOR_NAME)){
					EditorManager.editors[modName] = EditorManager.VEDITOR_NAME;
				}
			}
		},
		
		/**
		 * Проверить, существует ли движок визуального редактора.
		 * 
		 * @method editorExist
		 * @param {String} name Имя редактора.
		 * @return {Boolean}
		 */
		editorExist: function(name){
			if (EditorManager.editors[name]){
				return true;
			}
			return false;
		},
		
		/**
		 * Зарегистрировать движок редактора.
		 * 
		 * @method registerEngine
		 * @static
		 * @param {String} name Наименование редактора.
		 * @param {Brick.widget.VisualEditor} engine Движок визуального редактора.
		 */
		registerEngine: function(name, engine){
			this.engines[name] = engine;
		},
		
		/**
		 * Загрузить визуальный редактор. 
		 * По окончанию загрузки выполнить callback.
		 * 
		 * @method loadEngine
		 * @static
		 * @param {String} name Имя движка визуального редактора.
		 * @param {Function} callback Функция, которая будет выполнена по
		 * окончанию загрузки визуального редактора. Параметр функции 
		 * oArgs.name - Имя движка визуального редактора, 
		 * oArgs.engine - Движок визуального редактора.
		 * Если null, компонент был загружен, но движок визуального редактора
		 * не зарегистрирован. 
		 */
		loadEngine: function(name, callback){
			var fire = function(){
				callback({
					'name': name,
					engine: EditorManager.engines[name]
				});
			};
			if (!this.engines[name]){
				Brick.Component.API.fireFunction(name, EditorManager.VEDITOR_NAME, function(){
					fire();
				});
			}else{
				fire();
			}
		}
	};
	
	EditorManager.findEditors();
	
	Brick.widget.EditorManager = EditorManager;
})();

	var EM = Brick.widget.EditorManager;
	
	var _T = {};
	var _TId = {};

	/**
     * @class Editor
     * @description <p>Прототип редактора.</p>
     * @constructor
     * @extends YAHOO.util.Element
     * @param {String/HTMLElement} el HTML элемент TEXTAREA.
     * @param {Object} attrs Object liternal containing configuration parameters.
	 */
	var Editor = function (el, attrs){
		
        var oConfig = {
            element: el,
            attributes: attrs || {}
        };

        Editor.superclass.constructor.call(this, oConfig.element, oConfig.attributes);    
	};
	
	/**
	 * Имя текущего визуального редактора.
	 * 
	 * @property CURRENT_VISUAL_EDITOR
	 * @static 
	 * @default tinymce
	 */
	Editor.CURRENT_VISUAL_EDITOR = 'tinymce';
	
	/**
	 * Режим редактора "Код HTML"
	 * 
	 * @property MODE_CODE
	 * @static
	 * @type String
	 * @value code
	 */
	Editor.MODE_CODE = 'code';
	
	/**
	 * Режим редактора "Визуальный"
	 * 
	 * @property MODE_VISUAL
	 * @static
	 * @type String
	 * @value code
	 */
	Editor.MODE_VISUAL = 'visual';
	
	/**
	 * Режим панели инструментов - Расширеный.
	 * 
	 * @property TOOLBAR_FULL
	 * @static
	 * @type String
	 */
	Editor.TOOLBAR_FULL = 'full';

	/**
	 * Режим панели инструментов - Средний.
	 * 
	 * @property TOOLBAR_STANDART
	 * @static
	 * @type String
	 */
	Editor.TOOLBAR_STANDART = 'average';

	/**
	 * Режим панели инструментов - Минимальный.
	 * 
	 * @property TOOLBAR_MINIMAL
	 * @static
	 * @type String
	 */
	Editor.TOOLBAR_MINIMAL = 'minimal';
    
	/**
	 * Хеш таблица экземпляров Editor.
	 * 
	 * @private
	 * @static
	 * @property _instances
	 * @type Object
	 */
	Editor._instances = {};

	/**
	 * Получить объект Editor по HTML идентификатору .
	 * @method getEditorById
	 * @static
	 * @param {String} Идентификатор HTML элемента.
	 */
	Editor.getEditorById = function(id) {
        if (Editor._instances[id]) {
            return Editor._instances[id];
        }
        return null;
    };
	
    YAHOO.extend(Editor, YAHOO.util.Element, {
    	
    	/**
    	 * Экземпляр визуального редактора.
    	 * 
    	 * @property _ve
    	 * @private
    	 */
    	_ve: null,

    	/**
    	 * HTML элемент обертка текстового редактора
    	 * 
    	 * @property _wrap
    	 * @private
    	 */
        _wrap: null,
        
        /**
         * Дополнительные кнопки редактора (справа от редактора).
         * 
         * @property _buttons
         * @type Object
         * @private
         */
        _buttons: {},
        
    	/**
    	 * Обвернуть текстовый редактор.
    	 * 
    	 * @method _createTextArea
    	 * @private
    	 */
        _createTextArea: function() {
    	
    		var el = this.get('element');

    		var T = _T[el.id];
    		var TId = _TId[el.id];
    		
	        this._wrap = document.createElement('div');
	        this._wrap.id = el.id + '_wrap';
	        this._wrap.innerHTML = T['editor'];
	        
	        var par = el.parentNode;
	        par.replaceChild(this._wrap, el);
	        Dom.get(TId['editor']['editowrap']).appendChild(el);
	    },
	    
	    _initButtons: function(){
	    	
	    	var __self = this;
	    	
	    	this._buttons = {};
	    	
	    	this._buttons['code'] = new EditorButton(this, {
	    		name: 'code',
	    		image: '/modules/sys/images/ed_code.gif',
	    		onClick: function(){
	    			__self.set('mode', Editor.MODE_CODE);
	    		}
	    	});
	    	
	    	this._buttons['visual'] = new EditorButton(this, {
	    		name: 'visual',
	    		image: '/modules/sys/images/ed_visual.gif',
	    		onClick: function(){
	    			__self.set('mode', Editor.MODE_VISUAL);
	    		}
	    	});
	    	this._buttons['tb_full'] = new EditorButton(this, {
	    		name: 'tb_full',
	    		image: '/modules/sys/images/ed_tb_full.gif',
	    		onClick: function(){
	    			__self.set('toolbar', Editor.TOOLBAR_FULL);
	    		}
	    	});
	    	this._buttons['tb_standart'] = new EditorButton(this, {
	    		name: 'tb_standart',
	    		image: '/modules/sys/images/ed_tb_standart.gif',
	    		onClick: function(){
	    			__self.set('toolbar', Editor.TOOLBAR_STANDART);
	    		}
	    	});
	    	this._buttons['tb_minimal'] = new EditorButton(this, {
	    		name: 'tb_minimal',
	    		image: '/modules/sys/images/ed_tb_minimal.gif',
	    		onClick: function(){
	    			__self.set('toolbar', Editor.TOOLBAR_MINIMAL);
	    		}
	    	});
	    	this._buttons['filemanager'] = new EditorButton(this, {
	    		name: 'filemanager',
	    		image: '/modules/sys/images/ed_filemanager.gif',
	    		onClick: function(){
		    		Brick.Component.API.fire('filemanager', 'api', 'showFileBrowserPanel', function(result){
		    			__self.insertValue(result['html']);
		        	});
	    		}
	    	});
	    	this._updateButtons();
	    },
	    
	    _updateButtons: function(){
	    	
	    	var btns = this._buttons;
	    	
	    	var showOrHide = function(show, buttons){
	    		var arr = buttons.split(',');
	    		for (var i=0;i<arr.length;i++){
	    			if (show){
	    				btns[arr[i]].show();
	    			}else{
	    				btns[arr[i]].hide();
	    			}
	    		}
	    	};
	    	
	    	var isConfigButtons = this.get('configButtons');
	    	
	    	if(isConfigButtons){
		    	var mode = this.get('mode');
		    	if (mode == Editor.MODE_CODE){
		    		showOrHide(true, 'visual');
		    		showOrHide(false, 'code,tb_full,tb_standart,tb_minimal');
		    	}else{
		    		showOrHide(false, 'visual');
		    		showOrHide(true, 'code,tb_full,tb_standart,tb_minimal');
		    	}
		    	
	    		showOrHide(this.get('fileManager'), 'filemanager');
		    	
	    	} else {
	    		for (var n in btns){
	    			btns[n].hide();
	    		}
	    	}
	    },
	    
	    /**
	     * Загрузить и создать визуальный редактор.
	     * 
	     * @method _createVisualEditor
	     * @private
	     */
	    _createVisualEditor: function(){
	    	if (!L.isNull(this._ve)){ return; }
	    	var veName = this.get('veName');
	    	if (!veName){ return; }
	    	var __self = this;
	    	EM.loadEngine(veName, function(oArgs){
	    		if (L.isNull(oArgs.engine)){
	    			return;
	    		}
	    		__self._ve = new oArgs.engine(__self);
	    	});
	    },
	    
	    _removeVisualEditor: function(){
	    	if (L.isNull(this._ve)){ return; }
	    	this._ve.destroy();
	    	this._ve = null;
	    },
	    
	    _onModeChange: function(){
	    	var mode = this.get('mode');
        	if (mode == Editor.MODE_CODE){
        		this._removeVisualEditor();
        	}else if (mode == Editor.MODE_VISUAL){
        		this._createVisualEditor();
        	}                	
	    	this._updateButtons();
	    },
	    
	    _onToolbarChange: function(){
	    	if (L.isNull(this._ve)){ return; }
	    	var toolbarMode = this.get('toolbar');
    		this._ve.setToolbar(toolbarMode);
	    	this._updateButtons();
	    },
	    
	    _onConfigButtons: function(){
	    	this._updateButtons();
	    },
	    
	    _onFileManager: function(){
	    	this._updateButtons();
	    },
    	
	    /**
	     * Инициализация Editor.
	     * 
	     * @method init
	     * @private
	     */
        init: function(p_oElement, p_oAttributes) {
    		Editor.superclass.init.call(this, p_oElement, p_oAttributes);

	        var id = p_oElement;
	        
	        if (!L.isString(id)) {
	            if (id.tagName && (id.tagName.toLowerCase() == 'textarea')) {
	                id = Dom.generateId(id);                    
	            } else { return false; }
	        } else {
	            var el = Dom.get(id);
	            if (el.tagName && el.tagName.toLowerCase() == 'textarea') {
	                //All good
	            } else { return false; }
	        }
	
	        Editor._instances[id] = this;

	        var tm = TM.get(id);
			_T[id] = tm.data; 
			_TId[id] = tm.idManager;
	        
	        this._createTextArea();
	        this._initButtons();
	        this._onModeChange();
	        
			this.on("modeChange", this._onModeChange);
			this.on("toolbarChange", this._onToolbarChange);
	    },
        initAttributes: function(attr) {
            Editor.superclass.initAttributes.call(this, attr);
            
            /**
             * Имя модуля платформы Abricos, который содержит в себе
             * реализацию визуального редактора.
             * 
             * @attribute veName
             * @type String
             */
            this.setAttributeConfig('veName', {
                value: attr.veName || Editor.CURRENT_VISUAL_EDITOR,
                writeOnce: true,
                validator: function(value) {
            		return EM.editorExist(value);
                }
            });

            /**
             * Режим работы редактора. <br>
             * Атрибут принимает следующие значения:
             * <a href="Brick.widget.Editor.html#property_MODE_CODE">MODE_CODE</a> |
             * <a href="Brick.widget.Editor.html#property_MODE_VISUAL">MODE_VISUAL</a>.<br>
             * <i>Примечание: для режима визуального редактора, должен быть указан артибут 
             * <a href="Brick.widget.Editor.html#config_veName">veName</a></i>
             * 
             * @attribute mode
             * @type String
             */
            this.setAttributeConfig('mode', {
                value: attr.mode || Editor.MODE_CODE,
                validator: function(value) {
            		return value == Editor.MODE_CODE || value == Editor.MODE_VISUAL;
                }
            });
            
            /**
             * Режим панели инструментов.<br>
             * Атрибут принимает следующие значения:
             * <a href="Brick.widget.Editor.html#property_TOOLBAR_FULL">TOOLBAR_FULL</a> |
             * <a href="Brick.widget.Editor.html#property_TOOLBAR_STANDART">TOOLBAR_STANDART</a> |
             * <a href="Brick.widget.Editor.html#property_TOOLBAR_MINIMAL">TOOLBAR_MINIMAL</a>.
             * 
             * @attribute toolbar
             * @type String
             */
            this.setAttributeConfig('toolbar', {
                value: attr.toolbar || Editor.TOOLBAR_STANDART,
                validator: function(value) {
            		return value == Editor.TOOLBAR_STANDART 
            			|| value == Editor.TOOLBAR_FULL
            			|| value == Editor.TOOLBAR_MINIMAL;
                }
            });

            /**
             * Показать кнопки конфигурации редактора (группа кнопок справа).
             * 
             * @attribute configButtons
             * @type Boolean
             * @default true
             */
            this.setAttributeConfig('configButtons',{
            	value: attr.configButtons || true
            });

            /**
             * Показать кнопку вызова менеджера файлов.
             * Если модуль "Менеджер файлов" не установлен, кнопка будет скрыта
             * в любом случае.
             * 
             * @attribute fileManager
             * @type Boolean
             * @default true
             */
            this.setAttributeConfig('fileManager',{
            	value: attr.fileManager || true,
            	validator: function(value){
            		if (!value){
            			return false;
            		}
            		if (Brick.Modules['filemanager']){
            			return Brick.componentExists('filemanager', 'api');
            		}
            		return false;
            	}
            });
            
	    },
	    /**
	     * Отписаться от всех событий, удалить обертку элемента TEXTAREA,
	     * вызвать destroy визуального редактора, если он был создан.
	     * 
	     * @method destroy
	     */
	    destroy: function(){
	    	if (!L.isNull(this._ve)){ 
	    		this._ve.destroy();
	    		this._ve = null;
	    	}
	    	
	        var el = this.get('element');
			delete _T[el.id]; 
			delete _TId[el.id];

	        var par = this._wrap.parentNode;
	        // this._wrap.removeChild(el);
	        par.replaceChild(el, this._wrap);
	        this._wrap = null;
	        
	    },
	    
    	/**
    	 * Установить текст в текстовый редактор.
    	 * 
    	 * @method setContent
    	 * @param {String} text
    	 */
    	setContent: function(text){  
	    	if (L.isNull(this._ve)){ 
	    		this.get('element').value = text;
	    	}else{
		   		this._ve.setContent(text);
	    	}
	    },
    	
    	/**
    	 * Получить текст из текстового редактора.
    	 * 
    	 * @method getContent
    	 * @return {String}
    	 */
    	getContent: function(){
	    	if (L.isNull(this._ve)){
	    		this.get('element').value;
	    	}else{
	    		return this._ve.getContent();
	    	}
	    },
	    
	    /**
	     * Вставить текст по положению курсора в текстовый редактор.
	     * 
	     * @method insertValue
	     * @param {String} text
	     */
	    insertValue: function(text){
	    	if (L.isNull(this._ve)){ 
	    		
	    		var editor = this.get('element');
				if (document.selection) { // ie
					editor.focus();  
					sel = document.selection.createRange();  
					sel.text = text;  
				} else if (editor.selectionStart || editor.selectionStart == '0') { // firefox, opera  
					var startPos = editor.selectionStart;  
					var endPos = editor.selectionEnd;  
					editor.value = editor.value.substring(0, startPos) + text + editor.value.substring(endPos, editor.value.length);  
				} else { // over  
					editor.value += text;  
				}  
	    	}else{
		   		this._ve.insertValue(text);
	    	}
	    }

    });
    
    Brick.widget.Editor = Editor;
    
    var _buttonsAddedCss = {};
    
    var EditorButton = function(owner, config){
    	config = L.merge({
    		name: Dom.generateId(),
    		image: '',
    		title: '',
    		titleId: '',
    		onClick: null
    	}, config || {});
    	this.init(owner, config);
    };
    
    EditorButton.prototype = {
    	
    	_element: null,
    	
    	init: function(owner, config){
    		
    		this.owner = owner;
    		this.name = config.name;
			var el = owner.get('element');
			
			var T = _T[el.id];
			var TId = _TId[el.id];
			var tm = TM.get(el.id);
			
			if (!_buttonsAddedCss[this.name]){
		    	Brick.util.CSS.update(tm.replace('css', {
		    		name: this.name,
		    		image: config.image
		    	}));
		    	_buttonsAddedCss[this.name] = true;
			}
			
	    	this._element = new YAHOO.widget.Button({ 
	    		label:"", 
	    		id: this.name, 
	    		container: TId['editor']['buttons']
	    	});
	    	this._element.on("click", function(){
		    	if (L.isFunction(config.onClick)){
		    		config.onClick();
		    	}
		    	return true;
	    	});
	    	
    	},
    	
    	hide: function(){
    		var el = this._element.get('element');
    		el.style.display = 'none';
    	},
    	
    	show: function(){
    		var el = this._element.get('element');
    		el.style.display = '';
    	}
    };
    
    Brick.widget.EditorButton = EditorButton;
    
    /**
     * Абстрактный класс визуального редактора.
     * 
     * @class VisualEditor
     * @constructor
     * @param {String} name Имя визуального редактора
     * @param {Brick.widget.Editor} owner Экземпляр класса редактора
     */
    var VisualEditor = function(name, owner){
    	this.name = name;
    	this.owner = owner;
    	
    	this.init();
    };
    
    VisualEditor.prototype = {
    	
    	/**
    	 * Имя визуального редактора.
    	 * 
    	 * @property name
    	 * @type String
    	 */
    	name: '',
    	
    	/**
    	 * Экземпляр класса редактора.
    	 * 
    	 * @property owner
    	 * @type Brick.widget.Editor
    	 */
    	owner: null,
    	
    	/**
    	 * Абстрактный метод. Инициализировать класс
    	 * 
    	 * @method init
    	 */
    	init: function(){},
    	
    	/**
    	 * Абстрактный метод. Запросить визуальный редактор 
    	 * сменить режим.
    	 * 
    	 * @method setMode
    	 * @param {String} mode Режим редактора: 
    	 * <a href="Brick.widget.Editor.html#property_MODE_CODE">Editor.MODE_CODE</a> |
    	 * <a href="Brick.widget.Editor.html#property_MODE_VISUAL">Editor.MODE_VISUAL</a>.
    	 */
    	setMode: function(mode){},
    	
    	/**
    	 * Абстрактный метод. Запросить визуальный редактор
    	 * сменить режим панели инструментов.
    	 * 
    	 * @method setToolbar
    	 * @param {String} toolbarMode Режим панели инструментов, имеет значение: 
         * <a href="Brick.widget.Editor.html#property_TOOLBAR_FULL">Editor.TOOLBAR_FULL</a> |
         * <a href="Brick.widget.Editor.html#property_TOOLBAR_STANDART">Editor.TOOLBAR_STANDART</a> |
         * <a href="Brick.widget.Editor.html#property_TOOLBAR_MINIMAL">Editor.TOOLBAR_MINIMAL</a>.
    	 */
    	setToolbar: function(toolbarMode){},
    	
    	/**
    	 * Абстрактный метод. Разрушить экзепляр класса.
    	 * 
    	 * @method destroy
    	 */
    	destroy: function(){},
    	
    	/**
    	 * Получить HTML элемент TEXTAREA.
    	 * 
    	 * @method getElement
    	 * @return {HTMLElement} Элемент TEXTAREA
    	 */
    	getElement: function(){
    		return this.owner.get('element');
    	},
    	
    	/**
    	 * Абстрактный метод. Установить текст в текстовый редактор.
    	 * 
    	 * @method setContent
    	 * @param {String} text
    	 */
    	setContent: function(text){  },
    	
    	/**
    	 * Абстрактный метод. Получить текст из текстового редактора.
    	 * 
    	 * @method getContent
    	 * @return {String}
    	 */
    	getContent: function(){return '';},
    	
	    /**
	     * Абстрактный метод. Вставить текст по положению курсора в текстовый редактор.
	     * 
	     * @method insertValue
	     * @param {String} text
	     */
    	insertValue: function(text){}
    };
    
    Brick.widget.VisualEditor = VisualEditor;
};
