jquery-validation
9 years ago
jqueryui
9 years ago
select2
10 years ago
wp-color-picker-alpha
8 years ago
autocomplete.js
8 years ago
autosave.js
8 years ago
button-group.js
8 years ago
clone.js
8 years ago
color.js
9 years ago
date.js
8 years ago
datetime.js
8 years ago
file-input.js
9 years ago
file-upload.js
8 years ago
file.js
8 years ago
image-advanced.js
8 years ago
image-select.js
9 years ago
image-upload.js
8 years ago
input-list.js
8 years ago
map-frontend.js
8 years ago
map.js
8 years ago
media.js
8 years ago
oembed.js
8 years ago
range.js
8 years ago
script.js
8 years ago
select-advanced.js
8 years ago
select-tree.js
9 years ago
select.js
8 years ago
slider.js
8 years ago
thickbox-image.js
8 years ago
time.js
9 years ago
validate.js
8 years ago
video.js
8 years ago
wysiwyg.js
8 years ago
file-upload.js
191 lines
| 1 | window.rwmb = window.rwmb || {}; |
| 2 | |
| 3 | jQuery( function ( $ ) { |
| 4 | 'use strict'; |
| 5 | |
| 6 | var views = rwmb.views = rwmb.views || {}, |
| 7 | MediaField = views.MediaField, |
| 8 | FileUploadField, UploadButton; |
| 9 | |
| 10 | FileUploadField = views.FileUploadField = MediaField.extend( { |
| 11 | createAddButton: function () { |
| 12 | this.addButton = new UploadButton( {controller: this.controller} ); |
| 13 | } |
| 14 | } ); |
| 15 | |
| 16 | UploadButton = views.UploadButton = Backbone.View.extend( { |
| 17 | className: 'rwmb-upload-area', |
| 18 | tagName: 'div', |
| 19 | template: wp.template( 'rwmb-upload-area' ), |
| 20 | render: function () { |
| 21 | this.$el.html( this.template( {} ) ); |
| 22 | return this; |
| 23 | }, |
| 24 | |
| 25 | initialize: function ( options ) { |
| 26 | this.controller = options.controller; |
| 27 | this.el.id = _.uniqueId( 'rwmb-upload-area-' ); |
| 28 | this.render(); |
| 29 | |
| 30 | //Areas |
| 31 | this.dropzone = this.el; |
| 32 | this.browser = this.$( '.rwmb-browse-button' )[0]; |
| 33 | |
| 34 | if ( wp.Uploader.browser.supported ) { |
| 35 | this.initUploader(); |
| 36 | } |
| 37 | |
| 38 | // Auto hide if you reach the max number of media |
| 39 | this.listenTo( this.controller, 'change:full', function () { |
| 40 | this.$el.toggle( ! this.controller.get( 'full' ) ); |
| 41 | } ); |
| 42 | }, |
| 43 | |
| 44 | //Initializes plupload |
| 45 | //Uses code from wp.Uploader |
| 46 | initUploader: function () { |
| 47 | var isIE = navigator.userAgent.indexOf( 'Trident/' ) != - 1 || navigator.userAgent.indexOf( 'MSIE ' ) != - 1, |
| 48 | self = this, |
| 49 | extensions = this.getExtensions().join( ',' ), |
| 50 | max_file_size; |
| 51 | this.plupload = $.extend( true, { |
| 52 | multipart_params: { |
| 53 | post_id : $( '#post_ID' ).val() |
| 54 | }, |
| 55 | multipart: true, |
| 56 | urlstream_upload: true, |
| 57 | drop_element: this.dropzone, |
| 58 | browse_button: this.browser, |
| 59 | filters: {} |
| 60 | }, wp.Uploader.defaults ); |
| 61 | |
| 62 | if( max_file_size = this.controller.get( 'maxFileSize' ) ) { |
| 63 | this.plupload.filters.max_file_size = max_file_size; |
| 64 | } |
| 65 | |
| 66 | if ( extensions ) { |
| 67 | this.plupload.filters.mime_types = [{title: i18nRwmbMedia.select, extensions: extensions}]; |
| 68 | } |
| 69 | |
| 70 | // Make sure flash sends cookies (seems in IE it does without switching to urlstream mode) |
| 71 | if ( ! isIE && 'flash' === plupload.predictRuntime( this.plupload ) && |
| 72 | ( ! this.plupload.required_features || ! this.plupload.required_features.hasOwnProperty( 'send_binary_string' ) ) ) { |
| 73 | this.plupload.required_features = this.plupload.required_features || {}; |
| 74 | this.plupload.required_features.send_binary_string = true; |
| 75 | } |
| 76 | |
| 77 | // Initialize the plupload instance. |
| 78 | this.uploader = new plupload.Uploader( this.plupload ); |
| 79 | this.uploader.init(); |
| 80 | |
| 81 | this.uploader.bind( 'FilesAdded', function ( up, files ) { |
| 82 | _.each( files, function ( file ) { |
| 83 | var attributes, image; |
| 84 | |
| 85 | // Ignore failed uploads. |
| 86 | if ( plupload.FAILED === file.status ) { |
| 87 | return; |
| 88 | } |
| 89 | |
| 90 | // Generate attributes for a new `Attachment` model. |
| 91 | attributes = _.extend( { |
| 92 | file: file, |
| 93 | uploading: true, |
| 94 | date: new Date(), |
| 95 | filename: file.name, |
| 96 | menuOrder: 0, |
| 97 | uploadedTo: wp.media.model.settings.post.id, |
| 98 | icon: i18nRwmbMedia.loadingUrl |
| 99 | }, _.pick( file, 'loaded', 'size', 'percent' ) ); |
| 100 | |
| 101 | // Handle early mime type scanning for images. |
| 102 | image = /(?:jpe?g|png|gif)$/i.exec( file.name ); |
| 103 | |
| 104 | // For images set the model's type and subtype attributes. |
| 105 | if ( image ) { |
| 106 | attributes.type = 'image'; |
| 107 | |
| 108 | // `jpeg`, `png` and `gif` are valid subtypes. |
| 109 | // `jpg` is not, so map it to `jpeg`. |
| 110 | attributes.subtype = ( 'jpg' === image[0] ) ? 'jpeg' : image[0]; |
| 111 | } |
| 112 | |
| 113 | // Create a model for the attachment, and add it to the Upload queue collection |
| 114 | // so listeners to the upload queue can track and display upload progress. |
| 115 | file.attachment = wp.media.model.Attachment.create( attributes ); |
| 116 | wp.Uploader.queue.add( file.attachment ); |
| 117 | self.controller.get( 'items' ).add( [file.attachment] ); |
| 118 | } ); |
| 119 | |
| 120 | up.refresh(); |
| 121 | up.start(); |
| 122 | } ); |
| 123 | |
| 124 | this.uploader.bind( 'UploadProgress', function ( up, file ) { |
| 125 | file.attachment.set( _.pick( file, 'loaded', 'percent' ) ); |
| 126 | } ); |
| 127 | |
| 128 | this.uploader.bind( 'FileUploaded', function ( up, file, response ) { |
| 129 | var complete; |
| 130 | |
| 131 | try { |
| 132 | response = JSON.parse( response.response ); |
| 133 | } catch ( e ) { |
| 134 | return false; |
| 135 | } |
| 136 | |
| 137 | if ( ! _.isObject( response ) || _.isUndefined( response.success ) || ! response.success ) { |
| 138 | return false; |
| 139 | } |
| 140 | |
| 141 | _.each( ['file', 'loaded', 'size', 'percent'], function ( key ) { |
| 142 | file.attachment.unset( key ); |
| 143 | } ); |
| 144 | |
| 145 | file.attachment.set( _.extend( response.data, {uploading: false} ) ); |
| 146 | wp.media.model.Attachment.get( response.data.id, file.attachment ); |
| 147 | |
| 148 | complete = wp.Uploader.queue.all( function ( attachment ) { |
| 149 | return ! attachment.get( 'uploading' ); |
| 150 | } ); |
| 151 | |
| 152 | if ( complete ) { |
| 153 | wp.Uploader.queue.reset(); |
| 154 | } |
| 155 | } ); |
| 156 | |
| 157 | this.uploader.bind( 'Error', function ( up, error ) { |
| 158 | if ( error.file.attachment ) { |
| 159 | error.file.attachment.destroy(); |
| 160 | } |
| 161 | } ); |
| 162 | }, |
| 163 | |
| 164 | getExtensions: function () { |
| 165 | var mimeTypes = this.controller.get( 'mimeType' ).split( ',' ), |
| 166 | exts = []; |
| 167 | |
| 168 | _.each( mimeTypes, function ( current, index ) { |
| 169 | if ( i18nRwmbMedia.extensions[current] ) { |
| 170 | exts = exts.concat( i18nRwmbMedia.extensions[current] ); |
| 171 | } |
| 172 | } ); |
| 173 | return exts; |
| 174 | } |
| 175 | } ); |
| 176 | |
| 177 | /** |
| 178 | * Initialize fields |
| 179 | * @return void |
| 180 | */ |
| 181 | function init() { |
| 182 | var view = new FileUploadField( { input: this } ); |
| 183 | //Remove old then add new |
| 184 | $( this ).siblings( 'div.rwmb-media-view' ).remove(); |
| 185 | $( this ).after( view.el ); |
| 186 | } |
| 187 | |
| 188 | $( '.rwmb-file_upload' ).each( init ); |
| 189 | $( document ).on( 'clone', '.rwmb-file_upload', init ) |
| 190 | } ); |
| 191 |