mirror of
https://github.com/gosticks/wordpress-develop.git
synced 2026-06-30 23:30:05 +00:00
Remove unused media JS files.
See #28510. git-svn-id: https://develop.svn.wordpress.org/trunk@31405 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Scott Taylor
@@ -695,6 +695,15 @@ $_old_files = array(
|
||||
'wp-includes/js/jquery/ui/jquery.ui.tooltip.min.js',
|
||||
'wp-includes/js/jquery/ui/jquery.ui.widget.min.js',
|
||||
'wp-includes/js/tinymce/skins/wordpress/images/dashicon-no-alt.png',
|
||||
// 4.2
|
||||
'wp-includes/js/media-audiovideo.js',
|
||||
'wp-includes/js/media-audiovideo.min.js',
|
||||
'wp-includes/js/media-grid.js',
|
||||
'wp-includes/js/media-grid.min.js',
|
||||
'wp-includes/js/media-models.js',
|
||||
'wp-includes/js/media-models.min.js',
|
||||
'wp-includes/js/media-views.js',
|
||||
'wp-includes/js/media-views.min.js',
|
||||
);
|
||||
|
||||
/**
|
||||
|
||||
@@ -1,842 +0,0 @@
|
||||
/* global _wpMediaViewsL10n, _wpmejsSettings, MediaElementPlayer */
|
||||
|
||||
(function($, _, Backbone) {
|
||||
var media = wp.media,
|
||||
baseSettings = {},
|
||||
l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n;
|
||||
|
||||
if ( ! _.isUndefined( window._wpmejsSettings ) ) {
|
||||
baseSettings = _wpmejsSettings;
|
||||
}
|
||||
|
||||
/**
|
||||
* @mixin
|
||||
*/
|
||||
wp.media.mixin = {
|
||||
mejsSettings: baseSettings,
|
||||
|
||||
removeAllPlayers: function() {
|
||||
var p;
|
||||
|
||||
if ( window.mejs && window.mejs.players ) {
|
||||
for ( p in window.mejs.players ) {
|
||||
window.mejs.players[p].pause();
|
||||
this.removePlayer( window.mejs.players[p] );
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Override the MediaElement method for removing a player.
|
||||
* MediaElement tries to pull the audio/video tag out of
|
||||
* its container and re-add it to the DOM.
|
||||
*/
|
||||
removePlayer: function(t) {
|
||||
var featureIndex, feature;
|
||||
|
||||
if ( ! t.options ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// invoke features cleanup
|
||||
for ( featureIndex in t.options.features ) {
|
||||
feature = t.options.features[featureIndex];
|
||||
if ( t['clean' + feature] ) {
|
||||
try {
|
||||
t['clean' + feature](t);
|
||||
} catch (e) {}
|
||||
}
|
||||
}
|
||||
|
||||
if ( ! t.isDynamic ) {
|
||||
t.$node.remove();
|
||||
}
|
||||
|
||||
if ( 'native' !== t.media.pluginType ) {
|
||||
t.$media.remove();
|
||||
}
|
||||
|
||||
delete window.mejs.players[t.id];
|
||||
|
||||
t.container.remove();
|
||||
t.globalUnbind();
|
||||
delete t.node.player;
|
||||
},
|
||||
|
||||
/**
|
||||
* Allows any class that has set 'player' to a MediaElementPlayer
|
||||
* instance to remove the player when listening to events.
|
||||
*
|
||||
* Examples: modal closes, shortcode properties are removed, etc.
|
||||
*/
|
||||
unsetPlayers : function() {
|
||||
if ( this.players && this.players.length ) {
|
||||
_.each( this.players, function (player) {
|
||||
player.pause();
|
||||
wp.media.mixin.removePlayer( player );
|
||||
} );
|
||||
this.players = [];
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Autowire "collection"-type shortcodes
|
||||
*/
|
||||
wp.media.playlist = new wp.media.collection({
|
||||
tag: 'playlist',
|
||||
editTitle : l10n.editPlaylistTitle,
|
||||
defaults : {
|
||||
id: wp.media.view.settings.post.id,
|
||||
style: 'light',
|
||||
tracklist: true,
|
||||
tracknumbers: true,
|
||||
images: true,
|
||||
artists: true,
|
||||
type: 'audio'
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Shortcode modeling for audio
|
||||
* `edit()` prepares the shortcode for the media modal
|
||||
* `shortcode()` builds the new shortcode after update
|
||||
*
|
||||
* @namespace
|
||||
*/
|
||||
wp.media.audio = {
|
||||
coerce : wp.media.coerce,
|
||||
|
||||
defaults : {
|
||||
id : wp.media.view.settings.post.id,
|
||||
src : '',
|
||||
loop : false,
|
||||
autoplay : false,
|
||||
preload : 'none',
|
||||
width : 400
|
||||
},
|
||||
|
||||
edit : function( data ) {
|
||||
var frame, shortcode = wp.shortcode.next( 'audio', data ).shortcode;
|
||||
frame = wp.media({
|
||||
frame: 'audio',
|
||||
state: 'audio-details',
|
||||
metadata: _.defaults( shortcode.attrs.named, this.defaults )
|
||||
});
|
||||
|
||||
return frame;
|
||||
},
|
||||
|
||||
shortcode : function( model ) {
|
||||
var self = this, content;
|
||||
|
||||
_.each( this.defaults, function( value, key ) {
|
||||
model[ key ] = self.coerce( model, key );
|
||||
|
||||
if ( value === model[ key ] ) {
|
||||
delete model[ key ];
|
||||
}
|
||||
});
|
||||
|
||||
content = model.content;
|
||||
delete model.content;
|
||||
|
||||
return new wp.shortcode({
|
||||
tag: 'audio',
|
||||
attrs: model,
|
||||
content: content
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Shortcode modeling for video
|
||||
* `edit()` prepares the shortcode for the media modal
|
||||
* `shortcode()` builds the new shortcode after update
|
||||
*
|
||||
* @namespace
|
||||
*/
|
||||
wp.media.video = {
|
||||
coerce : wp.media.coerce,
|
||||
|
||||
defaults : {
|
||||
id : wp.media.view.settings.post.id,
|
||||
src : '',
|
||||
poster : '',
|
||||
loop : false,
|
||||
autoplay : false,
|
||||
preload : 'metadata',
|
||||
content : '',
|
||||
width : 640,
|
||||
height : 360
|
||||
},
|
||||
|
||||
edit : function( data ) {
|
||||
var frame,
|
||||
shortcode = wp.shortcode.next( 'video', data ).shortcode,
|
||||
attrs;
|
||||
|
||||
attrs = shortcode.attrs.named;
|
||||
attrs.content = shortcode.content;
|
||||
|
||||
frame = wp.media({
|
||||
frame: 'video',
|
||||
state: 'video-details',
|
||||
metadata: _.defaults( attrs, this.defaults )
|
||||
});
|
||||
|
||||
return frame;
|
||||
},
|
||||
|
||||
shortcode : function( model ) {
|
||||
var self = this, content;
|
||||
|
||||
_.each( this.defaults, function( value, key ) {
|
||||
model[ key ] = self.coerce( model, key );
|
||||
|
||||
if ( value === model[ key ] ) {
|
||||
delete model[ key ];
|
||||
}
|
||||
});
|
||||
|
||||
content = model.content;
|
||||
delete model.content;
|
||||
|
||||
return new wp.shortcode({
|
||||
tag: 'video',
|
||||
attrs: model,
|
||||
content: content
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Shared model class for audio and video. Updates the model after
|
||||
* "Add Audio|Video Source" and "Replace Audio|Video" states return
|
||||
*
|
||||
* @constructor
|
||||
* @augments Backbone.Model
|
||||
*/
|
||||
media.model.PostMedia = Backbone.Model.extend({
|
||||
initialize: function() {
|
||||
this.attachment = false;
|
||||
},
|
||||
|
||||
setSource: function( attachment ) {
|
||||
this.attachment = attachment;
|
||||
this.extension = attachment.get( 'filename' ).split('.').pop();
|
||||
|
||||
if ( this.get( 'src' ) && this.extension === this.get( 'src' ).split('.').pop() ) {
|
||||
this.unset( 'src' );
|
||||
}
|
||||
|
||||
if ( _.contains( wp.media.view.settings.embedExts, this.extension ) ) {
|
||||
this.set( this.extension, this.attachment.get( 'url' ) );
|
||||
} else {
|
||||
this.unset( this.extension );
|
||||
}
|
||||
},
|
||||
|
||||
changeAttachment: function( attachment ) {
|
||||
var self = this;
|
||||
|
||||
this.setSource( attachment );
|
||||
|
||||
this.unset( 'src' );
|
||||
_.each( _.without( wp.media.view.settings.embedExts, this.extension ), function( ext ) {
|
||||
self.unset( ext );
|
||||
} );
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* The controller for the Audio Details state
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.controller.State
|
||||
* @augments Backbone.Model
|
||||
*/
|
||||
media.controller.AudioDetails = media.controller.State.extend({
|
||||
defaults: {
|
||||
id: 'audio-details',
|
||||
toolbar: 'audio-details',
|
||||
title: l10n.audioDetailsTitle,
|
||||
content: 'audio-details',
|
||||
menu: 'audio-details',
|
||||
router: false,
|
||||
priority: 60
|
||||
},
|
||||
|
||||
initialize: function( options ) {
|
||||
this.media = options.media;
|
||||
media.controller.State.prototype.initialize.apply( this, arguments );
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* The controller for the Video Details state
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.controller.State
|
||||
* @augments Backbone.Model
|
||||
*/
|
||||
media.controller.VideoDetails = media.controller.State.extend({
|
||||
defaults: {
|
||||
id: 'video-details',
|
||||
toolbar: 'video-details',
|
||||
title: l10n.videoDetailsTitle,
|
||||
content: 'video-details',
|
||||
menu: 'video-details',
|
||||
router: false,
|
||||
priority: 60
|
||||
},
|
||||
|
||||
initialize: function( options ) {
|
||||
this.media = options.media;
|
||||
media.controller.State.prototype.initialize.apply( this, arguments );
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.MediaFrame.MediaDetails
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.MediaFrame.Select
|
||||
* @augments wp.media.view.MediaFrame
|
||||
* @augments wp.media.view.Frame
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
* @mixes wp.media.controller.StateMachine
|
||||
*/
|
||||
media.view.MediaFrame.MediaDetails = media.view.MediaFrame.Select.extend({
|
||||
defaults: {
|
||||
id: 'media',
|
||||
url: '',
|
||||
menu: 'media-details',
|
||||
content: 'media-details',
|
||||
toolbar: 'media-details',
|
||||
type: 'link',
|
||||
priority: 120
|
||||
},
|
||||
|
||||
initialize: function( options ) {
|
||||
this.DetailsView = options.DetailsView;
|
||||
this.cancelText = options.cancelText;
|
||||
this.addText = options.addText;
|
||||
|
||||
this.media = new media.model.PostMedia( options.metadata );
|
||||
this.options.selection = new media.model.Selection( this.media.attachment, { multiple: false } );
|
||||
media.view.MediaFrame.Select.prototype.initialize.apply( this, arguments );
|
||||
},
|
||||
|
||||
bindHandlers: function() {
|
||||
var menu = this.defaults.menu;
|
||||
|
||||
media.view.MediaFrame.Select.prototype.bindHandlers.apply( this, arguments );
|
||||
|
||||
this.on( 'menu:create:' + menu, this.createMenu, this );
|
||||
this.on( 'content:render:' + menu, this.renderDetailsContent, this );
|
||||
this.on( 'menu:render:' + menu, this.renderMenu, this );
|
||||
this.on( 'toolbar:render:' + menu, this.renderDetailsToolbar, this );
|
||||
},
|
||||
|
||||
renderDetailsContent: function() {
|
||||
var view = new this.DetailsView({
|
||||
controller: this,
|
||||
model: this.state().media,
|
||||
attachment: this.state().media.attachment
|
||||
}).render();
|
||||
|
||||
this.content.set( view );
|
||||
},
|
||||
|
||||
renderMenu: function( view ) {
|
||||
var lastState = this.lastState(),
|
||||
previous = lastState && lastState.id,
|
||||
frame = this;
|
||||
|
||||
view.set({
|
||||
cancel: {
|
||||
text: this.cancelText,
|
||||
priority: 20,
|
||||
click: function() {
|
||||
if ( previous ) {
|
||||
frame.setState( previous );
|
||||
} else {
|
||||
frame.close();
|
||||
}
|
||||
}
|
||||
},
|
||||
separateCancel: new media.View({
|
||||
className: 'separator',
|
||||
priority: 40
|
||||
})
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
setPrimaryButton: function(text, handler) {
|
||||
this.toolbar.set( new media.view.Toolbar({
|
||||
controller: this,
|
||||
items: {
|
||||
button: {
|
||||
style: 'primary',
|
||||
text: text,
|
||||
priority: 80,
|
||||
click: function() {
|
||||
var controller = this.controller;
|
||||
handler.call( this, controller, controller.state() );
|
||||
// Restore and reset the default state.
|
||||
controller.setState( controller.options.state );
|
||||
controller.reset();
|
||||
}
|
||||
}
|
||||
}
|
||||
}) );
|
||||
},
|
||||
|
||||
renderDetailsToolbar: function() {
|
||||
this.setPrimaryButton( l10n.update, function( controller, state ) {
|
||||
controller.close();
|
||||
state.trigger( 'update', controller.media.toJSON() );
|
||||
} );
|
||||
},
|
||||
|
||||
renderReplaceToolbar: function() {
|
||||
this.setPrimaryButton( l10n.replace, function( controller, state ) {
|
||||
var attachment = state.get( 'selection' ).single();
|
||||
controller.media.changeAttachment( attachment );
|
||||
state.trigger( 'replace', controller.media.toJSON() );
|
||||
} );
|
||||
},
|
||||
|
||||
renderAddSourceToolbar: function() {
|
||||
this.setPrimaryButton( this.addText, function( controller, state ) {
|
||||
var attachment = state.get( 'selection' ).single();
|
||||
controller.media.setSource( attachment );
|
||||
state.trigger( 'add-source', controller.media.toJSON() );
|
||||
} );
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.MediaFrame.AudioDetails
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.MediaFrame.MediaDetails
|
||||
* @augments wp.media.view.MediaFrame.Select
|
||||
* @augments wp.media.view.MediaFrame
|
||||
* @augments wp.media.view.Frame
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
* @mixes wp.media.controller.StateMachine
|
||||
*/
|
||||
media.view.MediaFrame.AudioDetails = media.view.MediaFrame.MediaDetails.extend({
|
||||
defaults: {
|
||||
id: 'audio',
|
||||
url: '',
|
||||
menu: 'audio-details',
|
||||
content: 'audio-details',
|
||||
toolbar: 'audio-details',
|
||||
type: 'link',
|
||||
title: l10n.audioDetailsTitle,
|
||||
priority: 120
|
||||
},
|
||||
|
||||
initialize: function( options ) {
|
||||
options.DetailsView = media.view.AudioDetails;
|
||||
options.cancelText = l10n.audioDetailsCancel;
|
||||
options.addText = l10n.audioAddSourceTitle;
|
||||
|
||||
media.view.MediaFrame.MediaDetails.prototype.initialize.call( this, options );
|
||||
},
|
||||
|
||||
bindHandlers: function() {
|
||||
media.view.MediaFrame.MediaDetails.prototype.bindHandlers.apply( this, arguments );
|
||||
|
||||
this.on( 'toolbar:render:replace-audio', this.renderReplaceToolbar, this );
|
||||
this.on( 'toolbar:render:add-audio-source', this.renderAddSourceToolbar, this );
|
||||
},
|
||||
|
||||
createStates: function() {
|
||||
this.states.add([
|
||||
new media.controller.AudioDetails( {
|
||||
media: this.media
|
||||
} ),
|
||||
|
||||
new media.controller.MediaLibrary( {
|
||||
type: 'audio',
|
||||
id: 'replace-audio',
|
||||
title: l10n.audioReplaceTitle,
|
||||
toolbar: 'replace-audio',
|
||||
media: this.media,
|
||||
menu: 'audio-details'
|
||||
} ),
|
||||
|
||||
new media.controller.MediaLibrary( {
|
||||
type: 'audio',
|
||||
id: 'add-audio-source',
|
||||
title: l10n.audioAddSourceTitle,
|
||||
toolbar: 'add-audio-source',
|
||||
media: this.media,
|
||||
menu: false
|
||||
} )
|
||||
]);
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.MediaFrame.VideoDetails
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.MediaFrame.MediaDetails
|
||||
* @augments wp.media.view.MediaFrame.Select
|
||||
* @augments wp.media.view.MediaFrame
|
||||
* @augments wp.media.view.Frame
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
* @mixes wp.media.controller.StateMachine
|
||||
*/
|
||||
media.view.MediaFrame.VideoDetails = media.view.MediaFrame.MediaDetails.extend({
|
||||
defaults: {
|
||||
id: 'video',
|
||||
url: '',
|
||||
menu: 'video-details',
|
||||
content: 'video-details',
|
||||
toolbar: 'video-details',
|
||||
type: 'link',
|
||||
title: l10n.videoDetailsTitle,
|
||||
priority: 120
|
||||
},
|
||||
|
||||
initialize: function( options ) {
|
||||
options.DetailsView = media.view.VideoDetails;
|
||||
options.cancelText = l10n.videoDetailsCancel;
|
||||
options.addText = l10n.videoAddSourceTitle;
|
||||
|
||||
media.view.MediaFrame.MediaDetails.prototype.initialize.call( this, options );
|
||||
},
|
||||
|
||||
bindHandlers: function() {
|
||||
media.view.MediaFrame.MediaDetails.prototype.bindHandlers.apply( this, arguments );
|
||||
|
||||
this.on( 'toolbar:render:replace-video', this.renderReplaceToolbar, this );
|
||||
this.on( 'toolbar:render:add-video-source', this.renderAddSourceToolbar, this );
|
||||
this.on( 'toolbar:render:select-poster-image', this.renderSelectPosterImageToolbar, this );
|
||||
this.on( 'toolbar:render:add-track', this.renderAddTrackToolbar, this );
|
||||
},
|
||||
|
||||
createStates: function() {
|
||||
this.states.add([
|
||||
new media.controller.VideoDetails({
|
||||
media: this.media
|
||||
}),
|
||||
|
||||
new media.controller.MediaLibrary( {
|
||||
type: 'video',
|
||||
id: 'replace-video',
|
||||
title: l10n.videoReplaceTitle,
|
||||
toolbar: 'replace-video',
|
||||
media: this.media,
|
||||
menu: 'video-details'
|
||||
} ),
|
||||
|
||||
new media.controller.MediaLibrary( {
|
||||
type: 'video',
|
||||
id: 'add-video-source',
|
||||
title: l10n.videoAddSourceTitle,
|
||||
toolbar: 'add-video-source',
|
||||
media: this.media,
|
||||
menu: false
|
||||
} ),
|
||||
|
||||
new media.controller.MediaLibrary( {
|
||||
type: 'image',
|
||||
id: 'select-poster-image',
|
||||
title: l10n.videoSelectPosterImageTitle,
|
||||
toolbar: 'select-poster-image',
|
||||
media: this.media,
|
||||
menu: 'video-details'
|
||||
} ),
|
||||
|
||||
new media.controller.MediaLibrary( {
|
||||
type: 'text',
|
||||
id: 'add-track',
|
||||
title: l10n.videoAddTrackTitle,
|
||||
toolbar: 'add-track',
|
||||
media: this.media,
|
||||
menu: 'video-details'
|
||||
} )
|
||||
]);
|
||||
},
|
||||
|
||||
renderSelectPosterImageToolbar: function() {
|
||||
this.setPrimaryButton( l10n.videoSelectPosterImageTitle, function( controller, state ) {
|
||||
var urls = [], attachment = state.get( 'selection' ).single();
|
||||
|
||||
controller.media.set( 'poster', attachment.get( 'url' ) );
|
||||
state.trigger( 'set-poster-image', controller.media.toJSON() );
|
||||
|
||||
_.each( wp.media.view.settings.embedExts, function (ext) {
|
||||
if ( controller.media.get( ext ) ) {
|
||||
urls.push( controller.media.get( ext ) );
|
||||
}
|
||||
} );
|
||||
|
||||
wp.ajax.send( 'set-attachment-thumbnail', {
|
||||
data : {
|
||||
urls: urls,
|
||||
thumbnail_id: attachment.get( 'id' )
|
||||
}
|
||||
} );
|
||||
} );
|
||||
},
|
||||
|
||||
renderAddTrackToolbar: function() {
|
||||
this.setPrimaryButton( l10n.videoAddTrackTitle, function( controller, state ) {
|
||||
var attachment = state.get( 'selection' ).single(),
|
||||
content = controller.media.get( 'content' );
|
||||
|
||||
if ( -1 === content.indexOf( attachment.get( 'url' ) ) ) {
|
||||
content += [
|
||||
'<track srclang="en" label="English"kind="subtitles" src="',
|
||||
attachment.get( 'url' ),
|
||||
'" />'
|
||||
].join('');
|
||||
|
||||
controller.media.set( 'content', content );
|
||||
}
|
||||
state.trigger( 'add-track', controller.media.toJSON() );
|
||||
} );
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.MediaDetails
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.Settings.AttachmentDisplay
|
||||
* @augments wp.media.view.Settings
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
*/
|
||||
media.view.MediaDetails = media.view.Settings.AttachmentDisplay.extend({
|
||||
initialize: function() {
|
||||
_.bindAll(this, 'success');
|
||||
this.players = [];
|
||||
this.listenTo( this.controller, 'close', media.mixin.unsetPlayers );
|
||||
this.on( 'ready', this.setPlayer );
|
||||
this.on( 'media:setting:remove', media.mixin.unsetPlayers, this );
|
||||
this.on( 'media:setting:remove', this.render );
|
||||
this.on( 'media:setting:remove', this.setPlayer );
|
||||
this.events = _.extend( this.events, {
|
||||
'click .remove-setting' : 'removeSetting',
|
||||
'change .content-track' : 'setTracks',
|
||||
'click .remove-track' : 'setTracks',
|
||||
'click .add-media-source' : 'addSource'
|
||||
} );
|
||||
|
||||
media.view.Settings.AttachmentDisplay.prototype.initialize.apply( this, arguments );
|
||||
},
|
||||
|
||||
prepare: function() {
|
||||
return _.defaults({
|
||||
model: this.model.toJSON()
|
||||
}, this.options );
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove a setting's UI when the model unsets it
|
||||
*
|
||||
* @fires wp.media.view.MediaDetails#media:setting:remove
|
||||
*
|
||||
* @param {Event} e
|
||||
*/
|
||||
removeSetting : function(e) {
|
||||
var wrap = $( e.currentTarget ).parent(), setting;
|
||||
setting = wrap.find( 'input' ).data( 'setting' );
|
||||
|
||||
if ( setting ) {
|
||||
this.model.unset( setting );
|
||||
this.trigger( 'media:setting:remove', this );
|
||||
}
|
||||
|
||||
wrap.remove();
|
||||
},
|
||||
|
||||
/**
|
||||
*
|
||||
* @fires wp.media.view.MediaDetails#media:setting:remove
|
||||
*/
|
||||
setTracks : function() {
|
||||
var tracks = '';
|
||||
|
||||
_.each( this.$('.content-track'), function(track) {
|
||||
tracks += $( track ).val();
|
||||
} );
|
||||
|
||||
this.model.set( 'content', tracks );
|
||||
this.trigger( 'media:setting:remove', this );
|
||||
},
|
||||
|
||||
addSource : function( e ) {
|
||||
this.controller.lastMime = $( e.currentTarget ).data( 'mime' );
|
||||
this.controller.setState( 'add-' + this.controller.defaults.id + '-source' );
|
||||
},
|
||||
|
||||
loadPlayer: function () {
|
||||
this.players.push( new MediaElementPlayer( this.media, this.settings ) );
|
||||
this.scriptXhr = false;
|
||||
},
|
||||
|
||||
/**
|
||||
* @global MediaElementPlayer
|
||||
*/
|
||||
setPlayer : function() {
|
||||
if ( this.players.length || ! this.media ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( this.media.src.indexOf( 'vimeo' ) && ! ( 'Froogaloop' in window ) && ! this.scriptXhr ) {
|
||||
this.scriptXhr = $.getScript( baseSettings.pluginPath + 'froogaloop.min.js', _.bind( this.loadPlayer, this ) );
|
||||
} else if ( ! this.scriptXhr ) {
|
||||
this.loadPlayer();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
*/
|
||||
setMedia : function() {
|
||||
return this;
|
||||
},
|
||||
|
||||
success : function(mejs) {
|
||||
var autoplay = mejs.attributes.autoplay && 'false' !== mejs.attributes.autoplay;
|
||||
|
||||
if ( 'flash' === mejs.pluginType && autoplay ) {
|
||||
mejs.addEventListener( 'canplay', function() {
|
||||
mejs.play();
|
||||
}, false );
|
||||
}
|
||||
|
||||
this.mejs = mejs;
|
||||
},
|
||||
|
||||
/**
|
||||
* @returns {media.view.MediaDetails} Returns itself to allow chaining
|
||||
*/
|
||||
render: function() {
|
||||
var self = this;
|
||||
|
||||
media.view.Settings.AttachmentDisplay.prototype.render.apply( this, arguments );
|
||||
setTimeout( function() { self.resetFocus(); }, 10 );
|
||||
|
||||
this.settings = _.defaults( {
|
||||
success : this.success
|
||||
}, baseSettings );
|
||||
|
||||
return this.setMedia();
|
||||
},
|
||||
|
||||
resetFocus: function() {
|
||||
this.$( '.embed-media-settings' ).scrollTop( 0 );
|
||||
}
|
||||
}, {
|
||||
instances : 0,
|
||||
|
||||
/**
|
||||
* When multiple players in the DOM contain the same src, things get weird.
|
||||
*
|
||||
* @param {HTMLElement} elem
|
||||
* @returns {HTMLElement}
|
||||
*/
|
||||
prepareSrc : function( elem ) {
|
||||
var i = media.view.MediaDetails.instances++;
|
||||
_.each( $( elem ).find( 'source' ), function( source ) {
|
||||
source.src = [
|
||||
source.src,
|
||||
source.src.indexOf('?') > -1 ? '&' : '?',
|
||||
'_=',
|
||||
i
|
||||
].join('');
|
||||
} );
|
||||
|
||||
return elem;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.AudioDetails
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.MediaDetails
|
||||
* @augments wp.media.view.Settings.AttachmentDisplay
|
||||
* @augments wp.media.view.Settings
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
*/
|
||||
media.view.AudioDetails = media.view.MediaDetails.extend({
|
||||
className: 'audio-details',
|
||||
template: media.template('audio-details'),
|
||||
|
||||
setMedia: function() {
|
||||
var audio = this.$('.wp-audio-shortcode');
|
||||
|
||||
if ( audio.find( 'source' ).length ) {
|
||||
if ( audio.is(':hidden') ) {
|
||||
audio.show();
|
||||
}
|
||||
this.media = media.view.MediaDetails.prepareSrc( audio.get(0) );
|
||||
} else {
|
||||
audio.hide();
|
||||
this.media = false;
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.VideoDetails
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.MediaDetails
|
||||
* @augments wp.media.view.Settings.AttachmentDisplay
|
||||
* @augments wp.media.view.Settings
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
*/
|
||||
media.view.VideoDetails = media.view.MediaDetails.extend({
|
||||
className: 'video-details',
|
||||
template: media.template('video-details'),
|
||||
|
||||
setMedia: function() {
|
||||
var video = this.$('.wp-video-shortcode');
|
||||
|
||||
if ( video.find( 'source' ).length ) {
|
||||
if ( video.is(':hidden') ) {
|
||||
video.show();
|
||||
}
|
||||
|
||||
if ( ! video.hasClass('youtube-video') && ! video.hasClass('vimeo-video') ) {
|
||||
this.media = media.view.MediaDetails.prepareSrc( video.get(0) );
|
||||
} else {
|
||||
this.media = video.get(0);
|
||||
}
|
||||
} else {
|
||||
video.hide();
|
||||
this.media = false;
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
||||
}(jQuery, _, Backbone));
|
||||
@@ -1,732 +0,0 @@
|
||||
/* global _wpMediaViewsL10n, MediaElementPlayer, _wpMediaGridSettings */
|
||||
(function($, _, Backbone, wp) {
|
||||
// Local reference to the WordPress media namespace.
|
||||
var media = wp.media, l10n;
|
||||
|
||||
// Link localized strings and settings.
|
||||
if ( media.view.l10n ) {
|
||||
l10n = media.view.l10n;
|
||||
} else {
|
||||
l10n = media.view.l10n = typeof _wpMediaViewsL10n === 'undefined' ? {} : _wpMediaViewsL10n;
|
||||
delete l10n.settings;
|
||||
}
|
||||
|
||||
/**
|
||||
* wp.media.controller.EditAttachmentMetadata
|
||||
*
|
||||
* A state for editing an attachment's metadata.
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.controller.State
|
||||
* @augments Backbone.Model
|
||||
*/
|
||||
media.controller.EditAttachmentMetadata = media.controller.State.extend({
|
||||
defaults: {
|
||||
id: 'edit-attachment',
|
||||
// Title string passed to the frame's title region view.
|
||||
title: l10n.attachmentDetails,
|
||||
// Region mode defaults.
|
||||
content: 'edit-metadata',
|
||||
menu: false,
|
||||
toolbar: false,
|
||||
router: false
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* wp.media.view.MediaFrame.Manage
|
||||
*
|
||||
* A generic management frame workflow.
|
||||
*
|
||||
* Used in the media grid view.
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.MediaFrame
|
||||
* @augments wp.media.view.Frame
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
* @mixes wp.media.controller.StateMachine
|
||||
*/
|
||||
media.view.MediaFrame.Manage = media.view.MediaFrame.extend({
|
||||
/**
|
||||
* @global wp.Uploader
|
||||
*/
|
||||
initialize: function() {
|
||||
var self = this;
|
||||
_.defaults( this.options, {
|
||||
title: '',
|
||||
modal: false,
|
||||
selection: [],
|
||||
library: {}, // Options hash for the query to the media library.
|
||||
multiple: 'add',
|
||||
state: 'library',
|
||||
uploader: true,
|
||||
mode: [ 'grid', 'edit' ]
|
||||
});
|
||||
|
||||
this.$body = $( document.body );
|
||||
this.$window = $( window );
|
||||
this.$adminBar = $( '#wpadminbar' );
|
||||
this.$window.on( 'scroll resize', _.debounce( _.bind( this.fixPosition, this ), 15 ) );
|
||||
$( document ).on( 'click', '.add-new-h2', _.bind( this.addNewClickHandler, this ) );
|
||||
|
||||
// Ensure core and media grid view UI is enabled.
|
||||
this.$el.addClass('wp-core-ui');
|
||||
|
||||
// Force the uploader off if the upload limit has been exceeded or
|
||||
// if the browser isn't supported.
|
||||
if ( wp.Uploader.limitExceeded || ! wp.Uploader.browser.supported ) {
|
||||
this.options.uploader = false;
|
||||
}
|
||||
|
||||
// Initialize a window-wide uploader.
|
||||
if ( this.options.uploader ) {
|
||||
this.uploader = new media.view.UploaderWindow({
|
||||
controller: this,
|
||||
uploader: {
|
||||
dropzone: document.body,
|
||||
container: document.body
|
||||
}
|
||||
}).render();
|
||||
this.uploader.ready();
|
||||
$('body').append( this.uploader.el );
|
||||
|
||||
this.options.uploader = false;
|
||||
}
|
||||
|
||||
this.gridRouter = new media.view.MediaFrame.Manage.Router();
|
||||
|
||||
// Call 'initialize' directly on the parent class.
|
||||
media.view.MediaFrame.prototype.initialize.apply( this, arguments );
|
||||
|
||||
// Append the frame view directly the supplied container.
|
||||
this.$el.appendTo( this.options.container );
|
||||
|
||||
this.createStates();
|
||||
this.bindRegionModeHandlers();
|
||||
this.render();
|
||||
|
||||
// Update the URL when entering search string (at most once per second)
|
||||
$( '#media-search-input' ).on( 'input', _.debounce( function(e) {
|
||||
var val = $( e.currentTarget ).val(), url = '';
|
||||
if ( val ) {
|
||||
url += '?search=' + val;
|
||||
}
|
||||
self.gridRouter.navigate( self.gridRouter.baseUrl( url ) );
|
||||
}, 1000 ) );
|
||||
},
|
||||
|
||||
/**
|
||||
* Create the default states for the frame.
|
||||
*/
|
||||
createStates: function() {
|
||||
var options = this.options;
|
||||
|
||||
if ( this.options.states ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Add the default states.
|
||||
this.states.add([
|
||||
new media.controller.Library({
|
||||
library: media.query( options.library ),
|
||||
multiple: options.multiple,
|
||||
title: options.title,
|
||||
content: 'browse',
|
||||
toolbar: 'select',
|
||||
contentUserSetting: false,
|
||||
filterable: 'all',
|
||||
autoSelect: false
|
||||
})
|
||||
]);
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind region mode activation events to proper handlers.
|
||||
*/
|
||||
bindRegionModeHandlers: function() {
|
||||
this.on( 'content:create:browse', this.browseContent, this );
|
||||
|
||||
// Handle a frame-level event for editing an attachment.
|
||||
this.on( 'edit:attachment', this.openEditAttachmentModal, this );
|
||||
|
||||
this.on( 'select:activate', this.bindKeydown, this );
|
||||
this.on( 'select:deactivate', this.unbindKeydown, this );
|
||||
},
|
||||
|
||||
handleKeydown: function( e ) {
|
||||
if ( 27 === e.which ) {
|
||||
e.preventDefault();
|
||||
this.deactivateMode( 'select' ).activateMode( 'edit' );
|
||||
}
|
||||
},
|
||||
|
||||
bindKeydown: function() {
|
||||
this.$body.on( 'keydown.select', _.bind( this.handleKeydown, this ) );
|
||||
},
|
||||
|
||||
unbindKeydown: function() {
|
||||
this.$body.off( 'keydown.select' );
|
||||
},
|
||||
|
||||
fixPosition: function() {
|
||||
var $browser, $toolbar;
|
||||
if ( ! this.isModeActive( 'select' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$browser = this.$('.attachments-browser');
|
||||
$toolbar = $browser.find('.media-toolbar');
|
||||
|
||||
// Offset doesn't appear to take top margin into account, hence +16
|
||||
if ( ( $browser.offset().top + 16 ) < this.$window.scrollTop() + this.$adminBar.height() ) {
|
||||
$browser.addClass( 'fixed' );
|
||||
$toolbar.css('width', $browser.width() + 'px');
|
||||
} else {
|
||||
$browser.removeClass( 'fixed' );
|
||||
$toolbar.css('width', '');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Click handler for the `Add New` button.
|
||||
*/
|
||||
addNewClickHandler: function( event ) {
|
||||
event.preventDefault();
|
||||
this.trigger( 'toggle:upload:attachment' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Open the Edit Attachment modal.
|
||||
*/
|
||||
openEditAttachmentModal: function( model ) {
|
||||
// Create a new EditAttachment frame, passing along the library and the attachment model.
|
||||
wp.media( {
|
||||
frame: 'edit-attachments',
|
||||
controller: this,
|
||||
library: this.state().get('library'),
|
||||
model: model
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Create an attachments browser view within the content region.
|
||||
*
|
||||
* @param {Object} contentRegion Basic object with a `view` property, which
|
||||
* should be set with the proper region view.
|
||||
* @this wp.media.controller.Region
|
||||
*/
|
||||
browseContent: function( contentRegion ) {
|
||||
var state = this.state();
|
||||
|
||||
// Browse our library of attachments.
|
||||
this.browserView = contentRegion.view = new media.view.AttachmentsBrowser({
|
||||
controller: this,
|
||||
collection: state.get('library'),
|
||||
selection: state.get('selection'),
|
||||
model: state,
|
||||
sortable: state.get('sortable'),
|
||||
search: state.get('searchable'),
|
||||
filters: state.get('filterable'),
|
||||
display: state.get('displaySettings'),
|
||||
dragInfo: state.get('dragInfo'),
|
||||
sidebar: 'errors',
|
||||
|
||||
suggestedWidth: state.get('suggestedWidth'),
|
||||
suggestedHeight: state.get('suggestedHeight'),
|
||||
|
||||
AttachmentView: state.get('AttachmentView'),
|
||||
|
||||
scrollElement: document
|
||||
});
|
||||
this.browserView.on( 'ready', _.bind( this.bindDeferred, this ) );
|
||||
|
||||
this.errors = wp.Uploader.errors;
|
||||
this.errors.on( 'add remove reset', this.sidebarVisibility, this );
|
||||
},
|
||||
|
||||
sidebarVisibility: function() {
|
||||
this.browserView.$( '.media-sidebar' ).toggle( !! this.errors.length );
|
||||
},
|
||||
|
||||
bindDeferred: function() {
|
||||
if ( ! this.browserView.dfd ) {
|
||||
return;
|
||||
}
|
||||
this.browserView.dfd.done( _.bind( this.startHistory, this ) );
|
||||
},
|
||||
|
||||
startHistory: function() {
|
||||
// Verify pushState support and activate
|
||||
if ( window.history && window.history.pushState ) {
|
||||
Backbone.history.start( {
|
||||
root: _wpMediaGridSettings.adminUrl,
|
||||
pushState: true
|
||||
} );
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* A similar view to media.view.Attachment.Details
|
||||
* for use in the Edit Attachment modal.
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.Attachment.Details
|
||||
* @augments wp.media.view.Attachment
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
*/
|
||||
media.view.Attachment.Details.TwoColumn = media.view.Attachment.Details.extend({
|
||||
template: media.template( 'attachment-details-two-column' ),
|
||||
|
||||
editAttachment: function( event ) {
|
||||
event.preventDefault();
|
||||
this.controller.content.mode( 'edit-image' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Noop this from parent class, doesn't apply here.
|
||||
*/
|
||||
toggleSelectionHandler: function() {},
|
||||
|
||||
render: function() {
|
||||
media.view.Attachment.Details.prototype.render.apply( this, arguments );
|
||||
|
||||
media.mixin.removeAllPlayers();
|
||||
this.$( 'audio, video' ).each( function (i, elem) {
|
||||
var el = media.view.MediaDetails.prepareSrc( elem );
|
||||
new MediaElementPlayer( el, media.mixin.mejsSettings );
|
||||
} );
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* A router for handling the browser history and application state.
|
||||
*
|
||||
* @constructor
|
||||
* @augments Backbone.Router
|
||||
*/
|
||||
media.view.MediaFrame.Manage.Router = Backbone.Router.extend({
|
||||
routes: {
|
||||
'upload.php?item=:slug': 'showItem',
|
||||
'upload.php?search=:query': 'search'
|
||||
},
|
||||
|
||||
// Map routes against the page URL
|
||||
baseUrl: function( url ) {
|
||||
return 'upload.php' + url;
|
||||
},
|
||||
|
||||
// Respond to the search route by filling the search field and trigggering the input event
|
||||
search: function( query ) {
|
||||
$( '#media-search-input' ).val( query ).trigger( 'input' );
|
||||
},
|
||||
|
||||
// Show the modal with a specific item
|
||||
showItem: function( query ) {
|
||||
var library = media.frame.state().get('library'), item;
|
||||
|
||||
// Trigger the media frame to open the correct item
|
||||
item = library.findWhere( { id: parseInt( query, 10 ) } );
|
||||
if ( item ) {
|
||||
media.frame.trigger( 'edit:attachment', item );
|
||||
} else {
|
||||
item = media.attachment( query );
|
||||
media.frame.listenTo( item, 'change', function( model ) {
|
||||
media.frame.stopListening( item );
|
||||
media.frame.trigger( 'edit:attachment', model );
|
||||
} );
|
||||
item.fetch();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
media.view.EditImage.Details = media.view.EditImage.extend({
|
||||
initialize: function( options ) {
|
||||
this.editor = window.imageEdit;
|
||||
this.frame = options.frame;
|
||||
this.controller = options.controller;
|
||||
media.View.prototype.initialize.apply( this, arguments );
|
||||
},
|
||||
|
||||
back: function() {
|
||||
this.frame.content.mode( 'edit-metadata' );
|
||||
},
|
||||
|
||||
save: function() {
|
||||
var self = this;
|
||||
|
||||
this.model.fetch().done( function() {
|
||||
self.frame.content.mode( 'edit-metadata' );
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* A frame for editing the details of a specific media item.
|
||||
*
|
||||
* Opens in a modal by default.
|
||||
*
|
||||
* Requires an attachment model to be passed in the options hash under `model`.
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.Frame
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
* @mixes wp.media.controller.StateMachine
|
||||
*/
|
||||
media.view.MediaFrame.EditAttachments = media.view.MediaFrame.extend({
|
||||
|
||||
className: 'edit-attachment-frame',
|
||||
template: media.template( 'edit-attachment-frame' ),
|
||||
regions: [ 'title', 'content' ],
|
||||
|
||||
events: {
|
||||
'click .left': 'previousMediaItem',
|
||||
'click .right': 'nextMediaItem'
|
||||
},
|
||||
|
||||
initialize: function() {
|
||||
media.view.Frame.prototype.initialize.apply( this, arguments );
|
||||
|
||||
_.defaults( this.options, {
|
||||
modal: true,
|
||||
state: 'edit-attachment'
|
||||
});
|
||||
|
||||
this.controller = this.options.controller;
|
||||
this.gridRouter = this.controller.gridRouter;
|
||||
this.library = this.options.library;
|
||||
|
||||
if ( this.options.model ) {
|
||||
this.model = this.options.model;
|
||||
}
|
||||
|
||||
this.bindHandlers();
|
||||
this.createStates();
|
||||
this.createModal();
|
||||
|
||||
this.title.mode( 'default' );
|
||||
this.toggleNav();
|
||||
},
|
||||
|
||||
bindHandlers: function() {
|
||||
// Bind default title creation.
|
||||
this.on( 'title:create:default', this.createTitle, this );
|
||||
|
||||
// Close the modal if the attachment is deleted.
|
||||
this.listenTo( this.model, 'change:status destroy', this.close, this );
|
||||
|
||||
this.on( 'content:create:edit-metadata', this.editMetadataMode, this );
|
||||
this.on( 'content:create:edit-image', this.editImageMode, this );
|
||||
this.on( 'content:render:edit-image', this.editImageModeRender, this );
|
||||
this.on( 'close', this.detach );
|
||||
},
|
||||
|
||||
createModal: function() {
|
||||
var self = this;
|
||||
|
||||
// Initialize modal container view.
|
||||
if ( this.options.modal ) {
|
||||
this.modal = new media.view.Modal({
|
||||
controller: this,
|
||||
title: this.options.title
|
||||
});
|
||||
|
||||
this.modal.on( 'open', function () {
|
||||
$( 'body' ).on( 'keydown.media-modal', _.bind( self.keyEvent, self ) );
|
||||
} );
|
||||
|
||||
// Completely destroy the modal DOM element when closing it.
|
||||
this.modal.on( 'close', function() {
|
||||
self.modal.remove();
|
||||
$( 'body' ).off( 'keydown.media-modal' ); /* remove the keydown event */
|
||||
// Restore the original focus item if possible
|
||||
$( 'li.attachment[data-id="' + self.model.get( 'id' ) +'"]' ).focus();
|
||||
self.resetRoute();
|
||||
} );
|
||||
|
||||
// Set this frame as the modal's content.
|
||||
this.modal.content( this );
|
||||
this.modal.open();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Add the default states to the frame.
|
||||
*/
|
||||
createStates: function() {
|
||||
this.states.add([
|
||||
new media.controller.EditAttachmentMetadata( { model: this.model } )
|
||||
]);
|
||||
},
|
||||
|
||||
/**
|
||||
* Content region rendering callback for the `edit-metadata` mode.
|
||||
*
|
||||
* @param {Object} contentRegion Basic object with a `view` property, which
|
||||
* should be set with the proper region view.
|
||||
*/
|
||||
editMetadataMode: function( contentRegion ) {
|
||||
contentRegion.view = new media.view.Attachment.Details.TwoColumn({
|
||||
controller: this,
|
||||
model: this.model
|
||||
});
|
||||
|
||||
/**
|
||||
* Attach a subview to display fields added via the
|
||||
* `attachment_fields_to_edit` filter.
|
||||
*/
|
||||
contentRegion.view.views.set( '.attachment-compat', new media.view.AttachmentCompat({
|
||||
controller: this,
|
||||
model: this.model
|
||||
}) );
|
||||
|
||||
// Update browser url when navigating media details
|
||||
if ( this.model ) {
|
||||
this.gridRouter.navigate( this.gridRouter.baseUrl( '?item=' + this.model.id ) );
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Render the EditImage view into the frame's content region.
|
||||
*
|
||||
* @param {Object} contentRegion Basic object with a `view` property, which
|
||||
* should be set with the proper region view.
|
||||
*/
|
||||
editImageMode: function( contentRegion ) {
|
||||
var editImageController = new media.controller.EditImage( {
|
||||
model: this.model,
|
||||
frame: this
|
||||
} );
|
||||
// Noop some methods.
|
||||
editImageController._toolbar = function() {};
|
||||
editImageController._router = function() {};
|
||||
editImageController._menu = function() {};
|
||||
|
||||
contentRegion.view = new media.view.EditImage.Details( {
|
||||
model: this.model,
|
||||
frame: this,
|
||||
controller: editImageController
|
||||
} );
|
||||
},
|
||||
|
||||
editImageModeRender: function( view ) {
|
||||
view.on( 'ready', view.loadEditor );
|
||||
},
|
||||
|
||||
toggleNav: function() {
|
||||
this.$('.left').toggleClass( 'disabled', ! this.hasPrevious() );
|
||||
this.$('.right').toggleClass( 'disabled', ! this.hasNext() );
|
||||
},
|
||||
|
||||
/**
|
||||
* Rerender the view.
|
||||
*/
|
||||
rerender: function() {
|
||||
// Only rerender the `content` region.
|
||||
if ( this.content.mode() !== 'edit-metadata' ) {
|
||||
this.content.mode( 'edit-metadata' );
|
||||
} else {
|
||||
this.content.render();
|
||||
}
|
||||
|
||||
this.toggleNav();
|
||||
},
|
||||
|
||||
/**
|
||||
* Click handler to switch to the previous media item.
|
||||
*/
|
||||
previousMediaItem: function() {
|
||||
if ( ! this.hasPrevious() ) {
|
||||
this.$( '.left' ).blur();
|
||||
return;
|
||||
}
|
||||
this.model = this.library.at( this.getCurrentIndex() - 1 );
|
||||
this.rerender();
|
||||
this.$( '.left' ).focus();
|
||||
},
|
||||
|
||||
/**
|
||||
* Click handler to switch to the next media item.
|
||||
*/
|
||||
nextMediaItem: function() {
|
||||
if ( ! this.hasNext() ) {
|
||||
this.$( '.right' ).blur();
|
||||
return;
|
||||
}
|
||||
this.model = this.library.at( this.getCurrentIndex() + 1 );
|
||||
this.rerender();
|
||||
this.$( '.right' ).focus();
|
||||
},
|
||||
|
||||
getCurrentIndex: function() {
|
||||
return this.library.indexOf( this.model );
|
||||
},
|
||||
|
||||
hasNext: function() {
|
||||
return ( this.getCurrentIndex() + 1 ) < this.library.length;
|
||||
},
|
||||
|
||||
hasPrevious: function() {
|
||||
return ( this.getCurrentIndex() - 1 ) > -1;
|
||||
},
|
||||
/**
|
||||
* Respond to the keyboard events: right arrow, left arrow, except when
|
||||
* focus is in a textarea or input field.
|
||||
*/
|
||||
keyEvent: function( event ) {
|
||||
if ( ( 'INPUT' === event.target.nodeName || 'TEXTAREA' === event.target.nodeName ) && ! ( event.target.readOnly || event.target.disabled ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// The right arrow key
|
||||
if ( 39 === event.keyCode ) {
|
||||
this.nextMediaItem();
|
||||
}
|
||||
// The left arrow key
|
||||
if ( 37 === event.keyCode ) {
|
||||
this.previousMediaItem();
|
||||
}
|
||||
},
|
||||
|
||||
resetRoute: function() {
|
||||
this.gridRouter.navigate( this.gridRouter.baseUrl( '' ) );
|
||||
}
|
||||
});
|
||||
|
||||
media.view.SelectModeToggleButton = media.view.Button.extend({
|
||||
initialize: function() {
|
||||
media.view.Button.prototype.initialize.apply( this, arguments );
|
||||
this.listenTo( this.controller, 'select:activate select:deactivate', this.toggleBulkEditHandler );
|
||||
this.listenTo( this.controller, 'selection:action:done', this.back );
|
||||
},
|
||||
|
||||
back: function () {
|
||||
this.controller.deactivateMode( 'select' ).activateMode( 'edit' );
|
||||
},
|
||||
|
||||
click: function() {
|
||||
media.view.Button.prototype.click.apply( this, arguments );
|
||||
if ( this.controller.isModeActive( 'select' ) ) {
|
||||
this.back();
|
||||
} else {
|
||||
this.controller.deactivateMode( 'edit' ).activateMode( 'select' );
|
||||
}
|
||||
},
|
||||
|
||||
render: function() {
|
||||
media.view.Button.prototype.render.apply( this, arguments );
|
||||
this.$el.addClass( 'select-mode-toggle-button' );
|
||||
return this;
|
||||
},
|
||||
|
||||
toggleBulkEditHandler: function() {
|
||||
var toolbar = this.controller.content.get().toolbar, children;
|
||||
|
||||
children = toolbar.$( '.media-toolbar-secondary > *, .media-toolbar-primary > *');
|
||||
|
||||
// TODO: the Frame should be doing all of this.
|
||||
if ( this.controller.isModeActive( 'select' ) ) {
|
||||
this.model.set( 'text', l10n.cancelSelection );
|
||||
children.not( '.media-button' ).hide();
|
||||
this.$el.show();
|
||||
toolbar.$( '.delete-selected-button' ).removeClass( 'hidden' );
|
||||
} else {
|
||||
this.model.set( 'text', l10n.bulkSelect );
|
||||
this.controller.content.get().$el.removeClass( 'fixed' );
|
||||
toolbar.$el.css( 'width', '' );
|
||||
toolbar.$( '.delete-selected-button' ).addClass( 'hidden' );
|
||||
children.not( '.spinner, .media-button' ).show();
|
||||
this.controller.state().get( 'selection' ).reset();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* A button that handles bulk Delete/Trash logic
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.Button
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
*/
|
||||
media.view.DeleteSelectedButton = media.view.Button.extend({
|
||||
initialize: function() {
|
||||
media.view.Button.prototype.initialize.apply( this, arguments );
|
||||
if ( this.options.filters ) {
|
||||
this.listenTo( this.options.filters.model, 'change', this.filterChange );
|
||||
}
|
||||
this.listenTo( this.controller, 'selection:toggle', this.toggleDisabled );
|
||||
},
|
||||
|
||||
filterChange: function( model ) {
|
||||
if ( 'trash' === model.get( 'status' ) ) {
|
||||
this.model.set( 'text', l10n.untrashSelected );
|
||||
} else if ( media.view.settings.mediaTrash ) {
|
||||
this.model.set( 'text', l10n.trashSelected );
|
||||
} else {
|
||||
this.model.set( 'text', l10n.deleteSelected );
|
||||
}
|
||||
},
|
||||
|
||||
toggleDisabled: function() {
|
||||
this.model.set( 'disabled', ! this.controller.state().get( 'selection' ).length );
|
||||
},
|
||||
|
||||
render: function() {
|
||||
media.view.Button.prototype.render.apply( this, arguments );
|
||||
if ( this.controller.isModeActive( 'select' ) ) {
|
||||
this.$el.addClass( 'delete-selected-button' );
|
||||
} else {
|
||||
this.$el.addClass( 'delete-selected-button hidden' );
|
||||
}
|
||||
this.toggleDisabled();
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* When MEDIA_TRASH is true, a button that handles bulk Delete Permanently logic
|
||||
*
|
||||
* @constructor
|
||||
* @augments wp.media.view.DeleteSelectedButton
|
||||
* @augments wp.media.view.Button
|
||||
* @augments wp.media.View
|
||||
* @augments wp.Backbone.View
|
||||
* @augments Backbone.View
|
||||
*/
|
||||
media.view.DeleteSelectedPermanentlyButton = media.view.DeleteSelectedButton.extend({
|
||||
initialize: function() {
|
||||
media.view.DeleteSelectedButton.prototype.initialize.apply( this, arguments );
|
||||
this.listenTo( this.controller, 'select:activate', this.selectActivate );
|
||||
this.listenTo( this.controller, 'select:deactivate', this.selectDeactivate );
|
||||
},
|
||||
|
||||
filterChange: function( model ) {
|
||||
this.canShow = ( 'trash' === model.get( 'status' ) );
|
||||
},
|
||||
|
||||
selectActivate: function() {
|
||||
this.toggleDisabled();
|
||||
this.$el.toggleClass( 'hidden', ! this.canShow );
|
||||
},
|
||||
|
||||
selectDeactivate: function() {
|
||||
this.toggleDisabled();
|
||||
this.$el.addClass( 'hidden' );
|
||||
},
|
||||
|
||||
render: function() {
|
||||
media.view.Button.prototype.render.apply( this, arguments );
|
||||
this.selectActivate();
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
||||
}(jQuery, _, Backbone, wp));
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user