<?php
namespace W_RafflePlayWoo_Raffles;

include_once( RAFFLE_PLAY_WOO_DIR_PATH . '/includes/RafflePlayWoo_Includes.php');

if( ! defined('ABSPATH') )
    die('No Access to this page');

use RafflePlayWoo_Includes\RafflePlayWoo_Includes as RafflePlayWoo_Includes;

class W_RafflePlayWoo_Raffles{
    public static function drp_ProductPage( $settings ){
        RafflePlayWoo_Includes::rpwoo_loading_screen();        
    ?>     
        <div class='wrap'>
            <div class="container-fluid bmp-set-row">
                <div>                  
                    <div>                    
                        <nav class="navbar navbar-expand-lg navbar-light bg-light">
                            <a class="navbar-brand" href="#"></a>
                            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
                                <span class="navbar-toggler-icon"></span>
                            </button>
                            <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
                                <div class="navbar-nav" style="font-size: 1em;">
                                    <a class="nav-item nav-link text-primary btn-add" href="#">  <i class="fa fa-plus-square"></i>   </a>
                                    <a class="nav-item nav-link text-primary btn-edit" href="#"> <i class="fa fa-edit"></i> </a>                                
                                    <a class="nav-item nav-link text-primary btn-delete" href="#"> <i class="fa fa-trash"></i> </a>
                                </div>
                                <?php RafflePlayWoo_Includes::rpwoo_premium_image(); ?>
                            </div>
                            <?php RafflePlayWoo_Includes::rpwoo_premium_link(); ?>
                        </nav>
                    </div>
                    <table class='table table-striped' 
                           id='raffle_product_table'>
                    </table>
                </div>
            </div> <!-- /container-fluid -->
        </div> <!-- /wrap -->

        <script>
            var rpwoo_data = []; 
        </script>

        <style>

            .wrap .navbar .nav-item i.fa{
                border: 1px solid black;
                border-radius: 5px;                
                padding: 8px
            }
            /*
            .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .show>.nav-link {
                color: rgba(0, 0, 0, .9);
                border: 1px solid black;
                padding: 10px !important;
                border-radius: 10px !important;
                margin: 5px !important;
            }
                */
        </style>
        

          <!-- Modal -->
        <div class="modal" id="modalSaveEdit"  tabindex="-1" role="dialog" >
            <div class="modal-dialog modal-xl" style='margin-top: 80px !important;'>
            <div class="modal-content ">
                <div class='modal-headline'></div>

                <div class="modal-header">
                    <h4 class="modal-title"><?php esc_html_e('Raffle Action', 'raffle-play-woo');?> </h4>
                        <button type="button" class="close modal-close-btn" id='modal_close_btn' data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                </div>
                

                <div class="modal-body">

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Raffle Name', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="text" name="" id="raffle_name">                           
                        </div>
                    </div>

         

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Start Ticket', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="number" min='1' name="" id="start_ticket">                           
                        </div>
                    </div>           

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Live', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="checkbox" checked  name="" data-toggle='toggle'
                             data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"
                             data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" id="is_live"
                             data-size='small'
                             />                           
                        </div>
                    </div>           

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Terminated', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="checkbox"  name="" data-toggle='toggle'
                            data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"
                            data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" id="is_terminated"
                            data-size='small'
                            />                           
                        </div>
                    </div>

                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b>
                                <?php esc_html_e('Ticket Number Leading Zeros', 'raffle-play-woo' );?> 
                            </b>
                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                title="<?php esc_html_e('Put leading zeros to the number, the prefix will be included', 'raffle-play-woo' ); ?>"> 
                            <i class="fa fa-info-circle text-info"></i> </span>
                        </div>
                    
                        <div class="col-sm-7" 
                            style='display: inline-block'>                               
                            <input type="number" 
                                min='0'
                                max='20'
                                placeholder="0"  
                                id="leading_zeros" 
                                value="<?php ?>" 
                            />  

                            <p style='display: inline'> 
                                <i>                                                                                 
                                    <?php 
                                        esc_html_e('Eg: Leading zero set to 5, prefix T-, ticket is 12 => result: T-00012', 'raffle-play-woo');
                                    ?>
                                </i>
                            </p>
                        </div>
                    </div>

              

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Ticket Prefix', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="text"  name="" id="ticket_prefix" /> <?php esc_html_e('(limited to 15 characters)', 'raffle-play-woo'); ?>                           
                        </div>
                    </div>

               

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Limited Tickets', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <?php esc_html_e('Yes', 'raffle-play-woo');?> <input type="radio"  name="is_limited" id="is_limited_yes">   
                            <input type="number" name="" min='1' id="limit_no">
                           
                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                title="<?php esc_html_e('Generate Random Tickets within the range created by start ticket plus number of tickets. ***IMPORTANT*** Do not change the raffle ticket system from random to inline after tickets have been purchased***', 'raffle-play-woo' ); ?>" > 
                                <i class="fa fa-info-circle text-info"></i> 
                            </span>

                            <input type="checkbox"  data-toggle="toggle" data-size='small' id='gen_random_tickets'
                                data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                data-off="<?php esc_html_e('No', 'raffle-play-woo');?>"                                
                                data-size='small'
                            />  

                            <?php esc_html_e('Generate Random Tickets ', 'raffle-play-woo' ); ?>     


                            <br />
                            <?php esc_html_e('No', 'raffle-play-woo');?> <input checked type="radio"  name="is_limited" id="is_limited_no">                          
                        </div>
                    </div>
                    
                    <div class='row bmp-set-row border border-success' style='background-color: rgba(144, 238, 144, 0.4);' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                                <?php esc_html_e('Generate and Show Raffle tickets at checkout', 'raffle-play-woo' );?> 
                            <span data-toggle='tooltip' 
                                title="<?php esc_html_e('The tickets will be generated and shown at checkout page', 'raffle-play-woo' ); ?>" > 
                                <i class="fa fa-info-circle text-info"></i> 

                            </span>
                            <p class='text-success badge badge-primary'>
                                <?php esc_html_e('New feature', 'raffle-play-woo' );?> 
                            </p>
                        </div>
                    
                        <div class="col-sm-7" style=''>                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small' 
                                id='rdp_gen_checkout'
                                data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                data-off="<?php esc_html_e('No', 'raffle-play-woo');?>"                              
                            />       
                        </div>
                    </div>

                    <div class='row bmp-set-row border border-success' style='background-color: rgba(144, 238, 144, 0.4);' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                                <?php esc_html_e('Let customers pick tickets at checkout', 'raffle-play-woo' );?> 
                            <span data-toggle='tooltip' 
                                title="<?php esc_html_e('This feature only works if tickets are generated at checkout. The customer can change the raffle tickets to the desired ones', 'raffle-play-woo' ); ?>" > 
                                <i class="fa fa-info-circle text-info"></i> 

                            </span>
                            <span class='text-success badge badge-primary'>
                                <?php esc_html_e('Enable Generate and Display tickets at checkout and add background image for ticket', 'raffle-play-woo' );?> 
                            </span>
                        </div>
                    
                        <div class="col-sm-7" style=''>                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small' 
                                id='rdp_user_pick_tickets'
                                data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                data-off="<?php esc_html_e('No', 'raffle-play-woo');?>"                             
                                />       
                        </div>
                    </div>
              

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Start Date', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <div class='col-sm-6' style='display: inline-block'>                       
                                <input type="text" id="datepicker_from" placeholder='dd-mm-yyyy'>                                                                    
                            </div>
                           
                            <div class="input-group clockpicker col-sm-3" style='display: inline-flex'
                                data-autoclose="true">
                                    <input type="text" id="timepicker_from"
                                    class="form-control"  placeholder="hh:mm"  >
                                    <span class="input-group-addon">
                                        <span class="glyphicon glyphicon-time"></span>
                                    </span>
                            </div>
                         
                           
                        </div>
                    </div>

             

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('End Date', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">   

                            <div class='col-sm-6' style='display: inline-block'>                       
                                <input type="text" id="datepicker_to" placeholder='dd-mm-yyyy'>  
                            </div>

                            <div class="input-group clockpicker col-sm-3" 
                                style='display: inline-flex'
                                data-autoclose="true">
                                <input type="text" id="timepicker_to"
                                class="form-control"  placeholder="hh:mm"  >
                                <span class="input-group-addon">
                                    <span class="glyphicon glyphicon-time"></span>
                                </span>
                            </div>
                             
                           
                        </div>
                    </div>

             

                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b> <?php esc_html_e('Terminate Raffle on Buy Out Product', 'raffle-play-woo' );?>  </b>
                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                                title="<?php esc_html_e('The raffle will be set to terminated if the "Buyout Product" is out of stock.', 'raffle-play-woo' ); ?>"> 
                                            <i class="fa fa-info-circle text-info"></i> </span>
                        </div>
                    
                        <div class="col-sm-7" style=''>                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small' id='rdp_enable_buy_product'
                                data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>" 
                                data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" 
                                data-size='small'
                            /> 
                        </div>
                    </div>

            

                
                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php  esc_html_e('Email Extra Line Text', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="text" placeholder="<?php esc_html_e('Eg: Raffle takes place on 10th of January 2021', 'raffle-play-woo' ); ?>"  name="" id="email_extra" style='width: 100%' />                           
                        </div>
                    </div>
                
            
                 

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Inherit Email Format from Default Raffle', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="checkbox" checked disabled  name="" data-toggle='toggle'
                            data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"
                            data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" 
                            data-size='small' id='one_raffle_inherit'
                            />                           
                        </div>
                    </div>

                 

                    <div class="row bmp-set-row">
                        <div class="col-sm-5">
                            <b> <?php esc_html_e('Inherit Messages from Default Raffle', 'raffle-play-woo' );?> </b>
                        </div>
                        <div class="col-sm-7">    
                            <input type="checkbox" checked disabled  name="" data-toggle='toggle'
                            data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"
                            data-off="<?php esc_html_e('No', 'raffle-play-woo');?>"
                            data-size='small' id='two_raffle_inherit'
                            />                           
                        </div>
                    </div>

                    <div class='bmp-set-row'>
                        <div class='row'  >
                            <div class="col-sm-5 " > 
                                <b>  <?php esc_html_e('Show Tickets Number with Raffle image in background (Thank you Page / Email )', 'raffle-play-woo' );?>  </b>
                                <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                    title="<?php esc_html_e('Raffle image will be placed in the background of the ticket number. Custom images can be used, or customized in the template', 'raffle-play-woo' ); ?>" > 
                                    <i class="fa fa-info-circle text-info"></i> 

                                </span>
                            </div>
                                                                
                            <div class="col-sm-7" >                               
                                <input type="checkbox" id="show_ticket_image" data-toggle='toggle' data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>" 
                                data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" data-size='small'/>
                            </div>

                        </div>

                        <div class='row' >
                            <div class="col-sm-5 " style='display: inline-block'>    
                            </div>                                    
                            
                            <div class="col-sm-7" style='display: inline-block;'>  
                                <p class='h6'><?php  esc_html_e('Select image for background ticket. (Select custom to add your own)', 'raffle-play-woo' );?> </p>
                                <select name="select_ticket_image" id="select_ticket_image">
                                    <option value="blue" ><?php esc_html_e('Blue', 'raffle-play-woo' ); ?> </option>
                                    <option value="gold-one"  ><?php esc_html_e('Gold', 'raffle-play-woo' ); ?> </option>
                                    <option value="gold-two" ><?php esc_html_e('Gold Lines', 'raffle-play-woo' ); ?> </option>
                                    <option value="gray" ><?php esc_html_e('Gray', 'raffle-play-woo' ); ?> </option>
                                    <option value="orange"  ><?php esc_html_e('Orange', 'raffle-play-woo' ); ?> </option>
                                    <option value="purple" ><?php esc_html_e('Purple', 'raffle-play-woo' ); ?> </option>
                                    <option value="red"  ><?php esc_html_e('Red', 'raffle-play-woo' ); ?> </option>
                                    <option value="custom"  ><?php esc_html_e('Custom', 'raffle-play-woo' ); ?> </option>                                                
                                </select>
                                <img id='ticket_img_show' data-src="<?php echo RAFFLE_PLAY_WOO_URL . '/';?>" src="" style='width: 80px;' alt="">

                                <div class='row' style='margin-top: 12px' >
                                
                                    <div class="col-sm-12 div-custom-ticket-img" style='display: none' >  
                                        <button class='button button-primary' id='load_ticket_img' style='display: inline; height: 34px;' >
                                        <?php esc_html_e('Library', 'raffle-play-woo' ); ?></button>                             
                                        <div style='display: inline;'>
                                            <input type="text" id="ticket_image_url"  style='width:80%' style='display: inline;'
                                            placeholder="https://yourdomain.com/images/raffle-ticket-image.png"
                                            value="<?php //echo esc_url_raw( $settings['ticket_image_raffles']['0']->ticket_image_url ); ?>" />
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b>
                                <?php esc_html_e('Show Countdown on Product Page', 'raffle-play-woo' );?> 
                            </b>

                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                title='<?php esc_html_e('Show Countdown if Raffle has start date or end date set for the products linked to this raffle', 'raffle-play-woo' ); ?>'> 
                                <i class="fa fa-info-circle text-info"></i> 
                            </span>


                        </div>
                        
                        <div class="col-sm-7" >                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small'                               
                                    id='rdp_show_countdown'
                                    data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                    data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" />  
                                    
                            <span>
                                <img width='200' style='max-width: 200px' 
                                    src="<?php echo esc_url_raw( RAFFLE_PLAY_WOO_URL .'/images/countdown-image.png');?>" 
                                    alt="<?php esc_html_e('Countdown Image', 'raffle-play-woo');?>" />
                            </span>
                        </div>
                    </div>

                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b>
                                <?php esc_html_e('Show Countdown on Card Product', 'raffle-play-woo' );?> 
                            </b>

                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                title='<?php esc_html_e('Show Countdown if Raffle has start date or end date set for the products linked to this raffle', 'raffle-play-woo' ); ?>'> 
                                <i class="fa fa-info-circle text-info"></i> 
                            </span>
                        </div>
                        
                        <div class="col-sm-7" >                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small'                               
                                    id='rdp_show_countdown_card'
                                    data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                    data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" />  
                                    
                            <span>
                                <img width='120' style='max-width: 120px' 
                                    src="<?php echo esc_url_raw( RAFFLE_PLAY_WOO_URL .'/images/countdown-card-image.png');?>" 
                                    alt="<?php esc_html_e('Countdown Image', 'raffle-play-woo');?>" />
                            </span>
                        </div>
                    </div>


                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b>
                                <?php esc_html_e('Show Progress Bar on Product Page', 'raffle-play-woo' );?> 
                            </b>

                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                title='<?php esc_html_e('Show Progress Bar in the product page. Position is set in the Main Settings', 'raffle-play-woo' ); ?>'> 
                                <i class="fa fa-info-circle text-info"></i> 
                            </span>
                        </div>
                        
                        <div class="col-sm-7" >                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small'                               
                                    id='rdp_show_pb'
                                    data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                    data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" />  
                                    
                            <span>
                                <img width='200' style='max-width: 200px' 
                                    src="<?php echo esc_url_raw( RAFFLE_PLAY_WOO_URL .'/images/progress-bar-image.png');?>" 
                                    alt="<?php esc_html_e('Progress Bar Image', 'raffle-play-woo');?>" />
                            </span>
                        </div>
                    </div>

                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b>
                                <?php esc_html_e('Show Progress Bar on Card Product', 'raffle-play-woo' );?> 
                            </b>

                            <span data-toggle='tooltip' data-container="#modalSaveEdit"
                                title='<?php esc_html_e('Show Progress Bar on Loop Card (eg: shop page). Position is set in the Main Settings', 'raffle-play-woo' ); ?>'> 
                                <i class="fa fa-info-circle text-info"></i> 
                            </span>
                        </div>
                        
                        <div class="col-sm-7" >                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small'                               
                                    id='rdp_show_pb_card'
                                    data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                    data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" />  
                                    
                            <span>
                                <img width='120' style='max-width: 120px' 
                                    src="<?php echo esc_url_raw( RAFFLE_PLAY_WOO_URL .'/images/progress-bar-card-image.png');?>" 
                                    alt="<?php esc_html_e('Progress Bar Image', 'raffle-play-woo');?>" />
                            </span>
                        </div>
                    </div>

                    <div class='row bmp-set-row' >
                        <div class="col-sm-5 " style='display: inline-block'> 
                            <b>
                                <?php esc_html_e('Enable Restrict One Order for this Raffle', 'raffle-play-woo' );?> 
                            </b>
                        </div>
                        
                        <div class="col-sm-7" >                               
                            <input type="checkbox"  data-toggle="toggle" data-size='small'                               
                                    id='restrict_order_raffle'
                                    data-on="<?php esc_html_e('Yes', 'raffle-play-woo');?>"  
                                    data-off="<?php esc_html_e('No', 'raffle-play-woo');?>" />  
                                    

                        </div>
                    </div>


                </div>

                <div class="modal-footer">
                    <span> 
                        <?php RafflePlayWoo_Includes::rpwoo_premium_image(); ?>  
                            <?php esc_html_e('Only Available in Premium Version', 'raffle-play-woo'); ?> 
                        <?php RafflePlayWoo_Includes::rpwoo_premium_image(); ?> 
                    </span>
                    <input type="hidden" name="" value='-1' id='modal_action'>
                    <?php wp_nonce_field( 'nonce_field_form_rpr', 'nonce_field_form_rpr' ); ?>
                    <button type="button" class="button button-default" data-dismiss="modal" > <?php esc_html_e('Cancel', 'raffle-play-woo');?> </button>
                    <button type="button" class="button button-primary" id="btnSave"><?php esc_html_e('Save', 'raffle-play-woo');?> </button>                                                 
                </div>

              

            </div><!-- /.modal-content -->
            
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->         


      <?php  
    }
}