<?php

// Exit if accessed directly
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

// Add animation Settings meta
function eapsgt_animation_settings() {
	global $post;
	wp_nonce_field( "animation-settings-filed", "nonce1" );
	$templates       = EAPSGT_AnimatedPopupConfig::templates();
    $animation_value = esc_attr(get_post_meta( $post->ID, "_eapsgt-animationList", true ));
    $duration_value  = esc_attr(get_post_meta( $post->ID, "_eapsgt-duration_value", true ));
	if ( ! isset( $duration_value ) || ! $duration_value ) {
		$duration_value = 1;
	};
	?>
    <input class="eapsgt-duration_value" type="hidden" duration_value="<?php echo $duration_value ?>">
    <div class="eapsgt-animation-settings__admin">
        <div class="eapsgt-animation-settings__option">
            <table class="eapsgt-detailtbl">
                <tr>
                    <th>
                        <div class="eapsgt-options"><?php esc_html_e( "Animation Effect", 'easy-animated-popup' ); ?></br></div>
                        <span class="eapsgt-description"><?php esc_html_e( "Select a predefined popup animation effect", 'easy-animated-popup' ); ?></span>
                    </th>
                    <td>
                        <select name="eapsgt-animationList" class="eapsgt-animation-list-select"
                                id="eapsgt-animationList">
							<?php
							$animate_options = EAPSGT_AnimatedPopupConfig::animations();
							foreach ( $animate_options as $key => $value ) {
								if ( $key == $animation_value ) {
									?>
                                    <option selected class="eapsgt-animation-item"
                                            value="<?php echo esc_attr($key) ?>"><?php echo esc_html($value); ?></option>
									<?php
								} else {
									?>
                                    <option class="eapsgt-animation-item"
                                            value="<?php echo esc_attr($key) ?>"><?php echo esc_html($value); ?></option>
									<?php
								}
							}
							?>
                        </select>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div class="eapsgt-options"><?php esc_html_e( "Duration", 'easy-animated-popup' ); ?></br></div>
                        <span class="eapsgt-description"><?php esc_html_e( "Select the duration in seconds for the animation", 'easy-animated-popup' ); ?></span>
                    </th>
                    <td style="min-width: 215px;">
                        <div class="eapsgt-slider" id="eapsgt-duration_slider"></div>
                        <input class="eapsgt-value_input" type="text"
                               id="eapsgt-duration_slider_value" name="eapsgt-duration_value"
                               readonly value="<?php echo esc_attr($duration_value); ?>" size="1" min=1 max=5/>
                        <div class="eapsgt-slider_unit"><?php esc_html_e( "sec", 'easy-animated-popup' ); ?></div>
                    </td>
                </tr>
                <tr>
                    <th>
                        <div class="eapsgt-options"><?php esc_html_e( "Preview", 'easy-animated-popup' ); ?></br></div>
                        <span class="eapsgt-description"><?php esc_html_e( "Click the button to preview", 'easy-animated-popup' ); ?></span>
                    </th>
                    <td colspan="2" class="eapsgt-button_preview">
                        <button class="eapsgt-rainbow eapsgt-rainbow-1" type="button"
                                id="eapsgt-preview_animation"><?php esc_html_e( "Preview", 'easy-animated-popup' ); ?></button>
                    </td>
                </tr>
            </table>
        </div>
        <div class="eapsgt-animation-settings__preview">
            <div class="eapsgt-preview_content">
				<?php
				foreach ( $templates as $index => $template ) {
					?>
                    <div id="eapsgt-animation<?php echo( $index + 1 ); ?>">
						<?php
						apply_filters( 'preview_eapsgt_' . $template, '' ); ?>
                    </div>
					<?php
				}
				?>
            </div>
        </div>
    </div>
	<?php
}

// Add filter for Animation
add_filter( 'eapsgt_tab_animation', 'eapsgt_animation_settings' );
