sergiotarxz
/
Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

TinyMCE: 

- Fix toolbar icons in IE9.
- Remove background gradients in IE < 10.
- Lint our plugins.
- Add draggable attribute to the caption wrapper and make the captioned images non-draggable in Chrome.
See #24067.

git-svn-id: https://develop.svn.wordpress.org/trunk@26880 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz 2013-12-30 01:53:25 +00:00
parent 2f8c1ccffc
commit c37a101100
7 changed files with 122 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

132
src/wp-includes/css/editor.css
View File

@ -2,12 +2,13 @@
TinyMCE and Quicklinks toolbars TinyMCE and Quicklinks toolbars
------------------------------------------------------------------------------*/ ------------------------------------------------------------------------------*/
.mce-panel { div.mce-panel {
border: 0; border: 0;
background: #fff; background: #fff;
filter: none;
} }
.mce-toolbar-grp { div.mce-toolbar-grp {
border-bottom: 1px solid #dedede; border-bottom: 1px solid #dedede;
background: #f5f5f5; background: #f5f5f5;
} }
@ -40,6 +41,7 @@
margin: 0 1px; margin: 0 1px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
border-radius: 2px; border-radius: 2px;
filter: none;
} }
#wp-fullscreen-buttons .mce-btn:hover, #wp-fullscreen-buttons .mce-btn:hover,
@ -107,37 +109,37 @@
color: #333; color: #333;
} }
.mce-i-bold, i.mce-i-bold,
.mce-i-italic, i.mce-i-italic,
.mce-i-bullist, i.mce-i-bullist,
.mce-i-numlist, i.mce-i-numlist,
.mce-i-blockquote, i.mce-i-blockquote,
.mce-i-alignleft, i.mce-i-alignleft,
.mce-i-aligncenter, i.mce-i-aligncenter,
.mce-i-alignright, i.mce-i-alignright,
.mce-i-link, i.mce-i-link,
.mce-i-unlink, i.mce-i-unlink,
.mce-i-wp_more, i.mce-i-wp_more,
.mce-i-strikethrough, i.mce-i-strikethrough,
.mce-i-spellchecker, i.mce-i-spellchecker,
.mce-i-fullscreen, i.mce-i-fullscreen,
.mce-i-wp_fullscreen, i.mce-i-wp_fullscreen,
.mce-i-wp_adv, i.mce-i-wp_adv,
.mce-i-underline, i.mce-i-underline,
.mce-i-alignjustify, i.mce-i-alignjustify,
.mce-i-forecolor, i.mce-i-forecolor,
.mce-i-pastetext, i.mce-i-pastetext,
.mce-i-pasteword, i.mce-i-pasteword,
.mce-i-removeformat, i.mce-i-removeformat,
.mce-i-charmap, i.mce-i-charmap,
.mce-i-outdent, i.mce-i-outdent,
.mce-i-indent, i.mce-i-indent,
.mce-i-undo, i.mce-i-undo,
.mce-i-redo, i.mce-i-redo,
.mce-i-help, i.mce-i-help,
.mce-i-wp_help, i.mce-i-wp_help,
.mce-i-wp-media-library, i.mce-i-wp-media-library,
.mce-i-ltr { i.mce-i-ltr {
font: normal 20px/1 'dashicons'; font: normal 20px/1 'dashicons';
padding: 0; padding: 0;
vertical-align: top; vertical-align: top;
@ -146,116 +148,117 @@
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
.mce-i-bold:before { i.mce-i-bold:before {
content: '\f200'; content: '\f200';
} }
.mce-i-italic:before { i.mce-i-italic:before {
content: '\f201'; content: '\f201';
} }
.mce-i-bullist:before { i.mce-i-bullist:before {
content: '\f203'; content: '\f203';
} }
.mce-i-numlist:before { i.mce-i-numlist:before {
content: '\f204'; content: '\f204';
} }
.mce-i-blockquote:before { i.mce-i-blockquote:before {
content: '\f205'; content: '\f205';
} }
.mce-i-alignleft:before { i.mce-i-alignleft:before {
content: '\f206'; content: '\f206';
} }
.mce-i-aligncenter:before { i.mce-i-aligncenter:before {
content: '\f207'; content: '\f207';
} }
.mce-i-alignright:before { i.mce-i-alignright:before {
content: '\f208'; content: '\f208';
} }
.mce-i-link:before { i.mce-i-link:before {
content: '\f103'; content: '\f103';
} }
.mce-i-unlink:before { i.mce-i-unlink:before {
content: '\f225'; content: '\f225';
} }
.mce-i-wp_more:before { i.mce-i-wp_more:before {
content: '\f209'; content: '\f209';
} }
.mce-i-strikethrough:before { i.mce-i-strikethrough:before {
content: '\f224'; content: '\f224';
} }
.mce-i-spellchecker:before { i.mce-i-spellchecker:before {
content: '\f210'; content: '\f210';
} }
.mce-i-fullscreen:before, i.mce-i-fullscreen:before,
.mce-i-wp_fullscreen:before { i.mce-i-wp_fullscreen:before {
content: '\f211'; content: '\f211';
} }
.mce-i-wp_adv:before { i.mce-i-wp_adv:before {
content: '\f212'; content: '\f212';
} }
.mce-i-underline:before {
i.mce-i-underline:before {
content: '\f213'; content: '\f213';
} }
.mce-i-alignjustify:before { i.mce-i-alignjustify:before {
content: '\f214'; content: '\f214';
} }
.mce-i-forecolor:before { i.mce-i-forecolor:before {
content: '\f215'; content: '\f215';
} }
.mce-i-pastetext:before { i.mce-i-pastetext:before {
content: '\f217'; content: '\f217';
} }
.mce-i-removeformat:before { i.mce-i-removeformat:before {
content: '\f218'; content: '\f218';
} }
.mce-i-charmap:before { i.mce-i-charmap:before {
content: '\f220'; content: '\f220';
} }
.mce-i-outdent:before { i.mce-i-outdent:before {
content: '\f221'; content: '\f221';
} }
.mce-i-indent:before { i.mce-i-indent:before {
content: '\f222'; content: '\f222';
} }
.mce-i-undo:before { i.mce-i-undo:before {
content: '\f171'; content: '\f171';
} }
.mce-i-redo:before { i.mce-i-redo:before {
content: '\f172'; content: '\f172';
} }
.mce-i-help:before, i.mce-i-help:before,
.mce-i-wp_help:before { i.mce-i-wp_help:before {
content: '\f223'; content: '\f223';
} }
.mce-i-wp-media-library:before { i.mce-i-wp-media-library:before {
content: '\f104'; content: '\f104';
} }
.mce-i-ltr:before { i.mce-i-ltr:before {
content: '\f320'; content: '\f320';
} }
@ -299,8 +302,7 @@
box-shadow: none; box-shadow: none;
} }
.quicktags-toolbar, .quicktags-toolbar {
.wp_themeSkin tr.mceFirst td.mceToolbar {
border-bottom: 1px solid #dedede; border-bottom: 1px solid #dedede;
background: #f5f5f5; background: #f5f5f5;
} }

