﻿// JScript 文件
Ext.onReady(function(){
    Ext.QuickTips.init();
    
    var previousNode;
  
    // shorthand
    var Tree = Ext.tree;
    Ext.get('item-number').load({
        url: 'data/get_number.aspx',
        //scripts:true,
        params: 'need=yes',
        text: 'Loading...'
    });

    var border = new Ext.Panel({
    //title: 'Border Layout',
    applyTo:'container',
    layout:'border',
    height: 400,
    width: 738,
    border:false,
    items: [{
        region:'west',
        el:'left-tree',
       
        split:true,
        width: 230,
        minSize: 1,
        maxSize: 500,
        collapsible: false
       
    },{
      
        region:'center',
        el:'right-tree'
       
    }]
});
    var leftTree = new Tree.TreePanel({
        el:'left-tree', 
        id:'left-tree',
        autoScroll:true,
        animate:true,
        enableDD:false,
        containerScroll:true,
        singleExpand:true, 
        height:400,
        width:230,
        
        loader: new Tree.TreeLoader({
            dataUrl:'data/get_folders.aspx'
        })
    });

    // set the root node
    var leftTreeRoot = new Tree.AsyncTreeNode({
        text: '收藏夹 ',
        iconCls:'addtoo-star',
        draggable:false,
        id:'0'
    });
   
    leftTree.setRootNode(leftTreeRoot);
   
    // render the tree
    leftTree.render();
    leftTreeRoot.select();
    
    leftTreeRoot.expand();
    
    var rightTree = new Tree.TreePanel({
        el:'right-tree',
        id:'right-tree',
        autoScroll:true,
        animate:true,
        enableDD:false,
        containerScroll:true,
        lines :false,
        height:400,
        width:503,
       
        rootVisible:false,
        
        loader: new Tree.TreeLoader({
            dataUrl:'data/get_hrefs.aspx'
        })
    });

    // set the root node
    var rightTreeRoot = new Tree.AsyncTreeNode({
        text: '收藏夹 ',
        draggable:false,
        id:'0'
    });
   
    rightTree.setRootNode(rightTreeRoot);
   
    // render the tree
    rightTree.render();
    rightTree.root.expand();
   leftTree.on('click',function(node,e){
   
         //
           if(previousNode && previousNode.id!='0'){
               
              previousNode.getUI().getIconEl().attributes.getNamedItem('class').value ='x-tree-node-icon addtoo-folder';
           }
           if(node.id!='0'){
              node.getUI().getIconEl().attributes.getNamedItem('class').value ='x-tree-node-icon addtoo-folder-open';
           }
           previousNode=node;
           rightTreeRoot.id = node.id;
           rightTreeRoot.reload();
           node.expand();

     })
  
   rightTree.on('beforeload',function(node){
     
      Ext.get('right-tree').mask('正在加载，请等待...');
   }) 
   rightTree.on('load',function(node){

      Ext.get('right-tree').unmask();
   }) 
   rightTree.on('click',function(node,e){
       node.unselect();
   })
  var refreshButton= Ext.get('refresh-button'); 
  refreshButton.on('mouseover',function(e){
       refreshButton.dom.style.background='#739BE0';
     });
     refreshButton.on('mouseout',function(e){
       refreshButton.dom.style.background='';
     });
   refreshButton.on('click',function(){
	    Ext.get('item-number').load({
            url: 'data/get_number.aspx',
            //scripts:true,
            params: 'need=yes',
            text: 'Loading...'
          });
         leftTree.root.reload(); 
         leftTree.root.select();
         //rightTree.root.reload();
         rightTreeRoot.id = '0';
         rightTreeRoot.reload();
	  
    });     
   
 });   

