ivalentin
/
SWDB


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752
							<?php
    /**
     * Monster view.
     *
     * Contains the view layout and some code to present the data.
     *
     * @category View
     * @property_read Monster_Page $page The page model.
     * @property_read int $UID Player ID.
     */
?>
<!DOCTYPE html>
<html lang='en'>
    <head>
        <meta content='text/html; charset=utf-8' http-equiv='content-type'/>
        <meta name='viewport' content='width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1'/>
        <title><?=$page->title?></title>
        <link rel='shortcut icon' href='<?=$page->favicon?>'/>
        <!-- CSS files -->
        <link rel='stylesheet' type='text/css' href='<?=URL::CSS?>ui.css'/>
        <link rel='stylesheet' type='text/css' href='<?=URL::CSS?>optimizer.css'/>
        <!-- Meta tags -->
        <link rel='canonical' href='<?=$page->canonical?>'/>
        <link rel='author' href='<?=$page->author?>'/>
        <link rel='publisher' href='<?=$page->author?>'/>
        <meta name='description' content='<?=$page->description?>'/>
        <meta property='og:title' content='<?=$page->title?>'/>
        <meta property='og:url' content='<?=$page->canonical?>'/>
        <meta property='og:description' content='<?=$page->description?>'/>
        <meta property='og:image' content='<?=$page->icon?>'/>
        <meta property='og:site_name' content='<?=$page->name?>'/>
        <meta property='og:type' content='website'/>
        <meta property='og:locale' content='en'/>
        <meta name='twitter:card' content='summary'/>
        <meta name='twitter:title' content='<?=$page->title?>'/>
        <meta name='twitter:description' content='<?=$page->description?>'/>
        <meta name='twitter:image' content='<?=$page->icon?>'/>
        <meta name='twitter:url' content='<?=$page->canonical?>'/>
        <meta name='robots' content='index follow'/>
        <script>

            /**
             * Unit current stats.
             */
            var current_stats = {
                "attack": <?=$page->unit->total_attack?>,
                "defense": <?=$page->unit->total_defense?>,
                "hp": <?=$page->unit->total_hp?>,
                "speed": <?=$page->unit->total_speed?>,
                "crit_rate": <?=$page->unit->total_crit_rate?>,
                "crit_damage": <?=$page->unit->total_crit_damage?>,
                "accuracy": <?=$page->unit->total_accuracy?>,
                "resistance": <?=$page->unit->total_resistance?>,
                "ehp": <?=$page->unit->effective_hp?>,
                "dmg": <?=$page->unit->effective_dmg?>
            }
            
            var base_stats = {
                "attack": <?=$page->unit->attack?>,
                "defense": <?=$page->unit->defense?>,
                "hp": <?=$page->unit->hp?>,
                "speed": <?=$page->unit->speed?>,
                "crit_rate": <?=$page->unit->crit_rate?>,
                "crit_damage": <?=$page->unit->crit_damage?>,
                "accuracy": <?=$page->unit->accuracy?>,
                "resistance": <?=$page->unit->resistance?>,
                "ehp": <?=$page->unit->effective_hp?>,
                "dmg": <?=$page->unit->effective_dmg?>
            }

<?php
            // Get current rune sets
            $sets = [];
            foreach ($page->unit->rune as $rune){
                if (!in_array($rune->type->id, $sets)){
                    array_push($sets, $rune->type->id);
                }
            }
            for ($i = sizeof($sets); $i < 3; $i ++){
                array_push($sets, 0);
            }
?>
            var current_sets = [<?=$sets[0]?>, <?=$sets[1]?>, <?=$sets[2]?>];

            // Get current main stats in even slots
<?php
            $mains = [0, 0, 0];
            foreach ($page->unit->rune as $rune){
                if ($rune->slot % 2 == 0){
                    $mains[($rune->slot / 2) - 1] = $rune->main_stat;
                }
            }
