PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 3.11.14
Visualizer – Tables & Charts Manager with Built-in AI Generator v3.11.14
4.0.8 4.0.7 4.0.6 4.0.5 4.0.4 4.0.3 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.10.0 3.10.1 3.10.10 3.10.11 3.10.12 3.10.13 3.10.14 3.10.15 3.10.2 3.10.3 All 149 releases
← All changes | js/setup-wizard.js +136 -232 4.0.83.11.14 View file →
@@ -15,18 +15,9 @@
15 15 *
16 16 * @type {boolean}
17 17 */
18 18 const isLivePreview = window.location.search.includes('env=preview');
19 - const emailRegex = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
20 19
21 - var showNewsletterError = function ($input, message) {
22 - var $wrap = $input.closest('.vz-option-input');
23 - $wrap.next('.vz-field-error').remove();
24 - if (message) {
25 - $wrap.after('<span class="vz-field-error">' + message + '</span>');
26 - }
27 - };
28 -
29 20 /**
30 21 * Redirect to draft page after subscribe (optional).
31 22 *
32 23 * @param {Object} postData - Post data.
@@ -37,10 +28,8 @@
37 28 postData.security ??= visualizerSetupWizardData.ajax.security;
38 29 postData.step ??= 'step_subscribe';
39 30
40 31 // Subscribe the user using the email if provided. Redirect to the draft page.
41 - var $currentStep = $('#step-3');
42 -
43 32 $.post(visualizerSetupWizardData.ajax.url, postData, function (res) {
44 33
45 34 // Toggle the redirect popup.
46 35 $('.redirect-popup').find('h3.popup-title').html(res.message);
@@ -52,144 +41,77 @@
52 41 }, 5000);
53 42 } else {
54 43 $('.redirect-popup').hide();
55 44 }
56 - $currentStep.find('.spinner').removeClass('is-active');
45 + currentStep.find('.spinner').removeClass('is-active');
57 46 }).fail(function () {
58 47 $('.redirect-popup').hide();
59 - $currentStep.find('.spinner').removeClass('is-active');
48 + currentStep.find('.spinner').removeClass('is-active');
60 49 });
61 50 }
62 51
63 - var runImport = function () {
64 - var chartType = $(".vz-radio-btn:checked").val();
65 - var percentBarWidth = 0;
66 - var loaderDelay;
67 - var $step = $('#step-1');
68 - var $status = $step.find('.vz-import-status');
69 - var $progress = $status.find('.vz-progress-bar');
70 - var $message = $status.find('[data-import_message]');
71 - var $error = $status.find('.vz-error-notice');
72 - var $spinner = $step.find('.spinner');
73 - var $button = $step.find('[data-step_number="1"]');
52 + var provideContent = function(id, stepDirection, stepPosition, selStep, callback) {
53 + // Import chart data.
54 + if ( 1 == id ) {
55 + var chartType = $(".vz-radio-btn:checked").val();
56 + var percentBarWidth = 0;
57 + var loaderDelay;
58 + $.ajax( {
59 + beforeSend: function() {
60 + loaderDelay = setInterval(function () {
61 + $('.vz-progress-bar').css({
62 + width: percentBarWidth++ + '%'
63 + });
64 + }, 1000);
65 + },
66 + type: 'POST',
67 + url: visualizerSetupWizardData.ajax.url,
68 + dataType: 'json',
69 + data: {
70 + action: 'visualizer_wizard_step_process',
71 + security: visualizerSetupWizardData.ajax.security,
72 + chart_type: chartType,
73 + step: 'step_2',
74 + },
75 + success: function (data) {
76 + clearInterval( loaderDelay );
77 + loaderDelay = setInterval(function () {
78 + $('.vz-progress-bar').css({
79 + width: percentBarWidth++ + '%'
80 + });
81 + if ( percentBarWidth >= 100 ) {
82 + if ( 1 === data.success ) {
83 + var importMessage = jQuery('[data-import_message]');
84 + importMessage
85 + .html( importMessage.data('import_message') )
86 + .addClass('import_message');
74 87
75 - $status.show();
76 - $progress.css({ width: '0' });
77 - if ($message.length) {
78 - $message
79 - .text($message.data('import_initial'))
80 - .removeClass('import_message');
81 - }
82 - $error.addClass('hidden').empty();
83 - $spinner.addClass('is-active');
84 - $button.addClass('disabled');
85 -
86 - loaderDelay = setInterval(function () {
87 - percentBarWidth = Math.min(percentBarWidth + 4, 90);
88 - $progress.css({ width: percentBarWidth + '%' });
89 - }, 120);
90 -
91 - $.ajax({
92 - type: 'POST',
93 - url: visualizerSetupWizardData.ajax.url,
94 - dataType: 'json',
95 - data: {
96 - action: 'visualizer_wizard_step_process',
97 - security: visualizerSetupWizardData.ajax.security,
98 - chart_type: chartType,
99 - step: 'step_2',
100 - },
101 - success: function (data) {
102 - clearInterval(loaderDelay);
103 - $progress.css({ width: '100%' });
104 -
105 - if (1 === data.success) {
106 - if (data.chart_id) {
107 - var $shortcode = $('#basic_shortcode');
108 - if ($shortcode.length) {
109 - $shortcode.val(
110 - $shortcode.val().replace('{{chart_id}}', data.chart_id)
111 - );
88 + $('#step-2').find('button.disabled').removeClass('disabled');
89 + } else if( 2 === data.status && '' !== data.message ) {
90 + $('#step-2')
91 + .find('.vz-error-notice')
92 + .html( '<p>' + data.message + '</p>' )
93 + .removeClass('hidden');
94 + } else {
95 + $('#smartwizard').smartWizard('reset');
96 + }
97 + $('.vz-progress-bar').css({
98 + width: 100 + '%'
99 + });
100 + $('.vz-progress').css({
101 + visibility: 'hidden'
102 + });
103 + clearInterval( loaderDelay );
112 104 }
113 - }
114 - if ($message.length) {
115 - $message
116 - .text($message.data('import_message'))
117 - .addClass('import_message');
118 - }
119 -
120 - setTimeout(function () {
121 - $spinner.removeClass('is-active');
122 - $('#smartwizard').smartWizard('next');
123 - }, 200);
124 - } else if (2 === data.status && '' !== data.message) {
125 - $error.html('<p>' + data.message + '</p>').removeClass('hidden');
126 - $spinner.removeClass('is-active');
127 - $button.removeClass('disabled');
128 - } else {
129 - $spinner.removeClass('is-active');
130 - $button.removeClass('disabled');
131 - $('#smartwizard').smartWizard('reset');
105 + }, 36 );
106 + },
107 + error: function() {
108 + $('#step-2').find('.vz-progress-bar').animate({ width: '0' });
132 109 }
133 - },
134 - error: function () {
135 - clearInterval(loaderDelay);
136 - $progress.css({ width: '0' });
137 - $spinner.removeClass('is-active');
138 - $button.removeClass('disabled');
139 - }
140 - });
141 - };
142 -
143 - var collectInstallSlugs = function () {
144 - var slugs = [];
145 - var $optimole = $('#enable_performance');
146 - if ($optimole.length && $optimole.is(':checked') && !$optimole.is(':disabled')) {
147 - slugs.push('optimole-wp');
110 + } );
148 111 }
149 - if ($('#enable_otter_blocks').is(':checked') && !$('#enable_otter_blocks').is(':disabled')) {
150 - slugs.push('otter-blocks');
151 - }
152 - if ($('#enable_page_cache').is(':checked') && !$('#enable_page_cache').is(':disabled')) {
153 - slugs.push('wp-cloudflare-page-cache');
154 - }
155 - return slugs;
156 - };
157 -
158 - var setInstallStatus = function (slug, statusClass) {
159 - var $status = $('[data-install-status="' + slug + '"]');
160 - $status.removeClass('is-installing is-done is-error').addClass(statusClass);
161 - };
162 -
163 - var installPluginsSequentially = function (slugs, onDone) {
164 - if (!slugs.length) {
165 - onDone(true);
166 - return;
167 - }
168 - var slug = slugs.shift();
169 - setInstallStatus(slug, 'is-installing');
170 - $.post(
171 - visualizerSetupWizardData.ajax.url,
172 - {
173 - action: 'visualizer_wizard_step_process',
174 - security: visualizerSetupWizardData.ajax.security,
175 - slug: slug,
176 - step: 'step_4',
177 - },
178 - function (response) {
179 - if (1 === response.status) {
180 - setInstallStatus(slug, 'is-done');
181 - installPluginsSequentially(slugs, onDone);
182 - } else {
183 - setInstallStatus(slug, 'is-error');
184 - onDone(false, response.message);
185 - }
186 - }
187 - ).fail(function () {
188 - setInstallStatus(slug, 'is-error');
189 - onDone(false, '');
190 - });
191 - };
112 + callback();
113 + }
192 114 $("#smartwizard").smartWizard({
193 115 transition: {
194 116 animation: "fade", // Animation effect on navigation, none|fade|slideHorizontal|slideVertical|slideSwing|css(Animation CSS class also need to specify)
195 117 speed: "400", // Animation speed. Not used if animation is 'css'
@@ -210,9 +132,10 @@
210 132 // CSS Class settings
211 133 btnCss: "",
212 134 btnNextCss: "btn-primary next-btn",
213 135 btnPrevCss: "btn-light",
214 - }
136 + },
137 + getContent: provideContent
215 138 });
216 139
217 140 // click to open accordion.
218 141 $(".vz-accordion .vz-accordion-item .vz-accordion-item__button").on(
@@ -244,21 +167,49 @@
244 167
245 168 switch (stepNumber) {
246 169 case 1:
247 170 if ($(".vz-radio-btn").is(":checked")) {
248 - runImport();
171 + $('#smartwizard').smartWizard('next');
249 172 }
250 173 break;
251 - case 2:
174 + case 3:
252 175 if ( isLivePreview ) {
253 176 $('#smartwizard').smartWizard('next');
254 177 } else {
255 178 var urlParams = new URLSearchParams(window.location.search);
256 179 urlParams.set('preview_chart', Date.now());
257 - window.location.hash = "#step-2";
180 + window.location.hash = "#step-3";
258 181 window.location.search = urlParams;
259 182 }
260 183 break;
184 + case 4:
185 + $('#step-4').find('.spinner').addClass('is-active');
186 + $('#step-4').find('.vz-error-notice').addClass('hidden');
187 +
188 + $.post(
189 + visualizerSetupWizardData.ajax.url,
190 + {
191 + action: 'visualizer_wizard_step_process',
192 + security: visualizerSetupWizardData.ajax.security,
193 + slug: 'optimole-wp',
194 + step: 'step_4',
195 + },
196 + function (response) {
197 + if (1 === response.status) {
198 + $('#smartwizard').smartWizard('next');
199 + } else if ( 'undefined' !== typeof response.message ) {
200 + $('#step-4')
201 + .find('.vz-error-notice')
202 + .html("<p>" + response.message + "</p>");
203 + $('#step-4').find('.vz-error-notice').removeClass('hidden');
204 + }
205 + $('#step-4').find('.spinner').removeClass('is-active');
206 + }
207 + ).fail(function () {
208 + $('#step-4').find('.spinner').removeClass('is-active');
209 + });
210 + e.preventDefault();
211 + break;
261 212 default:
262 213 e.preventDefault();
263 214 break;
264 215 }
@@ -294,19 +245,21 @@
294 245 e.preventDefault();
295 246 });
296 247
297 248 // Enable performance feature.
249 + $("#step-4").on("change", "input:checkbox", function () {
250 + if ($(this).is(":checked")) {
251 + $(".skip-improvement").hide();
252 + $(".vz-wizard-install-plugin").show();
253 + } else {
254 + $(".skip-improvement").show();
255 + $(".vz-wizard-install-plugin").hide();
256 + }
257 + });
258 +
298 259 // Step: 4 Skip and subscribe process.
299 260 $(document).on( 'click', '.vz-subscribe', function (e) {
300 - var $btn = $(this);
301 -
302 - // Prevent double-clicks while the async flow is running.
303 - if ( $btn.prop('disabled') ) {
304 - e.preventDefault();
305 - return;
306 - }
307 -
308 - var withSubscribe = $btn.data("vz_subscribe");
261 + var withSubscribe = $(this).data("vz_subscribe");
309 262 var postData = {
310 263 action: "visualizer_wizard_step_process",
311 264 security: visualizerSetupWizardData.ajax.security,
312 265 step: "step_subscribe",
@@ -312,104 +265,35 @@
312 265 step: "step_subscribe",
313 266 };
314 267 var emailElement = $("#vz_subscribe_email");
315 268 // Remove error message.
316 - showNewsletterError(emailElement, '');
317 - var newsletterEnabled = $("#enable_newsletter").is(":checked");
269 + emailElement.next(".vz-field-error").remove();
318 270
319 - if (withSubscribe && newsletterEnabled) {
320 - var subscribeEmail = emailElement.val().trim();
271 + if (withSubscribe) {
272 + var subscribeEmail = emailElement.val();
273 + var EmailTest = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
321 274 var errorMessage = "";
322 275
323 276 if ("" === subscribeEmail) {
324 277 errorMessage = visualizerSetupWizardData.errorMessages.requiredEmail;
325 - } else if (!emailRegex.test(subscribeEmail)) {
278 + } else if (!EmailTest.test(subscribeEmail)) {
326 279 errorMessage = visualizerSetupWizardData.errorMessages.invalidEmail;
327 280 }
328 281 if ("" !== errorMessage) {
329 - showNewsletterError(emailElement, errorMessage);
282 + $('<span class="vz-field-error">' + errorMessage + "</span>").insertAfter(emailElement);
330 283 return false;
331 284 }
332 285
333 286 postData.email = subscribeEmail;
334 287 postData.with_subscribe = withSubscribe;
335 - } else {
336 - postData.with_subscribe = false;
337 288 }
289 + var currentStep = $( '.vz-wizard-wrap .tab-pane:last-child' );
290 + currentStep.find(".spinner").addClass("is-active");
338 291
339 - $btn.prop('disabled', true);
340 - var $step = $('#step-3');
341 - $step.find(".spinner").addClass("is-active");
342 - var $error = $step.find('.vz-error-notice').first();
343 - $error.addClass('hidden').empty();
344 -
345 - var slugs = collectInstallSlugs();
346 - installPluginsSequentially(slugs.slice(), function (ok, message) {
347 - if (!ok) {
348 - if (message) {
349 - $error.html('<p>' + message + '</p>').removeClass('hidden');
350 - }
351 - $step.find(".spinner").removeClass("is-active");
352 - $btn.prop('disabled', false);
353 - return;
354 - }
355 - goToDraftPage(postData);
356 - });
292 + goToDraftPage( postData );
357 293 e.preventDefault();
358 294 });
359 295
360 - $(document).on('click', '.vz-change-email', function () {
361 - var $card = $(this).closest('.vz-option-card--newsletter');
362 - var $inputWrap = $card.find('.vz-option-input');
363 - $inputWrap.show();
364 - $card.find('#vz_subscribe_email').focus();
365 - validateNewsletterEmail();
366 - });
367 -
368 - var finalizeNewsletterEmail = function ($card) {
369 - var $input = $card.find('#vz_subscribe_email');
370 - var $text = $card.find('.vz-email-text');
371 - var email = $input.val();
372 - if (email) {
373 - $text.text(email);
374 - }
375 - $card.find('.vz-option-input').hide();
376 - };
377 -
378 - $(document).on('click', '.vz-save-email', function () {
379 - var $card = $(this).closest('.vz-option-card--newsletter');
380 - if (!validateNewsletterEmail()) {
381 - return;
382 - }
383 - finalizeNewsletterEmail($card);
384 - });
385 -
386 - var validateNewsletterEmail = function () {
387 - var $input = $("#vz_subscribe_email");
388 - if (!$input.length) {
389 - return true;
390 - }
391 - var $card = $input.closest('.vz-option-card--newsletter');
392 - var $saveButton = $card.find('.vz-save-email');
393 - var email = $input.val().trim();
394 - showNewsletterError($input, '');
395 - if (!email) {
396 - $saveButton.prop('disabled', false);
397 - return true;
398 - }
399 - if (!emailRegex.test(email)) {
400 - showNewsletterError($input, visualizerSetupWizardData.errorMessages.invalidEmail);
401 - $saveButton.prop('disabled', true);
402 - return false;
403 - }
404 - $saveButton.prop('disabled', false);
405 - return true;
406 - };
407 -
408 - $(document).on('input blur', '#vz_subscribe_email', function () {
409 - validateNewsletterEmail();
410 - });
411 -
412 296 // Click to copy.
413 297 var clipboard = new ClipboardJS(".vz-copy-code-btn");
414 298 clipboard.on("success", function (e) {
415 299 var inputElement = $(e.trigger).prev("input:text");
@@ -418,11 +302,8 @@
418 302 // Remove disabled class from get started button.
419 303 $("#step-1").on("change", "input:radio", function () {
420 304 $("#step-1").find('[data-step_number="1"]').removeClass("disabled");
421 305 });
422 - if ( $('#step-1 .vz-radio-btn:checked').length ) {
423 - $('#step-1').find('[data-step_number="1"]').removeClass('disabled');
424 - }
425 306
426 307 // Change button text.
427 308 $(document).on("change", "#insert_shortcode", function () {
428 309 if ($(this).is(":checked")) {
@@ -436,8 +317,31 @@
436 317 ' <span class="dashicons dashicons-arrow-right-alt"></span>'
437 318 );
438 319 }
439 320 });
321 +
322 + $('.vz-chart-list > ul').slick({
323 + dots: false,
324 + infinite: false,
325 + speed: 400,
326 + slidesToShow: 1,
327 + centerMode: false,
328 + variableWidth: true
329 + })
330 + .on( 'afterChange', function(event, slick, currentSlide) {
331 + // Disable next buttion.
332 + if( currentSlide === 4 ) {
333 + $('.slick-next').attr('disabled', true).css('pointer-events', 'none');
334 + } else {
335 + $('.slick-next').removeAttr('disabled').css('pointer-events', 'all');
336 + }
337 + // Disable prev buttion.
338 + if( currentSlide === 0 ) {
339 + $('.slick-prev').attr('disabled', true).css('pointer-events', 'none');
340 + } else {
341 + $('.slick-prev').removeAttr('disabled').css('pointer-events', 'all');
342 + }
343 + } );
440 344
441 345 $(window).bind('pageshow', function() {
442 346 if ( jQuery('.vz-chart-option input').is(':checked') ) {
443 347 $('#step-1').find('button.disabled').removeClass('disabled');