App.js
上传用户:dawnssy
上传日期:2022-08-06
资源大小:9345k
文件大小:7k
源码类别:

JavaScript

开发平台:

JavaScript

  1. /*!
  2.  * Ext JS Library 3.1.0
  3.  * Copyright(c) 2006-2009 Ext JS, LLC
  4.  * licensing@extjs.com
  5.  * http://www.extjs.com/license
  6.  */
  7. /*
  8.  * Sample Image Organizer utilizing Ext.Direct
  9.  * Tagging/Organizing into galleries
  10.  * Image uploading
  11.  */
  12. Ext.ns('Imgorg','Imgorg.App');
  13. Imgorg.App = function() {
  14.     var swfu;
  15.     SWFUpload.onload = function() {
  16.         var settings = {
  17.             flash_url: "SWFUpload/Flash/swfupload.swf",
  18.             upload_url: "php/router.php",
  19.             file_size_limit: "100 MB",
  20.             file_types: "*.*",
  21.             file_types_description: "Image Files",
  22.             file_upload_limit: 100,
  23.             file_queue_limit: 100, 
  24.             debug: false,
  25.             button_placeholder_id: "btnUploadHolder",
  26.             button_cursor: SWFUpload.CURSOR.HAND,
  27.             button_window_mode: SWFUpload.WINDOW_MODE.TRANSPARENT,
  28.             file_queued_handler: function(file) {
  29.                 Ext.ux.SwfuMgr.fireEvent('filequeued', this, file);
  30.             },
  31.             upload_start_handler: function(file) {
  32.                 Ext.ux.SwfuMgr.fireEvent('uploadstart', this, file);
  33.             },
  34.             upload_progress_handler: function(file, complete, total) {
  35.                 Ext.ux.SwfuMgr.fireEvent('uploadprogress', this, file, complete, total);
  36.             },
  37.             upload_error_handler: function(file, error, message) {
  38.                 Ext.ux.SwfuMgr.fireEvent('uploaderror', this, file, error, message);
  39.             },
  40.             upload_success_handler: function(file, data, response) {
  41.                 Ext.ux.SwfuMgr.fireEvent('uploadsuccess', this, file, data);
  42.             },
  43.             minimum_flash_version: "9.0.28",
  44.             post_params: {
  45.                 extAction: 'Images', // The class to use
  46.                 extUpload: true,      
  47.                 extMethod: 'upload'  // The method to execute
  48.                 //needs extTID – Transaction ID to associate with this request.
  49.             }
  50.         };
  51.         swfu = new SWFUpload(settings);
  52.     };
  53.     var view, thumbPanel, uploadPanel, tabPanel;
  54.     return {
  55.         debugSWF: false,
  56.         
  57.         init: function() {
  58.             Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
  59.             Ext.QuickTips.init();
  60.             Ext.BLANK_IMAGE_URL = '../../resources/images/default/s.gif';
  61.             Ext.Direct.addProvider(Imgorg.REMOTING_API);
  62.             
  63.             Ext.ux.SwfuMgr.on('filequeued', this.onFileQueued, this);
  64.             
  65.             new Ext.Viewport({
  66.                 layout: 'border',
  67.                 items: [{
  68.                     xtype: 'img-albumtree',
  69.                     id: 'album-tree',
  70.                     region: 'west',
  71.                     width: 180,
  72.                     minWidth: 180,
  73.                     maxWidth: 180,
  74.                     collapsible: true,
  75.                     split: true,
  76.                     collapseMode: 'mini',
  77.                     margins: '5 0 5 5',
  78.                     cmargins: '0 0 0 0',
  79.                     tbar: [{
  80.                         text: 'Add Album',
  81.                         iconCls: 'add',
  82.                         scale: 'large',
  83.                         handler: function() {
  84.                             Ext.getCmp('album-tree').addAlbum();
  85.                         }
  86.                     },{
  87.                         text: 'Upload',
  88.                         iconCls: 'upload',
  89.                         scale: 'large',
  90.                         handler: function() {
  91.                             swfu.selectFiles();
  92.                         }
  93.                     }],
  94.                     listeners: {
  95.                         click: this.onAlbumClick,
  96.                         scope: this
  97.                     }
  98.                 },{
  99.                     xtype: 'tabpanel',
  100.                     region: 'center',
  101.                     id: 'img-tabpanel',
  102.                     margins: '5 5 5 0',
  103.                     activeItem: 0,
  104.                     enableTabScroll: true,
  105.                     items: this.getTabs()
  106.                 }]
  107.             });
  108.             
  109.             tabPanel = Ext.getCmp('img-tabpanel');
  110.             thumbPanel = tabPanel.getComponent('images-view');
  111.             Imgorg.TagWin = new Imgorg.TagWindow();
  112.         },
  113.         
  114.         getTabs: function() {
  115.             var tabs = [{
  116.                 xtype: 'img-albumspanel',
  117.                 title: 'Albums',
  118.                 listeners: {
  119.                     openalbum: this.onOpenAlbum,
  120.                     scope: this
  121.                 }
  122.             },Ext.apply({
  123.                 xtype: 'img-thumbpanel',
  124.                 itemId:'images-view'
  125.             },this.getImageThumbConfig())];
  126.             
  127.             if (this.debugSWF) {
  128.                 tabs.push({
  129.                     title: 'debug',
  130.                     contentEl: 'SWFUpload_Console',
  131.                     listeners: {
  132.                         render: function() {
  133.                             Ext.fly('SWFUpload_Console').applyStyles({height: '100%', width: '100%'});
  134.                         }
  135.                     }
  136.                 });
  137.             }
  138.             return tabs;
  139.         },
  140.         
  141.         getImageThumbConfig: function() {
  142.             return {
  143.                 dvConfig: {
  144.                     listeners: {
  145.                         dblclick: function(view, idx, node, e) {
  146.                             var p = this.openImage(view.getStore().getAt(idx));
  147.                             p.show();
  148.                         },
  149.                         viewitem: function(view, node) {
  150.                             var recs = view.getSelectedRecords();
  151.                             for (var i = 0; i < recs.length; i++) {
  152.                                 this.openImage(recs[i]);
  153.                             }
  154.                         },
  155.                         scope: this
  156.                     }
  157.                 }
  158.             };
  159.         },
  160.         
  161.         openImage: function(rec) {
  162.             return tabPanel.add({
  163.                 xtype: 'img-panel',
  164.                 title: Ext.util.Format.ellipsis(rec.data.filename,15),
  165.                 url: rec.data.url,
  166.                 imageData: rec.data
  167.             });
  168.         },
  169.         
  170.         onOpenAlbum: function(ap, album, name) {
  171.             var tab = tabPanel.add(Ext.apply({
  172.                 xtype: 'img-thumbpanel',
  173.                 closable: true,
  174.                 title: 'Album: '+name
  175.             },this.getImageThumbConfig()));
  176.             tab.albumFilter({
  177.                 id: album,
  178.                 text: name
  179.             });
  180.             tab.show();
  181.         },
  182.         
  183.         onAlbumClick: function(node, e) {
  184.             this.onOpenAlbum(null, node.attributes.id, node.attributes.text);
  185.         },
  186.         
  187.         onFileQueued: function(swfu, file) {
  188.             if (!uploadPanel) {
  189.                 uploadPanel = Ext.getCmp('img-tabpanel').add({
  190.                     title: 'Upload Queue',
  191.                     xtype: 'img-uploadqueue',
  192.                     swfu: swfu
  193.                 });
  194.                 uploadPanel.show();
  195.                 uploadPanel.addFile(swfu, file);
  196.             } else {
  197.                 uploadPanel.show();
  198.             }
  199.         },
  200.         
  201.         getSwf: function() {
  202.             return swfu;
  203.         }
  204.     }
  205. }();
  206. Ext.onReady(Imgorg.App.init,Imgorg.App);
  207. Ext.override(Ext.CompositeElementLite,{
  208.     removeElement : function(keys, removeDom){
  209.         var me = this, els = this.elements, el;     
  210.     Ext.each(keys, function(val){
  211.     if (el = (els[val] || els[val = me.indexOf(val)])) {
  212.      if(removeDom) 
  213.      el.dom ? el.remove() : Ext.removeNode(el);
  214.      els.splice(val, 1);     
  215. }
  216.     });
  217.         return this;
  218.     }
  219. });