<script>
    function getCategoryName(cat){
        switch (cat) {
            case "0":	return 'Swords'; break;
            case "1":	return 'Axes'; break;
            case "2":	return 'Scepters'; break;
            case "3":	return 'Spears'; break;
            case "4":	return 'Bows'; break;
            case "5":	return 'Staffs'; break;
            case "6":	return 'Shields'; break;
            case "7":	return 'Helms'; break;
            case "8":	return 'Armors'; break;
            case "9":	return 'Pants'; break;
            case "10": return 'Gloves'; break;
            case "11": return 'Boots'; break;
            case "12": return 'Wings/Ords/Seeds/Boxes'; break;
            case "13": return 'Miscs'; break;
            case "14": return 'Jewels/Potions/Tickets'; break;
            case "15": return 'Skills'; break;
            default: return 'Unknown';break;
        }
    }
    function GetImageChar(Class)
    {
        var classnum = '';
        switch (Class) {
            case "0":
                classnum = "/web/templates/default/images/Characters/sm.png";
                break;

            case "1":
                classnum = "/web/templates/default/images/Characters/bk.png";
                break;
            case "2":
                classnum = "/web/templates/default/images/Characters/me.png";
                break;
            case "3":
                classnum = "/web/templates/default/images/Characters/su.png";
                break;
            case "4":
                classnum = "/web/templates/default/images/Characters/mg.png";
                break;
            case "5":
                classnum = "/web/templates/default/images/Characters/dl.png";
                break;
            case "6":
                classnum = "/web/templates/default/images/Characters/rf.png";
                break;



        }
        return classnum;
    }
    function GetClassChar(Class)
    {
        var classnum = '';
        switch (Class) {
            case "0": classnum = "Dark Wizard"; break;
            case "1": classnum = "Dark Knight"; break;
            case "2": classnum = "Fairy Elf"; break;
            case "3": classnum = "Summoner"; break;
            case "4": classnum = "Magic Gladiator"; break;
            case "5": classnum = "Dark Lord"; break;
            case "6": classnum = "Rage Fighter"; break;
        }
        return classnum;
    }

    $(document).ready(function(){
        var Classes = $('.nice-button');
        var Categoryes = {json_encode($Categoryes)};
        var Items = {json_encode($CategoryesItems)};
        var Class = 0;
        var Type = 0;

        $('.character_classes a').click(function(){
            Class = $(this).attr('data-class');
            $('#shop-class-image').attr('src',GetImageChar(Class));
            $('#text-shop-class-image').html(GetClassChar(Class));
            $('.class_items_sub_groups').html(' ');
            var i = 0;
            for (var key in Categoryes[$(this).attr('data-class')]) {
                var val = Categoryes[$(this).attr('data-class')][key];
                if (i == 0)
                    $('.class_items_sub_groups').append('<a data-cat="'+val+'" class="nice-button active">'+getCategoryName(val)+'</a>');
                else
                    $('.class_items_sub_groups').append('<a data-cat="'+val+'" class="nice-button">'+getCategoryName(val)+'</a>');
                i++;
            }

        });
        $(document).on("click",'.class_items_sub_groups a',function(){
            $('.items_list').html(' ');
            Type = $(this).attr('data-cat');
            for (var key in Items[Class][Type]) {
                var val = Items[Class][Type][key];
                $('.items_list').append('<a data-item-id="'+val['ID']+'" href="/user/shop/'+val['ID']+'" class="">'+val['Name']+'</a>');
                //$('.class_items_sub_groups').append('<a data-cat="'+key+'" class="nice-button">'+getCategoryName(key)+'</a>');
            }

        });
    });
