Edit File by line

/* global wpforms_edit_post_education */

[0] Fix | Delete

[1] Fix | Delete

/**

[2] Fix | Delete

* WPForms Edit Post Education function.

[3] Fix | Delete

[4] Fix | Delete

* @since 1.8.1

[5] Fix | Delete

[6] Fix | Delete

[7] Fix | Delete

'use strict';

[8] Fix | Delete

[9] Fix | Delete

const WPFormsEditPostEducation = window.WPFormsEditPostEducation || ( function( document, window, $ ) {

[10] Fix | Delete

[11] Fix | Delete

/**

[12] Fix | Delete

* Public functions and properties.

[13] Fix | Delete

[14] Fix | Delete

* @since 1.8.1

[15] Fix | Delete

[16] Fix | Delete

* @type {object}

[17] Fix | Delete

[18] Fix | Delete

const app = {

[19] Fix | Delete

[20] Fix | Delete

/**

[21] Fix | Delete

* Determine if the notice was showed before.

[22] Fix | Delete

[23] Fix | Delete

* @since 1.8.1

[24] Fix | Delete

[25] Fix | Delete

isNoticeVisible: false,

[26] Fix | Delete

[27] Fix | Delete

/**

[28] Fix | Delete

* Start the engine.

[29] Fix | Delete

[30] Fix | Delete

* @since 1.8.1

[31] Fix | Delete

[32] Fix | Delete

init: function() {

[33] Fix | Delete

[34] Fix | Delete

$( window ).on( 'load', function() {

[35] Fix | Delete

[36] Fix | Delete

// In the case of jQuery 3.+, we need to wait for a ready event first.

[37] Fix | Delete

if ( typeof $.ready.then === 'function' ) {

[38] Fix | Delete

$.ready.then( app.load );

[39] Fix | Delete

} else {

[40] Fix | Delete

app.load();

[41] Fix | Delete

}

[42] Fix | Delete

} );

[43] Fix | Delete

[44] Fix | Delete

[45] Fix | Delete

/**

[46] Fix | Delete

* Page load.

[47] Fix | Delete

[48] Fix | Delete

* @since 1.8.1

[49] Fix | Delete

[50] Fix | Delete

load: function() {

[51] Fix | Delete

[52] Fix | Delete

if ( ! app.isGutenbergEditor() ) {

[53] Fix | Delete

app.maybeShowClassicNotice();

[54] Fix | Delete

app.bindClassicEvents();

[55] Fix | Delete

[56] Fix | Delete

return;

[57] Fix | Delete

}

[58] Fix | Delete

[59] Fix | Delete

const blockLoadedInterval = setInterval( function() {

[60] Fix | Delete

[61] Fix | Delete

if ( ! document.querySelector( '.editor-post-title__input, iframe[name="editor-canvas"]' ) ) {

[62] Fix | Delete

return;

[63] Fix | Delete

}

[64] Fix | Delete

[65] Fix | Delete

clearInterval( blockLoadedInterval );

[66] Fix | Delete

[67] Fix | Delete

if ( ! app.isFse() ) {

[68] Fix | Delete

[69] Fix | Delete

app.maybeShowGutenbergNotice();

[70] Fix | Delete

app.bindGutenbergEvents();

[71] Fix | Delete

[72] Fix | Delete

return;

[73] Fix | Delete

}

[74] Fix | Delete

[75] Fix | Delete

const iframe = document.querySelector( 'iframe[name="editor-canvas"]' );

[76] Fix | Delete

const observer = new MutationObserver( function() {

[77] Fix | Delete

[78] Fix | Delete

const iframeDocument = iframe.contentDocument || iframe.contentWindow.document || {};

[79] Fix | Delete

[80] Fix | Delete

if ( iframeDocument.readyState === 'complete' && iframeDocument.querySelector( '.editor-post-title__input' ) ) {

[81] Fix | Delete

app.maybeShowGutenbergNotice();

[82] Fix | Delete

app.bindFseEvents();

[83] Fix | Delete

[84] Fix | Delete

observer.disconnect();

[85] Fix | Delete

}

[86] Fix | Delete

} );

[87] Fix | Delete

observer.observe( document.body, { subtree: true, childList: true } );

[88] Fix | Delete

}, 200 );

[89] Fix | Delete

[90] Fix | Delete

[91] Fix | Delete

/**

[92] Fix | Delete

* Bind events for Classic Editor.

[93] Fix | Delete

[94] Fix | Delete

* @since 1.8.1

[95] Fix | Delete

[96] Fix | Delete

bindClassicEvents: function() {

[97] Fix | Delete

[98] Fix | Delete

const $document = $( document );

[99] Fix | Delete

[100] Fix | Delete

if ( ! app.isNoticeVisible ) {

[101] Fix | Delete

$document.on( 'input', '#title', app.maybeShowClassicNotice );

[102] Fix | Delete

}

[103] Fix | Delete

[104] Fix | Delete

$document.on( 'click', '.wpforms-edit-post-education-notice-close', app.closeNotice );

[105] Fix | Delete

[106] Fix | Delete

[107] Fix | Delete

/**

[108] Fix | Delete

* Bind events for Gutenberg Editor.

[109] Fix | Delete

[110] Fix | Delete

* @since 1.8.1

[111] Fix | Delete

[112] Fix | Delete

bindGutenbergEvents: function() {

[113] Fix | Delete

[114] Fix | Delete

const $document = $( document );

[115] Fix | Delete

[116] Fix | Delete

$document

[117] Fix | Delete

.on( 'DOMSubtreeModified', '.edit-post-layout', app.distractionFreeModeToggle );

[118] Fix | Delete

[119] Fix | Delete

if ( app.isNoticeVisible ) {

[120] Fix | Delete

return;

[121] Fix | Delete

}

[122] Fix | Delete

[123] Fix | Delete

$document

[124] Fix | Delete

.on( 'input', '.editor-post-title__input', app.maybeShowGutenbergNotice )

[125] Fix | Delete

.on( 'DOMSubtreeModified', '.editor-post-title__input', app.maybeShowGutenbergNotice );

[126] Fix | Delete

[127] Fix | Delete

[128] Fix | Delete

/**

[129] Fix | Delete

* Bind events for Gutenberg Editor in FSE mode.

[130] Fix | Delete

[131] Fix | Delete

* @since 1.8.1

[132] Fix | Delete

[133] Fix | Delete

bindFseEvents: function() {

[134] Fix | Delete

[135] Fix | Delete

const $iframe = $( 'iframe[name="editor-canvas"]' );

[136] Fix | Delete

[137] Fix | Delete

$( document )

[138] Fix | Delete

.on( 'DOMSubtreeModified', '.edit-post-layout', app.distractionFreeModeToggle );

[139] Fix | Delete

[140] Fix | Delete

$iframe.contents()

[141] Fix | Delete

.on( 'DOMSubtreeModified', '.editor-post-title__input', app.maybeShowGutenbergNotice );

[142] Fix | Delete

[143] Fix | Delete

[144] Fix | Delete

/**

[145] Fix | Delete

* Determine if the editor is Gutenberg.

[146] Fix | Delete

[147] Fix | Delete

* @since 1.8.1

[148] Fix | Delete

[149] Fix | Delete

* @returns {boolean} True if the editor is Gutenberg.

[150] Fix | Delete

[151] Fix | Delete

isGutenbergEditor: function() {

[152] Fix | Delete

[153] Fix | Delete

return typeof wp !== 'undefined' && typeof wp.blocks !== 'undefined';

[154] Fix | Delete

[155] Fix | Delete

[156] Fix | Delete

/**

[157] Fix | Delete

* Determine if the editor is Gutenberg in FSE mode.

[158] Fix | Delete

[159] Fix | Delete

* @since 1.8.1

[160] Fix | Delete

[161] Fix | Delete

* @returns {boolean} True if the Gutenberg editor in FSE mode.

[162] Fix | Delete

[163] Fix | Delete

isFse: function() {

[164] Fix | Delete

[165] Fix | Delete

return Boolean( $( 'iframe[name="editor-canvas"]' ).length );

[166] Fix | Delete

[167] Fix | Delete

[168] Fix | Delete

/**

[169] Fix | Delete

* Create a notice for Gutenberg.

[170] Fix | Delete

[171] Fix | Delete

* @since 1.8.1

[172] Fix | Delete

[173] Fix | Delete

showGutenbergNotice: function() {

[174] Fix | Delete

[175] Fix | Delete

wp.data.dispatch( 'core/notices' ).createInfoNotice(

[176] Fix | Delete

wpforms_edit_post_education.gutenberg_notice.template,

[177] Fix | Delete

app.getGutenbergNoticeSettings()

[178] Fix | Delete

);

[179] Fix | Delete

[180] Fix | Delete

// The notice component doesn't have a way to add HTML id or class to the notice.

[181] Fix | Delete

// Also, the notice became visible with a delay on old Gutenberg versions.

[182] Fix | Delete

const hasNotice = setInterval( function() {

[183] Fix | Delete

[184] Fix | Delete

const noticeBody = $( '.wpforms-edit-post-education-notice-body' );

[185] Fix | Delete

if ( ! noticeBody.length ) {

[186] Fix | Delete

return;

[187] Fix | Delete

}

[188] Fix | Delete

[189] Fix | Delete

const $notice = noticeBody.closest( '.components-notice' );

[190] Fix | Delete

$notice.addClass( 'wpforms-edit-post-education-notice' );

[191] Fix | Delete

$notice.find( '.is-secondary, .is-link' ).removeClass( 'is-secondary' ).removeClass( 'is-link' ).addClass( 'is-primary' );

[192] Fix | Delete

[193] Fix | Delete

clearInterval( hasNotice );

[194] Fix | Delete

}, 100 );

[195] Fix | Delete

[196] Fix | Delete

[197] Fix | Delete

/**

[198] Fix | Delete

* Get settings for the Gutenberg notice.

[199] Fix | Delete

[200] Fix | Delete

* @since 1.8.1

[201] Fix | Delete

[202] Fix | Delete

* @returns {object} Notice settings.

[203] Fix | Delete

[204] Fix | Delete

getGutenbergNoticeSettings: function() {

[205] Fix | Delete

[206] Fix | Delete

const pluginName = 'wpforms-edit-post-product-education-guide';

[207] Fix | Delete

const noticeSettings = {

[208] Fix | Delete

id: pluginName,

[209] Fix | Delete

isDismissible: true,

[210] Fix | Delete

HTML: true,

[211] Fix | Delete

__unstableHTML: true,

[212] Fix | Delete

actions: [

[213] Fix | Delete

{

[214] Fix | Delete

className: 'wpforms-edit-post-education-notice-guide-button',

[215] Fix | Delete

variant: 'primary',

[216] Fix | Delete

label: wpforms_edit_post_education.gutenberg_notice.button,

[217] Fix | Delete

[218] Fix | Delete

[219] Fix | Delete

};

[220] Fix | Delete

[221] Fix | Delete

if ( ! wpforms_edit_post_education.gutenberg_guide ) {

[222] Fix | Delete

[223] Fix | Delete

noticeSettings.actions[0].url = wpforms_edit_post_education.gutenberg_notice.url;

[224] Fix | Delete

[225] Fix | Delete

return noticeSettings;

[226] Fix | Delete

}

[227] Fix | Delete

[228] Fix | Delete

const Guide = wp.components.Guide;

[229] Fix | Delete

const useState = wp.element.useState;

[230] Fix | Delete

const registerPlugin = wp.plugins.registerPlugin;

[231] Fix | Delete

const unregisterPlugin = wp.plugins.unregisterPlugin;

[232] Fix | Delete

const GutenbergTutorial = function() {

[233] Fix | Delete

[234] Fix | Delete

const [ isOpen, setIsOpen ] = useState( true );

[235] Fix | Delete

[236] Fix | Delete

if ( ! isOpen ) {

[237] Fix | Delete

return null;

[238] Fix | Delete

}

[239] Fix | Delete

[240] Fix | Delete

return (

[241] Fix | Delete

// eslint-disable-next-line react/react-in-jsx-scope

[242] Fix | Delete

<Guide

[243] Fix | Delete

className="edit-post-welcome-guide"

[244] Fix | Delete

onFinish={ () => {

[245] Fix | Delete

unregisterPlugin( pluginName );

[246] Fix | Delete

setIsOpen( false );

[247] Fix | Delete

} }

[248] Fix | Delete

pages={ app.getGuidePages() }

[249] Fix | Delete

[250] Fix | Delete

);

[251] Fix | Delete

};

[252] Fix | Delete

[253] Fix | Delete

noticeSettings.onDismiss = app.updateUserMeta;

[254] Fix | Delete

noticeSettings.actions[0].onClick = () => registerPlugin( pluginName, { render: GutenbergTutorial } );

[255] Fix | Delete

[256] Fix | Delete

return noticeSettings;

[257] Fix | Delete

[258] Fix | Delete

[259] Fix | Delete

/**

[260] Fix | Delete

* Get Guide pages in proper format.

[261] Fix | Delete

[262] Fix | Delete

* @since 1.8.1

[263] Fix | Delete

[264] Fix | Delete

* @returns {Array} Guide Pages.

[265] Fix | Delete

[266] Fix | Delete

getGuidePages: function() {

[267] Fix | Delete

[268] Fix | Delete

const pages = [];

[269] Fix | Delete

[270] Fix | Delete

wpforms_edit_post_education.gutenberg_guide.forEach( function( page ) {

[271] Fix | Delete

pages.push(

[272] Fix | Delete

{

[273] Fix | Delete

/* eslint-disable react/react-in-jsx-scope */

