<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[38637] trunk/src/wp-admin/js/post.js: Editor: Improve `post.js` documentation.</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta" style="font-size: 105%">
<dt style="float: left; width: 6em; font-weight: bold">Revision</dt> <dd><a style="font-weight: bold" href="https://core.trac.wordpress.org/changeset/38637">38637</a><script type="application/ld+json">{"@context":"http://schema.org","@type":"EmailMessage","description":"Review this Commit","action":{"@type":"ViewAction","url":"https://core.trac.wordpress.org/changeset/38637","name":"Review Commit"}}</script></dd>
<dt style="float: left; width: 6em; font-weight: bold">Author</dt> <dd>SergeyBiryukov</dd>
<dt style="float: left; width: 6em; font-weight: bold">Date</dt> <dd>2016-09-21 08:56:28 +0000 (Wed, 21 Sep 2016)</dd>
</dl>
<pre style='padding-left: 1em; margin: 2em 0; border-left: 2px solid #ccc; line-height: 1.25; font-size: 105%; font-family: sans-serif'>Editor: Improve `post.js` documentation.
Props jipmoors, boblinthorst.
Fixes <a href="https://core.trac.wordpress.org/ticket/38118">#38118</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcwpadminjspostjs">trunk/src/wp-admin/js/post.js</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcwpadminjspostjs"></a>
<div class="modfile"><h4 style="background-color: #eee; color: inherit; margin: 1em 0; padding: 1.3em; font-size: 115%">Modified: trunk/src/wp-admin/js/post.js</h4>
<pre class="diff"><span>
<span class="info" style="display: block; padding: 0 10px; color: #888">--- trunk/src/wp-admin/js/post.js 2016-09-20 21:38:08 UTC (rev 38636)
+++ trunk/src/wp-admin/js/post.js 2016-09-21 08:56:28 UTC (rev 38637)
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1,173 +1,251 @@
</span><span class="cx" style="display: block; padding: 0 10px"> /* global postL10n, ajaxurl, wpAjax, setPostThumbnailL10n, postboxes, pagenow, tinymce, alert, deleteUserSetting */
</span><span class="cx" style="display: block; padding: 0 10px"> /* global theList:true, theExtraList:true, getUserSetting, setUserSetting, commentReply */
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/**
+ * Contains all dynamic functionality needed on post and term pages.
+ *
+ * @summary Control page and term functionality.
+ */
+
</ins><span class="cx" style="display: block; padding: 0 10px"> var commentsBox, WPSetThumbnailHTML, WPSetThumbnailID, WPRemoveThumbnail, wptitlehint, makeSlugeditClickable, editPermalink;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-// Back-compat: prevent fatal errors
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+// Backwards compatibility: prevent fatal errors.
</ins><span class="cx" style="display: block; padding: 0 10px"> makeSlugeditClickable = editPermalink = function(){};
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+// Make sure the wp object exists.
</ins><span class="cx" style="display: block; padding: 0 10px"> window.wp = window.wp || {};
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> ( function( $ ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var titleHasFocus = false;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-commentsBox = {
- st : 0,
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Control loading of comments on the post and term edit pages.
+ *
+ * @type {{st: number, get: commentsBox.get, load: commentsBox.load}}
+ *
+ * @namespace commentsBox
+ */
+ commentsBox = {
+ // Comment offset to use when fetching new comments.
+ st : 0,
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- get : function(total, num) {
- var st = this.st, data;
- if ( ! num )
- num = 20;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Fetch comments using AJAX and display them in the box.
+ *
+ * @param {int} total Total number of comments for this post.
+ * @param {int} num Optional. Number of comments to fetch, defaults to 20.
+ * @returns {boolean} Always returns false.
+ *
+ * @memberof commentsBox
+ */
+ get : function(total, num) {
+ var st = this.st, data;
+ if ( ! num )
+ num = 20;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- this.st += num;
- this.total = total;
- $( '#commentsdiv .spinner' ).addClass( 'is-active' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ this.st += num;
+ this.total = total;
+ $( '#commentsdiv .spinner' ).addClass( 'is-active' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- data = {
- 'action' : 'get-comments',
- 'mode' : 'single',
- '_ajax_nonce' : $('#add_comment_nonce').val(),
- 'p' : $('#post_ID').val(),
- 'start' : st,
- 'number' : num
- };
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ data = {
+ 'action' : 'get-comments',
+ 'mode' : 'single',
+ '_ajax_nonce' : $('#add_comment_nonce').val(),
+ 'p' : $('#post_ID').val(),
+ 'start' : st,
+ 'number' : num
+ };
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $.post(ajaxurl, data,
- function(r) {
- r = wpAjax.parseAjaxResponse(r);
- $('#commentsdiv .widefat').show();
- $( '#commentsdiv .spinner' ).removeClass( 'is-active' );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $.post(
+ ajaxurl,
+ data,
+ function(r) {
+ r = wpAjax.parseAjaxResponse(r);
+ $('#commentsdiv .widefat').show();
+ $( '#commentsdiv .spinner' ).removeClass( 'is-active' );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( 'object' == typeof r && r.responses[0] ) {
- $('#the-comment-list').append( r.responses[0].data );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( 'object' == typeof r && r.responses[0] ) {
+ $('#the-comment-list').append( r.responses[0].data );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- theList = theExtraList = null;
- $( 'a[className*=\':\']' ).unbind();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ theList = theExtraList = null;
+ $( 'a[className*=\':\']' ).unbind();
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( commentsBox.st > commentsBox.total )
- $('#show-comments').hide();
- else
- $('#show-comments').show().children('a').html(postL10n.showcomm);
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // If the offset is over the total number of comments we cannot fetch any more, so hide the button.
+ if ( commentsBox.st > commentsBox.total )
+ $('#show-comments').hide();
+ else
+ $('#show-comments').show().children('a').html(postL10n.showcomm);
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- return;
- } else if ( 1 == r ) {
- $('#show-comments').html(postL10n.endcomm);
- return;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ return;
+ } else if ( 1 == r ) {
+ $('#show-comments').html(postL10n.endcomm);
+ return;
+ }
+
+ $('#the-comment-list').append('<tr><td colspan="2">'+wpAjax.broken+'</td></tr>');
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ );
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $('#the-comment-list').append('<tr><td colspan="2">'+wpAjax.broken+'</td></tr>');
- }
- );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ return false;
+ },
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- return false;
- },
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Load the next batch of comments.
+ *
+ * @param {int} total Total number of comments to load.
+ *
+ * @memberof commentsBox
+ */
+ load: function(total){
+ this.st = jQuery('#the-comment-list tr.comment:visible').length;
+ this.get(total);
+ }
+ };
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- load: function(total){
- this.st = jQuery('#the-comment-list tr.comment:visible').length;
- this.get(total);
- }
-};
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Overwrite the content of the Featured Image postbox
+ *
+ * @param {string} html New HTML to be displayed in the content area of the postbox.
+ *
+ * @global
+ */
+ WPSetThumbnailHTML = function(html){
+ $('.inside', '#postimagediv').html(html);
+ };
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-WPSetThumbnailHTML = function(html){
- $('.inside', '#postimagediv').html(html);
-};
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Set the Image ID of the Featured Image
+ *
+ * @param {int} id The post_id of the image to use as Featured Image.
+ *
+ * @global
+ */
+ WPSetThumbnailID = function(id){
+ var field = $('input[value="_thumbnail_id"]', '#list-table');
+ if ( field.length > 0 ) {
+ $('#meta\\[' + field.attr('id').match(/[0-9]+/) + '\\]\\[value\\]').text(id);
+ }
+ };
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-WPSetThumbnailID = function(id){
- var field = $('input[value="_thumbnail_id"]', '#list-table');
- if ( field.length > 0 ) {
- $('#meta\\[' + field.attr('id').match(/[0-9]+/) + '\\]\\[value\\]').text(id);
- }
-};
-
-WPRemoveThumbnail = function(nonce){
- $.post(ajaxurl, {
- action: 'set-post-thumbnail', post_id: $( '#post_ID' ).val(), thumbnail_id: -1, _ajax_nonce: nonce, cookie: encodeURIComponent( document.cookie )
- }, function(str){
- if ( str == '0' ) {
- alert( setPostThumbnailL10n.error );
- } else {
- WPSetThumbnailHTML(str);
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Remove the Featured Image
+ *
+ * @param {string} nonce Nonce to use in the request.
+ *
+ * @global
+ */
+ WPRemoveThumbnail = function(nonce){
+ $.post(ajaxurl, {
+ action: 'set-post-thumbnail', post_id: $( '#post_ID' ).val(), thumbnail_id: -1, _ajax_nonce: nonce, cookie: encodeURIComponent( document.cookie )
+ },
+ /**
+ * Handle server response
+ *
+ * @param {string} str Response, will be '0' when an error occured otherwise contains link to add Featured Image.
+ */
+ function(str){
+ if ( str == '0' ) {
+ alert( setPostThumbnailL10n.error );
+ } else {
+ WPSetThumbnailHTML(str);
+ }
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- }
- );
-};
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ );
+ };
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-$(document).on( 'heartbeat-send.refresh-lock', function( e, data ) {
- var lock = $('#active_post_lock').val(),
- post_id = $('#post_ID').val(),
- send = {};
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Heartbeat locks.
+ *
+ * Used to lock editing of an object by only one user at a time.
+ *
+ * When the user does not send a heartbeat in a heartbeat-time
+ * the user is no longer editing and another user can start editing.
+ */
+ $(document).on( 'heartbeat-send.refresh-lock', function( e, data ) {
+ var lock = $('#active_post_lock').val(),
+ post_id = $('#post_ID').val(),
+ send = {};
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( ! post_id || ! $('#post-lock-dialog').length )
- return;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( ! post_id || ! $('#post-lock-dialog').length )
+ return;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- send.post_id = post_id;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ send.post_id = post_id;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( lock )
- send.lock = lock;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( lock )
+ send.lock = lock;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- data['wp-refresh-post-lock'] = send;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ data['wp-refresh-post-lock'] = send;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-}).on( 'heartbeat-tick.refresh-lock', function( e, data ) {
- // Post locks: update the lock string or show the dialog if somebody has taken over editing
- var received, wrap, avatar;
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }).on( 'heartbeat-tick.refresh-lock', function( e, data ) {
+ // Post locks: update the lock string or show the dialog if somebody has taken over editing.
+ var received, wrap, avatar;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( data['wp-refresh-post-lock'] ) {
- received = data['wp-refresh-post-lock'];
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( data['wp-refresh-post-lock'] ) {
+ received = data['wp-refresh-post-lock'];
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( received.lock_error ) {
- // show "editing taken over" message
- wrap = $('#post-lock-dialog');
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( received.lock_error ) {
+ // Show "editing taken over" message.
+ wrap = $('#post-lock-dialog');
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( wrap.length && ! wrap.is(':visible') ) {
- if ( wp.autosave ) {
- // Save the latest changes and disable
- $(document).one( 'heartbeat-tick', function() {
- wp.autosave.server.suspend();
- wrap.removeClass('saving').addClass('saved');
- $(window).off( 'beforeunload.edit-post' );
- });
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( wrap.length && ! wrap.is(':visible') ) {
+ if ( wp.autosave ) {
+ // Save the latest changes and disable.
+ $(document).one( 'heartbeat-tick', function() {
+ wp.autosave.server.suspend();
+ wrap.removeClass('saving').addClass('saved');
+ $(window).off( 'beforeunload.edit-post' );
+ });
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- wrap.addClass('saving');
- wp.autosave.server.triggerSave();
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ wrap.addClass('saving');
+ wp.autosave.server.triggerSave();
+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( received.lock_error.avatar_src ) {
- avatar = $( '<img class="avatar avatar-64 photo" width="64" height="64" alt="" />' ).attr( 'src', received.lock_error.avatar_src.replace( /&/g, '&' ) );
- wrap.find('div.post-locked-avatar').empty().append( avatar );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( received.lock_error.avatar_src ) {
+ avatar = $( '<img class="avatar avatar-64 photo" width="64" height="64" alt="" />' ).attr( 'src', received.lock_error.avatar_src.replace( /&/g, '&' ) );
+ wrap.find('div.post-locked-avatar').empty().append( avatar );
+ }
+
+ wrap.show().find('.currently-editing').text( received.lock_error.text );
+ wrap.find('.wp-tab-first').focus();
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- wrap.show().find('.currently-editing').text( received.lock_error.text );
- wrap.find('.wp-tab-first').focus();
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ } else if ( received.new_lock ) {
+ $('#active_post_lock').val( received.new_lock );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- } else if ( received.new_lock ) {
- $('#active_post_lock').val( received.new_lock );
</del><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- }
-}).on( 'before-autosave.update-post-slug', function() {
- titleHasFocus = document.activeElement && document.activeElement.id === 'title';
-}).on( 'after-autosave.update-post-slug', function() {
- // Create slug area only if not already there
- // and the title field was not focused (user was not typing a title) when autosave ran
- if ( ! $('#edit-slug-box > *').length && ! titleHasFocus ) {
- $.post( ajaxurl, {
- action: 'sample-permalink',
- post_id: $('#post_ID').val(),
- new_title: $('#title').val(),
- samplepermalinknonce: $('#samplepermalinknonce').val()
- },
- function( data ) {
- if ( data != '-1' ) {
- $('#edit-slug-box').html(data);
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }).on( 'before-autosave.update-post-slug', function() {
+ titleHasFocus = document.activeElement && document.activeElement.id === 'title';
+ }).on( 'after-autosave.update-post-slug', function() {
+
+ /*
+ * Create slug area only if not already there
+ * and the title field was not focused (user was not typing a title) when autosave ran.
+ */
+ if ( ! $('#edit-slug-box > *').length && ! titleHasFocus ) {
+ $.post( ajaxurl, {
+ action: 'sample-permalink',
+ post_id: $('#post_ID').val(),
+ new_title: $('#title').val(),
+ samplepermalinknonce: $('#samplepermalinknonce').val()
+ },
+ function( data ) {
+ if ( data != '-1' ) {
+ $('#edit-slug-box').html(data);
+ }
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- }
- );
- }
-});
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ );
+ }
+ });
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> }(jQuery));
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/**
+ * Heartbeat refresh nonces.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> (function($) {
</span><span class="cx" style="display: block; padding: 0 10px"> var check, timeout;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Only allow to check for nonce refresh every 30 seconds.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> function schedule() {
</span><span class="cx" style="display: block; padding: 0 10px"> check = false;
</span><span class="cx" style="display: block; padding: 0 10px"> window.clearTimeout( timeout );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -205,6 +283,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px"> }(jQuery));
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/**
+ * All post and postbox controls and functionality.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> jQuery(document).ready( function($) {
</span><span class="cx" style="display: block; padding: 0 10px"> var stamp, visibility, $submitButtons, updateVisibility, updateText,
</span><span class="cx" style="display: block; padding: 0 10px"> sticky = '',
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -220,32 +301,37 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> postboxes.add_postbox_toggles(pagenow);
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Clear the window name. Otherwise if this is a former preview window where the user navigated to edit another post,
- // and the first post is still being edited, clicking Preview there will use this window to show the preview.
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /*
+ * Clear the window name. Otherwise if this is a former preview window where the user navigated to edit another post,
+ * and the first post is still being edited, clicking Preview there will use this window to show the preview.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> window.name = '';
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // Post locks: contain focus inside the dialog. If the dialog is shown, focus the first item.
</span><span class="cx" style="display: block; padding: 0 10px"> $('#post-lock-dialog .notification-dialog').on( 'keydown', function(e) {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Don't do anything when [tab] is pressed.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( e.which != 9 )
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> var target = $(e.target);
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // [shift] + [tab] on first tab cycles back to last tab.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( target.hasClass('wp-tab-first') && e.shiftKey ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $(this).find('.wp-tab-last').focus();
</span><span class="cx" style="display: block; padding: 0 10px"> e.preventDefault();
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // [tab] on last tab cycles back to first tab.
</ins><span class="cx" style="display: block; padding: 0 10px"> } else if ( target.hasClass('wp-tab-last') && ! e.shiftKey ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $(this).find('.wp-tab-first').focus();
</span><span class="cx" style="display: block; padding: 0 10px"> e.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> }).filter(':visible').find('.wp-tab-first').focus();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Set the heartbeat interval to 15 sec. if post lock dialogs are enabled
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Set the heartbeat interval to 15 sec. if post lock dialogs are enabled.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( wp.heartbeat && $('#post-lock-dialog').length ) {
</span><span class="cx" style="display: block; padding: 0 10px"> wp.heartbeat.interval( 15 );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // The form is being submitted by the user
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // The form is being submitted by the user.
</ins><span class="cx" style="display: block; padding: 0 10px"> $submitButtons = $submitpost.find( ':submit, a.submitdelete, #post-preview' ).on( 'click.edit-post', function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var $button = $(this);
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -265,7 +351,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Stop autosave
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Stop auto save.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( wp.autosave ) {
</span><span class="cx" style="display: block; padding: 0 10px"> wp.autosave.server.suspend();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -350,7 +436,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Autosave new posts after a title is typed
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Auto save new posts after a title is typed.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $( '#auto_draft' ).val() ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $( '#title' ).blur( function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var cancel;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -359,7 +445,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Cancel the autosave when the blur was triggered by the user submitting the form
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Cancel the auto save when the blur was triggered by the user submitting the form.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('form#post').one( 'submit', function() {
</span><span class="cx" style="display: block; padding: 0 10px"> cancel = true;
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -388,6 +474,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /*
+ * When the user is trying to load another page, or reloads current page
+ * show a confirmation dialog when there are unsaved changes.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> $(window).on( 'beforeunload.edit-post', function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var editor = typeof tinymce !== 'undefined' && tinymce.get('content');
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -401,8 +491,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Unload is triggered (by hand) on removing the Thickbox iframe.
- // Make sure we process only the main document unload.
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /*
+ * Unload is triggered (by hand) on removing the Thickbox iframe.
+ * Make sure we process only the main document unload.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( event.target && event.target.nodeName != '#document' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -435,7 +527,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // multi-taxonomies
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Multiple Taxonomies.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $('#tagsdiv-post_tag').length ) {
</span><span class="cx" style="display: block; padding: 0 10px"> window.tagBox && window.tagBox.init();
</span><span class="cx" style="display: block; padding: 0 10px"> } else {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -447,7 +539,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // categories
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Handle categories.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('.categorydiv').each( function(){
</span><span class="cx" style="display: block; padding: 0 10px"> var this_id = $(this).attr('id'), catAddBefore, catAddAfter, taxonomyParts, taxonomy, settingName;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -455,8 +547,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> taxonomyParts.shift();
</span><span class="cx" style="display: block; padding: 0 10px"> taxonomy = taxonomyParts.join('-');
</span><span class="cx" style="display: block; padding: 0 10px"> settingName = taxonomy + '_tab';
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( taxonomy == 'category' )
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ if ( taxonomy == 'category' ) {
</ins><span class="cx" style="display: block; padding: 0 10px"> settingName = 'cats';
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> // TODO: move to jQuery 1.3+, support for multiple hierarchical taxonomies, see wp-lists.js
</span><span class="cx" style="display: block; padding: 0 10px"> $('a', '#' + taxonomy + '-tabs').click( function( e ) {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -465,34 +559,62 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $(this).parent().addClass('tabs').siblings('li').removeClass('tabs');
</span><span class="cx" style="display: block; padding: 0 10px"> $('#' + taxonomy + '-tabs').siblings('.tabs-panel').hide();
</span><span class="cx" style="display: block; padding: 0 10px"> $(t).show();
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( '#' + taxonomy + '-all' == t )
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( '#' + taxonomy + '-all' == t ) {
</ins><span class="cx" style="display: block; padding: 0 10px"> deleteUserSetting( settingName );
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- else
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ } else {
</ins><span class="cx" style="display: block; padding: 0 10px"> setUserSetting( settingName, 'pop' );
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( getUserSetting( settingName ) )
</span><span class="cx" style="display: block; padding: 0 10px"> $('a[href="#' + taxonomy + '-pop"]', '#' + taxonomy + '-tabs').click();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Ajax Cat
- $( '#new' + taxonomy ).one( 'focus', function() { $( this ).val( '' ).removeClass( 'form-input-tip' ); } );
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Add category button controls.
+ $('#new' + taxonomy).one( 'focus', function() {
+ $( this ).val( '' ).removeClass( 'form-input-tip' );
+ });
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // On [enter] submit the taxonomy.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#new' + taxonomy).keypress( function(event){
</span><span class="cx" style="display: block; padding: 0 10px"> if( 13 === event.keyCode ) {
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> $('#' + taxonomy + '-add-submit').click();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $('#' + taxonomy + '-add-submit').click( function(){ $('#new' + taxonomy).focus(); });
</del><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // After submitting a new taxonomy, re-focus the input field.
+ $('#' + taxonomy + '-add-submit').click( function() {
+ $('#new' + taxonomy).focus();
+ });
+
+ /**
+ * Before adding a new taxonomy, disable submit button.
+ *
+ * @param {Object} s Taxonomy object which will be added.
+ *
+ * @returns {Object}
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> catAddBefore = function( s ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( !$('#new'+taxonomy).val() )
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ if ( !$('#new'+taxonomy).val() ) {
</ins><span class="cx" style="display: block; padding: 0 10px"> return false;
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }
+
</ins><span class="cx" style="display: block; padding: 0 10px"> s.data += '&' + $( ':checked', '#'+taxonomy+'checklist' ).serialize();
</span><span class="cx" style="display: block; padding: 0 10px"> $( '#' + taxonomy + '-add-submit' ).prop( 'disabled', true );
</span><span class="cx" style="display: block; padding: 0 10px"> return s;
</span><span class="cx" style="display: block; padding: 0 10px"> };
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Re-enable submit button after a taxonomy has been added.
+ *
+ * Re-enable submit button.
+ * If the taxonomy has a parent place the taxonomy underneath the parent.
+ *
+ * @param {Object} r Response.
+ * @param {Object} s Taxonomy data.
+ *
+ * @returns void
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> catAddAfter = function( r, s ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var sup, drop = $('#new'+taxonomy+'_parent');
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -510,6 +632,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> addAfter: catAddAfter
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Add new taxonomy button toggles input form visibility.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#' + taxonomy + '-add-toggle').click( function( e ) {
</span><span class="cx" style="display: block; padding: 0 10px"> e.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> $('#' + taxonomy + '-adder').toggleClass( 'wp-hidden-children' );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -517,6 +640,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $('#new'+taxonomy).focus();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Sync checked items between "All {taxonomy}" and "Most used" lists.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#' + taxonomy + 'checklist, #' + taxonomy + 'checklist-pop').on( 'click', 'li.popular-category > label input[type="checkbox"]', function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var t = $(this), c = t.is(':checked'), id = t.val();
</span><span class="cx" style="display: block; padding: 0 10px"> if ( id && t.parents('#taxonomy-'+taxonomy).length )
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -525,29 +649,51 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> }); // end cats
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Custom Fields
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Custom Fields postbox.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $('#postcustom').length ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $( '#the-list' ).wpList( { addAfter: function() {
- $('table#list-table').show();
- }, addBefore: function( s ) {
- s.data += '&post_id=' + $('#post_ID').val();
- return s;
- }
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ $( '#the-list' ).wpList( {
+ /**
+ * Add current post_ID to request to fetch custom fields
+ *
+ * @param {Object} s Request object.
+ *
+ * @returns {Object} Data modified with post_ID attached.
+ */
+ addBefore: function( s ) {
+ s.data += '&post_id=' + $('#post_ID').val();
+ return s;
+ },
+ /**
+ * Show the listing of custom fields after fetching.
+ */
+ addAfter: function() {
+ $('table#list-table').show();
+ }
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // submitdiv
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /*
+ * Publish Post box (#submitdiv)
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $('#submitdiv').length ) {
</span><span class="cx" style="display: block; padding: 0 10px"> stamp = $('#timestamp').html();
</span><span class="cx" style="display: block; padding: 0 10px"> visibility = $('#post-visibility-display').html();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * When the visibility of a post changes sub-options should be shown or hidden.
+ *
+ * @returns void
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> updateVisibility = function() {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Show sticky for public posts.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $postVisibilitySelect.find('input:radio:checked').val() != 'public' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#sticky').prop('checked', false);
</span><span class="cx" style="display: block; padding: 0 10px"> $('#sticky-span').hide();
</span><span class="cx" style="display: block; padding: 0 10px"> } else {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#sticky-span').show();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ // Show password input field for password protected post.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $postVisibilitySelect.find('input:radio:checked').val() != 'password' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#password-span').hide();
</span><span class="cx" style="display: block; padding: 0 10px"> } else {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -555,6 +701,11 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> };
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Make sure all labels represent the current settings.
+ *
+ * @returns {boolean} False when an invalid timestamp has been selected, otherwise True.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> updateText = function() {
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( ! $timestampdiv.length )
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -568,6 +719,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> originalDate = new Date( $('#hidden_aa').val(), $('#hidden_mm').val() -1, $('#hidden_jj').val(), $('#hidden_hh').val(), $('#hidden_mn').val() );
</span><span class="cx" style="display: block; padding: 0 10px"> currentDate = new Date( $('#cur_aa').val(), $('#cur_mm').val() -1, $('#cur_jj').val(), $('#cur_hh').val(), $('#cur_mn').val() );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Catch unexpected date problems.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( attemptedDate.getFullYear() != aa || (1 + attemptedDate.getMonth()) != mm || attemptedDate.getDate() != jj || attemptedDate.getMinutes() != mn ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.find('.timestamp-wrap').addClass('form-invalid');
</span><span class="cx" style="display: block; padding: 0 10px"> return false;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -575,6 +727,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.find('.timestamp-wrap').removeClass('form-invalid');
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Determine what the publish should be depending on the date and post status.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( attemptedDate > currentDate && $('#original_post_status').val() != 'future' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> publishOn = postL10n.publishOnFuture;
</span><span class="cx" style="display: block; padding: 0 10px"> $('#publish').val( postL10n.schedule );
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -585,7 +738,10 @@
</span><span class="cx" style="display: block; padding: 0 10px"> publishOn = postL10n.publishOnPast;
</span><span class="cx" style="display: block; padding: 0 10px"> $('#publish').val( postL10n.update );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- if ( originalDate.toUTCString() == attemptedDate.toUTCString() ) { //hack
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ // If the date is the same, set it to trigger update events.
+ if ( originalDate.toUTCString() == attemptedDate.toUTCString() ) {
+ // Re-set to the current value.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#timestamp').html(stamp);
</span><span class="cx" style="display: block; padding: 0 10px"> } else {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#timestamp').html(
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -600,6 +756,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Add "privately published" to post status when applies.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $postVisibilitySelect.find('input:radio:checked').val() == 'private' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#publish').val( postL10n.update );
</span><span class="cx" style="display: block; padding: 0 10px"> if ( 0 === optPublish.length ) {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -621,7 +778,11 @@
</span><span class="cx" style="display: block; padding: 0 10px"> if ( postStatus.is(':hidden') )
</span><span class="cx" style="display: block; padding: 0 10px"> $('#misc-publishing-actions .edit-post-status').show();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ // Update "Status:" to currently selected status.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#post-status-display').html($('option:selected', postStatus).text());
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ // Show or hide the "Save Draft" button.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $('option:selected', postStatus).val() == 'private' || $('option:selected', postStatus).val() == 'publish' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#save-post').hide();
</span><span class="cx" style="display: block; padding: 0 10px"> } else {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -635,6 +796,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> return true;
</span><span class="cx" style="display: block; padding: 0 10px"> };
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Show the visibility options and hide the toggle button when opened.
</ins><span class="cx" style="display: block; padding: 0 10px"> $( '#visibility .edit-visibility').click( function( e ) {
</span><span class="cx" style="display: block; padding: 0 10px"> e.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $postVisibilitySelect.is(':hidden') ) {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -646,6 +808,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Cancel visibility selection area and hide it from view.
</ins><span class="cx" style="display: block; padding: 0 10px"> $postVisibilitySelect.find('.cancel-post-visibility').click( function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $postVisibilitySelect.slideUp('fast');
</span><span class="cx" style="display: block; padding: 0 10px"> $('#visibility-radio-' + $('#hidden-post-visibility').val()).prop('checked', true);
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -657,6 +820,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Set the selected visibility as current.
</ins><span class="cx" style="display: block; padding: 0 10px"> $postVisibilitySelect.find('.save-post-visibility').click( function( event ) { // crazyhorse - multiple ok cancels
</span><span class="cx" style="display: block; padding: 0 10px"> $postVisibilitySelect.slideUp('fast');
</span><span class="cx" style="display: block; padding: 0 10px"> $('#visibility .edit-visibility').show().focus();
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -664,7 +828,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $postVisibilitySelect.find('input:radio:checked').val() != 'public' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#sticky').prop('checked', false);
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- } // WEAPON LOCKED
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $('#sticky').prop('checked') ) {
</span><span class="cx" style="display: block; padding: 0 10px"> sticky = 'Sticky';
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -676,10 +840,12 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // When the selection changes, update labels.
</ins><span class="cx" style="display: block; padding: 0 10px"> $postVisibilitySelect.find('input:radio').change( function() {
</span><span class="cx" style="display: block; padding: 0 10px"> updateVisibility();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Edit publish time click.
</ins><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.siblings('a.edit-timestamp').click( function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $timestampdiv.is( ':hidden' ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.slideDown( 'fast', function() {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -690,6 +856,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Cancel editing the publish time and hide the settings.
</ins><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.find('.cancel-timestamp').click( function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.slideUp('fast').siblings('a.edit-timestamp').show().focus();
</span><span class="cx" style="display: block; padding: 0 10px"> $('#mm').val($('#hidden_mm').val());
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -701,6 +868,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Save the changed timestamp.
</ins><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.find('.save-timestamp').click( function( event ) { // crazyhorse - multiple ok cancels
</span><span class="cx" style="display: block; padding: 0 10px"> if ( updateText() ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $timestampdiv.slideUp('fast');
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -709,6 +877,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Cancel submit when an invalid timestamp has been selected.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#post').on( 'submit', function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( ! updateText() ) {
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -722,6 +891,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Post Status edit click.
</ins><span class="cx" style="display: block; padding: 0 10px"> $postStatusSelect.siblings('a.edit-post-status').click( function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $postStatusSelect.is( ':hidden' ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $postStatusSelect.slideDown( 'fast', function() {
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -732,21 +902,31 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Save the Post Status changes and hide the options.
</ins><span class="cx" style="display: block; padding: 0 10px"> $postStatusSelect.find('.save-post-status').click( function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $postStatusSelect.slideUp( 'fast' ).siblings( 'a.edit-post-status' ).show().focus();
</span><span class="cx" style="display: block; padding: 0 10px"> updateText();
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Cancel Post Status editing and hide the options.
</ins><span class="cx" style="display: block; padding: 0 10px"> $postStatusSelect.find('.cancel-post-status').click( function( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $postStatusSelect.slideUp( 'fast' ).siblings( 'a.edit-post-status' ).show().focus();
</span><span class="cx" style="display: block; padding: 0 10px"> $('#post_status').val( $('#hidden_post_status').val() );
</span><span class="cx" style="display: block; padding: 0 10px"> updateText();
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- } // end submitdiv
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ }
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // permalink
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Handle the editing of the post_name. Create the required HTML elements and update the changes via AJAX.
+ *
+ * @summary Permalink aka slug aka post_name editing
+ *
+ * @global
+ *
+ * @returns void
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> function editPermalink() {
</span><span class="cx" style="display: block; padding: 0 10px"> var i, slug_value,
</span><span class="cx" style="display: block; padding: 0 10px"> $el, revert_e,
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -760,15 +940,19 @@
</span><span class="cx" style="display: block; padding: 0 10px"> buttonsOrig = buttons.html(),
</span><span class="cx" style="display: block; padding: 0 10px"> full = $('#editable-post-name-full');
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Deal with Twemoji in the post-name
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Deal with Twemoji in the post-name.
</ins><span class="cx" style="display: block; padding: 0 10px"> full.find( 'img' ).replaceWith( function() { return this.alt; } );
</span><span class="cx" style="display: block; padding: 0 10px"> full = full.html();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> permalink.html( permalinkInner );
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ // Save current content to revert to when cancelling.
</ins><span class="cx" style="display: block; padding: 0 10px"> $el = $( '#editable-post-name' );
</span><span class="cx" style="display: block; padding: 0 10px"> revert_e = $el.html();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> buttons.html( '<button type="button" class="save button button-small">' + postL10n.ok + '</button> <button type="button" class="cancel button-link">' + postL10n.cancel + '</button>' );
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ // Save permalink changes.
</ins><span class="cx" style="display: block; padding: 0 10px"> buttons.children( '.save' ).click( function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var new_slug = $el.children( 'input' ).val();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -776,29 +960,35 @@
</span><span class="cx" style="display: block; padding: 0 10px"> buttons.children('.cancel').click();
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- $.post(ajaxurl, {
- action: 'sample-permalink',
- post_id: postId,
- new_slug: new_slug,
- new_title: $('#title').val(),
- samplepermalinknonce: $('#samplepermalinknonce').val()
- }, function(data) {
- var box = $('#edit-slug-box');
- box.html(data);
- if (box.hasClass('hidden')) {
- box.fadeIn('fast', function () {
- box.removeClass('hidden');
- });
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+
+ $.post(
+ ajaxurl,
+ {
+ action: 'sample-permalink',
+ post_id: postId,
+ new_slug: new_slug,
+ new_title: $('#title').val(),
+ samplepermalinknonce: $('#samplepermalinknonce').val()
+ },
+ function(data) {
+ var box = $('#edit-slug-box');
+ box.html(data);
+ if (box.hasClass('hidden')) {
+ box.fadeIn('fast', function () {
+ box.removeClass('hidden');
+ });
+ }
+
+ buttons.html(buttonsOrig);
+ permalink.html(permalinkOrig);
+ real_slug.val(new_slug);
+ $( '.edit-slug' ).focus();
+ wp.a11y.speak( postL10n.permalinkSaved );
</ins><span class="cx" style="display: block; padding: 0 10px"> }
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">-
- buttons.html(buttonsOrig);
- permalink.html(permalinkOrig);
- real_slug.val(new_slug);
- $( '.edit-slug' ).focus();
- wp.a11y.speak( postL10n.permalinkSaved );
- });
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ );
</ins><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Cancel editing of permalink.
</ins><span class="cx" style="display: block; padding: 0 10px"> buttons.children( '.cancel' ).click( function() {
</span><span class="cx" style="display: block; padding: 0 10px"> $('#view-post-btn').show();
</span><span class="cx" style="display: block; padding: 0 10px"> $el.html(revert_e);
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -808,19 +998,21 @@
</span><span class="cx" style="display: block; padding: 0 10px"> $( '.edit-slug' ).focus();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // If more than 1/4th of 'full' is '%', make it empty.
</ins><span class="cx" style="display: block; padding: 0 10px"> for ( i = 0; i < full.length; ++i ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( '%' == full.charAt(i) )
</span><span class="cx" style="display: block; padding: 0 10px"> c++;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ slug_value = ( c > full.length / 4 ) ? '' : full;
</ins><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- slug_value = ( c > full.length / 4 ) ? '' : full;
</del><span class="cx" style="display: block; padding: 0 10px"> $el.html( '<input type="text" id="new-post-slug" value="' + slug_value + '" autocomplete="off" />' ).children( 'input' ).keydown( function( e ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var key = e.which;
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // On enter, just save the new slug, don't save the post.
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // On [enter], just save the new slug, don't save the post.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( 13 === key ) {
</span><span class="cx" style="display: block; padding: 0 10px"> e.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> buttons.children( '.save' ).click();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // On [esc] cancel the editing.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( 27 === key ) {
</span><span class="cx" style="display: block; padding: 0 10px"> buttons.children( '.cancel' ).click();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -833,6 +1025,17 @@
</span><span class="cx" style="display: block; padding: 0 10px"> editPermalink();
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Add screen reader text to the title prompt when needed.
+ *
+ * @summary Title screen reader text handler.
+ *
+ * @param {string} id Optional. HTML ID to add the screen reader helper text to.
+ *
+ * @global
+ *
+ * @returns void
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> wptitlehint = function(id) {
</span><span class="cx" style="display: block; padding: 0 10px"> id = id || 'title';
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -859,19 +1062,24 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> wptitlehint();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Resize the visual and text editors
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Resize the WYSIWYG and plain text editors.
</ins><span class="cx" style="display: block; padding: 0 10px"> ( function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var editor, offset, mce,
</span><span class="cx" style="display: block; padding: 0 10px"> $handle = $('#post-status-info'),
</span><span class="cx" style="display: block; padding: 0 10px"> $postdivrich = $('#postdivrich');
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // No point for touch devices
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // If there are no textareas or we are on a touch device, we can't do anything.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( ! $textarea.length || 'ontouchstart' in window ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Hide the resize handle
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Hide the resize handle.
</ins><span class="cx" style="display: block; padding: 0 10px"> $('#content-resize-handle').hide();
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Handle drag event.
+ *
+ * @param {Object} event Event containing details about the drag.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> function dragging( event ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( $postdivrich.hasClass( 'wp-editor-expand' ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -886,6 +1094,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> event.preventDefault();
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * When the dragging stopped make sure we return focus and do a sanity check on the height.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> function endDrag() {
</span><span class="cx" style="display: block; padding: 0 10px"> var height, toolbarHeight;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -909,7 +1120,7 @@
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="cx" style="display: block; padding: 0 10px"> $document.off( '.wp-editor-resize' );
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // sanity check
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Sanity check: normalize height to stay within acceptable ranges.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( height && height > 50 && height < 5000 ) {
</span><span class="cx" style="display: block; padding: 0 10px"> setUserSetting( 'ed_size', height );
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -936,8 +1147,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }).on( 'mouseup.wp-editor-resize', endDrag );
</span><span class="cx" style="display: block; padding: 0 10px"> })();
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // TinyMCE specific handling of Post Format changes to reflect in the editor.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( typeof tinymce !== 'undefined' ) {
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // When changing post formats, change the editor body class
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // When changing post formats, change the editor body class.
</ins><span class="cx" style="display: block; padding: 0 10px"> $( '#post-formats-select input.post-format' ).on( 'change.set-editor-class', function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var editor, body, format = this.id;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -950,8 +1162,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><del style="background-color: #fdd; text-decoration:none; display:block; padding: 0 10px">- // Save on pressing Ctrl/Command + S in the Text editor
</del><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Save on pressing [ctrl]/[command] + [s] in the Text editor.
</ins><span class="cx" style="display: block; padding: 0 10px"> $textarea.on( 'keydown.wp-autosave', function( event ) {
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // Key [s] has code 83.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( event.which === 83 ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( event.shiftKey || event.altKey || ( isMac && ( ! event.metaKey || event.ctrlKey ) ) || ( ! isMac && ! event.ctrlKey ) ) {
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -962,6 +1175,7 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ // If the last status was auto-draft and the save is triggered, edit the current URL.
</ins><span class="cx" style="display: block; padding: 0 10px"> if ( $( '#original_post_status' ).val() === 'auto-draft' && window.history.replaceState ) {
</span><span class="cx" style="display: block; padding: 0 10px"> var location;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -975,6 +1189,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px"> });
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+/**
+ * TinyMCE word count display
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> ( function( $, counter ) {
</span><span class="cx" style="display: block; padding: 0 10px"> $( function() {
</span><span class="cx" style="display: block; padding: 0 10px"> var $content = $( '#content' ),
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -982,6 +1199,9 @@
</span><span class="cx" style="display: block; padding: 0 10px"> prevCount = 0,
</span><span class="cx" style="display: block; padding: 0 10px"> contentEditor;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Get the word count from TinyMCE and display it
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> function update() {
</span><span class="cx" style="display: block; padding: 0 10px"> var text, count;
</span><span class="cx" style="display: block; padding: 0 10px">
</span><span class="lines" style="display: block; padding: 0 10px; color: #888">@@ -1000,6 +1220,12 @@
</span><span class="cx" style="display: block; padding: 0 10px"> prevCount = count;
</span><span class="cx" style="display: block; padding: 0 10px"> }
</span><span class="cx" style="display: block; padding: 0 10px">
</span><ins style="background-color: #dfd; text-decoration:none; display:block; padding: 0 10px">+ /**
+ * Bind the word count update triggers.
+ *
+ * When a node change in the main TinyMCE editor has been triggered.
+ * When a key has been released in the plain text content editor.
+ */
</ins><span class="cx" style="display: block; padding: 0 10px"> $( document ).on( 'tinymce-editor-init', function( event, editor ) {
</span><span class="cx" style="display: block; padding: 0 10px"> if ( editor.id !== 'content' ) {
</span><span class="cx" style="display: block; padding: 0 10px"> return;
</span></span></pre>
</div>
</div>
</body>
</html>