← All changes | modules/plugin-search/plugin-search.js +19 -49 13.7.2 → 16.3-a.1 View file →

		@@ -2,9 +2,9 @@
2	2	* Handles the activation of a Jetpack feature, dismissing the card, and replacing the bottom row
3	3	* of the card with customized content.
4	4	*/
5	5
6		-/* global jetpackPluginSearch, JSON, jpTracksAJAX */
	6	+/* global jetpackPluginSearch, jpTracksAJAX */
7	7
8	8	var JetpackPSH = {};
9	9
10	10	( function ( $, jpsh ) {
		@@ -12,9 +12,9 @@
12	12	$pluginFilter: $( '#plugin-filter' ),
13	13
14	14	/**
15	15	* Get parent search hint element.
16		- * @returns {Element | null}
	16	+ * @return {Element | null}
17	17	*/
18	18	getCard: function () {
19	19	return document.querySelector( '.plugin-card-jetpack-plugin-search' );
20	20	},
		@@ -37,40 +37,8 @@
37	37	} );
38	38	},
39	39
40	40	/**
41		- * Update title of the card to add a mention that the result is from the Jetpack plugin.
42		- */
43		- updateCardTitle: function () {
44		- var hint = JetpackPSH.getCard();
45		-
46		- if ( 'object' === typeof hint && null !== hint ) {
47		- var title = hint.querySelector( '.column-name h3' );
48		- title.outerHTML =
49		- title.outerHTML + '<strong>' + jetpackPluginSearch.poweredBy + '</strong>';
50		- }
51		- },
52		-
53		- /**
54		- * Move action links below description.
55		- */
56		- moveActionLinks: function () {
57		- var hint = JetpackPSH.getCard();
58		- if ( 'object' === typeof hint && null !== hint ) {
59		- var descriptionContainer = hint.querySelector( '.column-description' );
60		- // Keep only the first paragraph. The second is the plugin author.
61		- var descriptionText = descriptionContainer.querySelector( 'p:first-child' );
62		- var actionLinks = hint.querySelector( '.action-links' );
63		-
64		- // Change the contents of the description, to keep the description text and the action links.
65		- descriptionContainer.innerHTML = descriptionText.outerHTML + actionLinks.outerHTML;
66		-
67		- // Remove the action links from their default location.
68		- actionLinks.parentNode.removeChild( actionLinks );
69		- }
70		- },
71		-
72		- /**
73	41	* Replace bottom row of the card to insert logo, text and link to dismiss the card.
74	42	*/
75	43	replaceCardBottom: function () {
76	44	var hint = JetpackPSH.getCard();
		@@ -96,9 +64,9 @@
96	64	}
97	65	},
98	66
99	67	/**
100		- * Check if plugin card list nodes changed. If there's a Jetpack PSH card, replace the title and the bottom row.
	68	+ * Check if plugin card list nodes changed. If there's a Jetpack PSH card, replace the bottom row.
101	69	* @param {array} mutationsList
102	70	*/
103	71	replaceOnNewResults: function ( mutationsList ) {
104	72	mutationsList.forEach( function ( mutation ) {
		@@ -105,10 +73,8 @@
105	73	if (
106	74	'childList' === mutation.type &&
107	75	1 === document.querySelectorAll( '.plugin-card-jetpack-plugin-search' ).length
108	76	) {
109		- JetpackPSH.updateCardTitle();
110		- JetpackPSH.moveActionLinks();
111	77	JetpackPSH.replaceCardBottom();
112	78	}
113	79	} );
114	80	},
		@@ -213,14 +179,8 @@
213	179	if ( JetpackPSH.$pluginFilter.length < 1 ) {
214	180	return;
215	181	}
216	182
217		- // Update title to show that the suggestion is from Jetpack.
218		- JetpackPSH.updateCardTitle();
219		-
220		- // Update the description and action links.
221		- JetpackPSH.moveActionLinks();
222		-
223	183	// Replace PSH bottom row on page load
224	184	JetpackPSH.replaceCardBottom();
225	185
226	186	// Listen for changes in plugin search results
		@@ -236,35 +196,45 @@
236	196	event.preventDefault();
237	197	JetpackPSH.ajaxActivateModule( $( this ).data( 'module' ) );
238	198	} )
239	199	.on( 'click', '.jetpack-plugin-search__primary', function ( event ) {
240		- event.preventDefault();
241	200	var $this = $( this );
	201	+ var opensInNewTab = '_blank' === $this.attr( 'target' );
	202	+ if ( ! opensInNewTab ) {
	203	+ event.preventDefault();
	204	+ }
242	205	if ( $this.data( 'track' ) ) {
243	206	// This catches Purchase, Configure, and Get started. Feature activation is tracked when it ends successfully, in its callback.
244	207	JetpackPSH.trackEvent(
245	208	'wpa_plugin_search_' + $this.data( 'track' ),
246	209	$this.data( 'module' ),
247		- $this.get( 0 )
	210	+ // only redirect if not opening in a new tab
	211	+ opensInNewTab ? undefined : $this.get( 0 )
248	212	);
249	213	}
250	214	} )
251	215	.on( 'click', '.jetpack-plugin-search__learn-more', function ( event ) {
252		- event.preventDefault();
253	216	var $this = $( this );
	217	+ var opensInNewTab = '_blank' === $this.attr( 'target' );
	218	+ if ( ! opensInNewTab ) {
	219	+ event.preventDefault();
	220	+ }
254	221	JetpackPSH.trackEvent(
255	222	'wpa_plugin_search_learn_more',
256	223	$this.data( 'module' ),
257		- $this.get( 0 )
	224	+ opensInNewTab ? undefined : $this.get( 0 )
258	225	);
259	226	} )
260	227	.on( 'click', '.jetpack-plugin-search__support_link', function ( event ) {
261		- event.preventDefault();
262	228	var $this = $( this );
	229	+ var opensInNewTab = '_blank' === $this.attr( 'target' );
	230	+ if ( ! opensInNewTab ) {
	231	+ event.preventDefault();
	232	+ }
263	233	JetpackPSH.trackEvent(
264	234	'wpa_plugin_search_support_link',
265	235	$this.data( 'module' ),
266		- $this.get( 0 )
	236	+ opensInNewTab ? undefined : $this.get( 0 )
267	237	);
268	238	} );
269	239	},
270	240	};