Issue #3305999 by nkoporec: Replace _.template() with vanilla JS alternative (a3d7878e) · Commits · project / acquia_lift

modules/acquia_lift_inspector/acquia_lift_inspector.libraries.yml

+0 −1

Changes for modules/acquia_lift_inspector/acquia_lift_inspector.libraries.yml: 0 added lines, 1 removed line.
Original line number	Diff line number	Diff line
		@@ -9,4 +9,3 @@ acquia-lift-inspector:
		- core/drupal
		- core/drupal.dialog
		- core/js-cookie
		- core/internal.underscore

modules/acquia_lift_inspector/assets/acquia_lift_inspector.js

+113 −116

Changes for modules/acquia_lift_inspector/assets/acquia_lift_inspector.js: 113 added lines, 116 removed lines.
Original line number	Diff line number	Diff line
		@@ -25,126 +25,123 @@
		//Get the Profile Manager URL from the config settings
		var accountURL = drupalSettings.acquia_lift_inspector.profile_manager_url;

		modal_template = _.template(
		'<div id="lift-inspector">' +
		' <div class="lift-inspector-wrapper lift-inspector-wrapper-fullwidth">' +
		' <h2>Account details</h2>' +
		' <div id="account-details" class="container">' +
		' <div class="item-wrapper">' +
		' <label>' + Drupal.t('Customer') + '</label>' +
		' <pre id="account-id" class="lift-value">' +
		' <a href="' + accountURL + '#person:accountId=<%- account_id %>" target="_blank" rel="noopener noreferrer"><%- account_id %></a>' +
		' </pre>' +
		' </div>' +
		' <div class="item-wrapper">' +
		' <label>' + Drupal.t('Customer Site') + '</label>' +
		' <pre id="site-id" class="lift-value"><%- site_id %></pre>' +
		' </div>' +
		' <div class="item-wrapper">' +
		' <label>' + Drupal.t('Tracking ID') + '</label>' +
		' <pre id="identity" class="lift-value">' +
		' <% if (typeof lastDecisionRequest !== "undefined" && !_.isEmpty(lastDecisionRequest.identity)) { %>' +
		' <a href="' + accountURL + '#person:accountId=<%- account_id %>;tracking=<%- lastDecisionRequest.identity %>" target="_blank" rel="noopener noreferrer"><%- lastDecisionRequest.identity %></a>' +
		' <% } else { %>' + Drupal.t('No tracking id available.') + '<% } %>' +
		' </pre>' +
		' </div>' +
		' </div>' +
		' </div>' +
		' <div class="lift-inspector-wrapper">' +
		' <h2>' + Drupal.t('Current user segment(s)') + '</h2>' +
		' <div id="user-segments" class="container ">' +
		' <% if (typeof currentSegments !== "undefined" && !_.isEmpty(currentSegments)) { %>' +
		' <% _.each(currentSegments, function (segment) {%>' +
		' <div class="segment-item-wrapper item-wrapper">' +
		' <div class="item-title">' +
		' <h3 >' +
		' <a href="' + accountURL + '#segment:accountId=<%- account_id %>;<%- encodeURIComponent(segment.name) %>,false" target="_blank" rel="noopener noreferrer"><%- segment.name %></a>' +
		' </h3>' +
		' </div>' +
		' <div class="item-details">' +
		' <div class="inline-wrap">' +
		' <label class="inline-pre">' + Drupal.t('ID') + '</label>' +
		' <pre><%- segment.id %></pre>' +
		' </div>' +
		' <div>' +
		' <label>' + Drupal.t('Description') + '</label>' +
		' <p class="lift-value"><%- segment.description %></p>' +
		' </div>' +
		' </div>' +
		' </div>' +
		' <% }); %>' +
		' <% } else { %>' +
		' <p>' + Drupal.t('No segment(s) available.') + '</p>' +
		' <% } %>' +
		' </div>' +
		' </div>' +
		' <div class="lift-inspector-wrapper">' +
		' <h2>' + Drupal.t('Decision(s) on this page') + '</h2>' +
		' <div id="decisions" class="container">' +
		' <% if (typeof decisions !== "undefined" && !_.isEmpty(decisions)) { %>' +
		' <% _.each(decisions, function (decision) {%>' +
		' <div class="decision-item-wrapper item-wrapper">' +
		' <div class="item-title">' +
		' <h3>' + Drupal.t('Slot Name') + ': <%- decision.slot_name %>' +
		' </h3>' +
		' </div>' +
		' <div class="item-details">' +
		' <div>' +
		' <label>' + Drupal.t('Slot View Mode') + '</label>' +
		' <p class="lift-value"><%- decision.view_mode_id %></p>' +
		' </div>' +
		' <div>' +
		' <label>' + Drupal.t('Rule Name') + '</label>' +
		' <p class="lift-value"><%- decision.rule_name %></p>' +
		' </div>' +
		' <div>' +
		' <label>' + Drupal.t('Content Displayed') + '</label>' +
		' <p class="lift-value"><%- decision.content_name %></p>' +
		' </div>' +
		' </div>' +
		' </div>' +
		' <% }); %>' +
		' <% } else { %>' +
		' <p>' + Drupal.t('No decision(s) made.') + '</p>' +
		' <% } %>' +
		' </div>' +
		' </div>' +
		' <div class="lift-inspector-wrapper">' +
		' <h2>' + Drupal.t('Recent captures') + '</h2>' +
		' <div id="captures" class="container">' +
		' <% if (typeof lastDecisionRequest !== "undefined" && !_.isEmpty(lastDecisionRequest.captures)) { %>' +
		' <% _.each(lastDecisionRequest.captures, function (capture) {%>' +
		' <div class="lastdecision-item-wrapper item-wrapper">' +
		' <div class="item-title">' +
		' <h3><%- capture.event_name %></h3>' +
		' </div>' +
		' <div class="item-details">' +
		' <div>' +
		' <label>' + Drupal.t('Source') + '</label>' +
		' <p class="lift-value"><%- capture.event_source %></p>' +
		' </div>' +
		' <div class="inline-wrap">' +
		' <label class="inline-pre">' + Drupal.t('URL') + '</label>' +
		' <pre class="lift-value"><%- capture.url %></pre>' +
		' </div>' +
		' </div>' +
		' </div>' +
		' <% }); %>' +
		' <% } else { %>' +
		' <p>' + Drupal.t('No recent captures.') + '</p>' +
		' </div>' +
		' <% } %>' +
		' </div>' +
		' </div>' +
		'</div>'
		);

		if (typeof window.AcquiaLift === 'undefined') {
		$modal_element = '<h1 id="lift-inspector">' + Drupal.t('Lift is not currently loaded.') + '</h1>';
		modal_template = `<h1 id="lift-inspector">${Drupal.t('Lift is not currently loaded.')}</h1>`;
		} else {
		$modal_element = $(modal_template(window.AcquiaLift));
		let account_id = window.AcquiaLift.account_id;
		let site_id = window.AcquiaLift.site_id;
		let lastDecisionRequest = window.AcquiaLift.lastDecisionRequest;
		let decisions = window.AcquiaLift.decisions;
		let currentSegments = window.AcquiaLift.currentSegments;

		modal_template = `
		<div id="lift-inspector">
		<div class="lift-inspector-wrapper lift-inspector-wrapper-fullwidth">
		<h2>Account details</h2>
		<div id="account-details" class="container">
		<div class="item-wrapper">
		<label> ${Drupal.t('Customer')} </label>
		<pre id="account-id" class="lift-value">
		<a href="${accountURL}#person:accountId=${account_id}" target="_blank" rel="noopener noreferrer">${account_id}</a>
		</pre>
		</div>
		<div class="item-wrapper">
		<label>${Drupal.t('Customer Site')}</label>
		<pre id="site-id" class="lift-value">${site_id}</pre>
		</div>
		<div class="item-wrapper">
		<label>${Drupal.t('Tracking ID')}</label>
		<pre id="identity" class="lift-value">
		${typeof lastDecisionRequest !== "undefined" && Object.keys(lastDecisionRequest).length !== 0 ?
		`<a href="${accountURL}#person:accountId=${account_id};tracking=${last_decision_request_identity}" target="_blank" rel="noopener noreferrer">${lastDecisionRequest.identity}</a>` :
		Drupal.t('No tracking id available.')}
		</pre>
		</div>
		</div>
		</div>
		<div class="lift-inspector-wrapper">
		<h2>${Drupal.t('Current user segment(s)')}</h2>
		<div id="user-segments" class="container ">
		${typeof currentSegments !== "undefined" && Object.keys(currentSegments).length !== 0 ?
		`${Object.keys(currentSegments).map(key => (
		`<div class="segment-item-wrapper item-wrapper">
		<div class="item-title">
		<h3 >
		<a href="${accountURL}#segment:accountId=${account_id};${encodeURIComponent(currentSegments[key].name)},false" target="_blank" rel="noopener noreferrer">${currentSegments[key].name}</a>
		</h3>
		</div>
		<div class="item-details">
		<div class="inline-wrap">
		<label class="inline-pre">${Drupal.t('ID')}</label>
		<pre>${currentSegments[key].id}</pre>
		</div>
		<div>
		<label>${Drupal.t('Description')}</label>
		<p class="lift-value">${currentSegments[key].description}</p>
		</div>
		</div>
		</div>`
		)).join('')}`:
		`<p>${Drupal.t('No segment(s) available.')}</p>`}
		</div>
		</div>
		<div class="lift-inspector-wrapper">
		<h2>${Drupal.t('Decision(s) on this page')}</h2>
		<div id="decisions" class="container">
		${typeof decisions !== "undefined" && Object.keys(decisions).length !== 0 ?
		`${Object.keys(decisions).map(key => (
		`<div class="decision-item-wrapper item-wrapper">
		<div class="item-title">
		<h3>${Drupal.t('Slot Name')} : ${decisions[key].slot_name}</h3>
		</div>
		<div class="item-details">
		<div>
		<label>${Drupal.t('Slot View Mode')}</label>
		<p class="lift-value">${decisions[key].view_mode_id}</p>
		</div>
		<div>
		<label>${Drupal.t('Rule Name')}</label>
		<p class="lift-value">${decisions[key].rule_name}</p>
		</div>
		<div>
		<label>${Drupal.t('Content Displayed')}</label>
		<p class="lift-value">${decisions[key].content_name}</p>
		</div>
		</div>
		</div>`
		)).join('')}`:
		`<p>${Drupal.t('No decision(s) made.')}</p>`}
		</div>
		</div>
		<div class="lift-inspector-wrapper">
		<h2>${Drupal.t('Recent captures')}</h2>
		<div id="captures" class="container">
		${typeof lastDecisionRequest !== "undefined" && Object.keys(lastDecisionRequest.captures).length !== 0 ?
		`${Object.keys(lastDecisionRequest.captures).map(key => (
		`<div class="lastdecision-item-wrapper item-wrapper">
		<div class="item-title">
		<h3>${lastDecisionRequest.captures[key].event_name}</h3>
		</div>
		<div class="item-details">
		<div>
		<label>${Drupal.t('Source')}</label>
		<p class="lift-value">${lastDecisionRequest.captures[key].event_source}</p>
		</div>
		<div class="inline-wrap">
		<label class="inline-pre">${Drupal.t('URL')}</label>
		<pre class="lift-value">${lastDecisionRequest.captures[key].url}</pre>
		</div>
		</div>
		</div>`
		)).join('')}`:
		`<p>${Drupal.t('No recent captures.')}</p>`}
		</div>
		</div>
		</div>
		`;
		}

		$modal_element = $(modal_template);
		var dialogActiveClassName = 'dialog-active';
		var dialogContainerSelector = 'body';
		Drupal.dialog($modal_element, {