?>

            /**
             * To calculate time.
             */
            var timestamp = 0;

            /**
             * Updates the value next to the sliders when they change.
             *
             * @param stat Name of the stat to set.
             * @param value Value of the slider.
             */
            function updateMinValue(stat, element){
                var value = Number(element.value);
                var max = Number(element.max);
                var min = Number(element.min);
                if (value < min){
                    value = min;
                }
                if (value > max){
                    value = max;
                }
                document.getElementById('lbl_min_' + stat).value = value;
                document.getElementById('min_' + stat).value = value;
            }
            
            /**
             * Resets filter to the unit's current stat status.
             *
             * @param stat Name of the stat to set.
             */
            function resetFilter(stat){
                document.getElementById('lbl_min_' + stat).value = current_stats[stat];
                document.getElementById('min_' + stat).value = current_stats[stat];
            }

            /**
             * Sets a filter to it's lowest possible value.
             *
             * @param stat Name of the stat to set.
             */
            function removeFilter(stat){
                document.getElementById('lbl_min_' + stat).value = document.getElementById('lbl_min_' + stat).min;
                document.getElementById('min_' + stat).value = document.getElementById('min_' + stat).min;
            }

            /**
             * Starts the optimization.
             *
             * Checks for error in the combination of the parameters, and
             * shows an error window if there is an invalid conbination. If
             * not, builds the url to fetch all candidate runes.
             *
             * @return false on error, true on success.
             */
            function apply(){

                var params = '';
                var x;

                // Player id - mandatory
                params = 'uid=<?=$UID?>';

                // Unit id - mandatory
                params += '&unit=<?=$page->unit->id?>';

                // Rune set 1 - mandatory
                params += '&set[]=' + document.getElementById('set_1').options[document.getElementById('set_1').selectedIndex].value;

                // Rune set 2 - mandatory
                params += '&set[]=' + document.getElementById('set_2').options[document.getElementById('set_2').selectedIndex].value;

                // Rune set 3 - optional
                x = document.getElementById('set_3').options[document.getElementById('set_3').selectedIndex].value;
                if (x != ''){
                    params += '&set[]=' + x;
                }

                // Slot 2 - mandatory
                params += '&stat[]=' + document.getElementById('slot_2').options[document.getElementById('slot_2').selectedIndex].value;

                // Slot 4 - mandatory
                params += '&stat[]=' + document.getElementById('slot_4').options[document.getElementById('slot_4').selectedIndex].value;

                // Slot 5 - mandatory
                params += '&stat[]=' + document.getElementById('slot_6').options[document.getElementById('slot_6').selectedIndex].value;

                // Rune source - mandatory
                params += '&source=' + document.getElementById('rune_source').options[document.getElementById('rune_source').selectedIndex].value;

                // Optimizer tuning - mandatory
                params += '&tuning=' + document.getElementById('tuning').options[document.getElementById('tuning').selectedIndex].value;

                // Limit combinations - mandatory
                params += '&limit=' + document.getElementById('limit').value;

                // Min HP - Optional
                if (Number(document.getElementById('min_hp').value) > Number(document.getElementById('min_hp').min)){
                    params += '&min_hp=' + document.getElementById('min_hp').value;
                }

                // Min ATK - Optional
                if (Number(document.getElementById('min_attack').value) > Number(document.getElementById('min_attack').min)){
                    params += '&min_attack=' + document.getElementById('min_attack').value;
                }

                // Min DEF - Optional
                if (Number(document.getElementById('min_defense').value) > Number(document.getElementById('min_defense').min)){
                    params += '&min_defense=' + document.getElementById('min_defense').value;
                }

                // Min SPD - Optional
                if (Number(document.getElementById('min_speed').value) > Number(document.getElementById('min_speed').min)){
                    params += '&min_speed=' + document.getElementById('min_speed').value;
                }

                // Min CRR - Optional
                if (Number(document.getElementById('min_crit_rate').value) > Number(document.getElementById('min_crit_rate').min)){
                    params += '&min_crit_rate=' + document.getElementById('min_crit_rate').value;
                }

                // Min CRD - Optional
                if (Number(document.getElementById('min_crit_damage').value) > Number(document.getElementById('min_crit_damage').min)){
                    params += '&min_crit_damage=' + document.getElementById('min_crit_damage').value;
                }

                // Min ACC - Optional
                if (Number(document.getElementById('min_accuracy').value) > Number(document.getElementById('min_accuracy').min)){
                    params += '&min_accuracy=' + document.getElementById('min_accuracy').value;
                }

                // Min RES - Optional
                if (Number(document.getElementById('min_resistance').value) > Number(document.getElementById('min_resistance').min)){
                    params += '&min_resistance=' + document.getElementById('min_resistance').value;
                }

                // Min EHP - Optional
                if (Number(document.getElementById('min_ehp').value) > 0){
                    params += '&min_ehp=' + document.getElementById('min_ehp').value;
                }

                // Min DMG - Optional
                if (Number(document.getElementById('min_dmg').value) > 0){
                    params += '&min_dmg=' + document.getElementById('min_dmg').value;
                }

                // Send the request
                var xhttp = new XMLHttpRequest();
                xhttp.onreadystatechange = function() {
                    if (this.readyState == 4){
                        document.getElementById('apply').removeAttribute('disabled');
                        document.getElementById('wait').style.display = 'none';
                        //console.log(this.response);
                        if (this.status == 200) {
                            time = ((+ new Date()) - timestamp) / 1000;
                            showOptimizations(this.response, time);
                        }
                        else if (this.status == 413) { // Payload too large
                            showMessage('Error', 'Too many combination found. Plesase narow your criteria and retry.');
                        }
                        else if (this.status == 500) { // Server error
                            showMessage('Error', 'Too many rune combination found. Plesase narow your criteria and retry.');
                        }
                    }
                };

                // DEBUG
                //params = 'uid=8114048&unit=6441802832&limit=6&set[]=2&set[]=4&set[]=4&stat[]=4&stat[]=4&stat[]=4&source=0&tuning=2&min_defense=800';


                // Clear result table, disable button and show spinner
                var container = document.getElementById('optimizations');
                while (container.firstChild) {
                    container.removeChild(container.firstChild);
                }
                document.getElementById('apply').setAttribute('disabled', 'disabled');
                document.getElementById('wait').style.display = 'block';
                document.getElementById('results').style.display = 'none';

                // Start timer
                timestamp = + new Date();

                // Make the request
                xhttp.open('POST', '/action/optimize_get_rune_list/', true);
                xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                xhttp.send(params);
            }

            function valid_set(candidates){
            
                // Debug section: Look out for current runes
                if (
                    candidates[0].ID == '18127229790' //&&
                    //candidates[1].ID == '16037693193' &&
                    //candidates[2].ID == '18831259497' &&
                    //candidates[3].ID == '19634059762' &&
                    //candidates[4].ID == '19057400217' &&
                    //candidates[5].ID == '20095751566'
                ){
                    console.log("CURRENT SET!!");
                }
            
                // Number of applied sets with the current candidates.
                var sets = {
                    'RUNE_SET_<?=RUNE_SET_ID::ENERGY?>': 0, // ENERGY
                    'RUNE_SET_<?=RUNE_SET_ID::GUARD?>': 0, // GUARD
                    'RUNE_SET_<?=RUNE_SET_ID::SWIFT?>': 0, // SWIFT
                    'RUNE_SET_<?=RUNE_SET_ID::BLADE?>': 0, // BLADE
                    'RUNE_SET_<?=RUNE_SET_ID::RAGE?>': 0, // RAGE
                    'RUNE_SET_<?=RUNE_SET_ID::FOCUS?>': 0, // FOCUS
                    'RUNE_SET_<?=RUNE_SET_ID::ENDURE?>': 0, // ENDURE
                    'RUNE_SET_<?=RUNE_SET_ID::FATAL?>': 0, // FATAL
                    'RUNE_SET_<?=RUNE_SET_ID::DESPAIR?>': 0, // DESPAIR
                    'RUNE_SET_<?=RUNE_SET_ID::VAMPIRE?>': 0, // VAMPIRE
                    'RUNE_SET_<?=RUNE_SET_ID::VIOLENT?>': 0, // VIOLENT
                    'RUNE_SET_<?=RUNE_SET_ID::NEMESIS?>': 0, // NEMESIS
                    'RUNE_SET_<?=RUNE_SET_ID::WILL?>': 0, // WILL
                    'RUNE_SET_<?=RUNE_SET_ID::SHIELD?>': 0, // SHIELD
                    'RUNE_SET_<?=RUNE_SET_ID::REVENGE?>': 0, // REVENGE
                    'RUNE_SET_<?=RUNE_SET_ID::DESTROY?>': 0, // DESTROY
                    'RUNE_SET_<?=RUNE_SET_ID::FIGHT?>': 0, // FIGHT
                    'RUNE_SET_<?=RUNE_SET_ID::DETERMINATION?>': 0, // DETERMINATION
                    'RUNE_SET_<?=RUNE_SET_ID::ENHANCE?>': 0, // ENHANCE
                    'RUNE_SET_<?=RUNE_SET_ID::ACCURACY?>': 0, // ACCURACY
                    'RUNE_SET_<?=RUNE_SET_ID::TOLERANCE?>': 0 // TOLERANCE
                };
                for (var i = 0; i <= 5; i ++){
                    sets['RUNE_SET_' + candidates[i].TYPE] ++;
                }
                for (var i = 0; i < sets.length; i ++){
                    switch (i){
                        case <?=RUNE_SET_ID::ENERGY?>:
                        case <?=RUNE_SET_ID::GUARD?>:
                        case <?=RUNE_SET_ID::NEMESIS?>:
                        case <?=RUNE_SET_ID::BLADE?>:
                        case <?=RUNE_SET_ID::FOCUS?>:
                        case <?=RUNE_SET_ID::ENDURE?>:
                        case <?=RUNE_SET_ID::WILL?>:
                        case <?=RUNE_SET_ID::SHIELD?>:
                        case <?=RUNE_SET_ID::REVENGE?>:
                        case <?=RUNE_SET_ID::DESTROY?>:
                        case <?=RUNE_SET_ID::FIGHT?>:
                        case <?=RUNE_SET_ID::DETERMINATION?>:
                        case <?=RUNE_SET_ID::ENHANCE?>:
                        case <?=RUNE_SET_ID::ACCURACY?>:
                        case <?=RUNE_SET_ID::TOLERANCE?>:
                            if (sets[i] % 2 != 0){
                                return false;
                            }
                            break;
                        
                        case <?=RUNE_SET_ID::DESPAIR?>:
                        case <?=RUNE_SET_ID::SWIFT?>:
                        case <?=RUNE_SET_ID::RAGE?>:
                        case <?=RUNE_SET_ID::FATAL?>:
                        case <?=RUNE_SET_ID::VAMPIRE?>:
                        case <?=RUNE_SET_ID::VIOLENT?>:
                            if (sets[i] != 4 && sets[i] != 0){
                                return false;
                            }
                            break;
                    }
                }
                
                // Its a valid set, but does it match the requested sets?
                var requested_sets = {
                    'RUNE_SET_<?=RUNE_SET_ID::ENERGY?>': 0, // ENERGY
                    'RUNE_SET_<?=RUNE_SET_ID::GUARD?>': 0, // GUARD
                    'RUNE_SET_<?=RUNE_SET_ID::SWIFT?>': 0, // SWIFT
                    'RUNE_SET_<?=RUNE_SET_ID::BLADE?>': 0, // BLADE
                    'RUNE_SET_<?=RUNE_SET_ID::RAGE?>': 0, // RAGE
                    'RUNE_SET_<?=RUNE_SET_ID::FOCUS?>': 0, // FOCUS
                    'RUNE_SET_<?=RUNE_SET_ID::ENDURE?>': 0, // ENDURE
                    'RUNE_SET_<?=RUNE_SET_ID::FATAL?>': 0, // FATAL
                    'RUNE_SET_<?=RUNE_SET_ID::DESPAIR?>': 0, // DESPAIR
                    'RUNE_SET_<?=RUNE_SET_ID::VAMPIRE?>': 0, // VAMPIRE
                    'RUNE_SET_<?=RUNE_SET_ID::VIOLENT?>': 0, // VIOLENT
                    'RUNE_SET_<?=RUNE_SET_ID::NEMESIS?>': 0, // NEMESIS
                    'RUNE_SET_<?=RUNE_SET_ID::WILL?>': 0, // WILL
                    'RUNE_SET_<?=RUNE_SET_ID::SHIELD?>': 0, // SHIELD
                    'RUNE_SET_<?=RUNE_SET_ID::REVENGE?>': 0, // REVENGE
                    'RUNE_SET_<?=RUNE_SET_ID::DESTROY?>': 0, // DESTROY
                    'RUNE_SET_<?=RUNE_SET_ID::FIGHT?>': 0, // FIGHT
                    'RUNE_SET_<?=RUNE_SET_ID::DETERMINATION?>': 0, // DETERMINATION
                    'RUNE_SET_<?=RUNE_SET_ID::ENHANCE?>': 0, // ENHANCE
                    'RUNE_SET_<?=RUNE_SET_ID::ACCURACY?>': 0, // ACCURACY
                    'RUNE_SET_<?=RUNE_SET_ID::TOLERANCE?>': 0 // TOLERANCE
                };
                var selected_1 = document.getElementById('set_1').options[document.getElementById('set_1').selectedIndex].value;
                var selected_2 = document.getElementById('set_2').options[document.getElementById('set_2').selectedIndex].value;
                var selected_3 = document.getElementById('set_3').options[document.getElementById('set_3').selectedIndex].value;
                var requested_values = [
                    document.getElementById('set_1').options[document.getElementById('set_1').selectedIndex].value,
                    document.getElementById('set_2').options[document.getElementById('set_2').selectedIndex].value,
                    document.getElementById('set_3').options[document.getElementById('set_3').selectedIndex].value
                ];
                for (var i = 0; i < 3; i ++){
                    switch (requested_values[i]){
                        case '<?=RUNE_SET_ID::ENERGY?>':
                        case '<?=RUNE_SET_ID::GUARD?>':
                        case '<?=RUNE_SET_ID::NEMESIS?>':
                        case '<?=RUNE_SET_ID::BLADE?>':
                        case '<?=RUNE_SET_ID::FOCUS?>':
                        case '<?=RUNE_SET_ID::ENDURE?>':
                        case '<?=RUNE_SET_ID::WILL?>':
                        case '<?=RUNE_SET_ID::SHIELD?>':
                        case '<?=RUNE_SET_ID::REVENGE?>':
                        case '<?=RUNE_SET_ID::DESTROY?>':
                        case '<?=RUNE_SET_ID::FIGHT?>':
                        case '<?=RUNE_SET_ID::DETERMINATION?>':
                        case '<?=RUNE_SET_ID::ENHANCE?>':
                        case '<?=RUNE_SET_ID::ACCURACY?>':
                        case '<?=RUNE_SET_ID::TOLERANCE?>':
                            requested_sets['RUNE_SET_' + requested_values[i]] += 2;
                            break;
                        case '<?=RUNE_SET_ID::DESPAIR?>':
                        case '<?=RUNE_SET_ID::SWIFT?>':
                        case '<?=RUNE_SET_ID::RAGE?>':
                        case '<?=RUNE_SET_ID::FATAL?>':
                        case '<?=RUNE_SET_ID::VAMPIRE?>':
                        case '<?=RUNE_SET_ID::VIOLENT?>':
                            requested_sets['RUNE_SET_' + i] += 4;
                            break;
                    }
                }

                //console.log("VALID SET!");
                if (JSON.stringify(sets) !== JSON.stringify(requested_sets)){
                    return false;
                }
                //console.log("VALID REQUESTED SET!");
                
                // Compare with filters
                var new_stats = {
                    "ATK": base_stats["attack"],
                    "DEF": base_stats["defense"],
                    "HP":  base_stats["hp"],
                    "SPD": base_stats["speed"],
                    "CRR": base_stats["crit_rate"],
                    "CRD": base_stats["crit_damage"],
                    "ACC": base_stats["accuracy"],
                    "RES": base_stats["resistance"],
                    "EHP": 0,
                    "DMG": 0
                }
                for (var i = 0; i <= 5; i ++){
                    new_stats["ATK"] += candidates[i].ATK;
                    new_stats["DEF"] += candidates[i].DEF;
                    new_stats["HP"]  += candidates[i].HP;
                    new_stats["SPD"] += candidates[i].SPD;
                    new_stats["CRR"] += candidates[i].CRR;
                    new_stats["CRD"] += candidates[i].CRD;
                    new_stats["ACC"] += candidates[i].ACC;
                    new_stats["RES"] += candidates[i].RES;
                }
                new_stats["EHP"] = Math.ceil((((new_stats["DEF"] * 3.5) + 1140) * new_stats["HP"]) / 1000);
                new_stats["DMG"] = Math.ceil((new_stats["ATK"] * (100 - new_stats["CRR"]) / 100) + ((new_stats["ATK"] + (new_stats["ATK"] * new_stats["CRD"] / 100)) * new_stats["CRR"] / 100));
                //console.log("HP " + new_stats["HP"] + "/" + document.getElementById('min_hp').value);
                if (
                    new_stats["ATK"] >= document.getElementById('min_attack').value &&
                    new_stats["DEF"] >= document.getElementById('min_defense').value &&
                    new_stats["HP"]  >= document.getElementById('min_hp').value &&
                    new_stats["SPD"] >= document.getElementById('min_speed').value &&
                    new_stats["CRR"] >= document.getElementById('min_crit_rate').value &&
                    new_stats["CRD"] >= document.getElementById('min_crit_damage').value &&
                    new_stats["ACC"] >= document.getElementById('min_accuracy').value &&
                    new_stats["RES"] >= document.getElementById('min_resistance').value &&
                    new_stats["EHP"] >= document.getElementById('min_ehp').value &&
                    new_stats["DMG"] >= document.getElementById('min_dmg').value
                ){
                    //console.log("IMPROVING SET!");
                    return true
                }
                return false;
            }
            
            /**
             * Parses the received content and creates the HTML with the new
             * rune options.
             *
             * @param content JSON received from server.
             */
            function showOptimizations(content, time){
                var container = document.getElementById('optimizations');
                var data = JSON.parse(content);
                //console.log(data);
                var candidates = [
                    data[1],
                    data[2],
                    data[3],
                    data[4],
                    data[5],
                    data[6]
                ];
                var total_combinations = data[1].length *  data[2].length *  data[3].length *  data[4].length *  data[5].length *  data[6].length;
                var checked_combinations = 0;
                // Valic combinations that match the minimum requeriments
                var valid_combinations = [];
                console.log("TOTAL COMBINATIONS: " + total_combinations);
                // TODO Prevent user on high numbers
                // Counters to keep track on array indexes
                var counters = [0, 0, 0, 0, 0, 0];
                
                
                while (true){
                
                    // Check loop exit condition
                    if (
                        counters[0] >= candidates[0].length &&
                        counters[1] >= candidates[1].length &&
                        counters[2] >= candidates[2].length &&
                        counters[3] >= candidates[3].length &&
                        counters[4] >= candidates[4].length &&
                        counters[5] >= candidates[5].length
                    ){
                        console.log("BREAK BY condition");
                        break;
                    }
                    
                    // TODO DEBUG Exit a 3
                    if (checked_combinations >= 3000000){
                        console.log("BREAK BY hard limit");
                        break;
                    }
                
                    if (valid_set([
                      candidates[0][counters[0]],
                      candidates[1][counters[1]],
                      candidates[2][counters[2]],
                      candidates[3][counters[3]],
                      candidates[4][counters[4]],
                      candidates[5][counters[5]]
                    ])){
                        valid_combinations.push({
                            'score': 0,
                            'runes': [
                                candidates[0][counters[0]],
                                candidates[1][counters[1]],
                                candidates[2][counters[2]],
                                candidates[3][counters[3]],
                                candidates[4][counters[4]],
                                candidates[5][counters[5]]
                            ]
                        });
                    }
                    
                    // Increase counters
                    checked_combinations ++;
                    counters[5] ++;
                    if (counters[5] >= candidates[5].length){
                        counters[5] = 0;
                        counters[4] ++;
                    }
                    if (counters[4] >= candidates[4].length){
                        counters[4] = 0;
                        counters[3] ++;
                    }
                    if (counters[3] >= candidates[3].length){
                        counters[3] = 0;
                        counters[2] ++;
                    }
                    if (counters[2] >= candidates[2].length){
                        counters[2] = 0;
                        counters[1] ++;
                    }
                    if (counters[1] >= candidates[1].length){
                        counters[1] = 0;
                        counters[0] ++;
                    }
                    if (counters[0] >= candidates[0].length){
                        console.log("BREAK BY increments");
                        break;
                    }
                    
                    /*if (checked_combinations % 1000 == 0){
                        console.log("COMBINATIONS CHECKED: " + checked_combinations + " / " + total_combinations + "(" + (checked_combinations * 100 / total_combinations) + "%)");
                        console.log("  0:  " + counters[0] + "/" + candidates[0].length);
                        console.log("  1:  " + counters[1] + "/" + candidates[1].length);
                        console.log("  2:  " + counters[2] + "/" + candidates[2].length);
                        console.log("  3:  " + counters[3] + "/" + candidates[3].length);
                        console.log("  4:  " + counters[4] + "/" + candidates[4].length);
                        console.log("  5:  " + counters[5] + "/" + candidates[5].length);
                    }*/
                    
                    
                }
                
                // Foreach valid combination, rate it and sort the array
                for (var i = 0; i < valid_combinations.length; i ++){
                    for (var r = 0; r < 6; r ++){
                        valid_combinations[i]['score'] += valid_combinations[i]["runes"][r]["ATK"];
                        valid_combinations[i]['score'] += valid_combinations[i]["runes"][r]["DEF"];
                        valid_combinations[i]['score'] += (valid_combinations[i]["runes"][r]["HP"] / 15);
                        valid_combinations[i]['score'] += (valid_combinations[i]["runes"][r]["SPD"] * 1.5);
                        valid_combinations[i]['score'] += (valid_combinations[i]["runes"][r]["CRR"] * 1.2);
                        valid_combinations[i]['score'] += (valid_combinations[i]["runes"][r]["CRD"] * 1.2);
                        valid_combinations[i]['score'] += (valid_combinations[i]["runes"][r]["ACC"] * 1.2);
                        valid_combinations[i]['score'] += (valid_combinations[i]["runes"][r]["ATK"] * 1.2);
                    }
                }
                console.log("CHECKED: " + checked_combinations + "/" + total_combinations);
                valid_combinations.sort(function(a, b) {return b['score'] - a['score'];});
                valid_combinations = valid_combinations.slice(0, document.getElementById('limit').value);
                console.log("SIZE: " + valid_combinations.length);
//                 for (var i = 0; i < valid_combinations.length; i ++){
//                     console.log(valid_combinations[i]['score']);
//                 }
                
                // Request to fetch the runes.
                // TODO
                // Make the request
                var xhttp = new XMLHttpRequest();
                xhttp.onreadystatechange = function() {
                    if (this.readyState == 4){
                        console.log("RUNES RECEIVED");
                        console.log(this.response);
                        if (this.status == 200) {
                            //time = ((+ new Date()) - timestamp) / 1000;
                            presentOptions(this.response, time);
                        }
                        /*document.getElementById('apply').removeAttribute('disabled');
                        document.getElementById('wait').style.display = 'none';
                        //console.log(this.response);
                        if (this.status == 200) {
                            time = ((+ new Date()) - timestamp) / 1000;
                            showOptimizations(this.response, time);
                        }
                        else if (this.status == 413) { // Payload too large
                            showMessage('Error', 'Too many combination found. Plesase narow your criteria and retry.');
                        }
                        else if (this.status == 500) { // Server error
                            showMessage('Error', 'Too many rune combination found. Plesase narow your criteria and retry.');
                        }*/
                    }
                };
                params = 'uid=<?=$UID?>&unit=<?=$page->unit->id?>';
                params += '&options=' + JSON.stringify(valid_combinations);
                xhttp.open('POST', '/action/optimize_get_options/', true);
                xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
                xhttp.send(params);
                // Send the request
                
                
                return;
                
                
            }
            function presentOptions(content, time){
                var container = document.getElementById('optimizations');
                var data = JSON.parse(content);
                
                
                if (Number(data.total) == 0){
                    showMessage('No results', 'No suitable combination found. Plesase relax your criteria and retry.');
                    return;
                }
                document.getElementById('num_results').innerHTML = data.total;
                document.getElementById('num_skipped').innerHTML = data.skipped;
                document.getElementById('num_seconds').innerHTML = time;
                var option;
                var tr;
                var td;
                var stat_table;
                var stat_tr;
                var stat_td;
                var span;
                var text;
                for (i = 0; i < data.length; i++){
                    option = data[i];
                    tr = document.createElement('tr');
                    td = document.createElement('td');
                    td.setAttribute('class', 'option_stats');
                    stat_table = document.createElement('table');
                    stat_table.setAttribute('class', 'stat_table');

                    // attack
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('ATK');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.attack + " ");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.attack) > Number(current_stats["attack"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.attack - current_stats["attack"]);

                    }
                    else if (Number(option.stats.attack) < Number(current_stats["attack"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["attack"] - option.stats.attack);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // defense
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('DEF');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.defense + " ");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.defense) > Number(current_stats["defense"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.defense - current_stats["defense"]);

                    }
                    else if (Number(option.stats.defense) < Number(current_stats["defense"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["defense"] - option.stats.defense);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // hp
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('HP ');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.hp + " ");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.hp) > Number(current_stats["hp"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.hp - current_stats["hp"]);

                    }
                    else if (Number(option.stats.hp) < Number(current_stats["hp"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["hp"] - option.stats.hp);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // speed
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('SPD');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.speed + " ");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.speed) > Number(current_stats["speed"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.speed - current_stats["speed"]);

                    }
                    else if (Number(option.stats.speed) < Number(current_stats["speed"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["speed"] - option.stats.speed);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // crit_rate
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('CRR');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.crit_rate + "%");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.crit_rate) > Number(current_stats["crit_rate"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.crit_rate - current_stats["crit_rate"]);

                    }
                    else if (Number(option.stats.crit_rate) < Number(current_stats["crit_rate"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["crit_rate"] - option.stats.crit_rate);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // crit_damage
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('CRD');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.crit_damage + "%");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.crit_damage) > Number(current_stats["crit_damage"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.crit_damage - current_stats["crit_damage"]);

                    }
                    else if (Number(option.stats.crit_damage) < Number(current_stats["crit_damage"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["crit_damage"] - option.stats.crit_damage);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // accuracy
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('ACC');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.accuracy + "%");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.accuracy) > Number(current_stats["accuracy"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.accuracy - current_stats["accuracy"]);

                    }
                    else if (Number(option.stats.accuracy) < Number(current_stats["accuracy"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["accuracy"] - option.stats.accuracy);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // resistance
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('RES');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.resistance + "%");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.resistance) > Number(current_stats["resistance"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.resistance - current_stats["resistance"]);

                    }
                    else if (Number(option.stats.resistance) < Number(current_stats["resistance"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["resistance"] - option.stats.resistance);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // ehp
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('EHP');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.ehp + " ");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.ehp) > Number(current_stats["ehp"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.ehp - current_stats["ehp"]);

                    }
                    else if (Number(option.stats.ehp) < Number(current_stats["ehp"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["ehp"] - option.stats.ehp);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // dmg
                    stat_tr = document.createElement('tr');
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'label');
                    text = document.createTextNode('DMG');
                    stat_td.appendChild(text);
                    stat_tr.appendChild(stat_td);
                    stat_td = document.createElement('td');
                    stat_td.setAttribute('class', 'value');
                    span = document.createElement('span');
                    span.setAttribute('class', 'stat');
                    text = document.createTextNode(option.stats.dmg + " ");
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    span = document.createElement('span');
                    if (Number(option.stats.dmg) > Number(current_stats["dmg"])){

                        span.setAttribute('class', 'variation increment');
                        text = document.createTextNode(option.stats.dmg - current_stats["dmg"]);

                    }
                    else if (Number(option.stats.dmg) < Number(current_stats["dmg"])){
                        span.setAttribute('class', 'variation decrement');
                        text = document.createTextNode(current_stats["dmg"] - option.stats.dmg);

                    }
                    else{
                        span.setAttribute('class', 'variation');
                        text = document.createTextNode(" ");
                    }
                    span.appendChild(text);
                    stat_td.appendChild(span);
                    stat_tr.appendChild(stat_td);
                    stat_table.appendChild(stat_tr);

                    // Add to the main table
                    td.appendChild(stat_table);
                    tr.appendChild(td);

                    // Runes td
                    td = document.createElement('td');
                    td.setAttribute('class', 'runes');
                    td.innerHTML += option.runes[6 - 1].html;
                    td.innerHTML += option.runes[1 - 1].html;
                    td.innerHTML += option.runes[2 - 1].html;
                    td.innerHTML += "<br/>";
                    td.innerHTML += option.runes[5 - 1].html;
                    td.innerHTML += option.runes[4 - 1].html;
                    td.innerHTML += option.runes[3 - 1].html;

                    // Add the table
                    tr.appendChild(td);
                    container.appendChild(tr);

                    // Make the section visible
                    document.getElementById('results').style.display = 'block';

                }
            }
            
            function sortOptions(a, b) {
                return b["score"] - a["score"];
            }

            /**
             * Displays a pop-up message.
             *
             * @param title Message title.
             * @param text Message content.
             */
            function showMessage(title, text){
                document.getElementById('message_title').innerHTML = title;
                document.getElementById('message_text').innerHTML = text;
                document.getElementById('message_container').style.display = 'block';
            }

            /**
             * Closes the message pop-up.
             */
            function closeMessage(){
                document.getElementById('message_container').style.display = 'none';
            }
            
            function debug(){
                document.getElementById('set_1').selectedIndex = 0;
                document.getElementById('set_2').selectedIndex = 0;
                document.getElementById('set_3').selectedIndex = 1;
                removeFilter('attack');
                removeFilter('defense');
                removeFilter('speed');
                removeFilter('crit_rate');
                removeFilter('crit_damage');
                removeFilter('accuracy');
                removeFilter('resistance');
                removeFilter('ehp');
                removeFilter('dmg');
                document.getElementById('lbl_min_hp').value = 13500;
                updateMinValue('hp', document.getElementById('lbl_min_hp'));
                //apply();
            }
        </script>
    </head>
    <body>
