AlbumTree.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:4k
源码类别:

中间件编程

开发平台:

JavaScript

  1. /*!
  2.  * Ext JS Library 3.0.0
  3.  * Copyright(c) 2006-2009 Ext JS, LLC
  4.  * licensing@extjs.com
  5.  * http://www.extjs.com/license
  6.  */
  7. Imgorg.AlbumTree = Ext.extend(Ext.tree.TreePanel,{
  8.     initComponent: function() {
  9.         Ext.apply(this,{
  10.             loader: new Ext.ux.tree.DirectTreeLoader({
  11.                 api: Imgorg.ss.Albums
  12.             }),
  13.             root: new Ext.tree.TreeNode({
  14.                 text:'dummynode',
  15.                 expanded: true,
  16.                 leaf: false,
  17.                 cls:'album-node'
  18.             }),
  19.             rootVisible: false,
  20.             clearOnLoad: false,
  21.             autoScroll: true,
  22.             containerScroll: true,
  23.             enableDrop: true,
  24.             dropConfig: {
  25.                 ddGroup: 'organizerDD',
  26.                 notifyDrop: this.onNotifyDrop.createDelegate(this)
  27.             }
  28.         });
  29.         Imgorg.AlbumTree.superclass.initComponent.call(this);
  30.         this.loader.load(this.root);
  31.         
  32.         this.editor = new Ext.tree.TreeEditor(this, {
  33.             allowBlank: false,
  34.             blankText: 'A name is required',
  35.             selectOnFocus: true
  36.         });
  37.         this.editor.on('complete', this.onEditComplete, this);
  38.         this.on('contextmenu', this.onContextMenu, this);
  39.     },
  40.     
  41.     onContextMenu: function(node, e) {
  42.         e.stopEvent();
  43.         if(!this.contMenu) {
  44.             this.contMenu = new Ext.menu.Menu({
  45.                 items: [{
  46.                     text: 'Remove',
  47.                     handler: function() {
  48.                         var node = this.currentNode;
  49.                         node.unselect();
  50.                         Ext.fly(node.ui.elNode).ghost('l', {
  51.                             callback: function() {
  52.                                 Imgorg.ss.Albums.remove({
  53.                                     album: node.id
  54.                                 });
  55.                                 node.remove();
  56.                             }, scope: node, duration: 0.4
  57.                         });
  58.                     },
  59.                     scope: this
  60.                 }]
  61.             });
  62.         }
  63.         this.currentNode = node;
  64.         this.contMenu.showAt(e.getXY());
  65.     },
  66.     
  67.     onNotifyDrop: function(src, e, data) {
  68.         var nodes = data.nodes;
  69.         var nodeIds = [];
  70.         for (var i = 0;i < nodes.length;i++) {
  71.             nodeIds.push(nodes[i].id);
  72.         }
  73.         this.addToAlbum(nodeIds, this.dropZone.dragOverData.target.attributes.id);
  74.         return true; // cancell repair anim
  75.     },
  76.     
  77.     addToAlbum: function(nodes, album) {
  78.         Imgorg.ss.Images.addToAlbum({
  79.             images: nodes, 
  80.             album: album
  81.         });
  82.     },
  83.     
  84.     addAlbum: function() {
  85.         var root = this.root;
  86.         var node = root.appendChild(new Ext.tree.TreeNode({
  87.             text:'Album',
  88.             cls:'album-node',
  89.             allowDrag:false
  90.         }));
  91.         this.getSelectionModel().select(node);
  92.         var ge = this.editor;
  93.         setTimeout(function(){
  94.             ge.editNode = node;
  95.             ge.startEdit(node.ui.textNode);
  96.         }, 10);
  97.     },
  98.     
  99.     onEditComplete: function(editor, newVal, oldVal) {
  100.         var n = editor.editNode;
  101.         Imgorg.ss.Albums.addOrUpdate({node: n.id, text: newVal, id: n.attributes.id});
  102.     }
  103. });
  104. Ext.reg('img-albumtree', Imgorg.AlbumTree);
  105. Ext.ns('Ext.ux.tree');
  106. Ext.ux.tree.DirectTreeLoader = Ext.extend(Ext.tree.TreeLoader,{
  107.     baseAttrs: {
  108.         cls:'album-node'
  109.     },
  110.     
  111.     load : function(node, callback){
  112.         this.requestData(node, callback);
  113.     },
  114.     
  115.     requestData : function(node, callback){
  116.         if(this.fireEvent("beforeload", this, node, callback) !== false){
  117.             this.api.loadtree({
  118.                 node: node.id
  119.             }, this.processResponse.createDelegate(this, [node, callback], true));
  120.         }else{
  121.             // if the load is cancelled, make sure we notify
  122.             // the node that we are done
  123.             if(typeof callback == "function"){
  124.                 callback();
  125.             }
  126.         }
  127.     },
  128.     
  129.     processResponse : function(res, trans, node, callback){
  130.         try {
  131.             node.beginUpdate();
  132.             for(var i = 0, len = res.length; i < len; i++){
  133.                 var n = this.createNode(res[i]);
  134.                 if(n){
  135.                     node.appendChild(n);
  136.                 }
  137.             }
  138.             node.endUpdate();
  139.             if(typeof callback == "function"){
  140.                 callback(this, node);
  141.             }
  142.         }catch(e){
  143.             this.handleFailure(res);
  144.         }
  145.     }
  146. });