git.roojs.org Git - Pman.Core/blob - Pman.Dialog.Image.js

   1 //<script type="text/javascript">
   2
   3 Pman.Dialog.Image = {
   4     dialog : false,
   5     form : false,
   6     create: function()
   7     {
   8         if (this.dialog) {
   9             return;
  10         }
  11         var _this = this;
  12
  13         this.dialog = new Ext.LayoutDialog(Ext.get(document.body).createChild({tag:'div'}),  {
  14             autoCreated: true,
  15             title: "Upload Image or  File",
  16             modal: true,
  17             width:  500,
  18             height: 140,
  19             shadow:true,
  20             minWidth:200,
  21             minHeight:180,
  22             //proxyDrag: true,
  23             closable: false,
  24             draggable: false,
  25             center: {
  26                 autoScroll:false,
  27                 titlebar: false,
  28                // tabPosition: 'top',
  29                 hideTabs: true,
  30                 closeOnTab: true,
  31                 alwaysShowTabs: false
  32             }
  33         });
  34         this.dialog.addKeyListener(27, this.dialog.hide, this.dialog);
  35         this.dialog.addButton("Cancel", this.dialog.hide, this.dialog);
  36
  37         this.dialog.addButton("Save", this.save, this);
  38         this.layout = this.dialog.getLayout();
  39         this.layout.beginUpdate();
  40
  41
  42         this.form = new Ext.form.Form({
  43             labelWidth: 150 ,
  44             fileUpload : true,
  45             listeners : {
  46                 actionfailed : function(f, act) {
  47                     _this.uploadComplete = true;
  48                     _this.dialog.el.unmask();
  49                     // error msg???
  50
  51                     if (act.type == 'submit') {
  52                         Ext.MessageBox.alert("Error", "Saving failed = fix errors and try again");
  53                         return;
  54                     }
  55
  56                     // what about load failing..
  57                     Ext.MessageBox.alert("Error", "Error loading details");
  58
  59                 },
  60                 actioncomplete: function(f, act) {
  61                     _this.uploadComplete = true;
  62                     _this.dialog.el.unmask();
  63
  64
  65                     if (act.type == 'load') {
  66
  67                         _this.data = act.result.data;
  68                        // _this.loaded();
  69                         return;
  70                     }
  71
  72
  73                     if (act.type == 'submit') { // only submitted here if we are
  74                         _this.dialog.hide();
  75                         //console.log(act);
  76                         if (_this.callback) {
  77                             _this.callback.call(this, act.result.data);
  78                         }
  79                         return;
  80                     }
  81                     // unmask??
  82                 }
  83             }
  84
  85
  86
  87
  88         });
  89         //?? will this work...
  90         this.form.addxtype.apply(this.form,
  91             [
  92                 // type filed??
  93                 { name: 'UPLOAD_IDENTIFIER' , xtype: 'Hidden' },
  94                 {
  95                         xtype :  'TextField',
  96                         name : 'imageUpload',
  97                         fieldLabel : "Upload Image or File",
  98                         inputType : 'file'
  99                 },
 100                 { name: 'ontable', xtype: 'Hidden' },
 101                 { name: 'onid', xtype: 'Hidden' },
 102                 { name: 'imgtype', xtype: 'Hidden' }, // special value for sorting!!
 103                 { name: 'post_max_size', xtype: 'Hidden' , value :'32M'} ,
 104                 { name: 'upload_max_filesize', xtype: 'Hidden' , value :'32M'}
 105
 106
 107
 108         ]
 109
 110         );
 111         var ef = this.dialog.getLayout().getEl().createChild({tag: 'div'});
 112         ef.dom.style.margin = 10;
 113
 114         this.form.render(ef.dom);
 115
 116         var vp = this.dialog.getLayout().add('center', new Ext.ContentPanel(ef, {
 117             autoCreate : true,
 118             //title: 'Org Details',
 119             //toolbar: this.tb,
 120             width: 250,
 121             maxWidth: 250,
 122             fitToFrame:true
 123         }));
 124
 125
 126
 127
 128         this.layout.endUpdate();
 129     },
 130     _id : 0,
 131
 132     show: function (data, callback)
 133     {
 134
 135         this.callback = callback;
 136          this.create();
 137         this.form.reset();
 138
 139         this.form.setValues(data);
 140         this.form.findField('UPLOAD_IDENTIFIER').setValue((new Date() * 1) + '' + Math.random());
 141         this.dialog.show();
 142
 143
 144     },
 145
 146     save : function()
 147     {
 148         this.dialog.el.mask("Sending");
 149         this.uploadComplete = false;
 150         this.form.doAction('submit', {
 151             url: baseURL + '/Roo/Images.html',
 152             method: 'POST',
 153             params: {
 154              //   _id: 0 ,
 155                 ts : Math.random()
 156             }
 157         });
 158         this.haveProgress = false,
 159         this.uploadProgress.defer(1000, this);
 160
 161     },
 162     uploadComplete : false,
 163     haveProgress: false,
 164     uploadProgress : function()
 165     {
 166         if (!this.haveProgress) {
 167             Roo.MessageBox.progress("Uploading", "Uploading");
 168         }
 169         if (this.uploadComplete) {
 170             Roo.MessageBox.hide();
 171             return;
 172         }
 173         this.haveProgress = true;
 174         var _this = this;
 175         var uid = this.form.findField('UPLOAD_IDENTIFIER').getValue();
 176         Pman.request({
 177             url : baseURL + '/Core/UploadProgress.php',
 178             params: {
 179                 id : uid
 180             },
 181             method: 'GET',
 182             success : function(data){
 183                 //console.log(data);
 184                 if (_this.uploadComplete) {
 185                     Roo.MessageBox.hide();
 186                     return;
 187                 }
 188
 189                 if (data){
 190                     Roo.MessageBox.updateProgress(data.bytes_uploaded/data.bytes_total,
 191                         Math.floor((data.bytes_total - data.bytes_uploaded)/1000) + 'k remaining'
 192                     );
 193                 }
 194                 _this.uploadProgress.defer(2000, _this);
 195             },
 196             failure: function(data) {
 197               //  console.log('fail');
 198              //   console.log(data);
 199             }
 200         })
 201
 202
 203
 204     }
 205
 206
 207
 208
 209
 210 };