<?php
        include __DIR__ . "/inc/header.php";
?>
        <aside>
            <h2>
                Optimize <?=$page->unit->title?>
            </h2>
            <div id='monster_info'>
                <div class='monster_panel'>
                    <?=HTML::unit_panel($page->unit)?>
                </div>
<?php
                if ($page->unit->experience_level != 0){
                    $exp_pct = ceil($page->unit->exp_gained * 100 / $page->unit->experience_level);
                    $exp_txt = $page->unit->exp_gained . " / " . $page->unit->experience_level;
                }
                else{
                    $exp_pct = 100;
                    $exp_txt = "MAX";
                }
                $now = time();
                //$datediff = $now - $page->unit->create_time->getTimestamp();
                $datediff = $now - strtotime($page->unit->create_time->format('Y-m-d H:i:s'));
                $datediff = floor($datediff / (60 * 60 * 24));
?>
                <div id='monster_details'>
<?php
                    if (sizeof($page->unit->teams) > 0){
?>
                        <div id='teams'>
                            <h4>
                                Teams:
                            </h4>
                            <ul>
<?php
                                foreach($page->unit->teams as $team){
?>
                                    <li>
                                        <a target='blank' href='/<?=$UID?>/teams/<?=$team->id?>'>
                                            <?=$team->name?>
                                        </a>
                                    </li>
<?php
                                }
?>
                            </ul>
                        </div>
<?php
                    }
