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

(function(className) {

	SPS[className] = $Class({
		_o : null,
		_maxHeight : 350,

		$init : function(sEl, arg, isAjax) {
		
			var oEl = $(sEl);
			
			var self = this;
			var o = this._o = {
				wrap : oEl,
				
				category02_1 : $$('.category02', oEl)[0],
				category02_2 : $$('.category02', oEl)[1],
				tab : $$('.category02_tab', oEl)[0],
				panels : $$('.category02', oEl)
			};
			
			if (o.tab) {
				
				SPS.tab(o.tab, o.panels, {
					onChange : function(oTab, oPanel) { self._setMaxHeight(oPanel, self._maxHeight); }
				});
				
			}

			this._bindEvents();
			
			this._setMaxHeight(o.category02_1, this._maxHeight);
			this._setMaxHeight(o.category02_2, this._maxHeight);
			
			// 열려있는 카테고리 데이터 받아오기
			if(isAjax)
				$A($$('li a.open', o.wrap)).forEach(function(oNode) {
					self._requestDynamicNode(oNode, true);
				});
			
		},
		
		_setMaxHeight : function(oEl, nHeight) {
			
			if (!oEl) return;
			
			var eEl = $Element(oEl);
			
			var eBox = eEl.hasClass('scroll') ? eEl : eEl.findElement('parentNode', function(oEl) { return $Element(oEl).hasClass('scroll'); });
			var oBox = eBox.$value();
			
			var nOrgScrollTop = oBox.scrollTop;

			eBox.css({
				'height' : 'auto',
				'overflow' : 'auto',
				'overflowY' : 'visible'
			});
			
			if (oBox.scrollHeight > nHeight) {
				
				eBox.css({
					'height' : nHeight + 'px',
					'overflow' : 'auto',
					'overflowY' : 'scroll'
				});
				
			}
			
			if ($Agent().navigator().ie)
				setTimeout(function() { oBox.scrollTop = nOrgScrollTop; }, 1); // avoidance IE bug
			else
				oBox.scrollTop = nOrgScrollTop;
			
		},
		
		_requestDynamicNode : function(oNode, bScroll) {
		
			var self = this;
			var sText = oNode.innerHTML.replace(/(.*)\([0-9]+\)$/, '$1');
			
			var nTrID = (new Date().getTime() % 1000000) * 1000 + parseInt(Math.random() * 1000);
			var sUrl = oNode.href;

			var oPanel = oNode.parentNode.parentNode; 
			
			var sUnit = oNode.className.match(/unit[0-9]+/)[0];
			var oSubTree = $$('.' + sUnit + '_tree', oPanel)[0];
			
			oNode.id = 'node' + nTrID;
			oSubTree.id = 'sub' + nTrID;
			
			var oAjax = $Ajax(sUrl, {
				onload : function(oRes) {
				
					var sHtml = oRes.text();
					var sTrID = sHtml.match(/<!--\s+\[trID:([0-9]+)\]\s+-->/);
					if (!sTrID) return;
					
					var oTree = $('sub' + sTrID[1]);
					var oNode = $('node' + sTrID[1]);
					
					var oPanel = oNode.parentNode.parentNode;
					
					// SPS.debug(oTree + '/' + 'sub' + sTrID[1]);
					if (oTree) oTree.innerHTML = sHtml;
					
					$Element(oTree).removeClass('dynamic');
					oTree.style.display = '';
					
					self._setMaxHeight(oNode, self._maxHeight);
					
					if (bScroll) {
						setTimeout(function() {
							var nScrollTop = $Element(oNode).offset().top - $Element(oPanel).offset().top;
							oPanel.scrollTop = nScrollTop - 5;
						}, 1); // IE bug
					}

				}
			});
			
			// oInitMatchTree.innerHTML = '<li>' + SPS.text('CATEGORY_LOADING') + '</li>';
			
			oAjax.request({
				trID : nTrID,
				value : sText
			});		
		
		},
		
		_bindEvents : function () {

			var o = this._o;
			var sInitMatchTree = new String();
			var oInitMatchTree = new Object();
			
			var self = this;
			
			var pToggle = function(oEvent) {
			
				var oEl = this[0];
				var oToggle = this[1];
			
				sInitMatchTree = oToggle.className.replace(/( )?(close)?(open)?(toggle)?/g,'');
				sInitMatchTree = sInitMatchTree.replace(/(^\s+|\s+$)/, '');
				oInitMatchTree = $$('.'+sInitMatchTree+"_tree",oEl)[0];
			
				if( $Element(oToggle).hasClass('open') ) {
					$Element(oToggle).removeClass('open');
					$Element(oToggle).addClass('close');
					if ( oInitMatchTree ) {
						oInitMatchTree.style.display = "none";
					}
					self._setMaxHeight(oEvent.element, self._maxHeight);
					
				}else {
					$Element(oToggle).removeClass('close');
					$Element(oToggle).addClass('open');
					if ( oInitMatchTree ) {
						var eSubTree = $Element(oInitMatchTree);
						if (eSubTree.hasClass('dynamic')) {

							self._requestDynamicNode(oToggle);
							
						} else {
						
							oInitMatchTree.style.display = "";
							self._setMaxHeight(oEvent.element, self._maxHeight);
							
						}

					}

				}
				
				oEvent.stop();

			};
		
			if ( o.category02_1 ) {
			
				var i = 0;

				$A($$('.toggle', o.category02_1)).forEach(function(oToggle) {
					$Fn(pToggle).owner([ o.category02_1, oToggle ]).attach(oToggle, 'click');
					i++;
				});
			}
			if ( o.category02_2 ) {
			
				var i = 0;

				$A($$('.toggle', o.category02_2)).forEach(function(oToggle) {
					$Fn(pToggle).owner([ o.category02_2, oToggle ]).attach(oToggle, 'click');
					i++;
				});
			}			
		}
	
	});

})('ct_category02');