annotate e2gallerypro/e2upload/Source/Uploader.js @ 10:ed52b2b7cbc1 judyates

[svn r11] created thumbs for the photo gallery.
author rlm
date Mon, 12 Apr 2010 01:57:22 -0400
parents 3f6b44aa6b35
children
rev   line source
rlm@3 1 /*
rlm@3 2 Script: Uploader.js
rlm@3 3 MooTools FileManager - Implements Upload functionality into the FileManager based on [FancyUpload](http://digitarald.de)
rlm@3 4
rlm@3 5 License:
rlm@3 6 MIT-style license.
rlm@3 7
rlm@3 8 Copyright:
rlm@3 9 Copyright (c) 2009 [Christoph Pojer](http://og5.net/christoph).
rlm@3 10
rlm@3 11 Dependencies:
rlm@3 12 - FileManager.js
rlm@3 13
rlm@3 14 Options:
rlm@3 15 - upload: (boolean, defaults to *true*)
rlm@3 16 - uploadAuthData: (object) Data to be send with the GET-Request of an Upload as Flash ignores authenticated clients
rlm@3 17 - resizeImages: (boolean, defaults to *true*) Whether to show the option to resize big images or not
rlm@3 18 */
rlm@3 19
rlm@3 20 FileManager.implement({
rlm@3 21
rlm@3 22 options: {
rlm@3 23 resizeImages: false,
rlm@3 24 upload: true,
rlm@3 25 uploadAuthData: {}
rlm@3 26 },
rlm@3 27
rlm@3 28 hooks: {
rlm@3 29 show: {
rlm@3 30 upload: function(){
rlm@3 31 this.startUpload();
rlm@3 32 }
rlm@3 33 },
rlm@3 34
rlm@3 35 cleanup: {
rlm@3 36 upload: function(){
rlm@3 37 if(!this.options.upload || !this.upload) return;
rlm@3 38
rlm@3 39 if(this.upload.uploader) this.upload.uploader.set('opacity', 0).dispose();
rlm@3 40 }
rlm@3 41 }
rlm@3 42 },
rlm@3 43
rlm@3 44 onDialogOpen: function(){
rlm@3 45 if(this.swf && this.swf.box) this.swf.box.setStyle('visibility', 'hidden');
rlm@3 46 },
rlm@3 47
rlm@3 48 onDialogClose: function(){
rlm@3 49 if(this.swf && this.swf.box) this.swf.box.setStyle('visibility', 'visible');
rlm@3 50 },
rlm@3 51
rlm@3 52 startUpload: function(){
rlm@3 53 if(!this.options.upload || this.swf) return;
rlm@3 54
rlm@3 55 var self = this;
rlm@3 56 this.upload = {
rlm@3 57 button: this.addMenuButton('upload').addEvents({
rlm@3 58 click: function(){
rlm@3 59 return false;
rlm@3 60 },
rlm@3 61 mouseenter: function(){
rlm@3 62 this.addClass('hover');
rlm@3 63 },
rlm@3 64 mouseleave: function(){
rlm@3 65 this.removeClass('hover');
rlm@3 66 this.blur();
rlm@3 67 },
rlm@3 68 mousedown: function(){
rlm@3 69 this.focus();
rlm@3 70 }
rlm@3 71 }),
rlm@3 72 list: new Element('ul', {'class': 'filemanager-uploader-list'}),
rlm@3 73 uploader: new Element('div', {opacity: 0}).adopt(
rlm@3 74 new Element('h2', {text: this.language.upload}),
rlm@3 75 new Element('div', {'class': 'filemanager-uploader'})
rlm@3 76 )
rlm@3 77 };
rlm@3 78 this.upload.uploader.getElement('div').adopt(this.upload.list);
rlm@3 79 this.closeIcon.appearOn(this.upload.button, 0.8);
rlm@3 80
rlm@3 81 if(this.options.resizeImages){
rlm@3 82 var resizer = new Element('div', {'class': 'checkbox'}),
rlm@3 83 check = (function(){ this.toggleClass('checkboxChecked'); }).bind(resizer);
rlm@3 84 check();
rlm@3 85 this.upload.label = new Element('label').adopt(
rlm@3 86 resizer, new Element('span', {text: this.language.resizeImages})
rlm@3 87 ).addEvent('click', check).inject(this.menu);
rlm@3 88 }
rlm@3 89
rlm@3 90 var File = new Class({
rlm@3 91
rlm@3 92 Extends: Swiff.Uploader.File,
rlm@3 93
rlm@3 94 initialize: function(base, data){
rlm@3 95 this.parent(base, data);
rlm@3 96 this.setOptions({
rlm@3 97 url: self.options.url+'?'+Hash.toQueryString($merge({}, self.options.uploadAuthData, {
rlm@3 98 event: 'upload',
rlm@3 99 directory: self.normalize(self.Directory),
rlm@3 100 resize: self.options.resizeImages && resizer.hasClass('checkboxChecked') ? 1 : 0
rlm@3 101 }))
rlm@3 102 });
rlm@3 103 },
rlm@3 104
rlm@3 105 render: function(){
rlm@3 106 if(this.invalid){
rlm@3 107 var message = self.language.uploader.unknown, sub = {
rlm@3 108 name: this.name,
rlm@3 109 size: Swiff.Uploader.formatUnit(this.size, 'b')
rlm@3 110 };
rlm@3 111
rlm@3 112 if(self.language.uploader[this.validationError])
rlm@3 113 message = self.language.uploader[this.validationError];
rlm@3 114
rlm@3 115 if(this.validationError=='sizeLimitMin')
rlm@3 116 sub.size_min = Swiff.Uploader.formatUnit(this.base.options.fileSizeMin, 'b');
rlm@3 117 else if(this.validationError=='sizeLimitMax')
rlm@3 118 sub.size_max = Swiff.Uploader.formatUnit(this.base.options.fileSizeMax, 'b');
rlm@3 119
rlm@3 120 new Dialog(new Element('div', {html: message.substitute(sub, /\\?\$\{([^{}]+)\}/g)}) , {language: {confirm: self.language.ok}, buttons: ['confirm']});
rlm@3 121 return this;
rlm@3 122 }
rlm@3 123
rlm@3 124 this.addEvents({
rlm@3 125 open: this.onOpen,
rlm@3 126 remove: this.onRemove,
rlm@3 127 requeue: this.onRequeue,
rlm@3 128 progress: this.onProgress,
rlm@3 129 stop: this.onStop,
rlm@3 130 complete: this.onComplete
rlm@3 131 });
rlm@3 132
rlm@3 133 this.ui = {};
rlm@3 134 this.ui.icon = new Asset.image(self.options.assetBasePath+'Icons/'+this.extension+'.png', {
rlm@3 135 onerror: function(){ new Asset.image(self.options.assetBasePath+'Icons/default.png').replaces(this); }
rlm@3 136 });
rlm@3 137 this.ui.element = new Element('li', {'class': 'file', id: 'file-' + this.id});
rlm@3 138 this.ui.title = new Element('span', {'class': 'file-title', text: this.name});
rlm@3 139 this.ui.size = new Element('span', {'class': 'file-size', text: Swiff.Uploader.formatUnit(this.size, 'b')});
rlm@3 140
rlm@3 141 var tips, file = this;
rlm@3 142 this.ui.cancel = new Asset.image(self.options.assetBasePath+'cancel.png', {'class': 'file-cancel', title: self.language.cancel}).addEvent('click', function(){
rlm@3 143 file.remove();
rlm@3 144 tips.hide();
rlm@3 145 tips.detach(this);
rlm@3 146 });
rlm@3 147 tips = new FileManager.Tips(this.ui.cancel);
rlm@3 148
rlm@3 149 var progress = new Element('img', {'class': 'file-progress', src: self.options.assetBasePath+'bar.gif'});
rlm@3 150
rlm@3 151 this.ui.element.adopt(
rlm@3 152 this.ui.cancel,
rlm@3 153 progress,
rlm@3 154 this.ui.icon,
rlm@3 155 this.ui.title,
rlm@3 156 this.ui.size
rlm@3 157 ).inject(self.upload.list).highlight();
rlm@3 158
rlm@3 159 this.ui.progress = new Fx.ProgressBar(progress).set(0);
rlm@3 160
rlm@3 161 this.base.reposition();
rlm@3 162
rlm@3 163 return this.parent();
rlm@3 164 },
rlm@3 165
rlm@3 166 onOpen: function(){
rlm@3 167 this.ui.element.addClass('file-running');
rlm@3 168 },
rlm@3 169
rlm@3 170 onRemove: function(){
rlm@3 171 this.ui = this.ui.element.destroy();
rlm@3 172 },
rlm@3 173
rlm@3 174 onProgress: function(){
rlm@3 175 this.ui.progress.start(this.progress.percentLoaded);
rlm@3 176 },
rlm@3 177
rlm@3 178 onStop: function(){
rlm@3 179 this.remove();
rlm@3 180 },
rlm@3 181
rlm@3 182 onComplete: function(){
rlm@3 183 this.ui.progress = this.ui.progress.cancel().element.destroy();
rlm@3 184 this.ui.cancel = this.ui.cancel.destroy();
rlm@3 185
rlm@3 186 var response = JSON.decode(this.response.text);
rlm@3 187 if(!response.status)
rlm@3 188 new Dialog((''+response.error).substitute(self.language, /\\?\$\{([^{}]+)\}/g) , {language: {confirm: self.language.ok}, buttons: ['confirm']});
rlm@3 189
rlm@3 190 this.ui.element.set('tween', {duration: 2000}).highlight(response.status ? '#e6efc2' : '#f0c2c2');
rlm@3 191 (function(){
rlm@3 192 this.ui.element.setStyle('overflow', 'hidden').morph({
rlm@3 193 opacity: 0,
rlm@3 194 height: 0
rlm@3 195 }).get('morph').chain(function(){
rlm@3 196 this.element.destroy();
rlm@3 197 if(!self.upload.list.getElements('li').length)
rlm@3 198 self.upload.uploader.fade(0).get('tween').chain(function(){
rlm@3 199 self.fillInfo();
rlm@3 200 });
rlm@3 201 });
rlm@3 202 }).delay(5000, this);
rlm@3 203 }
rlm@3 204
rlm@3 205 });
rlm@3 206
rlm@3 207 this.swf = new Swiff.Uploader({
rlm@3 208 id: 'SwiffFileManagerUpload',
rlm@3 209 path: this.options.assetBasePath+'Swiff.Uploader.swf',
rlm@3 210 queued: false,
rlm@3 211 target: this.upload.button,
rlm@3 212 allowDuplicates: true,
rlm@3 213 instantStart: true,
rlm@3 214 fileClass: File,
rlm@3 215 fileSizeMax: 25 * 1024 * 1024,
rlm@3 216 onBrowse: function(){},
rlm@3 217 onCancel: function(){},
rlm@3 218 zIndex: this.SwiffZIndex || 9999,
rlm@3 219 onSelectSuccess: function(){
rlm@3 220 self.fillInfo();
rlm@3 221 self.info.getElement('h2.filemanager-headline').setStyle('display', 'none');
rlm@3 222 self.preview.adopt(self.upload.uploader);
rlm@3 223 self.upload.uploader.fade(1);
rlm@3 224 },
rlm@3 225 onComplete: function(){
rlm@3 226 self.load(self.Directory, true);
rlm@3 227 },
rlm@3 228 onFail: function(error){
rlm@3 229 $$(self.upload.button, self.upload.label).dispose();
rlm@3 230 new Dialog(new Element('div', {html: self.language.flash[error] || self.language.flash.flash}), {language: {confirm: self.language.ok}, buttons: ['confirm']});
rlm@3 231 }
rlm@3 232 });
rlm@3 233 }
rlm@3 234
rlm@3 235 });