Ext.onReady(function(){
	
	Ext.BLANK_IMAGE_URL = './images/s.gif';
	
	Ext.History.init();
    
    var tokenDelimiter = ':';
	
	Ext.chart.Chart.CHART_URL = './js/ext/resources/charts.swf';
	

	Ext.apply(Ext.form.VTypes,{
	    phoneText: "Not a valid phone number.  Must be in the format 123-4567 or 123-456-7890.",
	    phoneMask: /[d-]/,
	    phoneRe: /^(d{3}[-]?){1,2}(d{4})$/,
	    phone : function (v) {
	        return this.phoneRe.test(v);
	    },
	
	    numericText: "번호만 입력 해주세요.",
	    numericMask: /[0-9]/,
	    numericRe: /[0-9]+/,
	    numeric :function (v) {
	        return this.numericRe.test(v);
	    } ,
	
	    decNumText: "Only decimal numbers are allowed.",
	    decNumMask: /(d|.)/,
	    decNumRe: /d+.d+|d+/,
	    decNum : function (v) {
	        return this.decNumRe.test(v);
	    }
	});  
	
	
	Ext.override(Ext.chart.Chart, {
		onDestroy: function(){
			Ext.chart.Chart.superclass.onDestroy.call(this);
			this.bindStore(null);
			//var tip = this.tipFnName;
			//if(!Ext.isEmpty(tip)){
			// delete window[tip];
			//}
		}
	});

	Ext.override(Ext.form.Field, {
		   setFieldLabel : function(text) {
		      Ext.fly(this.el.dom.parentNode.previousSibling).update(text);
		   }
		});
	
	
	Ext.Component.prototype.stateful = false;



	this.loginNoticeButton = new Ext.Button({
		text:'캠지 개선사항을 알려주세요~',
		iconCls:'board_modify',
		scope:this
	});
	
	//Ext.QuickTips.init();
  	//Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
    
	// left top Panel (main tree 표시)
	/**
	var westCenterPanel = new Ext.TabPanel({
									id:'westCenterPanel',
									region:'north',
									defaults: {autoScroll:true},
									//resizeTabs:true, // turn on tab resizing
							       // minTabWidth: 50,
							        collapsible: true,
									collapseMode: "mini",
									hideCollapseTool:true,
									height:310,
					        border:true,
					        split: true,
				      		//bbar : [this.loginNoticeButton],

									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            }
							        //enableTabScroll:true							
						      });
**/
							  
	var inlinePanelBlog = new Ext.hansub.panel.InlineBlog({
		
		id:'inlineBlog_ID',
		title:'캠핑지도 최신이야기',
		camping_user_uid : '',
		camping_list_uid : '',
		autorefrash:true,
		region:'center',
		closable:false,
		fieldWidth : 180,
		inputdisable : false
		
	});	
	
	var campingScoreGridPanel = new Ext.hansub.camping.CampingScoreGridPanel ({
		id:'campingScoreGridPanel_ID',
		autoHeight:true,
		iconCls:'blueicon',
		title:'정복지존 100',
		closable:false,
		fieldWidth : 180
		
	});			
	/**	  
	var leftCenterPanel = new Ext.TabPanel({
									id:'leftCenterPanel',
									region:'center',
									defaults: {autoScroll:true},
									resizeTabs:false, // turn on tab resizing
							        minTabWidth: 50,
							        //tabWidth:100,
							        border:true,
							        split: true,
									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            },
							        enableTabScroll:true
									
								});
						      
						      
	// center Top Panel ( 메인 표시 )							
	var centerCenterPanel = new Ext.TabPanel({
									id:'centerCenterPanel',
									region:'center',
									defaults: {autoScroll:true},
									resizeTabs:false, // turn on tab resizing
							        minTabWidth: 50,
							        //tabWidth:100,
							        border:true,
							        split: true,
									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            },
							        enableTabScroll:true	
									
								});

	var centerBottomPanel = new Ext.TabPanel({
									id:'centerBottomPanel',
									region:'east',
									width:300,
									defaults: {autoScroll:true},
									resizeTabs:false, // turn on tab resizing
							        minTabWidth: 50,
									collapsible: true,
									collapseMode: "mini",
									hideCollapseTool:true,
							        //tabWidth:100,
							        border:true,
							        split: true,
									/**
									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            },
							        enableTabScroll:true	
									
								});								


	
	// left top Panel (main tree 표시)
	var eastCenterPanel = new Ext.TabPanel({
									id:'eastCenterPanel',
									region:'center',
									defaults: {autoScroll:true},
									resizeTabs:true, // turn on tab resizing
							        minTabWidth: 50,
							       // tabWidth:100,
							        border:true,
							        split: true,
									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            },
							        enableTabScroll:true								
						      });
	
	// left bottom Panel
	var eastSouthPanel = new Ext.TabPanel({
									id:'eastSouthPanel',
									region:'south',
									height:200,
									border:true,
									defaults: {autoScroll:true},
									resizeTabs:true, // turn on tab resizing
							        minTabWidth: 115,
							        //tabWidth:135,
							        split: true,
							        enableTabScroll:true,
							        collapsible: true,
									collapseMode: "mini",
									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            },
									hideCollapseTool:true
									
								});
	**/
	    // mainToolbar 
    var mainToolbar = new MainToolbar();
    /**
    var leftPanel = new Ext.Panel({
    	id:'leftPanelID',
    	region:'west',
		split: true,
		border:false,
		width:250,
		layout:'border',
		collapsible: true,
		hideCollapseTool : true,
		collapseMode: "mini",
		items:[westCenterPanel,leftCenterPanel]
	});
	**/

	// 로그인 되었을 경우
    /**
	var viewport = new Ext.Viewport({
	    id:'layout',	
        layout:'border',
        items:	[
        			{
						region:'north',
						//autoHeight:true,
						//html:'<div class=\'head\'><a href=\'http://www.campingjido.com\'><font color=white>캠핑지도</font></a> &nbsp; &nbsp; [알림] 아트인아일랜드 정보가 업데이트되었습니다.</div> ',
						//html:'<div class=\'head\'><a href=\'http://www.campingjido.com\'><font color=white>캠핑지도</font></a> &nbsp; &nbsp; </div> ',
						//html:'<div class=\'head\'><a href=\'http://www.campingjido.com\'><img src=./images/logo.png border=0></a> &nbsp; &nbsp; </div> ',
						html:'<table border=0 width=100% background=./images/logo_bg.png><tr><td><a href=\'http://www.campingjido.com\'><img src=./images/logo_ani.gif border=0></a></td><td align=right><img src=./images/logoright.png border=0></td></tr></table>',
						//html:'<div class=\'head\'><a href=\'http://www.campingjido.com\'><img src=./images/campjido-title.jpg border=0></a> &nbsp; &nbsp; </div> ',
						height:62,
						border:false,
						bbar:mainToolbar
						 						        
					},
					leftPanel
					,{
						region:'center',
						layout:'border',
						border:false,
						items:[centerCenterPanel]
					}/**,{
						region:'east',
						split: true,
						border:false,
						width:300,
						layout:'border',
						collapsible: true,
						collapseMode: "mini",
						items:[eastCenterPanel,eastSouthPanel]
					}
       		]
    });
   **/
	 
	var campingRegionTreePanel = new Ext.hansub.tree.RegionTreePanel(
						null,
						{
							id:'campingRegionTreePanelID',
							title:'캠핑장',
							rootTitile:'전국캠핑장',
							split: true,
							height: 310,
							iconCls:'accept_icon',
							minSize: 150,
       						maxSize: 400,
       						loader: new Ext.tree.TreeLoader({
							            dataUrl:'./src/api/Interface.php',
							            baseParams:{
							            	'class':'Common',
							            	'method':'getTree',
											uid:"",
											table:""
							            	}
							            	
							        }),
							data:{}
						}
					);
	
	var campingToolTreePanel = new Ext.hansub.tree.ToolTreePanel(
			null,
			{
				id:'campingToolTreePanelID',
				title:'캠핑 장비',
				rootTitile:'장비',
				split: true,
				height: 310,
				iconCls:'accept_icon',
				minSize: 150,
					maxSize: 400,
					loader: new Ext.tree.TreeLoader({
				            dataUrl:'./src/api/Interface.php',
				            baseParams:{
				            	'class':'Common',
				            	'method':'getToolTree',
								uid:"",
								table:""
				            	}
				            	
				        }),
				data:{}
			}
		);
	
		var campingShoppingTreePanel = new Ext.hansub.tree.ShoppingTreePanel(
					null,
					{
						id:'campingShoppingTreePanel',
						title:'<b>쇼핑<font color=red></font></b>',
						rootTitile:'전국',
						iconCls:'shopping_icon',
						split: true,
						height: 310,
						minSize: 150,
						//frame: true,
    					maxSize: 400,
    					loader: new Ext.tree.TreeLoader({
						            dataUrl:'./src/api/Interface.php',
						            baseParams:{
						            	'class':'Common',
						            	'method':'getTreeShopping',
										uid:"",
										table:""
						            	}
						            	
						        }),
						data:{}
					}
				);

		var campingBlogTreePanel = new Ext.hansub.tree.BlogTreePanel(
					null,
					{
						id:'campingBlogTreePanel',
						title:'<b>블로거</b>',
						rootTitile:'전국',
						iconCls:'blog_icon',
						split: true,
						height: 310,
						minSize: 150,
						//frame: true,
   						maxSize: 400,
   						loader: new Ext.tree.TreeLoader({
						            dataUrl:'./src/api/Interface.php',
						            baseParams:{
						            	'class':'Common',
						            	'method':'getTreeBlog',
										uid:"",
										table:""
					            	}
						            	
						        }),
						data:{}
					}
			);

		/**		
  westCenterPanel.add(campingRegionTreePanel);
	westCenterPanel.setActiveTab(campingRegionTreePanel);
  westCenterPanel.add(campingShoppingTreePanel);
  westCenterPanel.add(campingBlogTreePanel);
  leftCenterPanel.add(inlinePanelBlog);
	leftCenterPanel.setActiveTab(inlinePanelBlog);
	
	
	leftCenterPanel.add(campingScoreGridPanel);
	**/
	//leftCenterPanel.setActiveTab(campingScoreGridPanel);
   
    //Ext.getCmp('centerBottomPanel').collapse(false);
	
	// 초기 페이지
	//mainToolbar.initPage("458");
	
	
		
	
	/*
	msg = 	
			"<p class='notic_content' align='left'><b>캠핑을 사랑하는 한 캠퍼로서 정보를 나누고자 만들었으며, 캠핑지도 회원이라면 누구나 등록/수정이 가능한 무료 사이트입니다. 많은 이용 및 참여를 부탁드립니다.^^ <!-- 캠핑장 정보를 캠지(캠핑지도)회원께 <br><font color='red'>공개</font>합니다.</p>"+
			"<p class='notic_content' align='left'>캠지회원이면  누구나 <br>"+
			"캠핑장  <font color='red'>등록</font> 및 <font color='red'>수정</font>이 가능합니다.</p>"+
			"<p class='notic_content' align='left'><b>캠지분들의 많은 공유 부탁드립니다.--></b></p>";;
		
	this.notification = new Ext.ux.Notification({
						iconCls:	'x-icon-information',
						title:	  '공지사항',
						html:		msg,
						width:700,
						autoDestroy: true,
						hideDelay:  10000
	});

	if(IS_LOGIN){
  	this.notification.show(document);
  }
    */	
	


  
	
		this.mapPanel = new Ext.hansub.camping.MyCampingMapPanel({
			id:"mymapID",
			iconCls:'globe',
			title:"<font name=맑은고딕><b>캠핑장지도</b></font>",
			isall: true,
			width : 800,
			height : 750,
			border: false,
			closable:false,
			level:10
		
		});	


	//centerCenterPanel.add(this.mapPanel);
	//centerCenterPanel.activate(this.mapPanel);
	
	
		/*
			var campingGridID = new Ext.hansub.camping.CampingGridPanel({
			id: 'campingGridID',
			title: '<b>캠핑장목록</b>',
    	iconCls:'database',
	  	closable: false,
			data: {
				viewtype: 'title',
						table: '',
						uid: ''
			}
		});
	centerCenterPanel.add(campingGridID);
	*/
	
/**		var campingGridExID = new Ext.hansub.camping.CampingGridPanelEx({
			id: 'campingGridExID',
			title: '<b>인기순위</b>',
	    	iconCls:'local_icon',
		  	closable: false,
			data: {
				viewtype: 'title'
			}
		});
		**/
	//centerCenterPanel.add(campingGridExID);

	
	
	

	
	/**
	var imageInlinePanelBlog = new Ext.hansub.panel.InlineBlogImage({
		
		id:'imageInlineBlog_ID',
		iconCls:'img_icon',
		title:'전체',
		camping_user_uid : '',
		camping_list_uid : '',
		autorefrash:true,
		region:'center',
		closable:false,
		fieldWidth : 180,
		inputdisable : false
		
	});
	**/	
	//centerCenterPanel.add(imageInlinePanelBlog);



	 this.board = new Ext.hansub.board.BoardGridPanel({
		 id:"BoardGridPanelID",
		title:"게시판",
		iconCls:'community_icon',
		data:{
			camping_boardtype_uid: '1',
			viewtype: 'summary'
		}
	});
	
	//centerCenterPanel.add(this.board);

	this.campingUser = new Ext.hansub.camping.CampingUserGridPanel({
		id:'CampingUserGridPanel_ID',
		iconCls:'community_icon',
		title:'<b>NEXT캠핑장</b>',
		autoHeight:true,
		closable:false,
		fieldWidth : 180
	});
	
	this.campingGridID = new Ext.hansub.camping.CampingGridPanelEx({
			id: 'campingGridID',
			title: '<b>캠핑장목록</b>',
	    	iconCls:'database',
		  	closable: false,
			data: {
				viewtype: 'title',
				table: '',
				uid: ''
			}
		});
	
	this.toolsGridID = new Ext.hansub.camping.ToolsGridPanelEx({
		id: 'toolsGridID',
		title: '<b>캠핑장비</b>',
    	iconCls:'tool',
	  	closable: false,
		data: {
			viewtype: 'title',
			table: '',
			uid: ''
		}
	});
	
	
	//centerCenterPanel.add(this.campingUser);
	
	
	
	
	
	
	
	
	
	

	
	
	
	
	
	
 	// top panel (title panel)
	var topPanel = new Ext.Panel({
		id:'topPanel',
		columnWidth:2,
		autoHeight:true,
		html:'<table border=0 width=100% background=./images/camji_02.gif><tr><td><a href=\'http://www.campingjido.com\'><img src=./images/camji_01.gif border=0></a></td></tr></table>',
		border:false,
		bbar:mainToolbar,
		height:10/**,
		
		
		html:'<table border=0 width=100% background=./images/logo_bg.png><tr><td><a href=\'http://www.campingjido.com\'><img src=./images/logo_ani.gif border=0></a></td><td align=right><img src=./images/logoright.png border=0></td></tr></table>',
		height:62,
		border:false/**
		,bbar:mainToolbar**/
		
		 						        
	});
	
	// left panel
	var leftPanel = new Ext.Panel({
		id:'leftPanel',
		cls:'viewport',
		width:250,
		height:'100%',
		border:false
	});
	
	
	// center panel					
	var mainTabPanel = new Ext.TabPanel({
									id:'centerCenterPanel',
									cls:'viewport',
									columnWidth:1,
									autoWidht:true,
									plain:true,
									defaults:{autoHeight: true},
									resizeTabs:false, // turn on tab resizing
							        minTabWidth: 50,
							        border:true,
							        split: true,
							        
									listeners: {
						                'tabchange': function(tabPanel, tab){
						                    Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
						                }
						            },
						            
							        enableTabScroll:true										
								});
	
	// left top panel
	var sideUpTabPanel = new Ext.TabPanel({
		id:'sideUpTabPanel',
		cls:'leftTabPanel',
		plain:true,
		defaults: {autoScroll:true},
		resizeTabs:false, // turn on tab resizing
        minTabWidth: 50,
        border:true,
		listeners: {
            'tabchange': function(tabPanel, tab){
                Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
            }
        },
        enableTabScroll:true										
	});
	
	// left top panel
	var sideCenterTabPanel = new Ext.TabPanel({
		id:'sideCenterTabPanel',
		cls:'leftTabPanel',
		plain:true,
		defaults: {autoScroll:true},
		resizeTabs:false, // turn on tab resizing
        minTabWidth: 50,
        border:true,
		listeners: {
            'tabchange': function(tabPanel, tab){
                Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
            }
        },
        enableTabScroll:true										
	});
	
	// left bottom panel
	var sideDownTabPanel = new Ext.TabPanel({
		id:'sideDownTabPanel',
		cls:'leftTabPanel',
		plain:true,
		region:'center',
		defaults: {autoScroll:true},
		resizeTabs:false, // turn on tab resizing
        minTabWidth: 50,
        border:true,
        split: true,
		listeners: {
            'tabchange': function(tabPanel, tab){
                Ext.History.add(tabPanel.id + tokenDelimiter + tab.id);
            }
        },
        enableTabScroll:true										
	});
	
	
	leftPanel.add(sideUpTabPanel);
	leftPanel.add(sideCenterTabPanel);
	leftPanel.add(sideDownTabPanel);
	
	sideUpTabPanel.add(campingRegionTreePanel);
	sideUpTabPanel.setActiveTab(campingRegionTreePanel);
	sideUpTabPanel.add(campingShoppingTreePanel);
	sideUpTabPanel.add(campingBlogTreePanel);
	
	sideCenterTabPanel.add(campingToolTreePanel);
	sideCenterTabPanel.setActiveTab(campingToolTreePanel);
	
	sideDownTabPanel.add(inlinePanelBlog);
	sideDownTabPanel.setActiveTab(inlinePanelBlog);
	sideDownTabPanel.add(campingScoreGridPanel);
	

	if(IS_LOGIN){
		
		this.mycamping = new Ext.hansub.camping.MyCampingPortalPanel({
			id:'myCampingWrapper_'+UID,
			camping_user_uid : UID,
			title : '<b>내캠핑홈</b>',
			camping_user_name : NAME,
			isall:false,
			closable:false
			
		})

	
		mainTabPanel.add(this.mycamping);
		mainTabPanel.setActiveTab(this.mycamping);
		mainTabPanel.add(this.campingGridID);
		mainTabPanel.add(this.mapPanel);
		mainTabPanel.add(this.toolsGridID);
		mainTabPanel.add(this.board);
		mainTabPanel.add(this.campingUser);
	}else{
		mainTabPanel.add(this.campingGridID);
		mainTabPanel.setActiveTab(this.campingGridID);
		mainTabPanel.add(this.mapPanel);
		mainTabPanel.add(this.toolsGridID);
		mainTabPanel.add(this.board);
		mainTabPanel.add(this.campingUser);
	}
	
	
	
	this.layoutPanel = new Ext.Panel({
		id:'layout',
		cls:'viewport',
		bodyStyle:'background-color: #DFE8F6;margin:0px 10px 0px 10px',
		layout:'column',
    	width:1240,
    	renderTo: document.body,
    	border:false,
        autoScroll: true,
        items:[topPanel, leftPanel, mainTabPanel]
    });
	


	if(!IS_LOGIN){
	  /* 로그인창 자동으로 뜨기 */
		if(!Ext.getCmp('loginWindowID')){
			this.loginWin = new Ext.hansub.user.LoginWindow();
		    //this.loginWin.on('login', this.loginState, this);
        }
        Ext.getCmp('loginWindowID').reset();
    	Ext.getCmp('loginWindowID').show();
	}

	
	Ext.History.on('change', function(token){
    	
        if(token){
            var parts = token.split(tokenDelimiter);
            var tabPanel = Ext.getCmp(parts[0]);
            var tabId = parts[1];
            
            tabPanel.show();
            tabPanel.setActiveTab(tabId);
        }else{
            // This is the initial default state.  Necessary if you navigate starting from the
            // page without any existing history token params and go back to the start state.
            //tp.setActiveTab(0);
            //tp.getItem(0).setActiveTab(0);
        }
    });

});