[274] Fix | Delete

content: (

[275] Fix | Delete

[276] Fix | Delete

<h1 className="edit-post-welcome-guide__heading">{ page.title }</h1>

[277] Fix | Delete

<p className="edit-post-welcome-guide__text">{ page.content }</p>

[278] Fix | Delete

</>

[279] Fix | Delete

[280] Fix | Delete

image: <img className="edit-post-welcome-guide__image" src={ page.image } alt={ page.title } />,

[281] Fix | Delete

/* eslint-enable react/react-in-jsx-scope */

[282] Fix | Delete

}

[283] Fix | Delete

);

[284] Fix | Delete

} );

[285] Fix | Delete

[286] Fix | Delete

return pages;

[287] Fix | Delete

[288] Fix | Delete

[289] Fix | Delete

/**

[290] Fix | Delete

* Show notice if the page title matches some keywords for Classic Editor.

[291] Fix | Delete

[292] Fix | Delete

* @since 1.8.1

[293] Fix | Delete

[294] Fix | Delete

maybeShowClassicNotice: function() {

[295] Fix | Delete

[296] Fix | Delete

if ( app.isNoticeVisible ) {

[297] Fix | Delete

return;

[298] Fix | Delete

}

[299] Fix | Delete

[300] Fix | Delete

if ( app.isTitleMatchKeywords( $( '#title' ).val() ) ) {

[301] Fix | Delete

app.isNoticeVisible = true;

[302] Fix | Delete

[303] Fix | Delete

$( '.wpforms-edit-post-education-notice' ).removeClass( 'wpforms-hidden' );

[304] Fix | Delete

}

[305] Fix | Delete

[306] Fix | Delete

[307] Fix | Delete

/**

[308] Fix | Delete

* Show notice if the page title matches some keywords for Gutenberg Editor.

[309] Fix | Delete

[310] Fix | Delete

* @since 1.8.1

[311] Fix | Delete

[312] Fix | Delete

maybeShowGutenbergNotice: function() {

[313] Fix | Delete

[314] Fix | Delete

if ( app.isNoticeVisible ) {

[315] Fix | Delete

return;

[316] Fix | Delete

}

[317] Fix | Delete

[318] Fix | Delete

const $postTitle = app.isFse() ?

[319] Fix | Delete

$( 'iframe[name="editor-canvas"]' ).contents().find( '.editor-post-title__input' ) :

[320] Fix | Delete

$( '.editor-post-title__input' );

[321] Fix | Delete

const tagName = $postTitle.prop( 'tagName' );

[322] Fix | Delete

const title = tagName === 'TEXTAREA' ? $postTitle.val() : $postTitle.text();

[323] Fix | Delete

[324] Fix | Delete

if ( app.isTitleMatchKeywords( title ) ) {

[325] Fix | Delete

app.isNoticeVisible = true;

[326] Fix | Delete

[327] Fix | Delete

app.showGutenbergNotice();

[328] Fix | Delete

}

[329] Fix | Delete

[330] Fix | Delete

[331] Fix | Delete

/**

[332] Fix | Delete

* Add notice class when the distraction mode is enabled.

[333] Fix | Delete

[334] Fix | Delete

* @since 1.8.1.2

[335] Fix | Delete

[336] Fix | Delete

distractionFreeModeToggle: function() {

[337] Fix | Delete

[338] Fix | Delete

if ( ! app.isNoticeVisible ) {

[339] Fix | Delete

return;

[340] Fix | Delete

}

[341] Fix | Delete

[342] Fix | Delete

const $document = $( document );

[343] Fix | Delete

const isDistractionFreeMode = Boolean( $document.find( '.is-distraction-free' ).length );

[344] Fix | Delete

[345] Fix | Delete

if ( ! isDistractionFreeMode ) {

[346] Fix | Delete

return;

[347] Fix | Delete

}

[348] Fix | Delete

[349] Fix | Delete

const isNoticeHasClass = Boolean( $( '.wpforms-edit-post-education-notice' ).length );

[350] Fix | Delete

[351] Fix | Delete

if ( isNoticeHasClass ) {

[352] Fix | Delete

return;

[353] Fix | Delete

}

[354] Fix | Delete

[355] Fix | Delete

const $noticeBody = $document.find( '.wpforms-edit-post-education-notice-body' );

[356] Fix | Delete

const $notice = $noticeBody.closest( '.components-notice' );

[357] Fix | Delete

[358] Fix | Delete

$notice.addClass( 'wpforms-edit-post-education-notice' );

[359] Fix | Delete

[360] Fix | Delete

[361] Fix | Delete

/**

[362] Fix | Delete

* Determine if the title matches keywords.

[363] Fix | Delete

[364] Fix | Delete

* @since 1.8.1

[365] Fix | Delete

[366] Fix | Delete

* @param {string} titleValue Page title value.

[367] Fix | Delete

[368] Fix | Delete

* @returns {boolean} True if the title matches some keywords.

[369] Fix | Delete

[370] Fix | Delete

isTitleMatchKeywords: function( titleValue ) {

[371] Fix | Delete

[372] Fix | Delete

const expectedTitleRegex = new RegExp( /\b(contact|form)\b/i );

[373] Fix | Delete

[374] Fix | Delete

return expectedTitleRegex.test( titleValue );

[375] Fix | Delete

[376] Fix | Delete

[377] Fix | Delete

/**

[378] Fix | Delete

* Close a notice.

[379] Fix | Delete

[380] Fix | Delete

* @since 1.8.1

[381] Fix | Delete

[382] Fix | Delete

closeNotice: function() {

[383] Fix | Delete

[384] Fix | Delete

$( this ).closest( '.wpforms-edit-post-education-notice' ).remove();

[385] Fix | Delete

[386] Fix | Delete

app.updateUserMeta();

[387] Fix | Delete

[388] Fix | Delete

[389] Fix | Delete

/**

[390] Fix | Delete

* Update user meta and don't show the notice next time.

[391] Fix | Delete

[392] Fix | Delete

* @since 1.8.1

[393] Fix | Delete

[394] Fix | Delete

updateUserMeta() {

[395] Fix | Delete

[396] Fix | Delete

$.post(

[397] Fix | Delete

wpforms_edit_post_education.ajax_url,

[398] Fix | Delete

{

[399] Fix | Delete

action: 'wpforms_education_dismiss',

[400] Fix | Delete

nonce: wpforms_edit_post_education.education_nonce,

[401] Fix | Delete

section: 'edit-post-notice',

[402] Fix | Delete

}

[403] Fix | Delete

);

[404] Fix | Delete

[405] Fix | Delete

};

[406] Fix | Delete

[407] Fix | Delete

return app;

[408] Fix | Delete

[409] Fix | Delete

}( document, window, jQuery ) );

[410] Fix | Delete

[411] Fix | Delete

WPFormsEditPostEducation.init();

[412] Fix | Delete

[413] Fix | Delete