WordPress/wp-admin/js/post-formats.js

181 lines
5.3 KiB
JavaScript

window.wp = window.wp || {};
(function($) {
var container, mediaFrame, lastMimeType, mediaPreview,
noUIFormats = ['standard', 'chat', 'status', 'aside', 'gallery'],
$container = $( '.post-formats-fields' ),
$screenIcon = $( '.icon32' );
function switchFormatClass( format ) {
container.get(0).className = container.get(0).className.replace( /\s?\bwp-format-[^ ]+/g, '' );
container.addClass('wp-format-' + format);
$screenIcon.get(0).className = $screenIcon.get(0).className.replace( /\s?\bwp-format-[^ ]+/g, '' );
$screenIcon.addClass('wp-format-' + format);
}
function switchFormat($this) {
var editor, body,
parent = $this.parent(),
format = $this.data('wp-format'),
description = $('.post-format-description'),
postTitle = $('#title');
if ( typeof container === 'undefined' )
container = $('#post-body-content');
parent.slideUp().find('a.active').removeClass('active');
$this.addClass('active');
$('#post_format').val(format);
$('.post-format-change').show().find('span.icon').removeClass(postFormats.currentPostFormat).addClass(format);
if ( -1 < $.inArray( format, noUIFormats ) ) {
switchFormatClass( format ); // No slide
$container.hide();
} else {
$container.slideUp( 200, function(){
switchFormatClass( format );
$container.slideDown( 400 );
});
}
postTitle.focus();
if ( '' === postTitle.val() )
$('#title-prompt-text').removeClass('screen-reader-text');
// Update description line
description.html($this.data('description'));
if (description.not(':visible'))
description.slideDown('fast');
if ( typeof tinymce != 'undefined' ) {
editor = tinymce.get('content');
if ( editor ) {
body = editor.getBody();
body.className = body.className.replace( /\bpost-format-[^ ]+/, '' );
editor.dom.addClass( body, 'post-format-' + format );
}
}
postFormats.currentPostFormat = format;
}
$(function(){
$('.post-format-change a').click(function() {
$('.post-formats-fields, .post-format-change').slideUp();
$('.post-format-options').slideDown();
return false;
});
// Post formats selection
$('.post-format-options').on( 'click', 'a', function(e){
e.preventDefault();
switchFormat($(this));
});
// Media selection
$('.wp-format-media-select').click(function(event) {
event.preventDefault();
var $el = $(this), mime = 'image',
$holder = $el.closest('.wp-format-media-holder'),
$field = $( '#wp_format_' + $holder.data('format') );
mime = $holder.data('format');
// If the media frame already exists, reopen it.
if ( mediaFrame && lastMimeType === mime ) {
mediaFrame.open();
return;
}
lastMimeType = mime;
// Create the media frame.
mediaFrame = wp.media.frames.formatMedia = wp.media({
// Set the title of the modal.
title: $el.data('choose'),
// Tell the modal to show only items matching the current mime type.
library: {
type: mime
},
// Customize the submit button.
button: {
// Set the text of the button.
text: $el.data('update')
}
});
mediaPreview = function(attachment) {
var w, h, dimensions = '', url = attachment.url, mime = attachment.mime, format = attachment.type;
if ( 'video' === format ) {
if ( attachment.width ) {
w = attachment.width;
if ( w > 600 )
w = 600;
dimensions += ' width="' + w + '"';
}
if ( attachment.height ) {
h = attachment.height;
if ( attachment.width && w < attachment.width )
h = Math.round( ( h * w ) / attachment.width );
dimensions += ' height="' + h + '"';
}
}
$('#' + format + '-preview').remove();
$holder.parent().prepend( '<div id="' + format + '-preview" class="wp-format-media-preview">' +
'<' + format + dimensions + ' class="wp-' + format + '-shortcode" controls="controls" preload="none">' +
'<source type="' + mime + '" src="' + url + '" />' +
'</' + format + '></div>' );
$('.wp-' + format + '-shortcode').mediaelementplayer();
};
// When an image is selected, run a callback.
mediaFrame.on( 'select', function() {
// Grab the selected attachment.
var w = 0, h = 0, html, attachment = mediaFrame.state().get('selection').first().toJSON();
if ( 0 === attachment.mime.indexOf('audio') ) {
$field.val(attachment.url);
// show one preview at a time
mediaPreview(attachment);
} else if ( 0 === attachment.mime.indexOf('video') ) {
attachment.src = attachment.url;
$field.val(wp.shortcode.string({
tag: 'video',
attrs: _.pick( attachment, 'src', 'width', 'height' )
}));
// show one preview at a time
mediaPreview(attachment);
} else {
html = wp.media.string.image({}, attachment);
// set the hidden input's value
$field.val(html);
$('#image-preview').remove();
if ( attachment.width )
w = attachment.width > 600 ? 600 : attachment.width;
if ( attachment.height )
h = attachment.height;
if ( w < attachment.width )
h = Math.round( ( h * w ) / attachment.width );
$holder.parent().prepend( ['<div id="image-preview" class="wp-format-media-preview">',
'<img src="', attachment.url, '"',
w ? ' width="' + w + '"' : '',
h ? ' height="' + h + '"' : '',
' />',
'</div>'].join('') );
}
});
mediaFrame.open();
});
});
})(jQuery);