| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271 |
- <?php
- /**
- * Optimizer teams view.
- *
- * Contains the view layout and ome code to present the data.
- *
- * @category View
- * @var Teams_Page $page The page model.
- * @var int $UID User 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'/>
- <?php
- if ($MODE == GAME_MODE_ID::RTA){
- ?>
- <link rel='stylesheet' type='text/css' href='<?=URL::CSS?>ui-rta.css'/>
- <?php
- }
- ?>
- <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>
- units = [];
- <?php
- $units_added = [];
- foreach ($page->teams as $team){
- foreach ($team->unit as $unit){
- if (!in_array($unit->id, $units_added)){
- array_push($units_added, $unit->id);
- $panel = json_encode("<div class='monster_panel'>" . HTML::unit_panel($unit) . "</div>");
- ?>
- units.push(
- {
- id: "<?=$unit->id?>",
- score: <?=$team->score?>,
- panel: <?=$panel?>
- }
- );
- <?php
- }
- else{
- // Find in array and increase score
- ?>
- for (let i = 0; i < units.length; i++) {
- if (units[i].id == "<?=$unit->id?>"){
- units[i].score += <?=$team->score?>;
- break;
- }
- }
- <?php
- }
- }
- }
- ?>
- /**
- * Changes the score of a team.
- *
- * @param team ID of the team to change.
- * @param score New score.
- * @return true on success, false on error.
- */
- function rateTeam(team, score){
-
- params = '?uid=<?=$UID?>&team=' + team + '&score=' + score;
- console.log(params);
- var xhttp = new XMLHttpRequest();
- xhttp.onreadystatechange = function() {
- if (this.readyState == 4){
- // TODO
- // Loop units array and set the new score
- calculateScores();
- }
- };
- xhttp.open('GET', '/action/rate_team/' + params, true);
- xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
- xhttp.send();
- return true;
- }
- /**
- * Redirect to a unit optimization page.
- *
- * @param unit ID of the unit to optimize.
- */
- function optimize(unit){
- window.location.href = "/<?=$UID?>/optimizer/" + unit;
- }
- /**
- * Builds the unitpriority table.
- *
- * Calculates the score of each unit acording to teams score, and
- * builds a sorted table enabling a link to optimization.
- */
- function calculateScores(){
- // Sort array, descending score
- units = units.sort(function(a, b){return b.score - a.score;});
- // Draw table
- const container = document.getElementById('unit_list');
- while (container.firstChild) {
- container.removeChild(container.lastChild);
- }
- let table = document.createElement('table');
- let tr = document.createElement('tr');
- let th = document.createElement('th');
- th.innerHTML = 'Unit';
- th.setAttribute('class', 'unit');
- tr.appendChild(th);
- th = document.createElement('th');
- th.setAttribute('class', 'score');
- th.innerHTML = 'Score';
- tr.appendChild(th);
- th = document.createElement('th');
- th.innerHTML = 'Action';
- th.setAttribute('class', 'action');
- tr.appendChild(th);
- table.appendChild(tr);
- var odd = 'odd';
- for (let i = 0; i < units.length; i++) {
- let tr = document.createElement('tr');
- let td = document.createElement('td');
- td.setAttribute('class', 'unit ' + odd);
- td.innerHTML = units[i].panel;
- tr.appendChild(td);
- td = document.createElement('td');
- td.setAttribute('class', 'score ' + odd);
- td.innerHTML = units[i].score;
- tr.appendChild(td);
- td = document.createElement('td');
- td.setAttribute('class', 'action ' + odd);
- btn = document.createElement('input');
- btn.setAttribute('type', 'button');
- btn.setAttribute('value', 'Optimize');
- btn.setAttribute('onclick', 'optimize("' + units[i].id + '")');
- td.appendChild(btn);
- tr.appendChild(td);
- table.appendChild(tr);
- if (odd == ''){
- odd = 'odd';
- }
- else{
- odd = '';
- }
- }
- container.appendChild(table);
- }
- </script>
- </head>
- <body onLoad='calculateScores();'>
- <?php
- include __DIR__ . "/inc/header.php";
- ?>
- <aside>
- <h2>
- Optimizer
- </h2>
- <p>
- Rate your teams and optimize the units that you use the most.
- <br/>
- <br/>
- <br/>
- To optimize units that are not on teams, do so from the <a href='/<?=$UID?>/monsters/'>monsters page</a>.
- </p>
- </aside>
- <main>
- <section class='content'>
- <h2>
- Teams
- </h2>
- <article>
- <table id='teams'>
- <tr>
- <th>
- Team
- </th>
- <th>
- Units
- </th>
- <th>
- Score
- </th>
- </tr>
- <?php
- $odd = "odd";
- foreach ($page->teams as $team){
- ?>
- <tr>
- <td class='team <?=$odd?>'>
- <?=$team->name?>
- </td>
- <td class='units <?=$odd?>'>
- <?php
- $prev_front = false;
- $front = "undefined";
- foreach ($team->unit as $unit){
- $front = in_array($unit->id, $team->frontline);
- if ($front != "undefined" && $prev_front != $front){
- ?>
- <hr class='frontline'/>
- <?php
- }
- ?>
- <a href='/<?=$UID?>/monsters/<?=$unit->id?>' target='_blank'>
- <div class='monster_panel'>
- <?=HTML::unit_panel($unit)?>
- <?php
- if ($unit->id == $team->leader){
- ?>
- <img alt='Leader' class='leader' src='<?=URL::IMG["ICON"]?>leader.png'/>
- <?php
- }
- ?>
- </div>
- </a>
- <?php
- $prev_front = $front;
- }
- ?>
- </td>
- <td class='score <?=$odd?>'>
- <input type='number' min='0' max='20' value='<?=$team->score?>' onChange='rateTeam(<?=$team->id?>, this.value);'/>
- </td>
- </tr>
- <?php
- if ($odd == ""){
- $odd = "odd";
- }
- else{
- $odd = "";
- }
- }
- ?>
- </table>
- <div id='unit_list'>
- </div>
- </article>
- </section> <!-- .list -->
- </main>
- <?php
- include __DIR__ . "/inc/footer.php";
- ?>
- </body>
- </html>
|