<?php
/**
 * Save Design Modal - Form
 *
 * @version 1.0
 *
 * @var string $theme HTML class names for dark/light theme.
 * @var string $form_fields Template of `save-design/expivi_save_design_form_fields.phtml`.
 * @var bool   $countries_selection Setting to tell whether the country selection field must be present.
 * @var string $countries_html_label Template for showing country label.
 * @var string $countries_html_select Template for country select field.
 * @var array  $countries_html_options Array of templates (select element) for country select field.
 * @var string $html_select_close Template for closing select field.
 * @var bool   $state_selection Setting to tell whether the state selection field must be present.
 * @var string $states_html_label Template for showing state label.
 * @var string $states_html_select Template for state select field.
 * @var array  $states_html_options Array of templates (select element) for state select field.
 * @var string $form_btn_text Form button text.
 */

if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

?>
<div id="xpv-save-my-design-form">
    <!-- save design button -->
    <input type="submit" id="xpv-save-design-btn" class="submit" name="xpv-save-design" value="Save design">

    <div id="save-design-modal" class="expivi-modal">
        <!-- Modal content -->
        <div class="expivi-modal-content <?= $theme ?>">
            <div class="expivi-modal-header">
                <div class="expivi-modal-header-content">
                    <span class="expivi-modal-header-text <?= $theme ?>"><?= __( 'Save my design', 'expivi' ) ?></span>
                    <span class="expivi-close-span"><?= __( 'Close', 'expivi' ) ?></span>
                </div>
            </div>
            <div class="expivi-modal-body <?= $theme ?>">
                <form class="expivi-modal-form <?= $theme ?>" id="save-design-form">
                    <?php
                        echo $form_fields;

                        if ( $countries_selection ) {
                            echo $countries_html_label;
                            echo $countries_html_select;

                            foreach ( $countries_html_options as $option ) {
                                echo $option;
                            }

                            echo $html_select_close;
                        }

                        if ( $state_selection ) {
                            echo $states_html_label;
                            echo $states_html_select;

                            foreach ( $states_html_options as $option ) {
                                echo $option;
                            }

                            echo $html_select_close;
                        }
                    ?>
                </form>
            </div>
            <div class="expivi-modal-footer <?= $theme ?>">
                <p id="error-response-save-design-modal"></p>
                <div class="expivi-loader <?= $theme ?>" id="save-design-loader"></div>
                <input class="save-design-btn" type="submit" value="<?= $form_btn_text ?>" id="save-design-btn-modal">
            </div>
        </div>
    </div>
</div>