</script>
<link rel="stylesheet" href="/web/templates/default/css/shop.css">
<h1>Магазин</h1>
<a href="/user" class="back-to-user-menu">Back to user menu</a>
<div>

        <div class="smithy">

            <div class="return">
                <span>{$Valutes[$Config.MainValute].Name}: {$CharacterValutes[$Config.MainValute].Count}</span>
                <a href="/user/shop/return" class="nice-button">Return Item</a>
            </div>

            <div class="spacer_2px"></div>

            <div class="character_classes">
                {foreach $Classes item=class key=i}
                    {if i == 0}
                        <a data-class="{$class}" class="nice-button active">{Shop::ClassesNames($class)}</a>
                    {else}
                        <a data-class="{$class}" class="nice-button">{Shop::ClassesNames($class)}</a>
                    {/if}
                {/foreach}
            </div>

            <div class="smithy_wrapper">
                <div class="smithy-class">
                    <img id="shop-class-image" width="86px" src="{Shop::GetImageChar(0)}" alt="">
                    <span id="text-shop-class-image">{Shop::GetClassChar(0)}</span>
                </div>

                <div class="class_items_sub_groups">

                    <a href="" class="nice-button active">swords</a>

                </div>

                <div class="items_list">

                    <a href="" class="">Kris</a>


                </div>
            </div>

            <div class="spacer_2px"></div>
            {if !empty($SelectedItem)}
            <form action="/user/shop" method="post" name="stats_start">
            <table width="100%" class="selected_item">
                <tbody><tr>
                    <td>
                        <div class="item_image">
                            <img src="/web/templates/default/images/items/{$SelectedItem.Type}-{$SelectedItem.Index}.gif">
                        </div>
                        <div class="selected_item_name">{$SelectedItem.Name}</div>
                        <div class="selected_item_price">Price: <span id="ItemPrice">{$SelectedItem.StartPrice}</span> {$Valutes[$Config.MainValute].Name}</div>
                        <button name="buy" value="{$SelectedItem.ID}" class="selected_item_buy_button">Buy</button>
                    </td>
                    <td class="item_options">
                            <input type="hidden" name="buy_item">
                            <div class="row">
                                <select onchange="SetPrice();" name="level" id="select_level">
                                    {for $level=0 to $SelectedItem.MaxLevel}
                                        <option data-price="{$level * $Config.Price.Level}" value="{$level}">{$SelectedItem.Name} +{$level}</option>
                                    {/for}
                                </select>
                                <select onchange="SetPrice();" name="option" id="select_opt">
                                    {for $opt=0 to $SelectedItem.MaxAddition}
                                        <option data-price="{$opt * $Config.Price.Option}" value="{$opt}">Additional Damage +{$opt * 4}</option>
                                    {/for}
                                </select>
                            </div>

                            <div class="row">
                                {if $SelectedItem.Luck}
                                <label class="luck"><input onclick="SetPrice();" type="checkbox" id="select_luck" name="luck" data-price="{$Config.Price.Luck}"> -
                                    Luck</label>
                                {/if}
                                {if $SelectedItem.Skill}
                                <label class="skill"><input onclick="SetPrice();" type="checkbox" id="select_skill" name="skill" data-price="{$Config.Price.Skill}"> -
                                    Skill</label>
                                {/if}
                            </div>

                            <div class="row excellent">

                                {if $SelectedItem.InClass[6] != -1}
                                    {if $SelectedItem.InClass[6] == 0}
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" id="exc1" name="exc1"> - Mana After Hunting Monsters +mana/8</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc2" id="exc2"> - Life After Hunting Monsters +life/8</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc3" id="exc3"> - Increase Attacking(Wizardy) speed +7</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc4" id="exc4"> - Increase Damage +2%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc5" id="exc5"> - Increase Damage +Level/20</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc6" id="exc6"> - Excellent Damage Rate +10%</label>
                                        </div>
                                    {elseif $SelectedItem.InClass[6] == 1}
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" id="exc1" name="exc1"> - Increases acquisition rate of Zen after hunting monsters +30%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc2" id="exc2"> - Defense success rate +10%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc3" id="exc3"> - Reflect Damage +5%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc4" id="exc4"> - Damage Decrease +4%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc5" id="exc5"> - Increase Max Mana +4%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc6" id="exc6"> - Increase Max HP +4%</label>
                                        </div>
                                    {elseif $SelectedItem.InClass[6] == 2}
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" id="exc1" name="exc1"> - HP +50 increased</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc2" id="exc2"> - Mana +50 increased</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc3" id="exc3"> - Ignor opponents defensive power by 3%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc4" id="exc4"> - Max AG +50 increased</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc5" id="exc5"> - Increase Attacking(Wizardry)speed +5</label>
                                        </div>
                                    {elseif $SelectedItem.InClass[6] == 4}
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" id="exc1" name="exc1"> - Ingor opponents defensive power by 5%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc2" id="exc2"> - Returns the enemys attack power in 5%</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc3" id="exc3"> - Complete recovery of life in 5% rate</label>
                                        </div>
                                        <div>
                                            <label><input type="checkbox" onclick="SetPrice();" name="exc4" id="exc4"> - Complete recover of Mana in 5% rate</label>
                                        </div>
                                    {/if}
                                {/if}
                            </div>
                            {if $SelectedItem.Ancient1 || $SelectedItem.Ancient2}
                            <div class="row ancient">
                                <table>
                                    <tr><td rowspan="2" style="vertical-align: middle;">Ancient:</td>
                                        <td>
                                            <select id="select_anc" style="width:250px;" name="select_anc" onchange="SetPrice();;">
                                                <option value="0">- Выберите анциент -</option>
                                                {if $SelectedItem.Ancient1}
                                                    <option value="5">- {$SelectedItem.Ancient1} -</option>
                                                {/if}
                                                {if $SelectedItem.Ancient2}
                                                    <option value="10">- {$SelectedItem.Ancient2} -</option>
                                                {/if}

                                            </select>
                                        </td>

                                    </tr>

                                </table>
                            </div>
                            {/if}
                            {if $SelectedItem.Type <= 13 && $SelectedItem.Harmony}
                            <div class="row harmony">
                                <table>
                                    <tr>
                                        <td rowspan="2" style="vertical-align: middle;">Harmony:</td>
                                        <td>
                                            <select id="select_joh" style="width:250px;" name="select_joh" onchange="SetPrice(); HarmonyOptions(this.form.select_joh.value);">
                                                <option value="0">- Выберите опцию -</option>
                                                {foreach $SelectedItem.HarmonyList.HarmOpt item=name key=id}
                                                    <option value="{$id}">{$name}</option>
                                                {/foreach}
                                            </select>
                                            <br><br>
                                            <select id="select_joh_value" style="width:250px;display:none;" name="select_joh_value" onchange="SetPrice();" onclick="SetPrice();">
                                                <option value="0">- Выберите значение -</option>
                                            </select>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                            {/if}

                    </td>
                </tr>
                </tbody></table>
            </form>
            {/if}
        </div>



        <script type="text/javascript">
            function SetPrice() {
                var ItemPrice = {$SelectedItem.StartPrice};
                ItemPrice = ItemPrice + document.getElementById('select_level').value * {$Config.Price.Level};
                ItemPrice = ItemPrice + document.getElementById('select_opt').value * {$Config.Price.Option};
                exc_type = 1;
                exc_opt_limit = {$SelectedItem.MaxExcellent};

                ItemPrice += HarmonyPrice();

                if (document.getElementById('select_skill') != undefined) {
                    if (document.getElementById('select_skill').checked == 1) {
                        ItemPrice = ItemPrice + {$Config.Price.Skill};
                    }
                }
                if (document.getElementById('select_luck') != undefined){
                    if (document.getElementById('select_luck').checked == 1) {
                        ItemPrice = ItemPrice + {$Config.Price.Luck};
                    }
                }
                if (document.getElementById('select_anc').value == 5) {
                    ItemPrice = ItemPrice + {$Config.Price.Ancient}
                }

                if (document.getElementById('select_anc').value == 10) {
                    ItemPrice = ItemPrice + {$Config.Price.Ancient}
                }

                exc_opt_price = {$Config.Price.Excellent};
                var selected_exc_opt_count = 0;
                if (document.getElementById('exc1') != undefined) {
                    if (document.getElementById('exc1').checked == true) {
                        ItemPrice = ItemPrice + exc_opt_price;
                        selected_exc_opt_count = selected_exc_opt_count + 1;
                    }
                }
                if (document.getElementById('exc2') != undefined) {
                    if (document.getElementById('exc2').checked == true) {
                        ItemPrice = ItemPrice + exc_opt_price;
                        selected_exc_opt_count = selected_exc_opt_count + 1;
                    }
                }
                if (document.getElementById('exc3') != undefined) {
                    if (document.getElementById('exc3').checked == true) {
                        ItemPrice = ItemPrice + exc_opt_price;
                        selected_exc_opt_count = selected_exc_opt_count + 1;
                    }
                }
                if (document.getElementById('exc4') != undefined) {
                    if (document.getElementById('exc4').checked == true) {
                        ItemPrice = ItemPrice + exc_opt_price;
                        selected_exc_opt_count = selected_exc_opt_count + 1;
                    }
                }
                if (document.getElementById('exc5') != undefined) {
                    if (document.getElementById('exc5').checked == true) {
                        ItemPrice = ItemPrice + exc_opt_price;
                        selected_exc_opt_count = selected_exc_opt_count + 1;
                    }
                }
                if (document.getElementById('exc6') != undefined) {
                    if (document.getElementById('exc6').checked == true) {
                        ItemPrice = ItemPrice + exc_opt_price;
                        selected_exc_opt_count = selected_exc_opt_count + 1;
                    }
                }
                if(selected_exc_opt_count >= exc_opt_limit){
                    if (document.getElementById('exc1') != undefined) {
                        if (document.getElementById('exc1').checked != true) {
                            document.getElementById('exc1').disabled = true;
                        }
                    }
                    if (document.getElementById('exc2') != undefined) {
                        if (document.getElementById('exc2').checked != true) {
                            document.getElementById('exc2').disabled = true;
                        }
                    }
                    if (document.getElementById('exc3') != undefined) {
                        if (document.getElementById('exc3').checked != true) {
                            document.getElementById('exc3').disabled = true;
                        }
                    }
                    if (document.getElementById('exc4') != undefined) {
                        if (document.getElementById('exc4').checked != true) {
                            document.getElementById('exc4').disabled = true;
                        }
                    }
                    if (document.getElementById('exc5') != undefined) {
                        if (document.getElementById('exc5').checked != true) {
                            document.getElementById('exc5').disabled = true;
                        }
                    }
                    if (document.getElementById('exc6') != undefined) {
                        if (document.getElementById('exc6').checked != true) {
                            document.getElementById('exc6').disabled = true;
                        }
                    }
                }
                else{
                    if (document.getElementById('exc1') != undefined) {
                        document.getElementById('exc1').disabled = false;
                    }
                    if (document.getElementById('exc2') != undefined) {
                        document.getElementById('exc2').disabled = false;
                    }
                    if (document.getElementById('exc3') != undefined) {
                        document.getElementById('exc3').disabled = false;
                    }
                    if (document.getElementById('exc4') != undefined) {
                        document.getElementById('exc4').disabled = false;
                    }
                    if (document.getElementById('exc5') != undefined) {
                        document.getElementById('exc5').disabled = false;
                    }
                    if (document.getElementById('exc6') != undefined) {
                        document.getElementById('exc6').disabled = false;
                    }
                }
                document.getElementById('ItemPrice').innerHTML=ItemPrice;
            }

            function HarmonyPrice() {
                var johType = document.getElementById('select_joh');
                if (!johType) return 0;

                var johValue = document.getElementById('select_joh_value');

                var optType = johType.options[johType.selectedIndex];
                if (optType.value == 0) return 0;

                var optValue = johValue.options[johValue.selectedIndex];

                return {$Config.Price.Harmony} + document.getElementById('select_joh_value').value * {$Config.Price.HarmonyLevel};
            }

            function HarmonyOptions(Type) {
                $('#select_joh_value').html('<option value="0">- Выберите значение -</option>');
                document.getElementById("select_joh_value").style.display = "block";

                if(Type == 0){ document.getElementById("select_joh_value").style.display = "none"; }
                else if(Type == 1){ {$SelectedItem.HarmonyList.OptList[1]} }
                else if(Type == 2){ {$SelectedItem.HarmonyList.OptList[2]} }
                else if(Type == 3){ {$SelectedItem.HarmonyList.OptList[3]} }
                else if(Type == 4){ {$SelectedItem.HarmonyList.OptList[4]} }
                else if(Type == 5){ {$SelectedItem.HarmonyList.OptList[5]} }
                else if(Type == 6){ {$SelectedItem.HarmonyList.OptList[6]} }
                else if(Type == 7){ {$SelectedItem.HarmonyList.OptList[7]} }
                else if(Type == 8){ {$SelectedItem.HarmonyList.OptList[8]} }
                else if(Type == 9){ {$SelectedItem.HarmonyList.OptList[9]} }
                else if(Type == 10){ {$SelectedItem.HarmonyList.OptList[10]} }
                else if(Type == 11){ {$SelectedItem.HarmonyList.OptList[11]} }
                else if(Type == 12){ {$SelectedItem.HarmonyList.OptList[12]} }
                else if(Type == 13){ {$SelectedItem.HarmonyList.OptList[13]} }
                else{ top.location="shop"; }
            }
        </script>
    </form>
</div>




