/**
 * @author hooriza (ajaxUI team)
 */

(function(className) {

	SPS[className] = $Class({
		
		_maxLength : 40,

		$init : function(sEl) {

			var oEl = $(sEl);
			var self = this;
			
			var o = this._o = {
				
				viewPanel : $$('.wb_view', oEl)[0],
				editPanel : $$('.wb_edit', oEl)[0],
				
				remainedChars : $$('.remained_chars', oEl)[0],
				frmTitle : $$('.frm_title', oEl)[0],
				txtTitle : $$('.word', oEl)[0],
				
				exportLayer : $$('.wordnote_export', oEl)[0],
				exportButton : $$('.export_button', oEl)[0],
				
				confirmButton : $$('.wb_edit .btnbox_l a', oEl)[0]
			};
			
			if (o.exportButton) {

				o.exportButton.onclick = function() {
					self._showExportLayer(true);
					return false;
				};
				
				$Fn(function(oEvent) {
					if (oEvent.of(o.exportLayer) || oEvent.of(o.exportButton)) return;
					this._showExportLayer(false);
				}).owner(this).attach(document, 'mousedown');
				
			}
			
			if (o.frmTitle && o.confirmButton) {
			
				$Fn(function(oEvent) {
					if (oEvent.key().keyCode != 13) return;
					o.confirmButton.onclick();
				}).owner(this).attach(o.frmTitle, 'keydown');
			
			}
			
			SPS.selectbox.touchAll('select_d', oEl);
			// new SPS.observe(o.frmTitle);
			
			this._initPanels();

		},
		
		_showExportLayer : function(bFlag) {
		
			var o = this._o;
			$Element(o.exportLayer)[bFlag ? 'show' : 'hide']();
		
		},
		
		_initPanels : function() {
			
			var o = this._o;
			
			if (!o.viewPanel || !o.editPanel) return;
			this._showEditPanel(false);
			
		},
		
		_showEditPanel : function(bFlag) {
			
			var o = this._o;
			var aMethods = bFlag ? [ 'show', 'hide' ] : [ 'hide', 'show' ];
			
			if (o.editPanel && o.viewPanel) {
				$Element(o.editPanel)[aMethods[0]]();
				$Element(o.viewPanel)[aMethods[1]]();
			}
			
		},
		
		_edit : function() {

			var o = this._o;

			o.frmTitle.value = o.txtTitle.innerHTML.toValue();
			
			this._refreshLength();
			this._showEditPanel(true);
			
		},
		
		_confirm : function(nVocId) {
			
			var o = this._o;
			var sReqUrl = 'editVocabTitle';
			
			$Element(o.frmTitle).addClass('notspace'); 
			var bPassed = SPS.validator.validate(o.editPanel);
			$Element(o.frmTitle).removeClass('notspace');

			if (!bPassed) return;
			
			if (typeof nVocId != "number") {
				sReqUrl = nVocId;
				nVocId = null;
			}
			
			var oAjax = $Ajax(sReqUrl, {
				
				onLoad : function(oRes) {
				
					if (oRes.text() == "true") {
						o.txtTitle.innerHTML = o.frmTitle.value.toHTML();
						this._showEditPanel(false);		
					}
				
				}

			});
			
			var oData = { 'title' :  o.frmTitle.value };
			if (nVocId) oData.vocabID = nVocId;
			if (typeof nVocId == "number") {
				oAjax.request(oData);
			}else{			
				location.href = "addVocabAction?title=" + encodeURIComponent(o.frmTitle.value);								
			}
			o.txtTitle.innerHTML = o.frmTitle.value.toHTML();
			this._showEditPanel(false);	

		},

		_refreshLength : function() {
			
			var o = this._o;
			
			var sValue = o.frmTitle.value; 
			var nLen = sValue.bytesLength();
			var nRemained = this._maxLength - nLen;
			
			var bOverflow = true;
			
			if (nRemained < 0) {
				sValue = sValue.bytesCut(this._maxLength);
				o.frmTitle.value = sValue;
				
				nLen = sValue.bytesLength();
				nRemained = this._maxLength - nLen;
				
				bOverflow = false;
			}
			
			o.remainedChars.innerHTML = nRemained;
			return bOverflow;
			
		},
		
		_onKeyUp : function(oEvent) {
		
			var o = this._o;
			
			SPS.validator.validate(o.frmTitle);
			this._refreshLength();
				
			return true;
			
		}

	});

})('ct_51_01');