diff --git a/assets/css/admin.scss b/assets/css/admin.scss index c73f987ac..32af1e8e0 100644 --- a/assets/css/admin.scss +++ b/assets/css/admin.scss @@ -5939,6 +5939,258 @@ body.user-registration { } } +.ur-multi-device-form-preview { + #nav-menu-header { + padding: 12px; + display: flex; + align-items: center; + position: relative; + border-color: $border_color; + background-color: $white; + z-index: 9; + + .ur-form-title { + font-weight: $semi_bold; + font-size: 16px; + line-height: 150%; + color: #414141; + padding-left: $spacing_18px; + padding-right: $spacing_8px; + } + + + .ur-brand-logo { + border-right: 1px solid $border_color; + + img { + width: 32px; + height: 32px; + margin-right: 8px; + display: flex; + } + a { + text-decoration: none; + border: none; + } + a:focus { + outline: none; + box-shadow: none; + } + } + + &::before, + &::after { + content: ""; + display: flex; + position: absolute; + left: 0; + right: 0; + bottom: 0; + background: $white; + } + + &::before { + top: 0; + z-index: -1; + } + + &::after { + height: 10px; + box-shadow: 0px 4px 8px transparentize($gray_base, 0.92); + z-index: -2; + } + + } + .major-publishing-actions { + clear: both; + line-height: 28px; + margin-left: auto; + + .publishing-action { + text-align: right; + float: right; + + input { + &.code { + width: 280px; + height: 33px; + padding: 0 $spacing_6px; + margin: 0; + border-color: $grey-50; + background: $blue-25; + border-radius: 3px 0 0 3px; + } + } + } + + + #copy-shortcode { + margin-left: -5px; + border-radius: 0 4px 4px 0; + background: $blue-50 !important; + border-color: $grey-50 !important; + + svg { + width: 18px; + height: 18px; + } + } + } + .ur-form-preview-devices{ + clear: both; + line-height: 28px; + margin-left: auto; + + svg{ + width: 18px; + height: 18px; + cursor: pointer; + } + + } + .ur-form-preview-main-content{ + + display: flex; + background: #f2f2f2; + + .ur-form-preview-form{ + width: 1060px; + padding: 30px; + gap: 30px; + border: 1px solid $border_color; + border-radius: 25px; + margin:38px; + background: #fff; + + .ur-form-preview-title{ + padding:24px; + font-size: 20px; + font-style: normal; + font-weight: 600; + line-height: 150%; + color: #414141; + + } + .ur-form-preview-content{ + padding:24px; + } + + } + + .ur-form-side-panel{ + display: flex; + min-width: 380px; + padding: 20px; + flex-direction: column; + gap: 36px; + border: 1px solid $border_color; + margin-left: auto; + background: #fff; + + .hidden{ + display:none !important; + } + .ur-form-preview-save, + .ur-form-preview-upgrade { + background: #475BB2; + width: max-content; + padding: 10px; + margin-bottom: 0px; + display: flex; + margin-left: auto; + margin-right: auto; + gap: 8px; + border-radius: 4px; + border: 1px solid #475BB2; + cursor: pointer; + + .ur-form-preview-save-title{ + font-size: 14px; + font-style: normal; + font-weight: 500; + line-height: 150%; + } + + } + + .ur-from-preview-theme-toggle{ + display: flex; + justify-content: space-between; + + .ur-form-preview-toggle-title{ + color: #222; + font-size: 16px; + font-style: normal; + font-weight: 600; + line-height: 150%; + } + + } + + .ur-form-preview-pro-features{ + display: flex; + flex-direction: column; + gap: 16px; + margin: 0; + + .ur-form-preview-sidebar__body--list-item{ + svg{ + height: 18px; + width: 18px; + position: relative; + top: 5px; + margin-right: 10px; + } + + } + } + } + .hidden{ + display: none; + } + + } + + .ur-small-screen-preview{ + .ur-form-row { + display: -webkit-flex; + display: flex; + + -webkit-flex-direction: column; + flex-direction: column; + .ur-form-grid{ + width: 100% !important; + margin-bottom: 20px; + &:nth-child(1n+2) { + border-left: 1px solid $border_color; + } + &:last-child { + margin-bottom: 0; + border-left: 0 none; + } + } + } + } + .ur-form-preview-sidepanel-toggler{ + position: absolute; + width: 27px; + height: 48px; + top: 50%; + left: calc(100% - 457px); + + } + .inactive{ + left: calc(100% - 27px); + + } + + + +} + + + + body { &.ur-settings-sidebar-hidden { .user-registration-settings-sidebar-container { diff --git a/assets/css/user-registration-default.scss b/assets/css/user-registration-default.scss new file mode 100644 index 000000000..cd2c22d7b --- /dev/null +++ b/assets/css/user-registration-default.scss @@ -0,0 +1,773 @@ +/** +* user-registration.scss +* Governs the general look and feel of User Registration sections of stores using themes that do not +* integrate with User Registration specifically. +*/ + +/** +* Imports +*/ +@import "variables/variables"; +@import "mixins/mixins"; +@import "fonts"; + +// Components +@import "components/button", "components/modal"; + + +/** +* Utility classes +*/ +.clear { + clear: both; +} + +.user-registration-page .select2-dropdown, +.user-registration-swal2-container { + z-index: 9999; +} + +.user-registration-page .select2-dropdown { + padding: 0px !important; +} + + +.ur-timepicker-range { + display: flex; +} + +.timepicker-start { + margin-right: 1rem; +} +/** +* Main User Registration styles +*/ +.user-registration-message, +.user-registration-error, +.user-registration-coupon-error, +.user-registration-info { + display: block; + margin: 0 0 10px; + padding: 10px 15px; + background-color: lighten($primary_color, 47%); + color: $color_gray_one; + border-top: 3px solid $primary_color; + list-style: none outside; + @include clearfix(); + width: auto; + word-wrap: break-word; + line-height: 1.25; + text-transform: none; + font-size: 14px; + + &::before { + content: "\f348"; + display: inline-block; + vertical-align: middle; + font-family: "Dashicons"; + font-size: calc(100% + 10px); + margin-right: 0.875rem; + } + + ul { + margin: 0 !important; + padding: 0 !important; + background-color: transparent !important; + } + + .button { + float: right; + } + + li { + list-style: none outside !important; // Required for default theme compatibility + padding-left: 0 !important; // Required for default theme compatibility + margin-left: 0 !important; // Required for default theme compatibility + } + + .message { + margin: 0; + padding: 0; + } +} + +.user-registration-message { + border-top-color: #8fae1b; + background: rgba(#8fae1b, 0.1); + color: darken(#8fae1b, 15%); +} + +.user-registration-info { + color: #1e85be; + border-top-color: #1e85be; +} + +.user-registration-error { + border-top-color: $red; + background: rgba($red, 0.1); + color: darken($red, 15%); + + &::before { + content: "\f534"; + } +} +.user-registration-coupon-error { + border-top-color: $red; + background: rgba($red, 0.1); + color: darken($red, 15%); + margin-top: 10px; +} + +input.ur-input-border-green, textarea.ur-input-border-green{ + border-color: #1EA71B !important; +} +input.ur-input-border-red, textarea.ur-input-border-red{ + border-color: $red !important; +} + +.ur-frontend-form { + //For borders around the form + margin-bottom: 30px; + border: 1px solid $border_color; + padding: 20px; + box-sizing: border-box; + + //For login form + //ToDO: Need to remove this class + &.login { + margin: 0; + padding: 10px; + box-shadow: none; + background: none; + + input[name="rememberme"]#rememberme { + vertical-align: middle; + } + } + + &.login-registration { + margin: 0; + border: none; + padding: 0; + } + + .register { + #node_recaptcha_register { + padding: 0 10px; + } + } + + #ur-recaptcha-node { + margin-top: 10px; + } + + * { + box-sizing: border-box; + } + + .description { + display: block; + font-size: 14px; + line-height: 1.5; + } + + .ur-form-row { + display: flex; + + &:last-child { + margin-bottom: 0; + } + + .ur-form-grid { + flex: 1; + padding: 0 10px; + + &:nth-child(1n + 2) { + border-left: 0 none; + } + + // .ur-field-item { + // margin-bottom: 20px; + // &.field-multiple_choice, + // &.field-subscription_plan, + // &.field-checkbox, + // &.field-radio { + // ul { + // margin: 0; + // list-style: none; + + // li { + // margin-left: 0; + // line-height: 1.3; + // vertical-align: middle; + // margin-bottom: 10px; + + // input, + // label { + // display: inline-block; + // vertical-align: inherit; + // } + + // input { + // &[type="checkbox"], + // &[type="radio"] { + // margin-top: 2px; + // } + // } + + // label { + // display: inline; + // } + // } + // } + // } + + // &:last-child { + // margin-bottom: 0; + // } + + // .form-row { + // display: block; + // } + // } + input{ + border-style: solid; + } + input[type="text"], + input[type="email"], + input[type="url"], + input[type="password"], + input[type="date"], + input[type="number"], + input[type="timepicker"], + input[type="phone"], + textarea, + select, + + .__PrivateStripeElement { + width: 100%; + padding: 4px 8px; + border-radius: 0; + min-height: 36px; + margin-bottom: 10px; + line-height: 1.5; + + &::placeholder { + color: #ddd; + } + } + + input[type="password"] { + display: inline; + margin-bottom: 0px; + } + + .StripeElement { + padding: 4px 8px; + border: 1px solid $border_color; + + .__PrivateStripeElement { + iframe { + // height: 20px !important; + position: absolute; + top: 50%; + transform: translateY(-50%); + } + } + } + + input[type="checkbox"], + input[type="radio"] { + font-size: 12px; + display: inline-block; + vertical-align: middle; + margin-right: 5px; + margin-left: 20px; + + &:first-child { + margin-left: 0; + } + } + + input[type="radio"]:focus, + input[type="text"]:focus, + input[type="email"]:focus, + input[type="url"]:focus, + input[type="password"]:focus, + textarea:focus, + select:focus, + button:focus { + outline: 0; + } + + input[readonly], + select[readonly], + textarea[readonly] { + cursor: auto; + } + + select { + -webkit-appearance: none; + background: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E") + no-repeat right 5px top 55%; + } + + legend, + label { + display: block; + font-size: 14px; + margin-bottom: 10px; + margin-top: 10px; + + .required { + text-decoration: none; + border: none; + color: $red; + } + + &.ur-label { + font-weight: bold; + } + } + + textarea { + padding: 10px; + height: 100px; + resize: none; + padding: 5px 20px; + } + + .hide_show_password { + input[type="password"] { + padding-right: 50px; + } + + .password-input-group { + position: relative; + + .password_preview { + color: $color_gray_two; + position: absolute; + top: 50%; + right: 15px; + transform: translateY(-50%); + + &.dashicons { + &.dashicons-hidden { + opacity: 0.6; + + &:hover { + opacity: 1; + } + } + } + } + } + } + } + + .select2-container { + .select2-selection--multiple { + border: 1px solid $color_gray_five; + + .select2-selection__rendered { + display: block; + + li { + &:last-child { + margin-left: 0; + } + } + } + + .select2-selection__choice { + margin: 5px; + } + + .select2-search--inline { + input[type="text"] { + margin: 5px; + height: inherit; + } + } + } + } + } + + button, + input[type="submit"], + button[type="submit"] { + padding: 10px 20px; + line-height: 1.5; + text-align: center; + word-break: break-word; + white-space: normal; + border: none; + cursor: pointer; + transition: 0.35s all ease-out; + } + + input[type="submit"] { + float: right; + } + + .ur-button-container { + display: flex; + margin-top: 10px; + padding: 0 10px; + + .ur-submit-button { + margin-left: auto; + } + } + + .user-registration-submit-Button { + float: right; + } + + .ur-submit-button { + margin-right: 10px; + margin-bottom: 0; + } + + label { + abbr.required { + text-decoration: none; + border: none; + color: $red; + } + } + + &.ur-frontend-form--bordered { + form { + .ur-form-row { + .ur-form-grid { + input[type="text"], + input[type="email"], + input[type="url"], + input[type="password"], + input[type="date"], + input[type="number"], + textarea, + select { + border: none; + border-bottom: 1px solid $border_color_input; + outline: none; + transition: all 0.35s; + padding: 10px 15px; + background: $input_background_color; + color: $label_color; + height: 45px; + } + + legend, + label { + margin-left: 5px; + color: $label_color; + } + + textarea { + height: 100px; + } + + .hide_show_password { + input[type="password"] { + padding-right: 50px; + } + } + } + } + + input[type="submit"], + button[type="submit"], + button.user-registration-multi-part-nav-prev, + button.user-registration-multi-part-nav-next { + background: $input_background_color; + border: 1px solid $border_color; + color: $label_color; + border-radius: 0; + + &:hover { + background: $primary_color; + color: $white; + border-color: $primary_color; + } + } + } + } + + &.ur-frontend-form--flat { + background: $color_sortable_background; + border: none transparent; + + form { + .ur-form-row { + .ur-form-grid { + .ur-field-item, + .form-row { + margin-bottom: 0; + } + + input[type="text"], + input[type="email"], + input[type="url"], + input[type="password"], + input[type="date"], + input[type="number"], + textarea, + select { + border: none; + outline: none; + padding: 10px 15px; + background: $white; + color: $label_color; + margin-bottom: 10px; + height: 45px; + + &:focus { + box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.05); + } + } + + select { + margin-bottom: 10px; + } + + legend, + label { + color: $label_color; + } + + textarea { + height: 100px; + } + + .hide_show_password { + input[type="password"] { + padding-right: 50px; + } + } + } + } + } + } + + &.ur-frontend-form--rounded { + form { + .ur-form-row { + .ur-form-grid { + input[type="text"], + input[type="email"], + input[type="url"], + input[type="password"], + input[type="date"], + input[type="number"], + textarea, + select { + border: 1px solid $rounded-color; + border-radius: 25px; + outline: none; + transition: all 0.35s; + padding: 10px 15px; + background: $white; + color: $label_color; + height: 45px; + } + + button[type="button"] { + border-radius: 25px; + } + + legend, + label { + margin-left: 5px; + color: $label_color; + } + + textarea { + height: 100px; + } + + .hide_show_password { + input[type="password"] { + padding-right: 50px; + } + } + } + } + + input[type="submit"], + button[type="submit"], + button.user-registration-multi-part-nav-prev, + button.user-registration-multi-part-nav-next { + border: 0 none; + color: $white; + border-radius: 25px; + float: none; + display: block; + padding: 15px 25px; + } + } + + &.ur-frontend-form--rounded-edge { + form { + .ur-form-row { + .ur-form-grid { + input[type="text"], + input[type="email"], + input[type="url"], + input[type="password"], + input[type="date"], + input[type="number"], + textarea, + select { + border-radius: 2px; + } + + .hide_show_password { + input[type="password"] { + padding-right: 50px; + } + } + + button[type="button"] { + border-radius: 2px; + } + } + } + + input[type="submit"], + button[type="submit"], + button.user-registration-multi-part-nav-prev, + button.user-registration-multi-part-nav-next { + border-radius: 2px; + } + } + } + } + + #ur-submit-message-node { + margin: 20px 0 0 0; + + &.ur-error { + background: rgba(206, 0, 0, 0.1); + } + + &.ur-message.message { + background: rgba(143, 174, 27, 0.2); + } + } +} + +#user-registration { + background-color: $white; + margin: 30px 0; + + &.user-registration, + * { + box-sizing: border-box; + } + + p { + color: #333333; + } + + .user-registration-tips { + font-size: 12px; + color: $color_gray_three; + margin-bottom: 0; + } + + + +} + +/** +* Password strength meter +*/ +.user-registration-password-strength { + text-align: center; + font-weight: 600; + padding: 3px 0.5em; + font-size: 1em; + + &.strong { + background-color: #c1e1b9; + border-color: #83c373; + } + + &.short { + background-color: #f1adad; + border-color: #e35b5b; + } + + &.bad { + background-color: #fbc5a9; + border-color: #f78b53; + } + + &.good { + background-color: #ffe399; + border-color: #ffc733; + } +} + +.user-registration-password-hint { + margin: 0.5em 0 0; + display: block; +} + +.ur-front-spinner { + background: url("../images/wpspin_light-2x.gif") no-repeat; + background-size: 16px 16px; + display: block; + opacity: 0.7; + filter: alpha(opacity=70); + width: 16px; + height: 16px; + margin-left: -40px; + float: left; +} + +.ur-hidden { + display: none; +} + +.button-check-all { + display: inline-block; + text-decoration: none; + font-size: 13px; + line-height: 2.15384615; + min-height: 30px; + margin: 0; + padding: 0 10px; + cursor: pointer; + border-width: 1px; + border-style: solid; + -webkit-appearance: none; + border-radius: 3px; + white-space: nowrap; + box-sizing: border-box; +} + +.ur-form-row { + margin-bottom: 24px; + + .flatpickr-input { + padding-left: 32px !important; + } + .without_icon { + padding-left: 10px !important; + } + span.input-wrapper { + position: relative; + + .ur-icon { + position: absolute; + top: 50%; + padding: 8px; + left: 0; + transform: translateY(-50%); + } + } +} diff --git a/assets/images/save-frame.svg b/assets/images/save-frame.svg new file mode 100644 index 000000000..03d35dfd8 --- /dev/null +++ b/assets/images/save-frame.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/assets/images/upgrade-icon.svg b/assets/images/upgrade-icon.svg new file mode 100644 index 000000000..a18270999 --- /dev/null +++ b/assets/images/upgrade-icon.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/assets/js/admin/admin.js b/assets/js/admin/admin.js index 0700021b6..03378b780 100644 --- a/assets/js/admin/admin.js +++ b/assets/js/admin/admin.js @@ -438,6 +438,113 @@ jQuery(function ($) { $("#user_registration_form_setting_redirect_after_field").hide(); } ); + /** + * Toggle sidepanel. + */ + $(document.body).on("click", ".ur-form-preview-sidepanel-toggler", function () { + $(".ur-form-side-panel").toggleClass("hidden"); + $(this).toggleClass("inactive"); + }) + + /** + * Change form preview based on device selected. + */ + $(document.body).on("click", ".ur-form-preview-device", function () { + + var device = $(this).data("device"); + var container_wrapper = $(".ur-frontend-form"); + var preview_form = $(".ur-form-preview-form"); + + $(this).parent().find("svg path").css("fill", "#383838") + $(this).find("path").css("fill", "#475BB2"); + + var isDesktop = (device === "desktop"); + var width = isDesktop ? "100%" : (device === "tablet" ? "768px" : "375px"); + + if (isDesktop) { + container_wrapper.removeClass("ur-small-screen-preview"); + } else { + container_wrapper.addClass("ur-small-screen-preview"); + } + container_wrapper.css("width", width); + + preview_form.css({ + "width": width, + "margin-left": isDesktop ? "" : "auto", + "margin-right": isDesktop ? "" : "auto" + }); + + + }) + + /** + * Save form preview settings. + */ + $(document.body).on("click", "#ur-form-save", function () { + var form_id = $(this).data( "id" ); + var form_theme = $( this ).data( 'theme' ); + + $.ajax({ + url: user_registration_form_preview.ajax_url, + type: "POST", + data: { + action: "user_registration_form_preview_save", + id: form_id, + theme: form_theme, + security: user_registration_form_preview.form_preview_nonce, + }, + beforeSend: function () { + var spinner = + ''; + $(".ur-form-preview-save").append(spinner); + }, + complete: function (response) { + $(".ur-spinner").remove(); + $('.ur-form-preview-save').find('img').remove() + if (response.responseJSON.success === true) { + $(".ur-form-preview-save-title").html( response.responseJSON.data.message); + + } else { + $(".ur-form-preview-save-title").html( response.responseJSON.data.message); + } + setTimeout(function() { + $(".ur-form-preview-save").toggleClass('hidden'); + }, 3000); + + } + + }) + }) + + $(document).ready(function () { + // $('#ur_toggle_form_preview_theme').is(":checked") ? $('link#ur-form-preview-theme-style-css').prop('disabled', true) : $('link#ur-form-preview-default-style-css').prop('disabled', false); + $('#ur_toggle_form_preview_theme').is(":checked") ? $('.ur-frontend-form').addClass("ur-frontend-form-preview") : $('.ur-frontend-form').removeClass("ur-frontend-form-preview"); + }) + + $(document.body).on("click", ".ur-form-preview-upgrade", function () { + window.open(user_registration_form_preview.pro_upgrade_link, "_blank"); + }) + + /** + * Save form applying theme style. + */ + $(document.body).on("change", "#ur_toggle_form_preview_theme", function () { + $('.ur-form-preview-save').toggleClass("hidden"); + $('.ur-frontend-form').toggleClass("ur-frontend-form-preview"); + // if($(this).is(":checked")) { + // $('link#ur-form-preview-theme-style-css').prop('disabled', false); + // $('link#ur-form-preview-default-style-css').prop('disabled', true); + // }else{ + // $('link#ur-form-preview-theme-style-css').prop('disabled', true); + // $('link#ur-form-preview-default-style-css').prop('disabled', false); + // } + + }) + + + + + /** * Hide/Show minimum password strength field on the basis of enable strong password value. diff --git a/includes/admin/class-ur-admin-form-preview.php b/includes/admin/class-ur-admin-form-preview.php new file mode 100644 index 000000000..600b484c4 --- /dev/null +++ b/includes/admin/class-ur-admin-form-preview.php @@ -0,0 +1,293 @@ +plugin_url() . '/assets/js/admin/admin.js', array( 'wp-element', 'wp-blocks', 'wp-editor' ), UR()->version, true ); + wp_register_style( 'ur-form-preview-admin-style', UR()->plugin_url() . '/assets/css/admin.css', array(), UR()->version ); + // wp_register_style( 'ur-form-preview-theme-style', UR()->plugin_url() . '/assets/css/user-registration-default.css', array(), UR()->version ); + wp_register_style( 'ur-form-preview-default-style', UR()->plugin_url() . '/assets/css/user-registration.css', array(), UR()->version ); + wp_register_style( 'ur-form-preview-smallscreens', UR()->plugin_url() . '/assets/css/user-registration-smallscreen.css', array(), UR()->version ); + wp_enqueue_style( 'ur-form-preview-admin-style' ); + wp_enqueue_style( 'ur-form-preview-smallscreens' ); + wp_enqueue_style( 'ur-form-preview-default-style' ); + // wp_enqueue_style( 'ur-form-preview-theme-style' ); + wp_enqueue_script( 'ur-form-preview-admin-script' ); + + wp_localize_script( + 'ur-form-preview-admin-script', + 'user_registration_form_preview', + array( + 'ajax_url' => admin_url( 'admin-ajax.php' ), + 'form_preview_nonce' => wp_create_nonce( 'ur_form_preview_nonce' ), + 'pro_upgrade_link' => 'https://wpeverest.com/wordpress-plugins/user-registration/?utm_source=plugin&utm_medium=form-preview&utm_campaign=pro-upgrade', + ) + ); + + if ( ! empty( $_GET['page'] ) && ! empty( $_GET['form_id'] ) ) { //phpcs:ignore WordPress.Security.NonceVerification + + ob_start(); + self::form_preview_header(); + self::form_preview_body(); + self::setup_wizard_footer(); + exit; + } + } + + /** + * Setup wizard header content. + * + * @since 1.0.0 + */ + public static function form_preview_header() { + ?> + + > + + + + + <?php esc_html_e( 'User Registration - Setup Wizard', 'user-registration' ); ?> + + + + + + + + + + + + + + + + + +
+ +
+ +
+ + + +
+ + + '; + $html .= ''; + $html .= get_the_title( $form_id ); + $html .= ''; + $html .= '
'; + if ( function_exists( 'apply_shortcodes' ) ) { + $content = apply_shortcodes( '[user_registration_form id="' . $form_id . '"]' ); + } else { + $content = do_shortcode( '[user_registration_form id="' . $form_id . '"]' ); + } + $html .= '
'; + $html .= $content; + $html .= ''; + + echo $html; + + + } + } + + /** + * Side panel content. + */ + public static function side_panel_content() { + $pro_features = array( + esc_html__( 'Stripe & PayPal Integration', 'user-registration' ), + esc_html__( 'Style Export & Import', 'user-registration' ), + esc_html__( 'Conditional Email Routing', 'user-registration' ), + esc_html__( 'Advanced Form Fields', 'user-registration' ), + esc_html__( 'Quiz & Survey Forms', 'user-registration' ), + esc_html__( '40+ Integrations', 'user-registration' ), + esc_html__( 'Multi-Step Forms', 'user-registration' ), + esc_html__( 'SMS Notifications', 'user-registration' ), + esc_html__( 'Calculated Fields', 'user-registration' ), + ); + $is_theme_style = get_post_meta( $_GET['form_id'],'user_registration_enable_theme_style', 'no' ); + if ( 'no' === $is_theme_style || empty( $is_theme_style ) ) { + $checked = ''; + $data_theme = 'default'; + } else { + $checked = 'checked'; + $data_theme = 'theme_style'; + } + $html =''; + $html .= '
'; + $html .= ''; + $html .= ''; + $html .= '
'; + $html .= ''; + $html .= '
'; + $html .= '

Our Pro Features

'; + foreach ( $pro_features as $list ) { + $html .= '
'; + + $html .= ' + + '; + + $html .= ''; + $html .= wp_kses_post( $list ); + $html .= ''; + $html .= '
'; + + } + $html .= '
'; + $html .= 'Save'; + $html .= '
Upgrade to Pro
'; + $html .= '
'; + + echo $html; + + ?> + + + + 'ur_form_preview', + 'form_id' => $form_id, + + ), + admin_url('admin.php') + ); } if ( isset( $_GET['onboarding-skipped'] ) ) { // phpcs:ignore WordPress.Security.NonceVerification.Recommended diff --git a/includes/admin/class-ur-admin.php b/includes/admin/class-ur-admin.php index 07a70f4f9..a85882a33 100644 --- a/includes/admin/class-ur-admin.php +++ b/includes/admin/class-ur-admin.php @@ -139,8 +139,12 @@ public function includes() { case 'user-registration-dashboard': include_once __DIR__ . '/class-ur-admin-dashboard.php'; break; + case 'ur_form_preview': + include_once __DIR__ . '/class-ur-admin-form-preview.php'; + break; } } + } /** diff --git a/includes/admin/views/html-admin-page-forms.php b/includes/admin/views/html-admin-page-forms.php index 8240d87a8..cbbb57c5b 100644 --- a/includes/admin/views/html-admin-page-forms.php +++ b/includes/admin/views/html-admin-page-forms.php @@ -51,8 +51,9 @@ class=" code" size="35"> } ?> - - + + diff --git a/includes/class-ur-ajax.php b/includes/class-ur-ajax.php index 724fe45b8..51d495ad3 100644 --- a/includes/class-ur-ajax.php +++ b/includes/class-ur-ajax.php @@ -74,6 +74,7 @@ public static function add_ajax_events() { 'search_global_settings' => false, 'php_notice_dismiss' => false, 'locate_form_action' => false, + 'form_preview_save' =>false, ); foreach ( $ajax_events as $ajax_event => $nopriv ) { @@ -756,6 +757,31 @@ public static function locate_form_action() { } } + /** + * Get form settings theme styles + */ + public static function form_preview_save(){ + check_ajax_referer( 'ur_form_preview_nonce', 'security' ); + + if ( ! current_user_can( 'manage_options' ) ) { + wp_send_json_error( array( 'message' => __( 'You do not have permission.', 'user-registration' ) ) ); + wp_die( -1 ); + } + + $form_id = isset( $_POST['id'] ) ? sanitize_text_field( $_POST['id'] ) : ''; + $theme = isset( $_POST['theme'] ) ? sanitize_text_field( $_POST['theme'] ) : ''; + + if ( empty( $form_id ) || empty( $theme ) ) { + wp_send_json_error( array( 'message' => __( 'Insufficient information', 'user-registration' ) ) ); + } + + $default_theme = ( 'default' === $theme ) ? 'yes' : 'no'; + + update_post_meta( $form_id, 'user_registration_enable_theme_style', $default_theme ); + + wp_send_json_success( array( 'message' => __( 'Saved', 'user-registration' ) ) ); + } + /** * User input dropped function *