/**********************************************************************
* /js/component/fujimi-input.js
* Copyright (C) 2007-2008 Kyoto University
*
* This library is free software; you can redistribute it and/or
* modify it under the terms of the GNU Lesser General Public
* License as published by the Free Software Foundation; either
* version 2.1 of the License, or (at your option) any later version.
*
* This library 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
* Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public
* License along with this library; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-
* 1301  USA
***********************************************************************/
/**
 * require util/utilities.js
 * require util/language.js
 * require util/color.js
 */

var FujimiInput = Class.create();
var InputContainer = Class.create();
var Textarea = Class.create();
var TabSet = Class.create();
var AutocompleteContainer = Class.create();

var CLASS_LANGUAGE_TAB = 'language-tab';
var CLASS_COLOR_MENU = 'color-select';
var ID_HEADER_TAB_SET = 'tab-group-';

FujimiInput.prototype = {
	initialize: function(hashId,languages,colors,serviceInformation){
		this.id = hashId.fujimiInput;
		this.element = $(this.id);
		this.containerPair = new Pair(new InputContainer(hashId.first,languages,colors,serviceInformation),
									new InputContainer(hashId.second,languages,colors,serviceInformation));
		this.containerPair.car().setPartnerContainer(this.containerPair.cdr());
		this.containerPair.cdr().setPartnerContainer(this.containerPair.car());
	},

	getLeftContainer: function(){
		return this.containerPair.car();
	},

	getRightContainer: function(){
		return this.containerPair.cdr();
	},

	getContainer: function(position){
		if(position == 'left'){
			return this.getLeftContainer();
		} else if(position == 'right'){
			return this.getRightContainer();
		}
		return null;
	}
}

