<?php
include 'includes/theme_info.php';

define('MENU_TITLE', 'GAMELEON'); //Define your menu title
define('MENU_SLUG', 'theme_options'); //Define your menu slug, if you don't know what it is, just leave it as it is

if (!class_exists('acera_theme_options')) {

    class acera_theme_options {

        private $options;

        public function acera_theme_options($options) {
            $this->options = $options;

            add_action('admin_menu', array(&$this, 'acera_add_menu')); // Action that triggers function below
        }

        public function acera_add_menu() {
            add_menu_page(__(MENU_TITLE), __(MENU_TITLE), 'administrator', 'themeoption' , array(&$this, 'acera_display_page'), get_stylesheet_directory_uri()."/tigu-options/" . 'images/icon.png');
        }

        /* Function That Generates Main Content */

        public function acera_display_page() {
            ?>
            <?php $this->save_options(); ?>
            <form id="acera-settings" method="post">
                <input type="hidden" name="action" id="action" value="acera_save_options" />
                <div id="acera-sidebar">
                    <div id="acera-meta-info">
                        <a href=""><h1><div class="logo"></div></h1></a>
                         <div class="themeauthor"><span class="theme-help">Need Help? <a href="http://tiguandesign.ticksy.com/" target="_blank" name="Support">Support System</a></span></div>
                        <div class="themeauthor"><span class="themeinfos-author">Theme Author: <?php echo THEME_AUTHOR; ?></span></div>	
                     
                    </div>
                    <ul id="acera-main-menu">

                        <?php $first = true; ?> 
                        <?php
                        /* Cycle that goes though $options array, it is searching for headings and sections to make navigation */

                        foreach ($this->options as $option):
                            if ($option['type'] == "section") :
                                $section = $option['id'];
                                ?>
                                <li><p><span class="<?php echo $option['icon']; ?>"></span><?php echo $option['title']; ?></p>
                                        <ul<?php if ($option['expanded'] == "true") echo ' class="default-accordion"'; ?>>
                                        <?php
                                        foreach ($this->options as $sections):
                                            if ((! empty($sections['section']) && $sections['section'] == $section) && (($sections['type'] == "heading") || ($sections['type'] == "html"))):  
                                                ?>
                                                <li><a<?php
                            if ($first) {
                                echo ' class="defaulttab"';
                                $first = false;
                            }
                                                ?> href="#" rel="<?php echo $sections['id']; ?>"><p><?php echo $sections['title']; ?></p></a></li>
                                                    <?php
                                                endif;
                                            endforeach;
                                            ?> 
                                    </ul>
                                </li>
                                <?php
                            endif;
                        endforeach;
                        ?>
                    </ul>
   <div class="themeauthor"><span class="contact-author"><a href="http://themeforest.net/user/tiguan#from" target="_blank">Contact the Author</a></span></div>
<br />	

                </div>


                <?php /* Below - script that generates divs for each tab */ ?>

                <div id="acera-content">
                    <?php foreach ($this->options as $option): ?> 
                        <?php if ($option['type'] == "heading"): ?>
                            <?php $under_section = $option['id']; ?>
                            <div class="tab-content" id="<?php echo $option['id']; ?>">
                                <div class="acera-settings-headline">
                                    <h2><?php echo $option['title']; ?></h2>
                                    <input name="save" class="save-button" type="submit" value="Save changes" />
                                </div>
                                <?php
                                /* Cycle that goes though options, and calls function for displaying input types */

                                foreach ($this->options as $item) {

                               if (! empty($item['under_section']) && $item['under_section'] == $under_section) {


                                        switch ($item['type']) {
                                            case "text":
                                                $this->display_text($item);
                                                break;

                                            case "sliderone":
                                                $this->display_sliderone($item);
                                                break;

                                            case "slidertwo":
                                                $this->display_slidertwo($item);
                                                break;

                                            case "sliderthree":
                                                $this->display_sliderthree($item);
                                                break;

                                            case "sliderfour":
                                                $this->display_sliderfour($item);
                                                break;

                                            case "sliderfive":
                                                $this->display_sliderfive($item);
                                                break;

                                            case "slidersix":
                                                $this->display_slidersix($item);
                                                break;

                                            case "sliderseven":
                                                $this->display_sliderseven($item);
                                                break;

                                            case "slidereight":
                                                $this->display_slidereight($item);
                                                break;

                                            case "color":
                                                $this->display_color($item);
                                                break;

                                            case "small_heading":
                                                $this->display_small_heading($item);
                                                break;

                                            case "textarea":
                                                $this->display_textarea($item);
                                                break;

                                            case "image":
                                                $this->display_image($item);
                                                break;

                                            case "checkbox":
                                                $this->display_checkbox($item);
                                                break;

                                            case "checkbox_image":
                                                $this->display_checkbox_image($item);
                                                break;

                                            case "radio":
                                                $this->display_radio($item);
                                                break;

                                            case "toggle_div_start":
                                                $this->display_toggle_div_start($item);
                                                break;

                                            case "toggle_div_end":
                                                $this->display_toggle_div_end();
                                                break;

                                            case "radio_image":
                                                $this->display_radio_image($item);
                                                break;

                                            case "select":
                                                $this->display_select($item);
                                                break;
                                        }
                                    }
                                }
                                ?>
                            </div>
                        <?php endif; ?>
                        <?php if ($option['type'] == "html"): ?>
                            <div class="tab-content" id="<?php echo $option['id']; ?>">
                                <?php echo $option['source']; ?>
                            </div>
                        <?php endif; ?>
                    <?php endforeach; ?>
<div class="acera-settings-headline">
                            
                                    <input name="save" class="save-button" type="submit" value="Save changes" />
                                </div>
                </div> 
            </form>
<?php if (get_option('tigu_admin_sound', 'false') == 'true'): ?>
<script type="text/javascript">
// Click sound effect- by JavaScript Kit (www.javascriptkit.com)
// Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code

var html5_audiotypes={
	"mp3": "audio/mpeg",
	"mp4": "audio/mp4",
	"ogg": "audio/ogg",
	"wav": "audio/wav"
}

function createsoundbite(sound){
	var html5audio=document.createElement('audio')
	if (html5audio.canPlayType){
		for (var i=0; i<arguments.length; i++){
			var sourceel=document.createElement('source')
			sourceel.setAttribute('src', arguments[i])
			if (arguments[i].match(/\.(\w+)$/i))
				sourceel.setAttribute('type', html5_audiotypes[RegExp.$1])
			html5audio.appendChild(sourceel)
		}
		html5audio.load()
		html5audio.playclip=function(){
			html5audio.pause()
			html5audio.currentTime=0
			html5audio.play()
		}
		return html5audio
	}
	else{
		return {playclip:function(){throw new Error("Your browser doesn't support HTML5 audio unfortunately")}}
	}
}

var clicksound=createsoundbite("<?php echo get_template_directory_uri(); ?>/sounds/button-click.ogg", "<?php echo get_template_directory_uri(); ?>/sounds/button-click.mp3")
</script>
<?php endif; ?>
            <?php
        }

        /*         * *************************************
         * *************************************
         * ****                           ****** 
         * ****     Display functions     ******  
         * ****                           ******
         * *************************************
         * ************************************ */







        /* Normal text input ("type" => "text" */

        public function display_text($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Normal text input ("type" => "sliderone" */

        public function display_sliderone($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,150" data-slider-step="1" data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
 <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
<script type='text/javascript'>
jQuery(document).ready(function ($) {
  $("[data-slider]")
    .each(function () {
      var input = $(this);
      $("<span>")
        .addClass("output")
        .insertAfter($(this));
    })
    .bind("slider:ready slider:changed", function (event, data) {
      $(this)
        .nextAll(".output:first")
          .html(data.value.toFixed());
    });
 });
  </script>


            <?php
        }        
        

        /* Normal text input ("type" => "slidertwo" */

        public function display_slidertwo($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,20" data-slider-step="1" data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
 <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }        

        /* Normal text input ("type" => "sliderthree" */

        public function display_sliderthree($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,15000" data-slider-step="100" data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
 <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }        

  /* Normal text input ("type" => "sliderfour" */

        public function display_sliderfour($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,3000" data-slider-step="10" data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
 <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }        
  /* Normal text input ("type" => "sliderfive" */

        public function display_sliderfive($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,500" data-slider-step="1" data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />


<p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
  <?php
        }        

 /* Normal text input ("type" => "slidersix" */

        public function display_slidersix($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,10000"  data-slider-step="500"  data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />


<p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>

            <?php
        }        

 /* Normal text input ("type" => "sliderseven" */

        public function display_sliderseven($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,1000"  data-slider-step="1"  data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
 

<p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>

            <?php
        }     

 /* Normal text input ("type" => "slidereight" */

        public function display_slidereight($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" data-slider-range="0,100"  data-slider-step="1"  data-slider-theme="volume" data-slider="true" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />


<p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>

            <?php
        }     
   
        /* Color picker ("type" => "color") */

        public function display_color($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <?php
            if (get_option($value['id']))
                $color = ' style="background-color: #' . get_option($value['id']) . ';"';
            else if ($value['default'])
                $color = ' style="background-color: #' . $value['default'] . ';"'
                ?>

            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-color-picker"<?php echo $color; ?> id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" type="text" value="<?php if (get_option($value['id'])) echo esc_html(stripslashes(get_option($value['id'])));else echo $value['default']; ?>" />
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Image Upload ("type" => "image") */

        public function display_image($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <?php
                    if (get_option($value['id']))
                        $def_value = stripslashes(get_option($value['id']));
                    else
                        $def_value = $value['default'];
                    ?>
                    <input<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> class="acera-fullwidth" type="text" value="<?php echo $def_value; ?>" name="<?php echo $value['id']; ?>" />


                    <span class="upload acera_upload acera-button-blue" id="<?php echo $value['id']; ?>">Upload image</span>
                    <?php if (get_option($value['id'])): ?>
                        <span type="button" class="acera_remove acera-button" id="remove_<?php echo $value['id']; ?>">Remove image</span>
                    <?php endif; ?>

                    <div class="acera_image_preview">
                        <?php if (get_option($value['id'])): ?>
                            <img src="<?php echo get_option($value['id']); ?>" />
                        <?php elseif ($value['default'] != ""): ?>
                            <img src="<?php echo $value['default']; ?>" />
                        <?php endif; ?>
                    </div>

                    <p class="description"><?php echo $value['desc']; ?></p>

                </div>
            </div>
            <?php
        }

        /* Textarea input ("type" => "textarea") */

        public function display_textarea($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <textarea<?php if ($value['placeholder']) echo ' placeholder="' . $value['placeholder'] . '"'; ?> id="<?php echo $value['id']; ?>" name="<?php echo $value['id']; ?>" cols="70" rows="8"><?php
            if (get_option($value['id']))
                echo stripslashes(get_option($value['id']));
            else
                 echo $value['default'];
                        ?></textarea>
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Select input ("type" => "select") */

        public function display_select($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                       <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <select name="<?php echo $value['id']; ?>" id="<?php echo $value['id']; ?>">
                        <?php
                        if (get_option($value['id']))
                            $default = get_option($value['id']);
                        else
                            $default = $value['default'];

                        foreach ($value['options'] as $option):
                            $selected = '';
                            if ($option == $default)
                                $selected = ' selected="selected"';
                            ?>
                            <option <?php echo $selected; ?>><?php echo $option ?></option>
                        <?php endforeach; ?>


                    </select>
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Normal checkbox ("type" => "checkbox") */

        public function display_checkbox($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                         <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <?php
                    $i = 0;
                    foreach ($value['options'] as $box):
                        $checked = '';

                        if (get_option($value['id'][$i])) {
                            if (get_option($value['id'][$i]) == 'true')
                                $checked = ' checked="checked"';

                            else
                                $checked = '';
                        }

                        else {
                            if ($value['default'][$i] == "checked")
                                $checked = ' checked="checked"';
                        }
                        ?>
                 
                        <label for="<?php echo $value['id'][$i]; ?>">
                            <input onclick="clicksound.playclip()" type="checkbox"<?php echo $checked; ?> name="<?php echo $value['id'][$i]; ?>" id="<?php echo $value['id'][$i]; ?>" class="ios-switch"  />
                        </label>
                    
                  <p class="option"><?php echo $box; ?></p>
                        <?php
                        $i++;
                    endforeach;
                    ?>
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Image checkbox ("type" => "checkbox_image") */

        public function display_checkbox_image($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="cOf">
                        <?php
                        $i = 0;
                        foreach ($value['options'] as $box):
                            $checked = '';
                            $class = '';
                            $img_size = '';

                            if ($value['image_size'][$i])
                                $img_size = 'width="' . $value['image_size'][$i] . '"';
                            else if ($value['image_size'][$i] == false && $value['image_size'][0] == true)
                                $img_size = 'width="' . $value['image_size'][0] . '"';
                            else
                                $img_size = 'width="120"';




                            if (get_option($value['id'][$i])) {
                                if (get_option($value['id'][$i]) == 'true') {
                                    $checked = ' checked="checked"';
                                    $class = ' acera-img-selected';
                                }
                            } elseif ($value['default'][$i] == "checked") {
                                $class = ' acera-img-selected';
                                $checked = ' checked="checked"';
                            }
                            ?>
                            <label class="acera-image-checkbox<?php echo $class; ?>" for="<?php echo $value['id'][$i]; ?>">
                                <img <?php echo $img_size; ?> src="<?php echo $value['image_src'][$i]; ?>" alt="<?php echo $box ?>" />
                                <input class="acera-image-checkbox-b" type="checkbox"<?php echo $checked; ?> name="<?php echo $value['id'][$i]; ?>" id="<?php echo $value['id'][$i]; ?>" />
                                <?php if ($value['show_labels'] == "true"): ?><p><?php echo $box; ?></p><?php endif; ?>
                            </label>
                            <?php
                            $i++;
                        endforeach;
                        ?>
                    </div>
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Normal radio input ("type" => "radio") */

        public function display_radio($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="acera_image_preview">
                        <?php if ($value['img_desc']): ?>
                            <img src="<?php echo $value['img_desc']; ?>" />
                        <?php endif; ?>
                    </div>
                    <?php
                    $i = 0;

                    if (get_option($value['id']))
                        $default = get_option($value['id']);
                    else
                        $default = $value['default'];

                    foreach ($value['options'] as $option):
                        $checked = '';

                        if ($value['options'][$i] == $default) {
                            $checked = ' checked="checked"';
                        }
                        ?>
                        <label class="label_radio" for="<?php echo $value['id'] . $i; ?>">
                            <input onclick="clicksound.playclip()" type="radio" id="<?php echo $value['id'] . $i; ?>" name="<?php echo $value['id']; ?>" value="<?php echo $value['options'][$i]; ?>" <?php echo $checked; ?> />
                            <?php echo $option; ?>
                        </label>
                        <?php
                        $i++;
                    endforeach;
                    ?>
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Image radio input ("type" => "radio_image") */

        public function display_radio_image($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <div class="label">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                </div>
                <div class="settings-content">
                    <div class="cOf">
                        <?php
                        $i = 0;

                        if (get_option($value['id']))
                            $default = get_option($value['id']);
                        else
                            $default = $value['default'];

                        foreach ($value['options'] as $option):
                            $class = '';
                            $img_size = '';
                            $checked = '';

                             if ($value['image_size'][$i])
                                $img_size = 'width="' . $value['image_size'][$i] . '"';
                             else if ($value['image_size'][$i] == false && $value['image_size'][0] == true)
                                $img_size = 'width="' . $value['image_size'][0] . '"';
                            else
                                $img_size = 'width="120"';

                            if ($value['options'][$i] == $default) {
                                $checked = ' checked="checked"';
                                $class = ' acera-img-selected';
                            }
                            ?>
                            <label class="acera-image-radio<?php echo $class; ?>" for="<?php echo $value['id'] . $i; ?>">
                                <img <?php echo $img_size; ?> src="<?php echo $value['image_src'][$i]; ?>" alt="<?php echo ! empty($box) && $box ?>" />
                                <input class="acera-image-radio-b" type="radio" id="<?php echo $value['id'] . $i; ?>" name="<?php echo $value['id']; ?>" value="<?php echo $value['options'][$i]; ?>" <?php echo $checked; ?> />
                                <?php if ($value['show_labels'] == "true"): ?><p><?php echo $option; ?></p><?php endif; ?>
                            </label>
                            <?php
                            $i++;
                        endforeach;
                        ?>
                    </div>
                    <p class="description"><?php echo $value['desc']; ?></p>
                </div>
            </div>
            <?php
        }

        /* Displays small Heading in tabs */

        public function display_small_heading($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
            <div<?php echo $rel; ?> class="separator">
                <h4><?php echo $value['title']; ?></h4>
            </div>
            <?php
        }
        
        /* Hiding div start ("type" => "toggle_div_start" */
        
        public function display_toggle_div_start($value) {
            $rel = "";
            if ($value['display_checkbox_id'])
                $rel = " rel=".$value['display_checkbox_id'];
            else
                $rel = "";
            ?>
                <div<?php echo $rel; ?>>
            <?php
        }
        
        
        /* Hiding div end ("type" => "toggle_div_end" */
        
        public function display_toggle_div_end() {
            ?>
                </div>                    
            <?php
        }


        /*         * *************************************
         * *************************************
         * ****                           ****** 
         * ****      Saving function      ******  
         * ****                           ******
         * *************************************
         * ************************************ */

        public function save_options() {

            if (isset($_POST['action']) && $_POST['action'] == "acera_save_options") {
                foreach ($this->options as $value) {
                    $the_type = $value['type'];

                    if ($the_type == "heading" || $the_type == "section" || $the_type == "small_heading")
                        continue;

                    else if ($the_type != "checkbox" && $the_type != "checkbox_image") {
                        update_option($value['id'], $_POST[$value['id']]);
                    } else if ($the_type == "checkbox" || $the_type == "checkbox_image") {
                        $i = 0;

                        foreach ($value['options'] as $box) {
                            $curr_id = $value['id'][$i];

                            if (isset($_POST[$curr_id]))
                                update_option($curr_id, 'true');

                            else
                                update_option($curr_id, 'false');
                            $i++;
                        }
                    }
                }
            }
        }

    }

}
?>