?>
                </div>
            </div>
        </aside>
        <main>
            <section id='monster' class='content'>
                <h2>
                    Optimize <?=$page->unit->title?>
                </h2>
                <article id='profile'>
                    <table id='stats'>
                        <tr>
                            <th>
                                Stats
                            </th>
                            <th>
                                Base
                            </th>
                            <th>
                                Runes
                            </th>
                            <th>
                                Artifacts
                            </th>
                            <th>
                                Buildings
                            </th>
                            <th>
                                Total
                            </th>
                        </tr>
                        <tr>
                            <th>
                                ATK
                            </th>
                            <td class='base'>
                                <?=$page->unit->attack?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_attack?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_attack?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_attack?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_attack?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                DEF
                            </th>
                            <td class='base'>
                                <?=$page->unit->defense?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_defense?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_defense?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_defense?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_defense?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                HP
                            </th>
                            <td class='base'>
                                <?=$page->unit->hp?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_hp?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_hp?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_hp?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_hp?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                SPD
                            </th>
                            <td class='base'>
                                <?=$page->unit->speed?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_speed?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_speed?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_speed?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_speed?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                CRR
                            </th>
                            <td class='base'>
                                <?=$page->unit->crit_rate?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_crit_rate?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_crit_rate?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_crit_rate?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_crit_rate?>
                                <span class='percent'>%</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                CRD
                            </th>
                            <td class='base'>
                                <?=$page->unit->crit_damage?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_crit_damage?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_crit_damage?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_crit_damage?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_crit_damage?>
                                <span class='percent'>%</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                ACC
                            </th>
                            <td class='base'>
                                <?=$page->unit->accuracy?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_accuracy?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_accuracy?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_accuracy?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_accuracy?>
                                <span class='percent'>%</span>
                            </td>
                        </tr>
                        <tr>
                            <th>
                                RES
                            </th>
                            <td class='base'>
                                <?=$page->unit->resistance?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->rune_resistance?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->artifact_resistance?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='extra'>
                                +<?=$page->unit->building_resistance?>
                                <span class='percent'>%</span>
                            </td>
                            <td class='total'>
                                <?=$page->unit->total_resistance?>
                                <span class='percent'>%</span>
                            </td>
                        </tr>
                        <tr>
                            <th colspan='5'>
                                Effective HP
                            </th>
                            <td class='total'>
                                <?=$page->unit->effective_hp?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                        </tr>
                        <tr>
                            <th colspan='5'>
                                Effective DMG
                            </th>
                            <td class='total'>
                                <?=$page->unit->effective_dmg?>
                                <span class='percent'>&nbsp;</span>
                            </td>
                        </tr>
                    </table>
                    <div id='artifacts'>
                        <?=HTML::artifact_table($page->unit->artifact_type)?>
                        <?=HTML::artifact_table($page->unit->artifact_element)?>
                    </div>
                </article> <!-- #profile -->
                <article id='current_runes'>
