Edit file File name : two_preview.js Content :jQuery("document").ready(function () { jQuery("style").remove(); jQuery("link:not(#two_preview_css-css):not(#two_google-fonts-css)").remove(); jQuery("body").html('<div id="two_preview_container"></div>') let two_local_flow_id = localStorage.getItem("two_flow_id"); let two_flow_id = two_preview_vars.flow_id; if(two_local_flow_id !== two_flow_id){ two_update_flow_status("1"); localStorage.removeItem("two_preview_mode"); localStorage.removeItem("two_mode_flow_status"); localStorage.setItem("two_flow_id", two_flow_id); } let two_preview_mode = localStorage.getItem("two_preview_mode"); let two_mode_flow_status = localStorage.getItem("two_mode_flow_status"); let two_modes = JSON.parse(two_preview_vars.two_modes); let two_incompatible_plugins = false; let two_mandatory_incompatible_plugins = false; const mandatory_plugins = ['wp-optimize/wp-optimize.php', 'wp-rocket/wp-rocket.php', 'nitropack/main.php']; if(two_preview_vars.incompatible_plugins){ two_incompatible_plugins = JSON.parse(two_preview_vars.incompatible_plugins); } if (two_incompatible_plugins) { two_mandatory_incompatible_plugins = !!Object.keys(two_incompatible_plugins).find((plugin) => mandatory_plugins.includes( plugin )) } let current_mode_key = "extreme"; let current_mode = two_modes[current_mode_key]; let current_mode_level = 1; let current_mode_next = current_mode["next"]; if (two_preview_mode && two_modes[two_preview_mode]["next"]) { current_mode = two_modes[two_preview_mode]; current_mode_key = current_mode["mode"]; current_mode_level = parseInt(current_mode["level"]); current_mode_next = current_mode["next"]; } let two_preview_contact_us_html = get_two_preview_contact_us_html(); let two_incompatible_plugins_html = get_two_incompatible_plugins_html(two_mandatory_incompatible_plugins); let two_preview_html = get_two_preview_html(current_mode, two_modes); if(current_mode_next === "0"){ jQuery("#two_preview_container").html(two_preview_contact_us_html); }else if(two_mode_flow_status && two_incompatible_plugins){ jQuery("#two_preview_container").html(two_incompatible_plugins_html); }else{ jQuery("#two_preview_container").html(two_preview_html); } jQuery("body").on("click", ".two_change_mode", function () { current_mode = two_modes[current_mode_next]; current_mode_key = current_mode["mode"]; current_mode_level = parseInt(current_mode["level"]); current_mode_next = current_mode["next"]; if(current_mode_next === "0"){ // contact_us // set mode no_optimize jQuery("#two_preview_container").html(two_preview_contact_us_html); two_update_flow_status("3"); two_flow_set_mode("extreme" , "1"); }else{ let two_preview_html = get_two_preview_html(current_mode, two_modes); jQuery("#two_preview_container").html(two_preview_html); } jQuery("#two_preview_iframe").attr("src", current_mode.preview_url); localStorage.setItem("two_preview_mode", current_mode_key); }); jQuery("body").on("click", ".two_save_mode", function () { //finish flow set global mode //check incompatible plugins let global_set_mode = jQuery(this).data("mode"); localStorage.setItem("two_mode_flow_status", "1"); localStorage.setItem("two_preview_mode", current_mode_key); two_update_flow_status("2"); if(two_incompatible_plugins) { two_flow_set_mode(global_set_mode); jQuery("#two_preview_container").html(two_incompatible_plugins_html); }else{ jQuery("#two_looks_good_form").submit(); } }); jQuery("body").on("click", ".two_contact_us_button", function (e) { e.preventDefault(); two_update_flow_status("4"); window.location.replace(two_preview_vars.contact_us_url); }); jQuery("body").append("<iframe id='two_preview_iframe' src='"+current_mode.preview_url+"'></iframe>"); jQuery('.two_incompatible_plugin label').click(function() { if( jQuery('.two_checkbox:checkbox:checked').length === 0 ) { jQuery('.two_disable_incompatible_plugins').addClass('deactivated').prop('disabled', true); } else { jQuery('.two_disable_incompatible_plugins').removeClass('deactivated').prop('disabled', false); } }); }); /*jQuery(document).on('click','.two_preview_close',function() { jQuery('.two_preview_tools').toggleClass('two_preview_tools_closed'); });*/ function get_two_incompatible_plugins_html(two_mandatory_incompatible_plugins) { if(two_preview_vars.incompatible_plugins){ let two_incompatible_plugins = JSON.parse(two_preview_vars.incompatible_plugins); let incompatible_plugins_html = ""; for (let two_i in two_incompatible_plugins) { if (two_mandatory_incompatible_plugins) { incompatible_plugins_html += `<div class='two_incompatible_plugin with-restricted'><input class="two_checkbox" name="incompatible_plugins[]" checked type="checkbox" value="` + two_i + `"><span class="restricted-mark"></span>` + two_incompatible_plugins[two_i] + `</div>`; } else { incompatible_plugins_html += `<div class='two_incompatible_plugin'><label> <input class="two_checkbox" name="incompatible_plugins[]" checked type="checkbox" value="` + two_i + `"> ` + two_incompatible_plugins[two_i] + `<span class="checkmark"></span></label> </div>`; } } let return_html = `<div class='two_not_available'>` + two_preview_vars.two_company_name + ` Booster onboarding flow <br/>is available only on desktop</div> <div class='two_preview_tools'> <div class="two_incompatible_plugins_container">`; if (two_mandatory_incompatible_plugins) { return_html += `<p class="two_preview_tools_title">` + two_preview_vars.two_company_name + ` Booster will not work with these plugins</p> <p class="two_preview_tools_desc last-step">Proceeding will temporarly deactivate these plugins.</p>` } else { return_html += `<p class="two_preview_tools_title">Some plugins are conflicting with ` + two_preview_vars.two_company_name + ` Booster</p> <p class="two_preview_tools_desc last-step">We recommend deactivating these plugins. By clicking ‘Next’ the selected plugins will be deactivated.</p>` } return_html += `<div class="two_preview_tools_info two_preview_tools_content incompatible_plugins"> <form action="` + two_preview_vars.ajaxurl + `" method="post"> <div class="two_incompatible_plugins"> ` + incompatible_plugins_html + ` </div> <input type="hidden" name="nonce" value="`+two_preview_vars.ajaxnonce+`"> <input type="hidden" name="action" value="two_flow_incompatible_plugins"> <div class="two_preview_tools_content_buttons"> <button class="two_disable_incompatible_plugins two_preview_button" name="two_disable_incompatible_plugins" type="submit">NEXT</button> </div> </form> </div> </div> </div>`; return return_html; } return ""; } function get_two_preview_html(current_mode, two_modes) { let two_next_mode_key = current_mode["next"]; if(two_next_mode_key === "0"){ return ""; } let next_mode = two_modes[two_next_mode_key]; let current_mode_level = parseInt(current_mode["level"]); let current_mode_key = current_mode["mode"]; return_html = ` <div class='two_not_available'>` + two_preview_vars.two_company_name + ` Booster onboarding flow <br/>is available only on desktop</div> <div class='two_preview_tools'> <div class="two_preview_tools-wrap"> <div class='two_preview_tools-first-block'> <p class="two_preview_tools_title with_icon">` + two_preview_vars.two_company_name + ` Booster</p> <p class="two_preview_tools_desc first-step">This is the preview of your optimized homepage.</p> <p class="two_preview_tools_notice"><span>Your live website is unaffected.</span></p> </div>`; if (current_mode_level === 1) { return_html += ` <div class="two_preview_tools_content"> <p class="two_preview_tools_desc two_bold">Is this preview identical to your live homepage?</p>`; } else { return_html += ` <div class="two_preview_tools_content"> <p class="two_preview_count">Preview ` + current_mode_level + `</p> <p class="two_preview_tools_desc">Is this preview identical to your live homepage?</p>`; } return_html += ` <div class="two_preview_tools_buttons"> <form style="display: none !important;" id="two_looks_good_form" action="` + two_preview_vars.ajaxurl + `" method="post"> <input type="hidden" name="action" value="two_flow_set_mode"> <input type="hidden" name="mode" value="`+current_mode_key+`"> <input type="hidden" name="test_mode" value="0"> <input type="hidden" name="redirect" value="1"> <input type="hidden" name="nonce" value="`+two_preview_vars.ajaxnonce+`"> </form> <p class="two_change_mode" data-level="` + next_mode['level'] + `" data-mode="` + two_next_mode_key + `" data-url="` + next_mode['preview_url'] + `">Something is off</p> <p class="two_save_mode" data-mode="`+current_mode_key+`">Looks good</p> </div> </div> </div> </div>` return return_html; } function get_two_preview_contact_us_html() { let return_html = ` <div class='two_not_available'>` + two_preview_vars.two_company_name + ` Booster onboarding flow <br/>is available only on desktop</div> <div class='two_preview_tools'> <div class="two_preview_tools_content_centered"> <p class="two_preview_tools_title">We know how to help you!</p> <p class="two_preview_tools_desc last-step">We’re sorry you’re still having issues. A unique website like yours requires a unique solution.</p> <div class="two_preview_tools_notice last-step"> <div> <span class="two_preview_chat"></span> <div class="two_contact_us-desc">Please drop us a message and we’ll try to fix it on our end.</div> </div> <a class="two_contact_us_button two_preview_button" href="\` + two_preview_vars.contact_us_url + \`">CONTACT US</a> </div> </div> </div>` return return_html; } function two_flow_set_mode(mode , test_mode="0", redirect_url = false){ jQuery.ajax({ type: "POST", url: two_preview_vars.ajaxurl, dataType: 'json', data: { action: "two_flow_set_mode", mode: mode, test_mode: test_mode, nonce: two_preview_vars.ajaxnonce, } }).done(function (data) { if(redirect_url){ window.location.href = redirect_url; } }); } function two_update_flow_status(status){ jQuery.ajax({ type: "POST", url: two_preview_vars.ajaxurl, dataType: 'json', data: { action: "two_update_flow_status", status:status, nonce: two_preview_vars.ajaxnonce, } }).done(function (data) { }); } Save