| Current File : /home/k/a/r/karenpetzb/www/items/category/wpeditimage.tar |
plugin.js 0000644 00000062052 15071211641 0006403 0 ustar 00 /* global tinymce */
tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
var toolbar, serializer, touchOnImage, pasteInCaption,
each = tinymce.each,
trim = tinymce.trim,
iOS = tinymce.Env.iOS;
function isPlaceholder( node ) {
return !! ( editor.dom.getAttrib( node, 'data-mce-placeholder' ) || editor.dom.getAttrib( node, 'data-mce-object' ) );
}
editor.addButton( 'wp_img_remove', {
tooltip: 'Remove',
icon: 'dashicon dashicons-no',
onclick: function() {
removeImage( editor.selection.getNode() );
}
} );
editor.addButton( 'wp_img_edit', {
tooltip: 'Edit|button', // '|button' is not displayed, only used for context.
icon: 'dashicon dashicons-edit',
onclick: function() {
editImage( editor.selection.getNode() );
}
} );
each( {
alignleft: 'Align left',
aligncenter: 'Align center',
alignright: 'Align right',
alignnone: 'No alignment'
}, function( tooltip, name ) {
var direction = name.slice( 5 );
editor.addButton( 'wp_img_' + name, {
tooltip: tooltip,
icon: 'dashicon dashicons-align-' + direction,
cmd: 'alignnone' === name ? 'wpAlignNone' : 'Justify' + direction.slice( 0, 1 ).toUpperCase() + direction.slice( 1 ),
onPostRender: function() {
var self = this;
editor.on( 'NodeChange', function( event ) {
var node;
// Don't bother.
if ( event.element.nodeName !== 'IMG' ) {
return;
}
node = editor.dom.getParent( event.element, '.wp-caption' ) || event.element;
if ( 'alignnone' === name ) {
self.active( ! /\balign(left|center|right)\b/.test( node.className ) );
} else {
self.active( editor.dom.hasClass( node, name ) );
}
} );
}
} );
} );
editor.once( 'preinit', function() {
if ( editor.wp && editor.wp._createToolbar ) {
toolbar = editor.wp._createToolbar( [
'wp_img_alignleft',
'wp_img_aligncenter',
'wp_img_alignright',
'wp_img_alignnone',
'wp_img_edit',
'wp_img_remove'
] );
}
} );
editor.on( 'wptoolbar', function( event ) {
if ( event.element.nodeName === 'IMG' && ! isPlaceholder( event.element ) ) {
event.toolbar = toolbar;
}
} );
function isNonEditable( node ) {
var parent = editor.$( node ).parents( '[contenteditable]' );
return parent && parent.attr( 'contenteditable' ) === 'false';
}
// Safari on iOS fails to select images in contentEditoble mode on touch.
// Select them again.
if ( iOS ) {
editor.on( 'init', function() {
editor.on( 'touchstart', function( event ) {
if ( event.target.nodeName === 'IMG' && ! isNonEditable( event.target ) ) {
touchOnImage = true;
}
});
editor.dom.bind( editor.getDoc(), 'touchmove', function() {
touchOnImage = false;
});
editor.on( 'touchend', function( event ) {
if ( touchOnImage && event.target.nodeName === 'IMG' && ! isNonEditable( event.target ) ) {
var node = event.target;
touchOnImage = false;
window.setTimeout( function() {
editor.selection.select( node );
editor.nodeChanged();
}, 100 );
} else if ( toolbar ) {
toolbar.hide();
}
});
});
}
function parseShortcode( content ) {
return content.replace( /(?:<p>)?\[(?:wp_)?caption([^\]]+)\]([\s\S]+?)\[\/(?:wp_)?caption\](?:<\/p>)?/g, function( a, b, c ) {
var id, align, classes, caption, img, width;
id = b.match( /id=['"]([^'"]*)['"] ?/ );
if ( id ) {
b = b.replace( id[0], '' );
}
align = b.match( /align=['"]([^'"]*)['"] ?/ );
if ( align ) {
b = b.replace( align[0], '' );
}
classes = b.match( /class=['"]([^'"]*)['"] ?/ );
if ( classes ) {
b = b.replace( classes[0], '' );
}
width = b.match( /width=['"]([0-9]*)['"] ?/ );
if ( width ) {
b = b.replace( width[0], '' );
}
c = trim( c );
img = c.match( /((?:<a [^>]+>)?<img [^>]+>(?:<\/a>)?)([\s\S]*)/i );
if ( img && img[2] ) {
caption = trim( img[2] );
img = trim( img[1] );
} else {
// Old captions shortcode style.
caption = trim( b ).replace( /caption=['"]/, '' ).replace( /['"]$/, '' );
img = c;
}
id = ( id && id[1] ) ? id[1].replace( /[<>&]+/g, '' ) : '';
align = ( align && align[1] ) ? align[1] : 'alignnone';
classes = ( classes && classes[1] ) ? ' ' + classes[1].replace( /[<>&]+/g, '' ) : '';
if ( ! width && img ) {
width = img.match( /width=['"]([0-9]*)['"]/ );
}
if ( width && width[1] ) {
width = width[1];
}
if ( ! width || ! caption ) {
return c;
}
width = parseInt( width, 10 );
if ( ! editor.getParam( 'wpeditimage_html5_captions' ) ) {
width += 10;
}
return '<div class="mceTemp"><dl id="' + id + '" class="wp-caption ' + align + classes + '" style="width: ' + width + 'px">' +
'<dt class="wp-caption-dt">'+ img +'</dt><dd class="wp-caption-dd">'+ caption +'</dd></dl></div>';
});
}
function getShortcode( content ) {
return content.replace( /(?:<div [^>]+mceTemp[^>]+>)?\s*(<dl [^>]+wp-caption[^>]+>[\s\S]+?<\/dl>)\s*(?:<\/div>)?/g, function( all, dl ) {
var out = '';
if ( dl.indexOf('<img ') === -1 || dl.indexOf('</p>') !== -1 ) {
// Broken caption. The user managed to drag the image out or type in the wrapper div?
// Remove the <dl>, <dd> and <dt> and return the remaining text.
return dl.replace( /<d[ldt]( [^>]+)?>/g, '' ).replace( /<\/d[ldt]>/g, '' );
}
out = dl.replace( /\s*<dl ([^>]+)>\s*<dt [^>]+>([\s\S]+?)<\/dt>\s*<dd [^>]+>([\s\S]*?)<\/dd>\s*<\/dl>\s*/gi, function( a, b, c, caption ) {
var id, classes, align, width;
width = c.match( /width="([0-9]*)"/ );
width = ( width && width[1] ) ? width[1] : '';
classes = b.match( /class="([^"]*)"/ );
classes = ( classes && classes[1] ) ? classes[1] : '';
align = classes.match( /align[a-z]+/i ) || 'alignnone';
if ( ! width || ! caption ) {
if ( 'alignnone' !== align[0] ) {
c = c.replace( /><img/, ' class="' + align[0] + '"><img' );
}
return c;
}
id = b.match( /id="([^"]*)"/ );
id = ( id && id[1] ) ? id[1] : '';
classes = classes.replace( /wp-caption ?|align[a-z]+ ?/gi, '' );
if ( classes ) {
classes = ' class="' + classes + '"';
}
caption = caption.replace( /\r\n|\r/g, '\n' ).replace( /<[a-zA-Z0-9]+( [^<>]+)?>/g, function( a ) {
// No line breaks inside HTML tags.
return a.replace( /[\r\n\t]+/, ' ' );
});
// Convert remaining line breaks to <br>.
caption = caption.replace( /\s*\n\s*/g, '<br />' );
return '[caption id="' + id + '" align="' + align + '" width="' + width + '"' + classes + ']' + c + ' ' + caption + '[/caption]';
});
if ( out.indexOf('[caption') === -1 ) {
// The caption html seems broken, try to find the image that may be wrapped in a link
// and may be followed by <p> with the caption text.
out = dl.replace( /[\s\S]*?((?:<a [^>]+>)?<img [^>]+>(?:<\/a>)?)(<p>[\s\S]*<\/p>)?[\s\S]*/gi, '<p>$1</p>$2' );
}
return out;
});
}
function extractImageData( imageNode ) {
var classes, extraClasses, metadata, captionBlock, caption, link, width, height,
captionClassName = [],
dom = editor.dom,
isIntRegExp = /^\d+$/;
// Default attributes.
metadata = {
attachment_id: false,
size: 'custom',
caption: '',
align: 'none',
extraClasses: '',
link: false,
linkUrl: '',
linkClassName: '',
linkTargetBlank: false,
linkRel: '',
title: ''
};
metadata.url = dom.getAttrib( imageNode, 'src' );
metadata.alt = dom.getAttrib( imageNode, 'alt' );
metadata.title = dom.getAttrib( imageNode, 'title' );
width = dom.getAttrib( imageNode, 'width' );
height = dom.getAttrib( imageNode, 'height' );
if ( ! isIntRegExp.test( width ) || parseInt( width, 10 ) < 1 ) {
width = imageNode.naturalWidth || imageNode.width;
}
if ( ! isIntRegExp.test( height ) || parseInt( height, 10 ) < 1 ) {
height = imageNode.naturalHeight || imageNode.height;
}
metadata.customWidth = metadata.width = width;
metadata.customHeight = metadata.height = height;
classes = tinymce.explode( imageNode.className, ' ' );
extraClasses = [];
tinymce.each( classes, function( name ) {
if ( /^wp-image/.test( name ) ) {
metadata.attachment_id = parseInt( name.replace( 'wp-image-', '' ), 10 );
} else if ( /^align/.test( name ) ) {
metadata.align = name.replace( 'align', '' );
} else if ( /^size/.test( name ) ) {
metadata.size = name.replace( 'size-', '' );
} else {
extraClasses.push( name );
}
} );
metadata.extraClasses = extraClasses.join( ' ' );
// Extract caption.
captionBlock = dom.getParents( imageNode, '.wp-caption' );
if ( captionBlock.length ) {
captionBlock = captionBlock[0];
classes = captionBlock.className.split( ' ' );
tinymce.each( classes, function( name ) {
if ( /^align/.test( name ) ) {
metadata.align = name.replace( 'align', '' );
} else if ( name && name !== 'wp-caption' ) {
captionClassName.push( name );
}
} );
metadata.captionClassName = captionClassName.join( ' ' );
caption = dom.select( 'dd.wp-caption-dd', captionBlock );
if ( caption.length ) {
caption = caption[0];
metadata.caption = editor.serializer.serialize( caption )
.replace( /<br[^>]*>/g, '$&\n' ).replace( /^<p>/, '' ).replace( /<\/p>$/, '' );
}
}
// Extract linkTo.
if ( imageNode.parentNode && imageNode.parentNode.nodeName === 'A' ) {
link = imageNode.parentNode;
metadata.linkUrl = dom.getAttrib( link, 'href' );
metadata.linkTargetBlank = dom.getAttrib( link, 'target' ) === '_blank' ? true : false;
metadata.linkRel = dom.getAttrib( link, 'rel' );
metadata.linkClassName = link.className;
}
return metadata;
}
function hasTextContent( node ) {
return node && !! ( node.textContent || node.innerText ).replace( /\ufeff/g, '' );
}
// Verify HTML in captions.
function verifyHTML( caption ) {
if ( ! caption || ( caption.indexOf( '<' ) === -1 && caption.indexOf( '>' ) === -1 ) ) {
return caption;
}
if ( ! serializer ) {
serializer = new tinymce.html.Serializer( {}, editor.schema );
}
return serializer.serialize( editor.parser.parse( caption, { forced_root_block: false } ) );
}
function updateImage( $imageNode, imageData ) {
var classes, className, node, html, parent, wrap, linkNode, imageNode,
captionNode, dd, dl, id, attrs, linkAttrs, width, height, align,
$imageNode, srcset, src,
dom = editor.dom;
if ( ! $imageNode || ! $imageNode.length ) {
return;
}
imageNode = $imageNode[0];
classes = tinymce.explode( imageData.extraClasses, ' ' );
if ( ! classes ) {
classes = [];
}
if ( ! imageData.caption ) {
classes.push( 'align' + imageData.align );
}
if ( imageData.attachment_id ) {
classes.push( 'wp-image-' + imageData.attachment_id );
if ( imageData.size && imageData.size !== 'custom' ) {
classes.push( 'size-' + imageData.size );
}
}
width = imageData.width;
height = imageData.height;
if ( imageData.size === 'custom' ) {
width = imageData.customWidth;
height = imageData.customHeight;
}
attrs = {
src: imageData.url,
width: width || null,
height: height || null,
title: imageData.title || null,
'class': classes.join( ' ' ) || null
};
dom.setAttribs( imageNode, attrs );
// Preserve empty alt attributes.
$imageNode.attr( 'alt', imageData.alt || '' );
linkAttrs = {
href: imageData.linkUrl,
rel: imageData.linkRel || null,
target: imageData.linkTargetBlank ? '_blank': null,
'class': imageData.linkClassName || null
};
if ( imageNode.parentNode && imageNode.parentNode.nodeName === 'A' && ! hasTextContent( imageNode.parentNode ) ) {
// Update or remove an existing link wrapped around the image.
if ( imageData.linkUrl ) {
dom.setAttribs( imageNode.parentNode, linkAttrs );
} else {
dom.remove( imageNode.parentNode, true );
}
} else if ( imageData.linkUrl ) {
if ( linkNode = dom.getParent( imageNode, 'a' ) ) {
// The image is inside a link together with other nodes,
// or is nested in another node, move it out.
dom.insertAfter( imageNode, linkNode );
}
// Add link wrapped around the image.
linkNode = dom.create( 'a', linkAttrs );
imageNode.parentNode.insertBefore( linkNode, imageNode );
linkNode.appendChild( imageNode );
}
captionNode = editor.dom.getParent( imageNode, '.mceTemp' );
if ( imageNode.parentNode && imageNode.parentNode.nodeName === 'A' && ! hasTextContent( imageNode.parentNode ) ) {
node = imageNode.parentNode;
} else {
node = imageNode;
}
if ( imageData.caption ) {
imageData.caption = verifyHTML( imageData.caption );
id = imageData.attachment_id ? 'attachment_' + imageData.attachment_id : null;
align = 'align' + ( imageData.align || 'none' );
className = 'wp-caption ' + align;
if ( imageData.captionClassName ) {
className += ' ' + imageData.captionClassName.replace( /[<>&]+/g, '' );
}
if ( ! editor.getParam( 'wpeditimage_html5_captions' ) ) {
width = parseInt( width, 10 );
width += 10;
}
if ( captionNode ) {
dl = dom.select( 'dl.wp-caption', captionNode );
if ( dl.length ) {
dom.setAttribs( dl, {
id: id,
'class': className,
style: 'width: ' + width + 'px'
} );
}
dd = dom.select( '.wp-caption-dd', captionNode );
if ( dd.length ) {
dom.setHTML( dd[0], imageData.caption );
}
} else {
id = id ? 'id="'+ id +'" ' : '';
// Should create a new function for generating the caption markup.
html = '<dl ' + id + 'class="' + className +'" style="width: '+ width +'px">' +
'<dt class="wp-caption-dt"></dt><dd class="wp-caption-dd">'+ imageData.caption +'</dd></dl>';
wrap = dom.create( 'div', { 'class': 'mceTemp' }, html );
if ( parent = dom.getParent( node, 'p' ) ) {
parent.parentNode.insertBefore( wrap, parent );
} else {
node.parentNode.insertBefore( wrap, node );
}
editor.$( wrap ).find( 'dt.wp-caption-dt' ).append( node );
if ( parent && dom.isEmpty( parent ) ) {
dom.remove( parent );
}
}
} else if ( captionNode ) {
// Remove the caption wrapper and place the image in new paragraph.
parent = dom.create( 'p' );
captionNode.parentNode.insertBefore( parent, captionNode );
parent.appendChild( node );
dom.remove( captionNode );
}
$imageNode = editor.$( imageNode );
srcset = $imageNode.attr( 'srcset' );
src = $imageNode.attr( 'src' );
// Remove srcset and sizes if the image file was edited or the image was replaced.
if ( srcset && src ) {
src = src.replace( /[?#].*/, '' );
if ( srcset.indexOf( src ) === -1 ) {
$imageNode.attr( 'srcset', null ).attr( 'sizes', null );
}
}
if ( wp.media.events ) {
wp.media.events.trigger( 'editor:image-update', {
editor: editor,
metadata: imageData,
image: imageNode
} );
}
editor.nodeChanged();
}
function editImage( img ) {
var frame, callback, metadata, imageNode;
if ( typeof wp === 'undefined' || ! wp.media ) {
editor.execCommand( 'mceImage' );
return;
}
metadata = extractImageData( img );
// Mark the image node so we can select it later.
editor.$( img ).attr( 'data-wp-editing', 1 );
// Manipulate the metadata by reference that is fed into the PostImage model used in the media modal.
wp.media.events.trigger( 'editor:image-edit', {
editor: editor,
metadata: metadata,
image: img
} );
frame = wp.media({
frame: 'image',
state: 'image-details',
metadata: metadata
} );
wp.media.events.trigger( 'editor:frame-create', { frame: frame } );
callback = function( imageData ) {
editor.undoManager.transact( function() {
updateImage( imageNode, imageData );
} );
frame.detach();
};
frame.state('image-details').on( 'update', callback );
frame.state('replace-image').on( 'replace', callback );
frame.on( 'close', function() {
editor.focus();
frame.detach();
/*
* `close` fires first...
* To be able to update the image node, we need to find it here,
* and use it in the callback.
*/
imageNode = editor.$( 'img[data-wp-editing]' )
imageNode.removeAttr( 'data-wp-editing' );
});
frame.open();
}
function removeImage( node ) {
var wrap = editor.dom.getParent( node, 'div.mceTemp' );
if ( ! wrap && node.nodeName === 'IMG' ) {
wrap = editor.dom.getParent( node, 'a' );
}
if ( wrap ) {
if ( wrap.nextSibling ) {
editor.selection.select( wrap.nextSibling );
} else if ( wrap.previousSibling ) {
editor.selection.select( wrap.previousSibling );
} else {
editor.selection.select( wrap.parentNode );
}
editor.selection.collapse( true );
editor.dom.remove( wrap );
} else {
editor.dom.remove( node );
}
editor.nodeChanged();
editor.undoManager.add();
}
editor.on( 'init', function() {
var dom = editor.dom,
captionClass = editor.getParam( 'wpeditimage_html5_captions' ) ? 'html5-captions' : 'html4-captions';
dom.addClass( editor.getBody(), captionClass );
// Prevent IE11 from making dl.wp-caption resizable.
if ( tinymce.Env.ie && tinymce.Env.ie > 10 ) {
// The 'mscontrolselect' event is supported only in IE11+.
dom.bind( editor.getBody(), 'mscontrolselect', function( event ) {
if ( event.target.nodeName === 'IMG' && dom.getParent( event.target, '.wp-caption' ) ) {
// Hide the thick border with resize handles around dl.wp-caption.
editor.getBody().focus(); // :(
} else if ( event.target.nodeName === 'DL' && dom.hasClass( event.target, 'wp-caption' ) ) {
// Trigger the thick border with resize handles...
// This will make the caption text editable.
event.target.focus();
}
});
}
});
editor.on( 'ObjectResized', function( event ) {
var node = event.target;
if ( node.nodeName === 'IMG' ) {
editor.undoManager.transact( function() {
var parent, width,
dom = editor.dom;
node.className = node.className.replace( /\bsize-[^ ]+/, '' );
if ( parent = dom.getParent( node, '.wp-caption' ) ) {
width = event.width || dom.getAttrib( node, 'width' );
if ( width ) {
width = parseInt( width, 10 );
if ( ! editor.getParam( 'wpeditimage_html5_captions' ) ) {
width += 10;
}
dom.setStyle( parent, 'width', width + 'px' );
}
}
});
}
});
editor.on( 'pastePostProcess', function( event ) {
// Pasting in a caption node.
if ( editor.dom.getParent( editor.selection.getNode(), 'dd.wp-caption-dd' ) ) {
// Remove "non-block" elements that should not be in captions.
editor.$( 'img, audio, video, object, embed, iframe, script, style', event.node ).remove();
editor.$( '*', event.node ).each( function( i, node ) {
if ( editor.dom.isBlock( node ) ) {
// Insert <br> where the blocks used to be. Makes it look better after pasting in the caption.
if ( tinymce.trim( node.textContent || node.innerText ) ) {
editor.dom.insertAfter( editor.dom.create( 'br' ), node );
editor.dom.remove( node, true );
} else {
editor.dom.remove( node );
}
}
});
// Trim <br> tags.
editor.$( 'br', event.node ).each( function( i, node ) {
if ( ! node.nextSibling || node.nextSibling.nodeName === 'BR' ||
! node.previousSibling || node.previousSibling.nodeName === 'BR' ) {
editor.dom.remove( node );
}
} );
// Pasted HTML is cleaned up for inserting in the caption.
pasteInCaption = true;
}
});
editor.on( 'BeforeExecCommand', function( event ) {
var node, p, DL, align, replacement, captionParent,
cmd = event.command,
dom = editor.dom;
if ( cmd === 'mceInsertContent' || cmd === 'Indent' || cmd === 'Outdent' ) {
node = editor.selection.getNode();
captionParent = dom.getParent( node, 'div.mceTemp' );
if ( captionParent ) {
if ( cmd === 'mceInsertContent' ) {
if ( pasteInCaption ) {
pasteInCaption = false;
/*
* We are in the caption element, and in 'paste' context,
* and the pasted HTML was cleaned up on 'pastePostProcess' above.
* Let it be pasted in the caption.
*/
return;
}
/*
* The paste is somewhere else in the caption DL element.
* Prevent pasting in there as it will break the caption.
* Make new paragraph under the caption DL and move the caret there.
*/
p = dom.create( 'p' );
dom.insertAfter( p, captionParent );
editor.selection.setCursorLocation( p, 0 );
/*
* If the image is selected and the user pastes "over" it,
* replace both the image and the caption elements with the pasted content.
* This matches the behavior when pasting over non-caption images.
*/
if ( node.nodeName === 'IMG' ) {
editor.$( captionParent ).remove();
}
editor.nodeChanged();
} else {
// Clicking Indent or Outdent while an image with a caption is selected breaks the caption.
// See #38313.
event.preventDefault();
event.stopImmediatePropagation();
return false;
}
}
} else if ( cmd === 'JustifyLeft' || cmd === 'JustifyRight' || cmd === 'JustifyCenter' || cmd === 'wpAlignNone' ) {
node = editor.selection.getNode();
align = 'align' + cmd.slice( 7 ).toLowerCase();
DL = editor.dom.getParent( node, '.wp-caption' );
if ( node.nodeName !== 'IMG' && ! DL ) {
return;
}
node = DL || node;
if ( editor.dom.hasClass( node, align ) ) {
replacement = ' alignnone';
} else {
replacement = ' ' + align;
}
node.className = trim( node.className.replace( / ?align(left|center|right|none)/g, '' ) + replacement );
editor.nodeChanged();
event.preventDefault();
if ( toolbar ) {
toolbar.reposition();
}
editor.fire( 'ExecCommand', {
command: cmd,
ui: event.ui,
value: event.value
} );
}
});
editor.on( 'keydown', function( event ) {
var node, wrap, P, spacer,
selection = editor.selection,
keyCode = event.keyCode,
dom = editor.dom,
VK = tinymce.util.VK;
if ( keyCode === VK.ENTER ) {
// When pressing Enter inside a caption move the caret to a new parapraph under it.
node = selection.getNode();
wrap = dom.getParent( node, 'div.mceTemp' );
if ( wrap ) {
dom.events.cancel( event ); // Doesn't cancel all :(
// Remove any extra dt and dd cleated on pressing Enter...
tinymce.each( dom.select( 'dt, dd', wrap ), function( element ) {
if ( dom.isEmpty( element ) ) {
dom.remove( element );
}
});
spacer = tinymce.Env.ie && tinymce.Env.ie < 11 ? '' : '<br data-mce-bogus="1" />';
P = dom.create( 'p', null, spacer );
if ( node.nodeName === 'DD' ) {
dom.insertAfter( P, wrap );
} else {
wrap.parentNode.insertBefore( P, wrap );
}
editor.nodeChanged();
selection.setCursorLocation( P, 0 );
}
} else if ( keyCode === VK.DELETE || keyCode === VK.BACKSPACE ) {
node = selection.getNode();
if ( node.nodeName === 'DIV' && dom.hasClass( node, 'mceTemp' ) ) {
wrap = node;
} else if ( node.nodeName === 'IMG' || node.nodeName === 'DT' || node.nodeName === 'A' ) {
wrap = dom.getParent( node, 'div.mceTemp' );
}
if ( wrap ) {
dom.events.cancel( event );
removeImage( node );
return false;
}
}
});
/*
* After undo/redo FF seems to set the image height very slowly when it is set to 'auto' in the CSS.
* This causes image.getBoundingClientRect() to return wrong values and the resize handles are shown in wrong places.
* Collapse the selection to remove the resize handles.
*/
if ( tinymce.Env.gecko ) {
editor.on( 'undo redo', function() {
if ( editor.selection.getNode().nodeName === 'IMG' ) {
editor.selection.collapse();
}
});
}
editor.wpSetImgCaption = function( content ) {
return parseShortcode( content );
};
editor.wpGetImgCaption = function( content ) {
return getShortcode( content );
};
editor.on( 'beforeGetContent', function( event ) {
if ( event.format !== 'raw' ) {
editor.$( 'img[id="__wp-temp-img-id"]' ).removeAttr( 'id' );
}
});
editor.on( 'BeforeSetContent', function( event ) {
if ( event.format !== 'raw' ) {
event.content = editor.wpSetImgCaption( event.content );
}
});
editor.on( 'PostProcess', function( event ) {
if ( event.get ) {
event.content = editor.wpGetImgCaption( event.content );
}
});
( function() {
var wrap;
editor.on( 'dragstart', function() {
var node = editor.selection.getNode();
if ( node.nodeName === 'IMG' ) {
wrap = editor.dom.getParent( node, '.mceTemp' );
if ( ! wrap && node.parentNode.nodeName === 'A' && ! hasTextContent( node.parentNode ) ) {
wrap = node.parentNode;
}
}
} );
editor.on( 'drop', function( event ) {
var dom = editor.dom,
rng = tinymce.dom.RangeUtils.getCaretRangeFromPoint( event.clientX, event.clientY, editor.getDoc() );
// Don't allow anything to be dropped in a captioned image.
if ( rng && dom.getParent( rng.startContainer, '.mceTemp' ) ) {
event.preventDefault();
} else if ( wrap ) {
event.preventDefault();
editor.undoManager.transact( function() {
if ( rng ) {
editor.selection.setRng( rng );
}
editor.selection.setNode( wrap );
dom.remove( wrap );
} );
}
wrap = null;
} );
} )();
// Add to editor.wp.
editor.wp = editor.wp || {};
editor.wp.isPlaceholder = isPlaceholder;
// Back-compat.
return {
_do_shcode: parseShortcode,
_get_shcode: getShortcode
};
});
plugin.min.js 0000644 00000027443 15071211641 0007172 0 ustar 00 tinymce.PluginManager.add("wpeditimage",function(g){var r,u,n,c,a,e=tinymce.each,l=tinymce.trim,t=tinymce.Env.iOS;function i(e){return!(!g.dom.getAttrib(e,"data-mce-placeholder")&&!g.dom.getAttrib(e,"data-mce-object"))}function o(e){e=g.$(e).parents("[contenteditable]");return e&&"false"===e.attr("contenteditable")}function d(e){return e.replace(/(?:<p>)?\[(?:wp_)?caption([^\]]+)\]([\s\S]+?)\[\/(?:wp_)?caption\](?:<\/p>)?/g,function(e,t,n){var a,i,o,r,c,d=t.match(/id=['"]([^'"]*)['"] ?/);return(c=(t=(i=(t=(a=(t=d?t.replace(d[0],""):t).match(/align=['"]([^'"]*)['"] ?/))?t.replace(a[0],""):t).match(/class=['"]([^'"]*)['"] ?/))?t.replace(i[0],""):t).match(/width=['"]([0-9]*)['"] ?/))&&(t=t.replace(c[0],"")),r=(r=(n=l(n)).match(/((?:<a [^>]+>)?<img [^>]+>(?:<\/a>)?)([\s\S]*)/i))&&r[2]?(o=l(r[2]),l(r[1])):(o=l(t).replace(/caption=['"]/,"").replace(/['"]$/,""),n),d=d&&d[1]?d[1].replace(/[<>&]+/g,""):"",a=a&&a[1]?a[1]:"alignnone",i=i&&i[1]?" "+i[1].replace(/[<>&]+/g,""):"",(c=(c=!c&&r?r.match(/width=['"]([0-9]*)['"]/):c)&&c[1]?c[1]:c)&&o?(c=parseInt(c,10),g.getParam("wpeditimage_html5_captions")||(c+=10),'<div class="mceTemp"><dl id="'+d+'" class="wp-caption '+a+i+'" style="width: '+c+'px"><dt class="wp-caption-dt">'+r+'</dt><dd class="wp-caption-dd">'+o+"</dd></dl></div>"):n})}function s(e){return e.replace(/(?:<div [^>]+mceTemp[^>]+>)?\s*(<dl [^>]+wp-caption[^>]+>[\s\S]+?<\/dl>)\s*(?:<\/div>)?/g,function(e,t){var n="";return-1===t.indexOf("<img ")||-1!==t.indexOf("</p>")?t.replace(/<d[ldt]( [^>]+)?>/g,"").replace(/<\/d[ldt]>/g,""):-1===(n=t.replace(/\s*<dl ([^>]+)>\s*<dt [^>]+>([\s\S]+?)<\/dt>\s*<dd [^>]+>([\s\S]*?)<\/dd>\s*<\/dl>\s*/gi,function(e,t,n,a){var i,o,r=n.match(/width="([0-9]*)"/);return r=r&&r[1]?r[1]:"",o=(i=(i=t.match(/class="([^"]*)"/))&&i[1]?i[1]:"").match(/align[a-z]+/i)||"alignnone",r&&a?'[caption id="'+((t=t.match(/id="([^"]*)"/))&&t[1]?t[1]:"")+'" align="'+o+'" width="'+r+'"'+(i=(i=i.replace(/wp-caption ?|align[a-z]+ ?/gi,""))&&' class="'+i+'"')+"]"+n+" "+(a=(a=a.replace(/\r\n|\r/g,"\n").replace(/<[a-zA-Z0-9]+( [^<>]+)?>/g,function(e){return e.replace(/[\r\n\t]+/," ")})).replace(/\s*\n\s*/g,"<br />"))+"[/caption]":"alignnone"!==o[0]?n.replace(/><img/,' class="'+o[0]+'"><img'):n})).indexOf("[caption")?t.replace(/[\s\S]*?((?:<a [^>]+>)?<img [^>]+>(?:<\/a>)?)(<p>[\s\S]*<\/p>)?[\s\S]*/gi,"<p>$1</p>$2"):n})}function h(e){return e&&(e.textContent||e.innerText).replace(/\ufeff/g,"")}function m(e){var t=g.dom.getParent(e,"div.mceTemp");(t=t||"IMG"!==e.nodeName?t:g.dom.getParent(e,"a"))?(t.nextSibling?g.selection.select(t.nextSibling):t.previousSibling?g.selection.select(t.previousSibling):g.selection.select(t.parentNode),g.selection.collapse(!0),g.dom.remove(t)):g.dom.remove(e),g.nodeChanged(),g.undoManager.add()}return g.addButton("wp_img_remove",{tooltip:"Remove",icon:"dashicon dashicons-no",onclick:function(){m(g.selection.getNode())}}),g.addButton("wp_img_edit",{tooltip:"Edit|button",icon:"dashicon dashicons-edit",onclick:function(){var e,t,n,p;e=g.selection.getNode(),"undefined"!=typeof wp&&wp.media?(n=function(e){var t,n,a,i,o=[],r=g.dom,c=/^\d+$/;(n={attachment_id:!1,size:"custom",caption:"",align:"none",extraClasses:"",link:!1,linkUrl:"",linkClassName:"",linkTargetBlank:!1,linkRel:"",title:""}).url=r.getAttrib(e,"src"),n.alt=r.getAttrib(e,"alt"),n.title=r.getAttrib(e,"title"),a=r.getAttrib(e,"width"),i=r.getAttrib(e,"height"),(!c.test(a)||parseInt(a,10)<1)&&(a=e.naturalWidth||e.width);(!c.test(i)||parseInt(i,10)<1)&&(i=e.naturalHeight||e.height);n.customWidth=n.width=a,n.customHeight=n.height=i,c=tinymce.explode(e.className," "),t=[],tinymce.each(c,function(e){/^wp-image/.test(e)?n.attachment_id=parseInt(e.replace("wp-image-",""),10):/^align/.test(e)?n.align=e.replace("align",""):/^size/.test(e)?n.size=e.replace("size-",""):t.push(e)}),n.extraClasses=t.join(" "),(a=r.getParents(e,".wp-caption")).length&&(a=a[0],c=a.className.split(" "),tinymce.each(c,function(e){/^align/.test(e)?n.align=e.replace("align",""):e&&"wp-caption"!==e&&o.push(e)}),n.captionClassName=o.join(" "),(i=r.select("dd.wp-caption-dd",a)).length)&&(i=i[0],n.caption=g.serializer.serialize(i).replace(/<br[^>]*>/g,"$&\n").replace(/^<p>/,"").replace(/<\/p>$/,""));e.parentNode&&"A"===e.parentNode.nodeName&&(c=e.parentNode,n.linkUrl=r.getAttrib(c,"href"),n.linkTargetBlank="_blank"===r.getAttrib(c,"target"),n.linkRel=r.getAttrib(c,"rel"),n.linkClassName=c.className);return n}(e),g.$(e).attr("data-wp-editing",1),wp.media.events.trigger("editor:image-edit",{editor:g,metadata:n,image:e}),t=wp.media({frame:"image",state:"image-details",metadata:n}),wp.media.events.trigger("editor:frame-create",{frame:t}),e=function(m){g.undoManager.transact(function(){var e,t,n,a,i,o,r,c,d,l,s;e=p,t=m,s=g.dom,e&&e.length&&(a=e[0],r=(r=tinymce.explode(t.extraClasses," "))||[],t.caption||r.push("align"+t.align),t.attachment_id&&(r.push("wp-image-"+t.attachment_id),t.size)&&"custom"!==t.size&&r.push("size-"+t.size),l=t.width,c=t.height,"custom"===t.size&&(l=t.customWidth,c=t.customHeight),c={src:t.url,width:l||null,height:c||null,title:t.title||null,class:r.join(" ")||null},s.setAttribs(a,c),e.attr("alt",t.alt||""),r={href:t.linkUrl,rel:t.linkRel||null,target:t.linkTargetBlank?"_blank":null,class:t.linkClassName||null},a.parentNode&&"A"===a.parentNode.nodeName&&!h(a.parentNode)?t.linkUrl?s.setAttribs(a.parentNode,r):s.remove(a.parentNode,!0):t.linkUrl&&((c=s.getParent(a,"a"))&&s.insertAfter(a,c),c=s.create("a",r),a.parentNode.insertBefore(c,a),c.appendChild(a)),r=g.dom.getParent(a,".mceTemp"),c=a.parentNode&&"A"===a.parentNode.nodeName&&!h(a.parentNode)?a.parentNode:a,t.caption?(t.caption=function(e){if(!e||-1===e.indexOf("<")&&-1===e.indexOf(">"))return e;u=u||new tinymce.html.Serializer({},g.schema);return u.serialize(g.parser.parse(e,{forced_root_block:!1}))}(t.caption),o=t.attachment_id?"attachment_"+t.attachment_id:null,d="wp-caption "+("align"+(t.align||"none")),t.captionClassName&&(d+=" "+t.captionClassName.replace(/[<>&]+/g,"")),g.getParam("wpeditimage_html5_captions")||(l=parseInt(l,10),l+=10),r?((i=s.select("dl.wp-caption",r)).length&&s.setAttribs(i,{id:o,class:d,style:"width: "+l+"px"}),(i=s.select(".wp-caption-dd",r)).length&&s.setHTML(i[0],t.caption)):(i="<dl "+(o=o?'id="'+o+'" ':"")+'class="'+d+'" style="width: '+l+'px"><dt class="wp-caption-dt"></dt><dd class="wp-caption-dd">'+t.caption+"</dd></dl>",o=s.create("div",{class:"mceTemp"},i),(n=s.getParent(c,"p"))?n.parentNode.insertBefore(o,n):c.parentNode.insertBefore(o,c),g.$(o).find("dt.wp-caption-dt").append(c),n&&s.isEmpty(n)&&s.remove(n))):r&&(n=s.create("p"),r.parentNode.insertBefore(n,r),n.appendChild(c),s.remove(r)),e=g.$(a),d=e.attr("srcset"),l=e.attr("src"),d&&l&&(l=l.replace(/[?#].*/,""),-1===d.indexOf(l))&&e.attr("srcset",null).attr("sizes",null),wp.media.events&&wp.media.events.trigger("editor:image-update",{editor:g,metadata:t,image:a}),g.nodeChanged())}),t.detach()},t.state("image-details").on("update",e),t.state("replace-image").on("replace",e),t.on("close",function(){g.focus(),t.detach(),(p=g.$("img[data-wp-editing]")).removeAttr("data-wp-editing")}),t.open()):g.execCommand("mceImage")}}),e({alignleft:"Align left",aligncenter:"Align center",alignright:"Align right",alignnone:"No alignment"},function(e,n){var t=n.slice(5);g.addButton("wp_img_"+n,{tooltip:e,icon:"dashicon dashicons-align-"+t,cmd:"alignnone"===n?"wpAlignNone":"Justify"+t.slice(0,1).toUpperCase()+t.slice(1),onPostRender:function(){var t=this;g.on("NodeChange",function(e){"IMG"===e.element.nodeName&&(e=g.dom.getParent(e.element,".wp-caption")||e.element,"alignnone"===n?t.active(!/\balign(left|center|right)\b/.test(e.className)):t.active(g.dom.hasClass(e,n)))})}})}),g.once("preinit",function(){g.wp&&g.wp._createToolbar&&(r=g.wp._createToolbar(["wp_img_alignleft","wp_img_aligncenter","wp_img_alignright","wp_img_alignnone","wp_img_edit","wp_img_remove"]))}),g.on("wptoolbar",function(e){"IMG"!==e.element.nodeName||i(e.element)||(e.toolbar=r)}),t&&g.on("init",function(){g.on("touchstart",function(e){"IMG"!==e.target.nodeName||o(e.target)||(n=!0)}),g.dom.bind(g.getDoc(),"touchmove",function(){n=!1}),g.on("touchend",function(e){var t;n&&"IMG"===e.target.nodeName&&!o(e.target)?(t=e.target,n=!1,window.setTimeout(function(){g.selection.select(t),g.nodeChanged()},100)):r&&r.hide()})}),g.on("init",function(){var t=g.dom,e=g.getParam("wpeditimage_html5_captions")?"html5-captions":"html4-captions";t.addClass(g.getBody(),e),tinymce.Env.ie&&10<tinymce.Env.ie&&t.bind(g.getBody(),"mscontrolselect",function(e){"IMG"===e.target.nodeName&&t.getParent(e.target,".wp-caption")?g.getBody().focus():"DL"===e.target.nodeName&&t.hasClass(e.target,"wp-caption")&&e.target.focus()})}),g.on("ObjectResized",function(a){var i=a.target;"IMG"===i.nodeName&&g.undoManager.transact(function(){var e,t,n=g.dom;i.className=i.className.replace(/\bsize-[^ ]+/,""),(e=n.getParent(i,".wp-caption"))&&(t=a.width||n.getAttrib(i,"width"))&&(t=parseInt(t,10),g.getParam("wpeditimage_html5_captions")||(t+=10),n.setStyle(e,"width",t+"px"))})}),g.on("pastePostProcess",function(e){g.dom.getParent(g.selection.getNode(),"dd.wp-caption-dd")&&(g.$("img, audio, video, object, embed, iframe, script, style",e.node).remove(),g.$("*",e.node).each(function(e,t){g.dom.isBlock(t)&&(tinymce.trim(t.textContent||t.innerText)?(g.dom.insertAfter(g.dom.create("br"),t),g.dom.remove(t,!0)):g.dom.remove(t))}),g.$("br",e.node).each(function(e,t){t.nextSibling&&"BR"!==t.nextSibling.nodeName&&t.previousSibling&&"BR"!==t.previousSibling.nodeName||g.dom.remove(t)}),c=!0)}),g.on("BeforeExecCommand",function(e){var t,n,a,i=e.command,o=g.dom;if("mceInsertContent"===i||"Indent"===i||"Outdent"===i){if(t=g.selection.getNode(),a=o.getParent(t,"div.mceTemp")){if("mceInsertContent"!==i)return e.preventDefault(),e.stopImmediatePropagation(),!1;c?c=!1:(n=o.create("p"),o.insertAfter(n,a),g.selection.setCursorLocation(n,0),"IMG"===t.nodeName&&g.$(a).remove(),g.nodeChanged())}}else"JustifyLeft"!==i&&"JustifyRight"!==i&&"JustifyCenter"!==i&&"wpAlignNone"!==i||(t=g.selection.getNode(),o="align"+i.slice(7).toLowerCase(),n=g.dom.getParent(t,".wp-caption"),"IMG"!==t.nodeName&&!n)||(a=g.dom.hasClass(t=n||t,o)?" alignnone":" "+o,t.className=l(t.className.replace(/ ?align(left|center|right|none)/g,"")+a),g.nodeChanged(),e.preventDefault(),r&&r.reposition(),g.fire("ExecCommand",{command:i,ui:e.ui,value:e.value}))}),g.on("keydown",function(e){var t,n,a,i=g.selection,o=e.keyCode,r=g.dom,c=tinymce.util.VK;if(o===c.ENTER)t=i.getNode(),(n=r.getParent(t,"div.mceTemp"))&&(r.events.cancel(e),tinymce.each(r.select("dt, dd",n),function(e){r.isEmpty(e)&&r.remove(e)}),a=tinymce.Env.ie&&tinymce.Env.ie<11?"":'<br data-mce-bogus="1" />',a=r.create("p",null,a),"DD"===t.nodeName?r.insertAfter(a,n):n.parentNode.insertBefore(a,n),g.nodeChanged(),i.setCursorLocation(a,0));else if((o===c.DELETE||o===c.BACKSPACE)&&("DIV"===(t=i.getNode()).nodeName&&r.hasClass(t,"mceTemp")?n=t:"IMG"!==t.nodeName&&"DT"!==t.nodeName&&"A"!==t.nodeName||(n=r.getParent(t,"div.mceTemp")),n))return r.events.cancel(e),m(t),!1}),tinymce.Env.gecko&&g.on("undo redo",function(){"IMG"===g.selection.getNode().nodeName&&g.selection.collapse()}),g.wpSetImgCaption=d,g.wpGetImgCaption=s,g.on("beforeGetContent",function(e){"raw"!==e.format&&g.$('img[id="__wp-temp-img-id"]').removeAttr("id")}),g.on("BeforeSetContent",function(e){"raw"!==e.format&&(e.content=g.wpSetImgCaption(e.content))}),g.on("PostProcess",function(e){e.get&&(e.content=g.wpGetImgCaption(e.content))}),g.on("dragstart",function(){var e=g.selection.getNode();"IMG"!==e.nodeName||(a=g.dom.getParent(e,".mceTemp"))||"A"!==e.parentNode.nodeName||h(e.parentNode)||(a=e.parentNode)}),g.on("drop",function(e){var t=g.dom,n=tinymce.dom.RangeUtils.getCaretRangeFromPoint(e.clientX,e.clientY,g.getDoc());n&&t.getParent(n.startContainer,".mceTemp")?e.preventDefault():a&&(e.preventDefault(),g.undoManager.transact(function(){n&&g.selection.setRng(n),g.selection.setNode(a),t.remove(a)})),a=null}),g.wp=g.wp||{},g.wp.isPlaceholder=i,{_do_shcode:d,_get_shcode:s}});