<?php
if(isset($_POST['submit_banner'])){
//if (isset($_POST['woo2app-admin']) && wp_verify_nonce($_POST['woo2app-admin'], 'woo2app-admin') && isset($_POST['submit_banner'])){
//if (isset($_POST['woo2app-admin']) && wp_verify_nonce($_POST['woo2app-admin'], 'woo2app-admin')){
	update_option("URL_SPLASH_PIC", esc_url_raw($_REQUEST["src_val"]));
	update_option("NUM_SPLASH_DELAY", ($_REQUEST["delay_splash"]));
	update_option("display_loading" , isset($_REQUEST["display_loading"]) ? true : false);
	update_option("fill_state", ($_REQUEST["fill_state"]));
}
?>
<h3 class="background-color-e5e5e5 padding-7px">
	<?php _e('Splash', 'woo2app'); ?>
</h3>
<p>
	<?php _e('The Splash screen is used to display some basic introductory information such as the company logo, content, etc just before the app loads completely.', 'woo2app'); ?>
</p>
<form action="" method="post">
    <table class="form-table">
        <tbody>
        <tr valign="top" class="">
            <th scope="row" class="titledesc">
                <label>
					<?php _e('Loading', 'woo2app'); ?>
                </label>
            </th>
            <td class="forminp">
                <input type="checkbox"  <?= checked(get_option('display_loading'))?>  id="display_loading" name="display_loading" >
                <span>
                    <?php _e('Display Loading Icon', 'woo2app'); ?>
                </span>
            </td>
        </tr>
        <tr valign="top" class="">
            <th scope="row" class="titledesc">
                <label>
					<?php _e('Scale Type', 'woo2app'); ?>
                </label>
            </th>
            <td class="forminp">
				<?php $fill_state = get_option('fill_state');?>
                <select name="fill_state">
                    <option value="Center" <?= selected($fill_state,'Center')?> > Center </option>
                    <option value="FitXY" <?= selected($fill_state,'FitXY')?>> FitXY </option>
                    <option value="CenterCrop" <?= selected($fill_state,'CenterCrop')?> > CenterCrop </option>
                    <option value="FitCenter" <?= selected($fill_state,'FitCenter')?>> FitCenter </option>
                </select>
            </td>
        </tr>
        <tr>
            <th scope="row" class="titledesc">
                <label dir="rtl"><?php _e('Select Image', 'woo2app'); ?></label>
                <br><br>
                <p>
					<?php _e('Recommended Resolution', 'woo2app'); ?> : 750x1334
                    <hr>
	                <?php _e('Max Size', 'woo2app'); ?> : 150KB
                    <hr>
	                <?php _e('Format', 'woo2app'); ?> : PNG - JPG - JPEG - GIF
                </p>
            </th>
            <td class="forminp">
                <input type="hidden" id="txt_url_item_hami" value="<?= get_option('URL_SPLASH_PIC')?>" name="src_val">
                <img id="div_image_item_hami" class="banner cursor-pointer width-187px-height-333px"
                     src="<?= get_option('URL_SPLASH_PIC') ? get_option('URL_SPLASH_PIC') : 'http://placehold.it/1334x750' ?> ">
            </td>
        </tr>
        <tr>
            <th scope="row" class="titledesc">
            </th>
            <td class="forminp">
                <input type="hidden" name="submit_banner" value="1">
                <input type="submit" class="button button-primary" value="<?php _e('Save', 'woo2app'); ?>"
                       name="submit_banner">
                <input type="button" onclick="submit_cancel()" class="button button-default"
                       value="<?php _e('clear', 'woo2app'); ?>"/>
            </td>
        </tbody>
    </table>
</form>
<?php wp_enqueue_media();?>
<script>
    var custom_uploader_hami;
    jQuery('#div_image_item_hami').click(function (e) {
        e.preventDefault();
        custom_uploader_hami = wp.media.frames.custom_uploader_hami = wp.media({
            title: '<?php _e('Select Image', 'woo2app'); ?>',
            library: {type: 'image'},
            button: {
                text: '<?php _e('Select', 'woo2app'); ?>'
            },
            multiple: false
        });
        custom_uploader_hami.on('select', function() {
            attachment = custom_uploader_hami.state().get('selection').first().toJSON();
            jQuery('#txt_url_item_hami').val(attachment.url);
            url_image = attachment.url;
            jQuery('#div_image_item_hami').attr("src",url_image);
        });
        custom_uploader_hami.open();
    })
    function submit_cancel() {
        if(confirm("Are you sure you want to delete Splash?")){
            jQuery("#txt_url_item_hami").val('');
            jQuery("#div_image_item_hami").attr('src','http://placehold.it/1334x750');
            jQuery("#delay_splash").val(0)
            jQuery("form").submit()
        }
    }
</script>