/**

[0] Fix | Delete

* Handles the addition of the comment form.

[1] Fix | Delete

*

[2] Fix | Delete

* @since 2.7.0

[3] Fix | Delete

* @output wp-includes/js/comment-reply.js

[4] Fix | Delete

*

[5] Fix | Delete

* @namespace addComment

[6] Fix | Delete

*

[7] Fix | Delete

* @type {Object}

[8] Fix | Delete

*/

[9] Fix | Delete

window.addComment = ( function( window ) {

[10] Fix | Delete

// Avoid scope lookups on commonly used variables.

[11] Fix | Delete

var document = window.document;

[12] Fix | Delete

[13] Fix | Delete

// Settings.

[14] Fix | Delete

var config = {

[15] Fix | Delete

commentReplyClass : 'comment-reply-link',

[16] Fix | Delete

commentReplyTitleId : 'reply-title',

[17] Fix | Delete

cancelReplyId : 'cancel-comment-reply-link',

[18] Fix | Delete

commentFormId : 'commentform',

[19] Fix | Delete

temporaryFormId : 'wp-temp-form-div',

[20] Fix | Delete

parentIdFieldId : 'comment_parent',

[21] Fix | Delete

postIdFieldId : 'comment_post_ID'

[22] Fix | Delete

};

[23] Fix | Delete

[24] Fix | Delete

// Cross browser MutationObserver.

[25] Fix | Delete

var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;

[26] Fix | Delete

[27] Fix | Delete

// Check browser cuts the mustard.

[28] Fix | Delete

var cutsTheMustard = 'querySelector' in document && 'addEventListener' in window;

[29] Fix | Delete

[30] Fix | Delete

/*

[31] Fix | Delete

* Check browser supports dataset.

[32] Fix | Delete

* !! sets the variable to true if the property exists.

[33] Fix | Delete

*/

[34] Fix | Delete

var supportsDataset = !! document.documentElement.dataset;

[35] Fix | Delete

[36] Fix | Delete

// For holding the cancel element.

[37] Fix | Delete

var cancelElement;

[38] Fix | Delete

[39] Fix | Delete

// For holding the comment form element.

[40] Fix | Delete

var commentFormElement;

[41] Fix | Delete

[42] Fix | Delete

// The respond element.

[43] Fix | Delete

var respondElement;

[44] Fix | Delete

[45] Fix | Delete

// The mutation observer.

[46] Fix | Delete

var observer;

[47] Fix | Delete

[48] Fix | Delete

if ( cutsTheMustard && document.readyState !== 'loading' ) {

[49] Fix | Delete

ready();

[50] Fix | Delete

} else if ( cutsTheMustard ) {

[51] Fix | Delete

window.addEventListener( 'DOMContentLoaded', ready, false );

[52] Fix | Delete

}

[53] Fix | Delete

[54] Fix | Delete

/**

[55] Fix | Delete

* Sets up object variables after the DOM is ready.

[56] Fix | Delete

*

[57] Fix | Delete

* @since 5.1.1

[58] Fix | Delete

*/

[59] Fix | Delete

function ready() {

[60] Fix | Delete

// Initialise the events.

[61] Fix | Delete

init();

[62] Fix | Delete

[63] Fix | Delete

// Set up a MutationObserver to check for comments loaded late.

[64] Fix | Delete

observeChanges();

[65] Fix | Delete

}

[66] Fix | Delete

[67] Fix | Delete

/**

[68] Fix | Delete

* Add events to links classed .comment-reply-link.

[69] Fix | Delete

*

[70] Fix | Delete

* Searches the context for reply links and adds the JavaScript events

[71] Fix | Delete

* required to move the comment form. To allow for lazy loading of

[72] Fix | Delete

* comments this method is exposed as window.commentReply.init().

[73] Fix | Delete

*

[74] Fix | Delete

* @since 5.1.0

[75] Fix | Delete

*

[76] Fix | Delete

* @memberOf addComment

[77] Fix | Delete

*

[78] Fix | Delete

* @param {HTMLElement} context The parent DOM element to search for links.

[79] Fix | Delete

*/

[80] Fix | Delete

function init( context ) {

[81] Fix | Delete

if ( ! cutsTheMustard ) {

[82] Fix | Delete

return;

[83] Fix | Delete

}

[84] Fix | Delete

[85] Fix | Delete

// Get required elements.

[86] Fix | Delete

cancelElement = getElementById( config.cancelReplyId );

[87] Fix | Delete

commentFormElement = getElementById( config.commentFormId );

[88] Fix | Delete

[89] Fix | Delete

// No cancel element, no replies.

[90] Fix | Delete

if ( ! cancelElement ) {

[91] Fix | Delete

return;

[92] Fix | Delete

}

[93] Fix | Delete

[94] Fix | Delete

cancelElement.addEventListener( 'touchstart', cancelEvent );

[95] Fix | Delete

cancelElement.addEventListener( 'click', cancelEvent );

[96] Fix | Delete

[97] Fix | Delete

// Submit the comment form when the user types [Ctrl] or [Cmd] + [Enter].

[98] Fix | Delete

var submitFormHandler = function( e ) {

[99] Fix | Delete

if ( ( e.metaKey || e.ctrlKey ) && e.keyCode === 13 ) {

[100] Fix | Delete

commentFormElement.removeEventListener( 'keydown', submitFormHandler );

[101] Fix | Delete

e.preventDefault();

[102] Fix | Delete

// The submit button ID is 'submit' so we can't call commentFormElement.submit(). Click it instead.

[103] Fix | Delete

commentFormElement.submit.click();

[104] Fix | Delete

return false;

[105] Fix | Delete

}

[106] Fix | Delete

};

[107] Fix | Delete

[108] Fix | Delete

if ( commentFormElement ) {

[109] Fix | Delete

commentFormElement.addEventListener( 'keydown', submitFormHandler );

[110] Fix | Delete

}

[111] Fix | Delete

[112] Fix | Delete

var links = replyLinks( context );

[113] Fix | Delete

var element;

[114] Fix | Delete

[115] Fix | Delete

for ( var i = 0, l = links.length; i < l; i++ ) {

[116] Fix | Delete

element = links[i];

[117] Fix | Delete

[118] Fix | Delete

element.addEventListener( 'touchstart', clickEvent );

[119] Fix | Delete

element.addEventListener( 'click', clickEvent );

[120] Fix | Delete

}

[121] Fix | Delete

}

[122] Fix | Delete

[123] Fix | Delete

/**

[124] Fix | Delete

* Return all links classed .comment-reply-link.

[125] Fix | Delete

*

[126] Fix | Delete

* @since 5.1.0

[127] Fix | Delete

*

[128] Fix | Delete

* @param {HTMLElement} context The parent DOM element to search for links.

[129] Fix | Delete

*

[130] Fix | Delete

* @return {HTMLCollection|NodeList|Array}

[131] Fix | Delete

*/

[132] Fix | Delete

function replyLinks( context ) {

[133] Fix | Delete

var selectorClass = config.commentReplyClass;

[134] Fix | Delete

var allReplyLinks;

[135] Fix | Delete

[136] Fix | Delete

// childNodes is a handy check to ensure the context is a HTMLElement.

[137] Fix | Delete

if ( ! context || ! context.childNodes ) {

[138] Fix | Delete

context = document;

[139] Fix | Delete

}

[140] Fix | Delete

[141] Fix | Delete

if ( document.getElementsByClassName ) {

[142] Fix | Delete

// Fastest.

[143] Fix | Delete

allReplyLinks = context.getElementsByClassName( selectorClass );

[144] Fix | Delete

}

[145] Fix | Delete

else {

[146] Fix | Delete

// Fast.

[147] Fix | Delete

allReplyLinks = context.querySelectorAll( '.' + selectorClass );

[148] Fix | Delete

}

[149] Fix | Delete

[150] Fix | Delete

return allReplyLinks;

[151] Fix | Delete

}

[152] Fix | Delete

[153] Fix | Delete

/**

[154] Fix | Delete

* Cancel event handler.

[155] Fix | Delete

*

[156] Fix | Delete

* @since 5.1.0

[157] Fix | Delete

*

[158] Fix | Delete

* @param {Event} event The calling event.

[159] Fix | Delete

*/

[160] Fix | Delete

function cancelEvent( event ) {

[161] Fix | Delete

var cancelLink = this;

[162] Fix | Delete

var temporaryFormId = config.temporaryFormId;

[163] Fix | Delete

var temporaryElement = getElementById( temporaryFormId );

[164] Fix | Delete

[165] Fix | Delete

if ( ! temporaryElement || ! respondElement ) {

[166] Fix | Delete

// Conditions for cancel link fail.

[167] Fix | Delete

return;

[168] Fix | Delete

}

[169] Fix | Delete

[170] Fix | Delete

getElementById( config.parentIdFieldId ).value = '0';

[171] Fix | Delete

[172] Fix | Delete

// Move the respond form back in place of the temporary element.

[173] Fix | Delete

var headingText = temporaryElement.textContent;

[174] Fix | Delete

temporaryElement.parentNode.replaceChild( respondElement, temporaryElement );

[175] Fix | Delete

cancelLink.style.display = 'none';

[176] Fix | Delete

[177] Fix | Delete

var replyHeadingElement = getElementById( config.commentReplyTitleId );

[178] Fix | Delete

var replyHeadingTextNode = replyHeadingElement && replyHeadingElement.firstChild;

[179] Fix | Delete

var replyLinkToParent = replyHeadingTextNode && replyHeadingTextNode.nextSibling;

[180] Fix | Delete

[181] Fix | Delete

if ( replyHeadingTextNode && replyHeadingTextNode.nodeType === Node.TEXT_NODE && headingText ) {

[182] Fix | Delete

if ( replyLinkToParent && 'A' === replyLinkToParent.nodeName && replyLinkToParent.id !== config.cancelReplyId ) {

[183] Fix | Delete

replyLinkToParent.style.display = '';

[184] Fix | Delete

}

[185] Fix | Delete

[186] Fix | Delete

replyHeadingTextNode.textContent = headingText;

[187] Fix | Delete

}

[188] Fix | Delete

[189] Fix | Delete

event.preventDefault();

[190] Fix | Delete

}

[191] Fix | Delete

[192] Fix | Delete

/**

[193] Fix | Delete

* Click event handler.

[194] Fix | Delete

*

[195] Fix | Delete

* @since 5.1.0

[196] Fix | Delete

*

[197] Fix | Delete

* @param {Event} event The calling event.

[198] Fix | Delete

*/

[199] Fix | Delete

function clickEvent( event ) {

[200] Fix | Delete

var replyNode = getElementById( config.commentReplyTitleId );

[201] Fix | Delete

var defaultReplyHeading = replyNode && replyNode.firstChild.textContent;

[202] Fix | Delete

var replyLink = this,

[203] Fix | Delete

commId = getDataAttribute( replyLink, 'belowelement' ),

[204] Fix | Delete

parentId = getDataAttribute( replyLink, 'commentid' ),

[205] Fix | Delete

respondId = getDataAttribute( replyLink, 'respondelement' ),

[206] Fix | Delete

postId = getDataAttribute( replyLink, 'postid' ),

[207] Fix | Delete

replyTo = getDataAttribute( replyLink, 'replyto' ) || defaultReplyHeading,

[208] Fix | Delete

follow;

[209] Fix | Delete

[210] Fix | Delete

if ( ! commId || ! parentId || ! respondId || ! postId ) {

[211] Fix | Delete

/*

[212] Fix | Delete

* Theme or plugin defines own link via custom `wp_list_comments()` callback

[213] Fix | Delete

* and calls `moveForm()` either directly or via a custom event hook.

[214] Fix | Delete

*/

[215] Fix | Delete

return;

[216] Fix | Delete

}

[217] Fix | Delete

[218] Fix | Delete

/*

[219] Fix | Delete

* Third party comments systems can hook into this function via the global scope,

[220] Fix | Delete

* therefore the click event needs to reference the global scope.

[221] Fix | Delete

*/

[222] Fix | Delete

follow = window.addComment.moveForm( commId, parentId, respondId, postId, replyTo );

[223] Fix | Delete

if ( false === follow ) {

[224] Fix | Delete

event.preventDefault();

[225] Fix | Delete

}

[226] Fix | Delete

}

[227] Fix | Delete

[228] Fix | Delete

/**

[229] Fix | Delete

* Creates a mutation observer to check for newly inserted comments.

[230] Fix | Delete

*

[231] Fix | Delete

* @since 5.1.0

[232] Fix | Delete

*/

[233] Fix | Delete

function observeChanges() {

[234] Fix | Delete

if ( ! MutationObserver ) {

[235] Fix | Delete

return;

[236] Fix | Delete

}

[237] Fix | Delete

[238] Fix | Delete

var observerOptions = {

[239] Fix | Delete

childList: true,

[240] Fix | Delete

subtree: true

[241] Fix | Delete

};

[242] Fix | Delete

[243] Fix | Delete

observer = new MutationObserver( handleChanges );

[244] Fix | Delete

observer.observe( document.body, observerOptions );

[245] Fix | Delete

}

[246] Fix | Delete

[247] Fix | Delete

/**

[248] Fix | Delete

* Handles DOM changes, calling init() if any new nodes are added.

[249] Fix | Delete

*

[250] Fix | Delete

* @since 5.1.0

[251] Fix | Delete

*

[252] Fix | Delete

* @param {Array} mutationRecords Array of MutationRecord objects.

[253] Fix | Delete

*/

[254] Fix | Delete

function handleChanges( mutationRecords ) {

[255] Fix | Delete

var i = mutationRecords.length;

[256] Fix | Delete

[257] Fix | Delete

while ( i-- ) {

[258] Fix | Delete

// Call init() once if any record in this set adds nodes.

[259] Fix | Delete

if ( mutationRecords[ i ].addedNodes.length ) {

[260] Fix | Delete

init();

[261] Fix | Delete

return;

[262] Fix | Delete

}

[263] Fix | Delete

}

[264] Fix | Delete

}

[265] Fix | Delete

[266] Fix | Delete

/**

[267] Fix | Delete

* Backward compatible getter of data-* attribute.

[268] Fix | Delete

*

[269] Fix | Delete

* Uses element.dataset if it exists, otherwise uses getAttribute.

[270] Fix | Delete

*

[271] Fix | Delete

* @since 5.1.0

[272] Fix | Delete

*

[273] Fix | Delete

* @param {HTMLElement} Element DOM element with the attribute.

[274] Fix | Delete

* @param {string} Attribute the attribute to get.

[275] Fix | Delete

*

[276] Fix | Delete

* @return {string}

[277] Fix | Delete

*/

[278] Fix | Delete

function getDataAttribute( element, attribute ) {

[279] Fix | Delete

if ( supportsDataset ) {

[280] Fix | Delete

return element.dataset[attribute];

[281] Fix | Delete

}

[282] Fix | Delete

else {

[283] Fix | Delete

return element.getAttribute( 'data-' + attribute );

[284] Fix | Delete

}

[285] Fix | Delete

}

[286] Fix | Delete

[287] Fix | Delete

/**

[288] Fix | Delete

* Get element by ID.

[289] Fix | Delete

*

[290] Fix | Delete

* Local alias for document.getElementById.

[291] Fix | Delete

*

[292] Fix | Delete

* @since 5.1.0

[293] Fix | Delete

*

[294] Fix | Delete

* @param {HTMLElement} The requested element.

[295] Fix | Delete

*/

[296] Fix | Delete

function getElementById( elementId ) {

[297] Fix | Delete

return document.getElementById( elementId );

[298] Fix | Delete

}

[299] Fix | Delete

[300] Fix | Delete

/**

[301] Fix | Delete

* Moves the reply form from its current position to the reply location.

[302] Fix | Delete

*

[303] Fix | Delete

* @since 2.7.0

[304] Fix | Delete

*

[305] Fix | Delete

* @memberOf addComment

[306] Fix | Delete

*

[307] Fix | Delete

* @param {string} addBelowId HTML ID of element the form follows.

[308] Fix | Delete

* @param {string} commentId Database ID of comment being replied to.

[309] Fix | Delete

* @param {string} respondId HTML ID of 'respond' element.

[310] Fix | Delete

* @param {string} postId Database ID of the post.

[311] Fix | Delete

* @param {string} replyTo Form heading content.

[312] Fix | Delete

*/

[313] Fix | Delete

function moveForm( addBelowId, commentId, respondId, postId, replyTo ) {

[314] Fix | Delete

// Get elements based on their IDs.

[315] Fix | Delete

var addBelowElement = getElementById( addBelowId );

[316] Fix | Delete

respondElement = getElementById( respondId );

[317] Fix | Delete

[318] Fix | Delete

// Get the hidden fields.

[319] Fix | Delete

var parentIdField = getElementById( config.parentIdFieldId );

[320] Fix | Delete

var postIdField = getElementById( config.postIdFieldId );

[321] Fix | Delete

var element, cssHidden, style;

[322] Fix | Delete

[323] Fix | Delete

var replyHeading = getElementById( config.commentReplyTitleId );

[324] Fix | Delete

var replyHeadingTextNode = replyHeading && replyHeading.firstChild;

[325] Fix | Delete

var replyLinkToParent = replyHeadingTextNode && replyHeadingTextNode.nextSibling;

[326] Fix | Delete

[327] Fix | Delete

if ( ! addBelowElement || ! respondElement || ! parentIdField ) {

[328] Fix | Delete

// Missing key elements, fail.

[329] Fix | Delete

return;

[330] Fix | Delete

}

[331] Fix | Delete

[332] Fix | Delete

if ( 'undefined' === typeof replyTo ) {

[333] Fix | Delete

replyTo = replyHeadingTextNode && replyHeadingTextNode.textContent;

[334] Fix | Delete

}

[335] Fix | Delete

[336] Fix | Delete

addPlaceHolder( respondElement );

[337] Fix | Delete

[338] Fix | Delete

// Set the value of the post.

[339] Fix | Delete

if ( postId && postIdField ) {

[340] Fix | Delete

postIdField.value = postId;

[341] Fix | Delete

}

[342] Fix | Delete

[343] Fix | Delete

parentIdField.value = commentId;

[344] Fix | Delete

[345] Fix | Delete

cancelElement.style.display = '';

[346] Fix | Delete

addBelowElement.parentNode.insertBefore( respondElement, addBelowElement.nextSibling );

[347] Fix | Delete

[348] Fix | Delete

if ( replyHeadingTextNode && replyHeadingTextNode.nodeType === Node.TEXT_NODE ) {

[349] Fix | Delete

if ( replyLinkToParent && 'A' === replyLinkToParent.nodeName && replyLinkToParent.id !== config.cancelReplyId ) {

[350] Fix | Delete

replyLinkToParent.style.display = 'none';

[351] Fix | Delete

}

[352] Fix | Delete

[353] Fix | Delete

replyHeadingTextNode.textContent = replyTo;

[354] Fix | Delete

}

[355] Fix | Delete

[356] Fix | Delete

/*

[357] Fix | Delete

* This is for backward compatibility with third party commenting systems

[358] Fix | Delete

* hooking into the event using older techniques.

[359] Fix | Delete

*/

[360] Fix | Delete

cancelElement.onclick = function() {

[361] Fix | Delete

return false;

[362] Fix | Delete

};

[363] Fix | Delete

[364] Fix | Delete

// Focus on the first field in the comment form.

[365] Fix | Delete

try {

[366] Fix | Delete

for ( var i = 0; i < commentFormElement.elements.length; i++ ) {

[367] Fix | Delete

element = commentFormElement.elements[i];

[368] Fix | Delete

cssHidden = false;

[369] Fix | Delete

[370] Fix | Delete

// Get elements computed style.

[371] Fix | Delete

if ( 'getComputedStyle' in window ) {

[372] Fix | Delete

// Modern browsers.

[373] Fix | Delete

style = window.getComputedStyle( element );

[374] Fix | Delete

} else if ( document.documentElement.currentStyle ) {

[375] Fix | Delete

// IE 8.

[376] Fix | Delete

style = element.currentStyle;

[377] Fix | Delete

}

[378] Fix | Delete

[379] Fix | Delete

/*

[380] Fix | Delete

* For display none, do the same thing jQuery does. For visibility,

[381] Fix | Delete

* check the element computed style since browsers are already doing

[382] Fix | Delete

* the job for us. In fact, the visibility computed style is the actual

[383] Fix | Delete

* computed value and already takes into account the element ancestors.

[384] Fix | Delete

*/

[385] Fix | Delete

if ( ( element.offsetWidth <= 0 && element.offsetHeight <= 0 ) || style.visibility === 'hidden' ) {

[386] Fix | Delete

cssHidden = true;

[387] Fix | Delete

}

[388] Fix | Delete

[389] Fix | Delete

// Skip form elements that are hidden or disabled.

[390] Fix | Delete

if ( 'hidden' === element.type || element.disabled || cssHidden ) {

[391] Fix | Delete

continue;

[392] Fix | Delete

}

[393] Fix | Delete

[394] Fix | Delete

element.focus();

[395] Fix | Delete

// Stop after the first focusable element.

[396] Fix | Delete

break;

[397] Fix | Delete

}

[398] Fix | Delete

}

[399] Fix | Delete

catch(e) {

[400] Fix | Delete

[401] Fix | Delete

}

[402] Fix | Delete

[403] Fix | Delete

/*

[404] Fix | Delete

* false is returned for backward compatibility with third party commenting systems

[405] Fix | Delete

* hooking into this function.

[406] Fix | Delete

*/

[407] Fix | Delete

return false;

[408] Fix | Delete

}

[409] Fix | Delete

[410] Fix | Delete

/**

[411] Fix | Delete

* Add placeholder element.

[412] Fix | Delete

*

[413] Fix | Delete

* Places a place holder element above the #respond element for

[414] Fix | Delete

* the form to be returned to if needs be.

[415] Fix | Delete

*

[416] Fix | Delete

* @since 2.7.0

[417] Fix | Delete

*

[418] Fix | Delete

* @param {HTMLelement} respondElement the #respond element holding comment form.

[419] Fix | Delete

*/

[420] Fix | Delete

function addPlaceHolder( respondElement ) {

[421] Fix | Delete

var temporaryFormId = config.temporaryFormId;

[422] Fix | Delete

var temporaryElement = getElementById( temporaryFormId );

[423] Fix | Delete

var replyElement = getElementById( config.commentReplyTitleId );

[424] Fix | Delete

var initialHeadingText = replyElement ? replyElement.firstChild.textContent : '';

[425] Fix | Delete

[426] Fix | Delete

if ( temporaryElement ) {

[427] Fix | Delete

// The element already exists, no need to recreate.

[428] Fix | Delete

return;

[429] Fix | Delete

}

[430] Fix | Delete

[431] Fix | Delete

temporaryElement = document.createElement( 'div' );

[432] Fix | Delete

temporaryElement.id = temporaryFormId;

[433] Fix | Delete

temporaryElement.style.display = 'none';

[434] Fix | Delete

temporaryElement.textContent = initialHeadingText;

[435] Fix | Delete

respondElement.parentNode.insertBefore( temporaryElement, respondElement );

[436] Fix | Delete

}

[437] Fix | Delete

[438] Fix | Delete

return {

[439] Fix | Delete

init: init,

[440] Fix | Delete

moveForm: moveForm

[441] Fix | Delete

};

[442] Fix | Delete

})( window );

[443] Fix | Delete

[444] Fix | Delete