InputContainer.prototype = {
	initialize: function(hashId,languages,colors, serviceInformation){
		this.id = hashId.container;
		this.element = $(this.id);
		this.colorMenuElement = null;
		this.translateButton = $(hashId.translateButton);
		this.postButton = $(hashId.postButton);
		this.loadingImageField = $(hashId.loadingImage);
		this.tabSet = new TabSet(hashId.tabSet,hashId.colorMenu,this,languages,colors);
		this.originalTextarea = new Textarea(hashId.originalTextarea);
		this.translationTextarea = new Textarea(hashId.translationTextarea);
		this.backTranslationTextarea = new Textarea(hashId.backTranslationTextarea);
		this.autocompleteContainer = new AutocompleteContainer(hashId.autocompleteContainer,hashId.originalTextarea,this, serviceInformation);
		this.languages = languages;
		this.partnerContainer = null;
		this.calltree = null;
	},

	clearAllTextarea: function(){
		this.originalTextarea.clear();
		this.translationTextarea.clear();
		this.backTranslationTextarea.clear();
	},

	setPartnerContainer: function(container){
		this.partnerContainer = container;
	},

	getPartnerContainer: function(){
		return this.partnerContainer;
	},

	getLanguageTabElements: function(){
		return this.getTabSet().getLanguageTabElements();
	},

	getColorMenuElement: function(){
		return this.getTabSet().getColorMenuElement();
	},

	getTabSet: function(){
		return this.tabSet;
	},

	getTranslateButton: function(){
		return this.translateButton;
	},

	getPostButton: function(){
		return this.postButton;
	},

	getOriginalTextarea: function(){
		return this.originalTextarea;
	},

	getTranslationTextarea: function(){
		return this.translationTextarea;
	},

	getBackTranslationTextarea: function(){
		return this.backTranslationTextarea;
	},

	getLanguage: function(){
		return this.getTabSet().getLanguage();
	},

	//* isSet:boolean
	setTranslationMark: function(isSet){
		if(isSet) {
			this.loadingImageField.innerHTML = '<img src="img/customized/icon_book.png" width="25" height="20" align="absmiddle" class="iepngfix" /> 翻訳結果&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="img/extention_fujimiparallel/ajax-loader6.gif" align="middle"/>&nbsp;&nbsp;翻訳しています';
		} else {
			this.loadingImageField.innerHTML = '<img src="img/customized/icon_book.png" width="25" height="20" align="absmiddle" class="iepngfix" /> 翻訳結果';
		}
	},

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

	getColor: function(){
		return this.getTabSet().getColor();
	},

	setColor: function(color){
		this.element.setStyle({
			backgroundColor: Color.getDiluteColorByName(color),
			borderTop: '5px solid '+Color.getDiluteColorByName(color)
		});
		this.getTabSet().setColor(color);
	},

	setLanguage: function(languageTag){
		this.getTabSet().setLanguageTab(languageTag);
		this.autocompleteContainer.setQueryLanguage(languageTag);
	},

	afterTranslation: function(resultObj){
		var checker = new StatusProcessor(resultObj);
		if(!checker.check()) return;

		resultObj = resultObj['contents']['result'];
		for(var i=0;i<resultObj.size();i++){
			this.getTranslationTextarea().setTextWithLanguage(resultObj[i].targetLanguage,resultObj[i].targetText);
			this.getBackTranslationTextarea().setTextWithLanguage(resultObj[i].targetLanguage,resultObj[i].backTranslationText);
		}
		var targetLanguage = this.getPartnerContainer().getLanguage();
		this.getTranslationTextarea().showTextFromLanguage(targetLanguage);
		this.getBackTranslationTextarea().showTextFromLanguage(targetLanguage);
	},

	translate: function(callback){
		if(this.getOriginalTextarea().getTextFromTextarea() == ''){
			//* exception
		} else {

			// eip kawauchi add start 20100113
			// 翻訳中は投稿ボタンを押下不可にする
			// UI的に文字色も変える
			this.postButton.disabled = true;
			this.postButton.style.color = "#AAAAAA";
			// eip kawauchi add end 20100113

			this.setTranslationMark(true);
			var callobj = {
				inputtext: this.getOriginalTextarea().getTextFromTextarea().replace(/\r\n/g," ").replace(/\n/ig," "),
				from: this.getLanguage(),
				to: this.languages.join(",")
			};
			var formText=$H(callobj).toQueryString();
			var fujimiInput = this;
			new Ajax.Request(
				 'php/ajax/fujimi-translation/back-translate.php',
				 {
					 method		:'post',
					 parameters	:formText,
					 fujimiInput:fujimiInput,
					 onSuccess	:function(httpObj){
					 	callback.update(httpObj.responseJSON.contents.profile);
						fujimiInput.afterTranslation(httpObj.responseJSON);
					 },
					 onFailure	:function(){
						 alert('Server Error.');
					 },
					 onComplete	:function(){
						 fujimiInput.setTranslationMark(false);

						 // eip kawauchi add start 20100113
						 // 翻訳が終わった時に投稿ボタンを押下可能にする
						 // 文字色も元に戻す
						 fujimiInput.postButton.disabled = false;
						 fujimiInput.postButton.style.color = "#333333";
						 // eip kawauchi add end 20100113

					 }
			 	}
			);

		}
	}
}

//* 複数の言語の翻訳結果の情報を持つことができるテキストエリア
Textarea.prototype = {
	initialize: function(id){
		this.id = id;
		this.element = $(this.id);
		this.textPairs = new Array();
	},

	clear: function(){
		this.showText('');
		this.resetTextPairs();
	},

	setTexts: function(textPairs){
		this.textPairs = textPairs;
	},

	setTextWithLanguage: function(language,text){
		for(var i=0;i<this.textPairs.size();i++){
			if(this.textPairs[i].car() == language){
				this.textPairs[i].setSecond(text);
				return;
			}
		}
		this.textPairs.push(new Pair(language,text));
	},

	getTextFromLanguage: function(language){
		for(var i=0;i<this.textPairs.size();i++){
			if(this.textPairs[i].car() == language){
				return this.textPairs[i].cdr();
			}
		}
		return null;
	},

	showTextFromLanguage: function(language){
		if(this.getTextFromLanguage(language) == undefined) this.element.value = '';
		else this.element.value = this.getTextFromLanguage(language);
	},

	showText: function(text){
		this.element.value = text;
	},

	getTextFromTextarea: function(){
		return this.element.value;
	},

	getTextPairs: function(){
		return this.textPairs;
	},

	resetTextPairs: function(){
		this.textPairs = new Array();
	}
}

