| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251 |
- /**
- * FancyUpload - Flash meets Ajax for powerful and elegant uploads.
- *
- * Updated to latest 3.0 API. Hopefully 100% compat!
- *
- * @version 3.0
- *
- * @license MIT License
- *
- * @author Harald Kirschner <http://digitarald.de>
- * @copyright Authors
- */
- var FancyUpload2 = new Class({
- Extends: Swiff.Uploader,
-
- options: {
- queued: 1,
- // compat
- limitSize: 0,
- limitFiles: 0,
- validateFile: $lambda(true)
- },
- initialize: function(status, list, options) {
- this.status = $(status);
- this.list = $(list);
- // compat
- options.fileClass = options.fileClass || FancyUpload2.File;
- options.fileSizeMax = options.limitSize || options.fileSizeMax;
- options.fileListMax = options.limitFiles || options.fileListMax;
- this.parent(options);
- this.addEvents({
- 'load': this.render,
- 'select': this.onSelect,
- 'cancel': this.onCancel,
- 'start': this.onStart,
- 'queue': this.onQueue,
- 'complete': this.onComplete
- });
- },
- render: function() {
- this.overallTitle = this.status.getElement('.overall-title');
- this.currentTitle = this.status.getElement('.current-title');
- this.currentText = this.status.getElement('.current-text');
- var progress = this.status.getElement('.overall-progress');
- this.overallProgress = new Fx.ProgressBar(progress, {
- text: new Element('span', {'class': 'progress-text'}).inject(progress, 'after')
- });
- progress = this.status.getElement('.current-progress')
- this.currentProgress = new Fx.ProgressBar(progress, {
- text: new Element('span', {'class': 'progress-text'}).inject(progress, 'after')
- });
-
- this.updateOverall();
- },
- onSelect: function() {
- this.status.removeClass('status-browsing');
- },
- onCancel: function() {
- this.status.removeClass('file-browsing');
- },
- onStart: function() {
- this.status.addClass('file-uploading');
- this.overallProgress.set(0);
- },
- onQueue: function() {
- this.updateOverall();
- },
- onComplete: function() {
- this.status.removeClass('file-uploading');
- if (this.size) {
- this.overallProgress.start(100);
- } else {
- this.overallProgress.set(0);
- this.currentProgress.set(0);
- }
-
- },
- updateOverall: function() {
- this.overallTitle.set('html', MooTools.lang.get('FancyUpload', 'progressOverall').substitute({
- total: Swiff.Uploader.formatUnit(this.size, 'b')
- }));
- if (!this.size) {
- this.currentTitle.set('html', MooTools.lang.get('FancyUpload', 'currentTitle'));
- this.currentText.set('html', '');
- }
- },
-
- /**
- * compat
- */
- upload: function() {
- this.start();
- },
-
- removeFile: function() {
- return this.remove();
- }
- });
- FancyUpload2.File = new Class({
-
- Extends: Swiff.Uploader.File,
- render: function() {
- if (this.invalid) {
- if (this.validationError) {
- var msg = MooTools.lang.get('FancyUpload', 'validationErrors')[this.validationError] || this.validationError;
- this.validationErrorMessage = msg.substitute({
- name: this.name,
- size: Swiff.Uploader.formatUnit(this.size, 'b'),
- fileSizeMin: Swiff.Uploader.formatUnit(this.base.options.fileSizeMin || 0, 'b'),
- fileSizeMax: Swiff.Uploader.formatUnit(this.base.options.fileSizeMax || 0, 'b'),
- fileListMax: this.base.options.fileListMax || 0,
- fileListSizeMax: Swiff.Uploader.formatUnit(this.base.options.fileListSizeMax || 0, 'b')
- });
- }
- this.remove();
- return;
- }
-
- this.addEvents({
- 'start': this.onStart,
- 'progress': this.onProgress,
- 'complete': this.onComplete,
- 'error': this.onError,
- 'remove': this.onRemove
- });
-
- this.info = new Element('span', {'class': 'file-info'});
- this.element = new Element('li', {'class': 'file'}).adopt(
- new Element('span', {'class': 'file-size', 'html': Swiff.Uploader.formatUnit(this.size, 'b')}),
- new Element('a', {
- 'class': 'file-remove',
- href: '#',
- html: MooTools.lang.get('FancyUpload', 'remove'),
- title: MooTools.lang.get('FancyUpload', 'removeTitle'),
- events: {
- click: function() {
- this.remove();
- return false;
- }.bind(this)
- }
- }),
- new Element('span', {'class': 'file-name', 'html': MooTools.lang.get('FancyUpload', 'fileName').substitute(this)}),
- this.info
- ).inject(this.base.list);
- },
-
- validate: function() {
- return (this.parent() && this.base.options.validateFile(this));
- },
-
- onStart: function() {
- this.element.addClass('file-uploading');
- this.base.currentProgress.cancel().set(0);
- this.base.currentTitle.set('html', MooTools.lang.get('FancyUpload', 'currentFile').substitute(this));
- },
- onProgress: function() {
- this.base.overallProgress.start(this.base.percentLoaded);
- this.base.currentText.set('html', MooTools.lang.get('FancyUpload', 'currentProgress').substitute({
- rate: (this.progress.rate) ? Swiff.Uploader.formatUnit(this.progress.rate, 'bps') : '- B',
- bytesLoaded: Swiff.Uploader.formatUnit(this.progress.bytesLoaded, 'b'),
- timeRemaining: (this.progress.timeRemaining) ? Swiff.Uploader.formatUnit(this.progress.timeRemaining, 's') : '-'
- }));
- this.base.currentProgress.start(this.progress.percentLoaded);
- },
-
- onComplete: function() {
- this.element.removeClass('file-uploading');
-
- this.base.currentText.set('html', 'Upload completed');
- this.base.currentProgress.start(100);
-
- if (this.response.error) {
- var msg = MooTools.lang.get('FancyUpload', 'errors')[this.response.error] || '{error} #{code}';
- this.errorMessage = msg.substitute($extend({
- name: this.name,
- size: Swiff.Uploader.formatUnit(this.size, 'b')
- }, this.response));
- var args = [this, this.errorMessage, this.response];
-
- this.fireEvent('error', args).base.fireEvent('fileError', args);
- } else {
- this.base.fireEvent('fileSuccess', [this, this.response.text || '']);
- }
- },
- onError: function() {
- this.element.addClass('file-failed');
- var error = MooTools.lang.get('FancyUpload', 'fileError').substitute(this);
- this.info.set('html', '<strong>' + error + ':</strong> ' + this.errorMessage);
- },
- onRemove: function() {
- this.element.getElements('a').setStyle('visibility', 'hidden');
- this.element.fade('out').retrieve('tween').chain(Element.destroy.bind(Element, this.element));
- }
-
- });
- // Avoiding MooTools.lang dependency
- (function() {
- var phrases = {
- 'progressOverall': 'Overall Progress ({total})',
- 'currentTitle': 'File Progress',
- 'currentFile': 'Uploading "{name}"',
- 'currentProgress': 'Upload: {bytesLoaded} with {rate}, {timeRemaining} remaining.',
- 'fileName': '{name}',
- 'remove': 'Remove',
- 'removeTitle': 'Click to remove this entry.',
- 'fileError': 'Upload failed',
- 'validationErrors': {
- 'duplicate': 'File <em>{name}</em> is already added, duplicates are not allowed.',
- 'sizeLimitMin': 'File <em>{name}</em> (<em>{size}</em>) is too small, the minimal file size is {fileSizeMin}.',
- 'sizeLimitMax': 'File <em>{name}</em> (<em>{size}</em>) is too big, the maximal file size is <em>{fileSizeMax}</em>.',
- 'fileListMax': 'File <em>{name}</em> could not be added, amount of <em>{fileListMax} files</em> exceeded.',
- 'fileListSizeMax': 'File <em>{name}</em> (<em>{size}</em>) is too big, overall filesize of <em>{fileListSizeMax}</em> exceeded.'
- },
- 'errors': {
- 'httpStatus': 'Server returned HTTP-Status <code>#{code}</code>',
- 'securityError': 'Security error occured ({text})',
- 'ioError': 'Error caused a send or load operation to fail ({text})'
- }
- };
-
- if (MooTools.lang) {
- MooTools.lang.set('en-US', 'FancyUpload', phrases);
- } else {
- MooTools.lang = {
- get: function(from, key) {
- return phrases[key];
- }
- };
- }
- })();
|