12
src/wp-includes/js/tinymce/plugins/wordpress/plugin.js
View File

@ -4,10 +4,14 @@ tinymce.PluginManager.add( 'wordpress', function( editor ) {
last = 0; last = 0;
function toggleToolbars( state ) { function toggleToolbars( state ) {
var iframe, var iframe, initial, toolbars,
pixels = 0, pixels = 0;
initial = state === 'hide',
toolbars = editor.theme.panel && editor.theme.panel.find('.toolbar'); initial = ( state === 'hide' );
if ( editor.theme.panel ) {
toolbars = editor.theme.panel.find('.toolbar');
}
if ( ! toolbars || toolbars.length < 2 || ( state === 'hide' && ! toolbars[1].visible() ) ) { if ( ! toolbars || toolbars.length < 2 || ( state === 'hide' && ! toolbars[1].visible() ) ) {
return; return;

17
src/wp-includes/js/tinymce/plugins/wpeditimage/plugin.js
View File

@ -49,6 +49,11 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
function getShortcode( content ) { function getShortcode( content ) {
return content.replace( /<div (?:id="attachment_|class="mceTemp)[^>]*>([\s\S]+?)<\/div>/g, function( a, b ) { return content.replace( /<div (?:id="attachment_|class="mceTemp)[^>]*>([\s\S]+?)<\/div>/g, function( a, b ) {
if ( b.indexOf('<img ') === -1 ) {
// Broken caption. The user dragged the image out?
return '';
}
var ret = b.replace( /<dl ([^>]+)>\s*<dt [^>]+>([\s\S]+?)<\/dt>\s*<dd [^>]+>([\s\S]*?)<\/dd>\s*<\/dl>/gi, function( a, b, c, cap ) { var ret = b.replace( /<dl ([^>]+)>\s*<dt [^>]+>([\s\S]+?)<\/dt>\s*<dd [^>]+>([\s\S]*?)<\/dd>\s*<\/dl>/gi, function( a, b, c, cap ) {
var id, cls, w; var id, cls, w;
@ -129,7 +134,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
captionId = '', captionId = '',
captionAlign = '', captionAlign = '',
captionWidth = '', captionWidth = '',
wrap, parent, html, P, imgId; wrap, parent, node, html, imgId;
// Temp image id so we can find the node later // Temp image id so we can find the node later
data.id = '__wp-temp-img-id'; data.id = '__wp-temp-img-id';
@ -178,7 +183,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
} }
if ( parent && parent.nodeName === 'P' ) { if ( parent && parent.nodeName === 'P' ) {
wrap = dom.create( 'div', { 'class': 'mceTemp' }, html ); wrap = dom.create( 'div', { 'class': 'mceTemp', 'draggable': 'true' }, html );
dom.insertAfter( wrap, parent ); dom.insertAfter( wrap, parent );
editor.selection.select( wrap ); editor.selection.select( wrap );
editor.nodeChanged(); editor.nodeChanged();
@ -187,7 +192,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
dom.remove( parent ); dom.remove( parent );
} }
} else { } else {
editor.selection.setContent( '<div class="mceTemp">' + html + '</div>' ); editor.selection.setContent( '<div class="mceTemp" draggable="true">' + html + '</div>' );
} }
} else { } else {
editor.selection.setContent( html ); editor.selection.setContent( html );
@ -244,7 +249,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
'<dt class="wp-caption-dt">'+ html +'</dt><dd class="wp-caption-dd">'+ caption +'</dd></dl>'; '<dt class="wp-caption-dt">'+ html +'</dt><dd class="wp-caption-dd">'+ caption +'</dd></dl>';
if ( parent = dom.getParent( imgNode, 'p' ) ) { if ( parent = dom.getParent( imgNode, 'p' ) ) {
wrap = dom.create( 'div', { 'class': 'mceTemp' }, html ); wrap = dom.create( 'div', { 'class': 'mceTemp', 'draggable': 'true' }, html );
dom.insertAfter( wrap, parent ); dom.insertAfter( wrap, parent );
editor.selection.select( wrap ); editor.selection.select( wrap );
editor.nodeChanged(); editor.nodeChanged();
@ -256,7 +261,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
dom.remove( parent ); dom.remove( parent );
} }
} else { } else {
editor.selection.setContent( '<div class="mceTemp">' + html + '</div>' ); editor.selection.setContent( '<div class="mceTemp" draggable="true">' + html + '</div>' );
} }
} }
} else { } else {
@ -284,7 +289,7 @@ tinymce.PluginManager.add( 'wpeditimage', function( editor ) {
editor.on( 'wpLoadImageData', function( e ) { editor.on( 'wpLoadImageData', function( e ) {
var parent, var parent,
data = e.imgData.data data = e.imgData.data,
imgNode = e.imgData.node; imgNode = e.imgData.node;
if ( parent = dom.getParent( imgNode, 'dl.wp-caption' ) ) { if ( parent = dom.getParent( imgNode, 'dl.wp-caption' ) ) {

5
src/wp-includes/js/tinymce/plugins/wpfullscreen/plugin.js
View File

@ -10,11 +10,10 @@ tinymce.PluginManager.add( 'wpfullscreen', function( editor ) {
var deltaSize, myHeight, var deltaSize, myHeight,
d = editor.getDoc(), d = editor.getDoc(),
body = d.body, body = d.body,
de = d.documentElement, DOM = tinymce.DOM,
DOM = tinymce.DOM
resizeHeight = 250; resizeHeight = 250;
if ( ( e && e.type == 'setcontent' && e.initial ) || editor.settings.inline ) { if ( ( e && e.type === 'setcontent' && e.initial ) || editor.settings.inline ) {
return; return;
} }

4
src/wp-includes/js/tinymce/plugins/wpgallery/plugin.js
View File

@ -1,5 +1,5 @@
/* global tinymce */ /* global tinymce */
tinymce.PluginManager.add('wpgallery', function( editor, url ) { tinymce.PluginManager.add('wpgallery', function( editor ) {
function parseGallery( content ) { function parseGallery( content ) {
return content.replace( /\[gallery([^\]]*)\]/g, function( match, attr ) { return content.replace( /\[gallery([^\]]*)\]/g, function( match, attr ) {
@ -69,7 +69,7 @@ tinymce.PluginManager.add('wpgallery', function( editor, url ) {
}); });
*/ */
editor.on( 'mouseup', function( e ) { editor.on( 'mouseup', function( e ) {
if ( e.target.nodeName == 'IMG' && editor.dom.hasClass( e.target, 'wp-gallery' ) ) { if ( e.target.nodeName === 'IMG' && editor.dom.hasClass( e.target, 'wp-gallery' ) ) {
// Don't trigger on right-click // Don't trigger on right-click
if ( e.button !== 2 ) { if ( e.button !== 2 ) {
if ( editor.dom.hasClass( e.target, 'wp-gallery-selected' ) ) { if ( editor.dom.hasClass( e.target, 'wp-gallery-selected' ) ) {

40
src/wp-includes/js/tinymce/plugins/wpview/plugin.js
View File

@ -13,8 +13,9 @@
var wpView = this; var wpView = this;
// Check if the `wp.mce` API exists. // Check if the `wp.mce` API exists.
if ( typeof wp === 'undefined' || ! wp.mce ) if ( typeof wp === 'undefined' || ! wp.mce ) {
return; return;
}
editor.on( 'PreInit', function() { editor.on( 'PreInit', function() {
// Add elements so we can set `contenteditable` to false. // Add elements so we can set `contenteditable` to false.
@ -26,8 +27,9 @@
// view wrappers. Since the editor's DOM is outdated at this point, // view wrappers. Since the editor's DOM is outdated at this point,
// we'll wait to render the views. // we'll wait to render the views.
editor.on( 'BeforeSetContent', function( e ) { editor.on( 'BeforeSetContent', function( e ) {
if ( ! e.content ) if ( ! e.content ) {
return; return;
}
e.content = wp.mce.view.toViews( e.content ); e.content = wp.mce.view.toViews( e.content );
}); });
@ -42,13 +44,14 @@
var selection = editor.selection; var selection = editor.selection;
// When a view is selected, ensure content that is being pasted // When a view is selected, ensure content that is being pasted
// or inserted is added to a text node (instead of the view). // or inserted is added to a text node (instead of the view).
editor.on( 'BeforeSetContent', function( e ) { editor.on( 'BeforeSetContent', function() {
var walker, target, var walker, target,
view = wpView.getParentView( selection.getNode() ); view = wpView.getParentView( selection.getNode() );
// If the selection is not within a view, bail. // If the selection is not within a view, bail.
if ( ! view ) if ( ! view ) {
return; return;
}
// If there are no additional nodes or the next node is a // If there are no additional nodes or the next node is a
// view, create a text node after the current view. // view, create a text node after the current view.
@ -72,13 +75,15 @@
// //
// Runs on paste and on inserting nodes/html. // Runs on paste and on inserting nodes/html.
editor.on( 'SetContent', function( e ) { editor.on( 'SetContent', function( e ) {
if ( ! e.context ) if ( ! e.context ) {
return; return;
}
var node = selection.getNode(); var node = selection.getNode();
if ( ! node.innerHTML ) if ( ! node.innerHTML ) {
return; return;
}
node.innerHTML = wp.mce.view.toViews( node.innerHTML ); node.innerHTML = wp.mce.view.toViews( node.innerHTML );
wp.mce.view.render( node ); wp.mce.view.render( node );
@ -88,8 +93,9 @@
// When the editor's contents are being accessed as a string, // When the editor's contents are being accessed as a string,
// transform any views back to their text representations. // transform any views back to their text representations.
editor.on( 'PostProcess', function( e ) { editor.on( 'PostProcess', function( e ) {
if ( ( ! e.get && ! e.save ) || ! e.content ) if ( ( ! e.get && ! e.save ) || ! e.content ) {
return; return;
}
e.content = wp.mce.view.toText( e.content ); e.content = wp.mce.view.toText( e.content );
}); });
@ -97,7 +103,7 @@
// Triggers when the selection is changed. // Triggers when the selection is changed.
// Add the event handler to the top of the stack. // Add the event handler to the top of the stack.
editor.on( 'NodeChange', function( e ) { editor.on( 'NodeChange', function( e ) {
var view = wpView.getParentView( node ); var view = wpView.getParentView( e.element );
// Update the selected view. // Update the selected view.
if ( view ) { if ( view ) {
@ -117,12 +123,13 @@
view, instance; view, instance;
// If a view isn't selected, let the event go on its merry way. // If a view isn't selected, let the event go on its merry way.
if ( ! selected ) if ( ! selected ) {
return; return;
}
// If the caret is not within the selected view, deselect the // If the caret is not within the selected view, deselect the
// view and bail. // view and bail.
view = wpView.getParentView( selection.getNode() ); view = wpView.getParentView( editor.selection.getNode() );
if ( view !== selected ) { if ( view !== selected ) {
wpView.deselect(); wpView.deselect();
return; return;
@ -138,8 +145,9 @@
// Let keypresses that involve the command or control keys through. // Let keypresses that involve the command or control keys through.
// Also, let any of the F# keys through. // Also, let any of the F# keys through.
if ( event.metaKey || event.ctrlKey || ( keyCode >= 112 && keyCode <= 123 ) ) if ( event.metaKey || event.ctrlKey || ( keyCode >= 112 && keyCode <= 123 ) ) {
return; return;
}
event.preventDefault(); event.preventDefault();
}); });
@ -147,8 +155,9 @@
getParentView : function( node ) { getParentView : function( node ) {
while ( node ) { while ( node ) {
if ( this.isView( node ) ) if ( this.isView( node ) ) {
return node; return node;
}
node = node.parentNode; node = node.parentNode;
} }
@ -159,8 +168,9 @@
}, },
select : function( view ) { select : function( view ) {
if ( view === selected ) if ( view === selected ) {
return; return;
}
this.deselect(); this.deselect();
selected = view; selected = view;
@ -168,8 +178,10 @@
}, },
deselect : function() { deselect : function() {
if ( selected ) if ( selected ) {
wp.mce.view.deselect( selected ); wp.mce.view.deselect( selected );
}
selected = null; selected = null;
} }
}); });

8
src/wp-includes/js/tinymce/skins/wordpress/wp-content.css
View File

@ -50,8 +50,12 @@ dl.aligncenter {
border: 0 none; border: 0 none;
} }
.wp-caption img, div.mceTemp {
.wp-caption a { -ms-user-select: element;
}
dl.wp-caption,
dl.wp-caption * {
-webkit-user-drag: none; -webkit-user-drag: none;
} }