<?php
                    $show_list = [6, 1, 2, 5, 4, 3];
                    //foreach ($page->unit->rune as $rune){
                    foreach ($show_list as $i){
                        $rune = $page->unit->rune[$i - 1];
                        $total_runes ++;
?>
                        <?=HTML::rune_table($rune)?>
<?php
                        if ($i == 2){
?>
                            <br/>
<?php
                        }
                    }
?>
                </article>
            </section> <!-- runes -->
            <section id='parameters' class='content'>
                <h2>
                    Optimization parameters
                </h2>
                <article>
                    <table id='parameters'>
                        <tr>
                            <td class='name'>
                                Rune sets
                            </td>
                            <td class='value'>
<?php
                                $reflect = new ReflectionClass("RUNE_SET_ID");
?>
                                <select id='set_1'>
<?php
                                foreach($reflect->getConstants() as $name => $id){
                                    $selected = "";
                                    if ($id == $sets[0]){
                                        $selected = "selected='selected'";
                                    }
?>
                                    <option value='<?=$id?>' <?=$selected?>><?=substr($name, 0, 7)?></option>
<?php
                                }
?>
                                </select>
                                <select id='set_2'>
<?php
                                foreach($reflect->getConstants() as $name => $id){
                                    $selected = "";
                                    if ($id == $sets[1]){
                                        $selected = "selected='selected'";
                                    }
?>
                                    <option value='<?=$id?>' <?=$selected?>><?=substr($name, 0, 7)?></option>
<?php
                                }
