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