TabSet.prototype = {
	initialize: function(id, colorMenuId,container,languages, colors){
		this.id = id;
		this.element = $(this.id);
		this.colorMenuId = colorMenuId;
		this.colorMenuElement = $(this.colorMenuId);
		this.languages = languages;
		this.colors = colors;
		this.inputContainer = container;
		this.color = 'red';
	},

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

	getLanguage: function(){
		for(var i=0;i<this.getLanguageTabElements().size();i++){
			if(this.getLanguageTabElements()[i].down('span').hasClassName('active')){
				return Language.getTagByName(this.getLanguageTabElements()[i].down('span').innerHTML.stripTags());
			}
		}
	},

	getLanguageTabElements: function(){
		return this.element.childElements().without(this.element.childElements().last());
	},

	getColorMenuElement: function(){
		return this.colorMenuElement;
	},

	setLanguageTab: function(languageTag){
		var language = Language.getNameByTag(languageTag);
		for(var i=0;i<this.element.childElements().size();i++){
			var e = this.element.childElements()[i];
			if(!e.hasClassName(CLASS_COLOR_MENU)){
				if(e.down('span').hasClassName('active')) {
					e.down('span').removeClassName('active');
					Color.setElementBackgroundColor(e.down('span'),'white');
				}
				if (e.down('span').innerHTML.stripTags() == language) {
					e.down('span').addClassName('active');
					Color.setElementBackgroundColor(e.down('span'),Color.getDiluteColorByName(this.color));
				}
			}
		}
	},

	getColor: function(){
		return this.color;
	},

	setColor: function(color){
		this.color = color;
		for(var i=0;i<this.element.childElements().size();i++){
			var e = this.element.childElements()[i];
			if(!e.hasClassName(CLASS_COLOR_MENU)){
				if(e.down('span').hasClassName('active'))
					Color.setElementBackgroundColor(e.down('span'),Color.getDiluteColorByName(this.color));
				else
					Color.setElementBackgroundColor(e.down('span'),'white');
			} else {
				Color.setElementBackgroundColor(e,Color.getDiluteColorByName(this.color));
			}
		}
		var options = this.colorMenuElement.childElements();
		for(var i=0;i<options.size();i++){
			if(options[i].value == color){
				options[i].selected = true;
				break;
			}
		}
	},

	draw: function(){
		//* 言語タブ作成
		for(var i=0;i<this.languages.size();i++){
			var img = document.createElement('img');
			img.src = Language.getFlagSrcByTag(this.languages[i]);
			var spacer = document.createElement('img');
			spacer.src = "img/common/space.gif";
			spacer.setAttribute('width', '2px');
			var text = document.createTextNode(Language.getNameByTag(this.languages[i]));
			this.element.childElements()[i].down('span').appendChild(img);
			this.element.childElements()[i].down('span').appendChild(spacer);
			this.element.childElements()[i].down('span').appendChild(text);
		}

		//* 色選択メニュー作成
		//*this.colorMenuElement = document.createElement('select');
		for (var i = 0; i < this.colors.size(); i++) {
			var colorOption = document.createElement('option');
			colorOption.value = this.colors[i];
			colorOption.appendChild(document.createTextNode(this.colors[i]));
			this.colorMenuElement.appendChild(colorOption);
		}

		//* 色選択メニューの位置調整
		var colorPanelWidth = this.colorMenuElement.up('li').getWidth();
		var contentPanelWidth = this.inputContainer.getElement().getWidth();
		this.colorMenuElement.up('li').setStyle({
			position: 'absolute',
			left: (contentPanelWidth-colorPanelWidth)+'px',
			top: '-4px'
		});
		this.element.makePositioned(this.colorMenuElement.up('li'));
	}
}