?>
                                </select>
                                <select id='set_3'>
                                    <option value='' <?=$selected?>></option>
<?php
                                foreach($reflect->getConstants() as $name => $id){
                                    $selected = "";
                                    if ($id == $sets[2]){
                                        $selected = "selected='selected'";
                                    }
?>
                                    <option value='<?=$id?>' <?=$selected?>><?=substr($name, 0, 7)?></option>
<?php
                                }
?>
                                </select>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min HP
                            </td>
                            <td class='value'>
                                <input id='min_hp' type='range' value='<?=$page->unit->total_hp?>' min='<?=$page->unit->hp?>' max='50000' oninput='updateMinValue("hp", this);'>
                                <input type='number' id='lbl_min_hp' value='<?=$page->unit->total_hp?>' min='<?=$page->unit->hp?>' max='50000' onChange='updateMinValue("hp", this);'></input></input><span class='slider_percent'> </span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("hp");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("hp");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='name'>
                                Even slots
                            </td>
                            <td class='value'>
                                <select id='slot_2'>
                                    <option value='<?=RUNE_STAT_ID::HP_P?>' <?=($mains[0] == RUNE_STAT_ID::HP_P) ? ("selected='selected'") : ("");?>>HP%</option>
                                    <option value='<?=RUNE_STAT_ID::ATK_P?>' <?=($mains[0] == RUNE_STAT_ID::ATK_P) ? ("selected='selected'") : ("");?>>ATK%</option>
                                    <option value='<?=RUNE_STAT_ID::DEF_P?>' <?=($mains[0] == RUNE_STAT_ID::DEF_P) ? ("selected='selected'") : ("");?>>DEF%</option>
                                    <option value='<?=RUNE_STAT_ID::SPD?>' <?=($mains[0] == RUNE_STAT_ID::SPD) ? ("selected='selected'") : ("");?>>SPD</option>
                                </select>
                                <select id='slot_4'>
                                    <option value='<?=RUNE_STAT_ID::HP_P?>' <?=($mains[1] == RUNE_STAT_ID::HP_P) ? ("selected='selected'") : ("");?>>HP%</option>
                                    <option value='<?=RUNE_STAT_ID::ATK_P?>' <?=($mains[1] == RUNE_STAT_ID::ATK_P) ? ("selected='selected'") : ("");?>>ATK%</option>
                                    <option value='<?=RUNE_STAT_ID::DEF_P?>' <?=($mains[1] == RUNE_STAT_ID::DEF_P) ? ("selected='selected'") : ("");?>>DEF%</option>
                                    <option value='<?=RUNE_STAT_ID::CRR?>' <?=($mains[1] == RUNE_STAT_ID::CRR) ? ("selected='selected'") : ("");?>>CRR</option>
                                    <option value='<?=RUNE_STAT_ID::CRR?>' <?=($mains[1] == RUNE_STAT_ID::CRD) ? ("selected='selected'") : ("");?>>CRD</option>
                                </select>
                                <select id='slot_6'>
                                    <option value='<?=RUNE_STAT_ID::HP_P?>' <?=($mains[2] == RUNE_STAT_ID::HP_P) ? ("selected='selected'") : ("");?>>HP%</option>
                                    <option value='<?=RUNE_STAT_ID::ATK_P?>' <?=($mains[2] == RUNE_STAT_ID::ATK_P) ? ("selected='selected'") : ("");?>>ATK%</option>
                                    <option value='<?=RUNE_STAT_ID::DEF_P?>' <?=($mains[2] == RUNE_STAT_ID::DEF_P) ? ("selected='selected'") : ("");?>>DEF%</option>
                                    <option value='<?=RUNE_STAT_ID::ACC?>' <?=($mains[2] == RUNE_STAT_ID::ACC) ? ("selected='selected'") : ("");?>>ACC</option>
                                    <option value='<?=RUNE_STAT_ID::RES?>' <?=($mains[2] == RUNE_STAT_ID::RES) ? ("selected='selected'") : ("");?>>RES</option>
                                </select>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min ATK
                            </td>
                            <td class='value'>
                                <input id='min_attack' type='range' value='<?=$page->unit->total_attack?>' min='<?=$page->unit->attack?>' max='4000' oninput='updateMinValue("attack", this);'>
                                <input type='number' id='lbl_min_attack' value='<?=$page->unit->total_attack?>' min='<?=$page->unit->attack?>' max='4000' onChange='updateMinValue("attack", this);'></input><span class='slider_percent'> </span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("attack");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("attack");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='name'>
                                Use runes from
                            </td>
                            <td class='value'>
                                <select id='rune_source'>
                                    <option value='0'>Storage only</option>
                                    <option value='1'>Units in no teams</option>
                                    <option value='2'>Units in teams with 0 score</option>
                                    <option value='3'>Units with lower overall score</option>
                                    <option value='4'>All runes</option>
                                </select>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min DEF
                            </td>
                            <td class='value'>
                                <input id='min_defense' type='range' value='<?=$page->unit->total_defense?>' min='<?=$page->unit->defense?>' max='4000' oninput='updateMinValue("defense", this);'>
                                <input type='number' id='lbl_min_defense' value='<?=$page->unit->total_defense?>' min='<?=$page->unit->defense?>' max='4000' onChange='updateMinValue("defense", this);'></input><span class='slider_percent'> </span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("defense");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("defense");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='name'>
                                Tune optimizer for
                            </td>
                            <td class='value'>
                                <select id='tuning'>
                                    <option value='0'>Rune current levels</option>
                                    <option value='1'>+12</option>
                                    <option value='2'>2/4/6 +15, 1/3/5 + 12</option>
                                    <option value='3'>+15</option>
                                </select>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min SPD
                            </td>
                            <td class='value'>
                                <input id='min_speed' type='range' value='<?=$page->unit->total_speed?>' min='<?=$page->unit->speed?>' max='400' oninput='updateMinValue("speed", this);'>
                                <input type='number' id='lbl_min_speed' value='<?=$page->unit->total_speed?>' min='<?=$page->unit->speed?>' max='400' onChange='updateMinValue("speed", this);'></input><span class='slider_percent'> </span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("speed");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("speed");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='empty'>
                                Max. combinations
                            </td>
                            <td class='empty'>
                                <input id='limit' type='number' value='10' max='100' min='1'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min CRR
                            </td>
                            <td class='value'>
                                <input id='min_crit_rate' type='range' value='<?=$page->unit->total_crit_rate?>' min='<?=$page->unit->crit_rate?>' max='100' oninput='updateMinValue("crit_rate", this);'>
                                <input type='number' id='lbl_min_crit_rate' value='<?=$page->unit->total_crit_rate?>' min='<?=$page->unit->crit_rate?>' max='100' onChange='updateMinValue("crit_rate", this);'></input><span class='slider_percent'>%</span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("crit_rate");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("crit_rate");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min CRD
                            </td>
                            <td class='value'>
                                <input id='min_crit_damage' type='range' value='<?=$page->unit->total_crit_damage?>' min='<?=$page->unit->crit_damage?>' max='400' oninput='updateMinValue("crit_damage", this);'>
                                <input type='number' id='lbl_min_crit_damage' value='<?=$page->unit->total_crit_damage?>' min='<?=$page->unit->crit_damage?>' max='400' onChange='updateMinValue("crit_damage", this);'></input><span class='slider_percent'>%</span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("crit_damage");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("crit_damage");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min ACC
                            </td>
                            <td class='value'>
                                <input id='min_accuracy' type='range' value='<?=$page->unit->total_accuracy?>' min='<?=$page->unit->accuracy?>' max='85' oninput='updateMinValue("accuracy", this);'>
                                <input type='number' id='lbl_min_accuracy' value='<?=$page->unit->total_accuracy?>' min='<?=$page->unit->accuracy?>' max='85' onChange='updateMinValue("accuracy", this);'></input><span class='slider_percent'>%</span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("accuracy");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("accuracy");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min RES
                            </td>
                            <td class='value'>
                                <input id='min_resistance' type='range' value='<?=$page->unit->total_resistance?>' min='<?=$page->unit->resistance?>' max='85' oninput='updateMinValue("resistance", this);'>
                                <input type='number' id='lbl_min_resistance' value='<?=$page->unit->total_resistance?>' min='<?=$page->unit->resistance?>' max='85' onChange='updateMinValue("resistance", this);'></input><span class='slider_percent'>%</span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("resistance");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("resistance");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min EHP
                            </td>
                            <td class='value'>
                                <input id='min_ehp' type='range' value='<?=$page->unit->effective_hp?>' min='0' max='200000' oninput='updateMinValue("ehp", this);'>
                                <input type='number' id='lbl_min_ehp' value='<?=$page->unit->effective_hp?>' min='0' max='200000' onChange='updateMinValue("ehp", this);'></input><span class='slider_percent'> </span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("ehp");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("ehp");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>
                        <tr>
                            <td class='action'>
                                <input id='apply' type='button' value='Apply' onClick='apply();'/>
                                <input id='apply' type='button' value='DEBUG' onClick='debug();'/>
                            </td>
                            <td class='empty'>
                                <img id='wait' src='<?=URL::IMG["ICON"] . "wait.gif";?>'>
                            </td>
                            <td class='empty'>
                            </td>
                            <td class='name'>
                                Min DMG
                            </td>
                            <td class='value'>
                                <input id='min_dmg' type='range' value='<?=$page->unit->effective_dmg?>' min='0' max='7000' oninput='updateMinValue("dmg", this);'>
                                <input type='number' id='lbl_min_dmg' value='<?=$page->unit->effective_dmg?>' min='0' max='7000' onChange='updateMinValue("dmg", this);'></input><span class='slider_percent'> </span>
                                <a title='Remove filter' class='filter_control a_button' onclick='removeFilter("dmg");'>
                                    <img alt='Remove filter' src='<?=URL::IMG["ICON"]?>nok.png'/>
                                </a>
                                <a title='Reset filter' class='filter_control a_button' onclick='resetFilter("dmg");'>
                                    <img alt='Reset filter' src='<?=URL::IMG["ICON"]?>edit.png'/>
                                </a>
                            </td>
                        </tr>


                    </table>
                </article>
            </section>
            <section id='results' class='content'>
                <h2>
                    Optimization results
                </h2>
                <article>
                    <div id='results_info'>
                        <span id='num_results'></span> results (<span id='num_skipped'></span> skipped) in <span id='num_seconds'></span> seconds
                    </div>
                    <table id='table_optimizations'>
                        <tbody id='optimizations'>
                        </tbody>
                    </table>
                </article>
            </section>
        </main>
        <div id='message_container'>
            <section class='content'>
                <h2 id='message_title'>
                    Message
                </h2>
                <article>
                    <p id='message_text'>
                        Message Text
                    </p>
                </article>
                <input type='button' value='OK' id='message_button' onclick='closeMessage();'/>
            </section>
        </div>
<?php
        include __DIR__ . "/inc/footer.php";
?>
    </body>
</html>