← All changes | js/build/classic-editor.js +156 -131 3.0.2 → trunk View file →

		@@ -1,7 +1,7 @@
1	1	/******/ "use strict";
2	2
3		-;// CONCATENATED MODULE: ./js/lib/confirmation-modal.js
	3	+;// ./js/src/lib/confirmation-modal.js
4	4	/**
5	5	* @package Polylang
6	6	*/
7	7
		@@ -7,11 +7,9 @@
7	7
8	8	const languagesList = jQuery( '.post_lang_choice' );
9	9
10	10	// Dialog box for alerting the user about a risky changing.
11		-const initializeConfimationModal = () => {
12		- // We can't use underscore or lodash in this common code because it depends of the context classic or block editor.
13		- // Classic editor underscore is loaded, Block editor lodash is loaded.
	11	+const initializeConfirmationModal = () => {
14	12	const { __ } = wp.i18n;
15	13
16	14	// Create dialog container.
17	15	const dialogContainer = jQuery(
		@@ -23,17 +21,17 @@
23	21	).text( __( 'Are you sure you want to change the language of the current content?', 'polylang' ) );
24	22
25	23	// Put it after languages list dropdown.
26	24	// PHPCS ignore dialogContainer is a new safe HTML code generated above.
27		- languagesList.after( dialogContainer ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.after
	25	+ languagesList.after( dialogContainer );
28	26
29	27	const dialogResult = new Promise(
30	28	( confirm, cancel ) => {
31		- const confirmDialog = ( what ) => { // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
32		- switch ( what ) { // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
	29	+ const confirmDialog = ( what ) => {
	30	+ switch ( what ) {
33	31	case 'yes':
34	32	// Confirm the new language.
35		- languagesList.data( 'old-value', languagesList.children( ':selected' )[0].value );
	33	+ languagesList.data( 'old-value', languagesList.children( ':selected' ).first().val() );
36	34	confirm();
37	35	break;
38	36	case 'no':
39	37	// Revert to the old language.
		@@ -40,54 +38,58 @@
40	38	languagesList.val( languagesList.data( 'old-value' ) );
41	39	cancel( 'Cancel' );
42	40	break;
43	41	}
44		- dialogContainer.dialog( 'close' ); // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
45		- } // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
	42	+ dialogContainer.dialog( 'close' );
	43	+ }
46	44
47	45	// Initialize dialog box in the case a language is selected but not added in the list.
48		- dialogContainer.dialog(
49		- {
50		- autoOpen: false,
51		- modal: true,
52		- draggable: false,
53		- resizable: false,
54		- title: __( 'Change language', 'polylang' ),
55		- minWidth: 600,
56		- maxWidth: '100%',
57		- classes: {
58		- 'ui-dialog': 'pll-confirmation-modal',
59		- },
60		- open: function( event, ui ) {
61		- // Change dialog box position for rtl language
62		- if ( jQuery( 'body' ).hasClass( 'rtl' ) ) {
63		- jQuery( this ).parent().css(
64		- {
65		- right: jQuery( this ).parent().css( 'left' ),
66		- left: 'auto'
67		- }
68		- );
69		- }
70		- },
71		- close: function( event, ui ) {
72		- // When we're closing the dialog box we need to cancel the language change as we click on Cancel button.
73		- confirmDialog( 'no' );
74		- },
75		- buttons: [
	46	+ const dialogOptions = {
	47	+ autoOpen: false,
	48	+ modal: true,
	49	+ draggable: false,
	50	+ resizable: false,
	51	+ title: __( 'Change language', 'polylang' ),
	52	+ minWidth: 600,
	53	+ maxWidth: '100%',
	54	+ open: function ( event, ui ) {
	55	+ // Change dialog box position for rtl language
	56	+ if ( jQuery( 'body' ).hasClass( 'rtl' ) ) {
	57	+ jQuery( this ).parent().css(
	58	+ {
	59	+ right: jQuery( this ).parent().css( 'left' ),
	60	+ left: 'auto'
	61	+ }
	62	+ );
	63	+ }
	64	+ },
	65	+ close: function ( event, ui ) {
	66	+ // When we're closing the dialog box we need to cancel the language change as we click on Cancel button.
	67	+ confirmDialog( 'no' );
	68	+ },
	69	+ buttons: [
76	70	{
77	71	text: __( 'OK', 'polylang' ),
78		- click: function( event ) {
	72	+ click: function ( event ) {
79	73	confirmDialog( 'yes' );
80	74	}
81	75	},
82	76	{
83	77	text: __( 'Cancel', 'polylang' ),
84		- click: function( event ) {
	78	+ click: function ( event ) {
85	79	confirmDialog( 'no' );
86	80	}
87		- } ]
88		- }
89		- );
	81	+ }
	82	+ ]
	83	+ };
	84	+
	85	+ if ( jQuery.ui.version >= '1.12.0' ) {
	86	+ Object.assign( dialogOptions, { classes: { 'ui-dialog': 'pll-confirmation-modal' } } );
	87	+ } else {
	88	+ Object.assign( dialogOptions, { dialogClass: 'pll-confirmation-modal' } ); // jQuery UI 1.11.4 - WP < 5.6
	89	+ }
	90	+
	91	+ dialogContainer.dialog( dialogOptions );
90	92	}
91	93	);
92	94	return { dialogContainer, dialogResult };
93	95	}
		@@ -93,23 +95,68 @@
93	95	}
94	96
95	97	const initializeLanguageOldValue = () => {
96	98	// Keep the old language value to be able to compare to the new one and revert to it if necessary.
97		- languagesList.attr( 'data-old-value', languagesList.children( ':selected' )[0].value );
	99	+ languagesList.attr( 'data-old-value', languagesList.children( ':selected' ).first().val() );
98	100	};
99	101
100		-;// CONCATENATED MODULE: ./js/classic-editor.js
	102	+;// ./js/src/lib/metabox-autocomplete.js
101	103	/**
102	104	* @package Polylang
103	105	*/
104	106
	107	+// Translations autocomplete input box.
	108	+function initMetaboxAutoComplete() {
	109	+ jQuery('.tr_lang').each(
	110	+ function () {
	111	+ var tr_lang = jQuery(this).attr('id').substring(8);
	112	+ var td = jQuery(this).parent().parent().siblings('.pll-edit-column');
105	113
	114	+ jQuery(this).autocomplete(
	115	+ {
	116	+ minLength: 0,
	117	+ source: ajaxurl + '?action=pll_posts_not_translated' +
	118	+ '&post_language=' + jQuery('.post_lang_choice').val() +
	119	+ '&translation_language=' + tr_lang +
	120	+ '&post_type=' + jQuery('#post_type').val() +
	121	+ '&_pll_nonce=' + jQuery('#_pll_nonce').val(),
	122	+ select: function (event, ui) {
	123	+ jQuery('#htr_lang_' + tr_lang).val(ui.item.id);
	124	+ // ui.item.link is built and come from server side and is well escaped when necessary
	125	+ td.html(ui.item.link);
	126	+ },
	127	+ }
	128	+ );
106	129
	130	+ // when the input box is emptied
	131	+ jQuery(this).on(
	132	+ 'blur',
	133	+ function () {
	134	+ if ( ! jQuery(this).val() ) {
	135	+ jQuery('#htr_lang_' + tr_lang).val(0);
	136	+ // Value is retrieved from HTML already generated server side
	137	+ td.html(td.siblings('.hidden').children().clone());
	138	+ }
	139	+ }
	140	+ );
	141	+ }
	142	+ );
	143	+}
	144	+
	145	+;// ./js/src/classic-editor.js
	146	+/**
	147	+ * @package Polylang
	148	+ */
	149	+
	150	+
	151	+
	152	+
	153	+
107	154	// tag suggest in metabox
108	155	jQuery(
109		- function( $ ) {
	156	+ function ( $ ) {
110	157	$.ajaxPrefilter(
111		- function( options, originalOptions, jqXHR ) {
	158	+ function ( options, originalOptions, jqXHR ) {
112	159	var lang = $( '.post_lang_choice' ).val();
113	160	if ( 'string' === typeof options.data && -1 !== options.url.indexOf( 'action=ajax-tag-search' ) && lang ) {
114	161	options.data = 'lang=' + lang + '&' + options.data;
115	162	}
		@@ -119,11 +166,11 @@
119	166	);
120	167
121	168	// overrides tagBox.get
122	169	jQuery(
123		- function( $ ) {
	170	+ function ( $ ) {
124	171	// overrides function to add the language
125		- tagBox.get = function( id ) {
	172	+ tagBox.get = function ( id ) {
126	173	var tax = id.substr( id.indexOf( '-' ) + 1 );
127	174
128	175	// add the language in the $_POST variable
129	176	var data = {
		@@ -134,9 +181,9 @@
134	181
135	182	$.post(
136	183	ajaxurl,
137	184	data,
138		- function( r, stat ) {
	185	+ function ( r, stat ) {
139	186	if ( 0 == r || 'success' != stat ) {
140	187	r = wpAjax.broken;
141	188	}
142	189
		@@ -141,12 +188,12 @@
141	188	}
142	189
143	190	// @see code from WordPress core https://github.com/WordPress/WordPress/blob/5.2.2/wp-admin/js/tags-box.js#L291
144	191	// @see wp_generate_tag_cloud function which generate the escaped HTML https://github.com/WordPress/WordPress/blob/a02b5cc2a8eecb8e076fbb7cf4de7bd2ec8a8eb1/wp-includes/category-template.php#L966-L975
145		- r = $( '<div />' ).addClass( 'the-tagcloud' ).attr( 'id', 'tagcloud-' + tax ).html( r ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
	192	+ r = $( '<div />' ).addClass( 'the-tagcloud' ).attr( 'id', 'tagcloud-' + tax ).html( r );
146	193	$( 'a', r ).on(
147	194	'click',
148		- function(){
	195	+ function () {
149	196	tagBox.flushTags( $( this ).closest( '.inside' ).children( '.tagsdiv' ), this );
150	197	return false;
151	198	}
152	199	);
		@@ -151,18 +198,18 @@
151	198	}
152	199	);
153	200
154	201	var tagCloud = $( '#tagcloud-' + tax );
155		- // add an if else condition to allow modifying the tags outputed when switching the language
	202	+ // add an if else condition to allow modifying the tags outputted when switching the language
156	203	var v = tagCloud.css( 'display' );
157	204	if ( v ) {
158	205	// See the comment above when r variable is created.
159		- $( '#tagcloud-' + tax ).replaceWith( r ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.replaceWith
	206	+ $( '#tagcloud-' + tax ).replaceWith( r );
160	207	$( '#tagcloud-' + tax ).css( 'display', v );
161	208	}
162	209	else {
163	210	// See the comment above when r variable is created.
164		- $( '#' + id ).after( r ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.after
	211	+ $( '#' + id ).after( r );
165	212	}
166	213	}
167	214	);
168	215	}
		@@ -169,13 +216,13 @@
169	216	}
170	217	);
171	218
172	219	jQuery(
173		- function( $ ) {
	220	+ function ( $ ) {
174	221	// collect taxonomies - code partly copied from WordPress
175	222	var taxonomies = new Array();
176	223	$( '.categorydiv' ).each(
177		- function(){
	224	+ function () {
178	225	var this_id = $( this ).attr( 'id' ), taxonomyParts, taxonomy;
179	226
180	227	taxonomyParts = this_id.split( '-' );
181	228	taxonomyParts.shift();
		@@ -184,9 +231,9 @@
184	231
185	232	// add our hidden field in the new category form - for each hierarchical taxonomy
186	233	// to set the language when creating a new category
187	234	// html code inserted come from html code itself.
188		- $( '#' + taxonomy + '-add-submit' ).before( // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.before
	235	+ $( '#' + taxonomy + '-add-submit' ).before(
189	236	$( '<input />' ).attr( 'type', 'hidden' )
190	237	.attr( 'id', taxonomy + '-lang' )
191	238	.attr( 'name', 'term_lang_choice' )
192	239	.attr( 'value', $( '.post_lang_choice' ).val() )
		@@ -199,11 +246,11 @@
199	246
200	247	// ajax for changing the post's language in the languages metabox
201	248	$( '.post_lang_choice' ).on(
202	249	'change',
203		- function( event ) {
	250	+ function ( event ) {
204	251	// Initialize the confirmation dialog box.
205		- const confirmationModal = initializeConfimationModal();
	252	+ const confirmationModal = initializeConfirmationModal();
206	253	const { dialogContainer: dialog } = confirmationModal;
207	254	let { dialogResult } = confirmationModal;
208	255	// The selected option in the dropdown list.
209	256	const selectedOption = event.target;
		@@ -213,15 +260,11 @@
213	260	} else {
214	261	dialogResult = Promise.resolve();
215	262	}
216	263
217		- // phpcs:disable PEAR.Functions.FunctionCallSignature.EmptyLine
218	264	dialogResult.then(
219	265	() => {
220		- var lang = selectedOption.options[selectedOption.options.selectedIndex].lang; // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
221		- var dir = $( '.pll-translation-column > span[lang="' + lang + '"]' ).attr( 'dir' ); // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
222		-
223		- var data = { // phpcs:ignore PEAR.Functions.FunctionCallSignature.Indent
	266	+ var data = {
224	267	action: 'post_lang_choice',
225	268	lang: selectedOption.value,
226	269	post_type: $( '#post_type' ).val(),
227	270	taxonomies: taxonomies,
		@@ -231,45 +274,46 @@
231	274
232	275	$.post(
233	276	ajaxurl,
234	277	data,
235		- function( response ) {
236		- var res = wpAjax.parseAjaxResponse( response, 'ajax-response' );
	278	+ function ( response ) {
	279	+ // Target a non existing WP HTML id to avoid a conflict with WP ajax requests.
	280	+ var res = wpAjax.parseAjaxResponse( response, 'pll-ajax-response' );
237	281	$.each(
238	282	res.responses,
239		- function() {
	283	+ function () {
240	284	switch ( this.what ) {
241	285	case 'translations': // translations fields
242	286	// Data is built and come from server side and is well escaped when necessary
243		- $( '.translations' ).html( this.data ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
244		- init_translations();
	287	+ $( '.translations' ).html( this.data );
	288	+ initMetaboxAutoComplete();
245	289	break;
246	290	case 'taxonomy': // categories metabox for posts
247	291	var tax = this.data;
248	292	// @see wp_terms_checklist https://github.com/WordPress/WordPress/blob/5.2.2/wp-admin/includes/template.php#L175
249	293	// @see https://github.com/WordPress/WordPress/blob/5.2.2/wp-admin/includes/class-walker-category-checklist.php#L89-L111
250		- $( '#' + tax + 'checklist' ).html( this.supplemental.all ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
	294	+ $( '#' + tax + 'checklist' ).html( this.supplemental.all );
251	295	// @see wp_popular_terms_checklist https://github.com/WordPress/WordPress/blob/5.2.2/wp-admin/includes/template.php#L236
252		- $( '#' + tax + 'checklist-pop' ).html( this.supplemental.populars ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
	296	+ $( '#' + tax + 'checklist-pop' ).html( this.supplemental.populars );
253	297	// @see wp_dropdown_categories https://github.com/WordPress/WordPress/blob/5.5.1/wp-includes/category-template.php#L336
254	298	// which is called by PLL_Admin_Classic_Editor::post_lang_choice to generate supplemental.dropdown
255		- $( '#new' + tax + '_parent' ).replaceWith( this.supplemental.dropdown ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.replaceWith
	299	+ $( '#new' + tax + '_parent' ).replaceWith( this.supplemental.dropdown );
256	300	$( '#' + tax + '-lang' ).val( $( '.post_lang_choice' ).val() ); // hidden field
257	301	break;
258	302	case 'pages': // parent dropdown list for pages
259	303	// @see wp_dropdown_pages https://github.com/WordPress/WordPress/blob/5.2.2/wp-includes/post-template.php#L1186-L1208
260	304	// @see https://github.com/WordPress/WordPress/blob/5.2.2/wp-includes/class-walker-page-dropdown.php#L88
261		- $( '#parent_id' ).html( this.data ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
	305	+ $( '#parent_id' ).html( this.data );
262	306	break;
263	307	case 'flag': // flag in front of the select dropdown
264	308	// Data is built and come from server side and is well escaped when necessary
265		- $( '.pll-select-flag' ).html( this.data ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
	309	+ $( '.pll-select-flag' ).html( this.data );
266	310	break;
267	311	case 'permalink': // Sample permalink
268	312	var div = $( '#edit-slug-box' );
269	313	if ( '-1' != this.data && div.children().length ) {
270	314	// @see get_sample_permalink_html https://github.com/WordPress/WordPress/blob/5.2.2/wp-admin/includes/post.php#L1425-L1454
271		- div.html( this.data ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
	315	+ div.html( this.data );
272	316	}
273	317	break;
274	318	}
275	319	}
		@@ -274,30 +318,23 @@
274	318	}
275	319	}
276	320	);
277	321
278		- // Update the old language with the new one to be able to compare it in the next changing.
279		- initializeLanguageOldValue();
280		- // modifies the language in the tag cloud
281		- $( '.tagcloud-link' ).each(
282		- function() {
283		- var id = $( this ).attr( 'id' );
284		- tagBox.get( id );
	322	+ // Creates an event once the language has been successfully changed.
	323	+ const onPostLangChoice = new CustomEvent(
	324	+ "onPostLangChoice",
	325	+ {
	326	+ detail: {
	327	+ lang: JSON.parse( selectedOption.options[selectedOption.options.selectedIndex].getAttribute( 'data-lang' ) )
	328	+ },
285	329	}
286	330	);
287		-
288		- // Modifies the text direction
289		- $( 'body' ).removeClass( 'pll-dir-rtl' ).removeClass( 'pll-dir-ltr' ).addClass( 'pll-dir-' + dir );
290		- $( '#content_ifr' ).contents().find( 'html' ).attr( 'lang', lang ).attr( 'dir', dir );
291		- $( '#content_ifr' ).contents().find( 'body' ).attr( 'dir', dir );
292		-
293		- pll.media.resetAllAttachmentsCollections();
	331	+ document.dispatchEvent( onPostLangChoice );
294	332	}
295	333	)
296	334	},
297	335	() => {} // Do nothing when promise is rejected by clicking the Cancel dialog button.
298	336	);
299		- // phpcs:enable PEAR.Functions.FunctionCallSignature.EmptyLine
300	337
301	338	function isEmptyPost() {
302	339	const title = $( 'input#title' ).val();
303	340	const content = $( 'textarea#content' ).val();
		@@ -307,47 +344,35 @@
307	344	}
308	345	}
309	346	);
310	347
311		- // translations autocomplete input box
312		- function init_translations() {
313		- $( '.tr_lang' ).each(
314		- function(){
315		- var tr_lang = $( this ).attr( 'id' ).substring( 8 );
316		- var td = $( this ).parent().parent().siblings( '.pll-edit-column' );
	348	+ // Listen to `onPostLangChoice` to perform actions after the language has been changed.
	349	+ document.addEventListener(
	350	+ 'onPostLangChoice',
	351	+ ( e ) => {
	352	+ // Update the old language with the new one to be able to compare it in the next changing.
	353	+ initializeLanguageOldValue();
317	354
318		- $( this ).autocomplete(
319		- {
320		- minLength: 0,
321		- source: ajaxurl + '?action=pll_posts_not_translated' +
322		- '&post_language=' + $( '.post_lang_choice' ).val() +
323		- '&translation_language=' + tr_lang +
324		- '&post_type=' + $( '#post_type' ).val() +
325		- '&_pll_nonce=' + $( '#_pll_nonce' ).val(),
326		- select: function( event, ui ) {
327		- $( '#htr_lang_' + tr_lang ).val( ui.item.id );
328		- // ui.item.link is built and come from server side and is well escaped when necessary
329		- td.html( ui.item.link ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
330		- },
331		- }
332		- );
	355	+ // Modifies the language in the tag cloud.
	356	+ $( '.tagcloud-link' ).each(
	357	+ function () {
	358	+ var id = $( this ).attr( 'id' );
	359	+ tagBox.get( id );
	360	+ }
	361	+ );
333	362
334		- // when the input box is emptied
335		- $( this ).on(
336		- 'blur',
337		- function() {
338		- if ( ! $( this ).val() ) {
339		- $( '#htr_lang_' + tr_lang ).val( 0 );
340		- // Value is retrieved from HTML already generated server side
341		- td.html( td.siblings( '.hidden' ).children().clone() ); // phpcs:ignore WordPressVIPMinimum.JS.HTMLExecutingFunctions.html
342		- }
343		- }
344		- );
345		- }
346		- );
347		- }
	363	+ // Modifies the text direction.
	364	+ let dir = e.detail.lang.is_rtl ? 'rtl' : 'ltr'
	365	+ $( 'body' ).removeClass( 'pll-dir-rtl' ).removeClass( 'pll-dir-ltr' ).addClass( 'pll-dir-' + dir );
	366	+ $( '#content_ifr' ).contents().find( 'html' ).attr( 'lang', e.detail.lang.locale ).attr( 'dir', dir );
	367	+ $( '#content_ifr' ).contents().find( 'body' ).attr( 'dir', dir );
348	368
349		- init_translations();
	369	+ // Refresh media libraries.
	370	+ pll.media.resetAllAttachmentsCollections();
	371	+ }
	372	+ );
	373	+
	374	+ initMetaboxAutoComplete();
350	375	}
351	376	);
352	377
353	378	/**
		@@ -386,9 +411,9 @@
386	411	*
387	412	* @param {Object} [props]
388	413	* @return {wp.media.model.Attachments}
389	414	*/
390		- query: function( props ) {
	415	+ query: function ( props ) {
391	416	var attachments = pll.media.query.delegate( props );
392	417
393	418	pll.media.attachmentsCollections.push( attachments );
394	419
		@@ -394,16 +419,16 @@
394	419
395	420	return attachments;
396	421	},
397	422
398		- resetAllAttachmentsCollections: function() {
	423	+ resetAllAttachmentsCollections: function () {
399	424	this.attachmentsCollections.forEach(
400		- function( attachmentsCollection ) {
	425	+ function ( attachmentsCollection ) {
401	426	/**
402	427	* First reset the { @see wp.media.model.Attachments } collection.
403	428	* Then, if it is mirroring a { @see wp.media.model.Query } collection,
404	429	* refresh this one too, so it will fetch new data from the server,
405		- * and then the wp.media.model.Attachments collection will syncrhonize with the new data.
	430	+ * and then the wp.media.model.Attachments collection will synchronize with the new data.
406	431	*/
407	432	attachmentsCollection.reset();
408	433	if (attachmentsCollection.mirroring) {
409	434	attachmentsCollection.mirroring._hasMore = true;