AutocompleteContainer.prototype = {
	initialize: function(id,sourceId,parentContainer, serviceInformation){
		this.id = id;
		this.sourceId =sourceId;
		this.element = $(this.id);
		this.parentContainer = parentContainer;
		this.oACDS = new YAHOO.widget.DS_XHR("php/ajax/fujimi-translation/autocomplete.php", ["result","sourceText"]);
		this.oAutoComplete = new YAHOO.widget.AutoComplete(this.sourceId,this.id, this.oACDS);

		this.setYuiEvent(serviceInformation);
	},


	//* オートコンプリート用にコールバック関数をオーバーライドする
	setYuiEvent: function(serviceInformation){
		this.oACDS.queryMatchContains = true;
		this.oACDS.maxCacheEntries = 0;

		this.oAutoComplete.useShadow = true;
		//* オートコンプリートの結果の調整
		this.oAutoComplete.formatResult = function(oResultItem, sQuery) {
			return oResultItem[0];
		};
		//* コンテナ表示前の調整
		this.oAutoComplete.doBeforeExpandContainer = function(oTextbox, oContainer, sQuery, aResults) {
			var pos = YAHOO.util.Dom.getXY(oTextbox);
			pos[1] += YAHOO.util.Dom.get(oTextbox).offsetHeight + 2;
			YAHOO.util.Dom.setXY(oContainer,pos);
			return true;
		};
		//* 項目選択時の動作の指定
		var container = this.parentContainer;
		this.oAutoComplete.itemSelectEvent.subscribe(function(oSelf,elItem,oData){
			serviceInformation.request('KawasakiParentLetterHandbook'); //* 決め打ち。要変更。
			serviceInformation.request('KawasakiSocialStudiesHandbook'); //* 決め打ち。要変更。
			serviceInformation.request('KawasakiCommonHandbook'); //* 決め打ち。要変更。
			var targetArray = elItem[1]._oResultData[1].targetTexts;
			for(var i=0;i<targetArray.length;i++){
				container.getTranslationTextarea().setTextWithLanguage(targetArray[i].targetLanguage,targetArray[i].targetText);
				container.getBackTranslationTextarea().setTextWithLanguage(targetArray[i].targetLanguage,elItem[1]._oResultData[1].sourceText);
			}
			container.getTranslationTextarea().setTextWithLanguage(elItem[1]._oResultData[1].sourceLanguage,elItem[1]._oResultData[1].sourceText);
			container.getBackTranslationTextarea().setTextWithLanguage(elItem[1]._oResultData[1].sourceLanguage,elItem[1]._oResultData[1].sourceText);
			var targetLanguage = container.getPartnerContainer().getLanguage();
			container.getTranslationTextarea().showTextFromLanguage(targetLanguage);
			container.getBackTranslationTextarea().showTextFromLanguage(targetLanguage);
		});
	},

	setQueryLanguage: function(){
	   	this.oACDS.scriptQueryAppend = "from=" + this.parentContainer.getLanguage();
	}
}

FujimiInput.Event = {
	load: function(fujimiInput){
		fujimiInput.getLeftContainer().getTabSet().draw();
		fujimiInput.getRightContainer().getTabSet().draw();
		fujimiInput.getLeftContainer().setLanguage('ja');
		fujimiInput.getRightContainer().setLanguage('zh');
		fujimiInput.getLeftContainer().setColor('blue');
		fujimiInput.getRightContainer().setColor('green');
		fujimiInput.getLeftContainer().clearAllTextarea();
		fujimiInput.getRightContainer().clearAllTextarea();
	},

	//* 各タブをクリックしたときの動作
	clickTab: function(event,fujimiInput,leftOrRight){
		var element = Event.element(event);
		if(element.hasAttribute('src')) element = element.up('span');
		var languageName = element.innerHTML.stripTags();
		fujimiInput.getContainer(leftOrRight).setLanguage(Language.getTagByName(languageName));
		fujimiInput.getContainer(leftOrRight).getPartnerContainer().getTranslationTextarea().showTextFromLanguage(Language.getTagByName(languageName));
		fujimiInput.getContainer(leftOrRight).getPartnerContainer().getBackTranslationTextarea().showTextFromLanguage(Language.getTagByName(languageName));
	},

	changeColor: function(event, fujimiInput,leftOrRight){
		var color = Event.element(event).value;
		fujimiInput.getContainer(leftOrRight).setColor(color);
	},

	clickTranslateButton: function(event, fujimiInput,leftOrRight, callback){
		fujimiInput.getContainer(leftOrRight).translate(callback);
	}

}