dario.genga/FE_Charts
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add comparator of characters

Browse Source 
The user can now compare the stats of multiple characters with two
graph (column graph and polar spider).

Small refactor of the displayPolarSpider function to work in all pages.
This commit is contained in:
dario-cfpt
2020-01-28 08:33:46 +01:00
parent 824e7eb784
commit 2baa70c2c2
8 changed files with 205 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
mobile/www/pages/comparator.html
View File

@ -1,19 +1,54 @@
<div class="view safe-areas">
<div class="page">
<div class="navbar">
<div class="navbar-inner">
<div class="left">
<a href="#" class="link icon-only panel-open" data-panel="left">
<i class="icon f7-icons ios-only">menu</i>
<i class="icon material-icons md-only">menu</i>
</a>
</div>
<div class="title sliding">Fire Emblem Charts</div>
<div class="page page-comparator">
<div class="navbar">
<div class="navbar-inner">
<div class="left">
<a href="#" class="link icon-only panel-open" data-panel="left">
<i class="icon f7-icons ios-only">menu</i>
<i class="icon material-icons md-only">menu</i>
</a>
</div>
<div class="title sliding">Comparator</div>
</div>
<div class="page-content">
<div class="block block-strong">
<p>Comparator page</p>
</div>
<div class="page-content">
<div class="card data-table data-table-collapsible data-table-init">
<table id="table-comparator">
<thead id="table-comparator-header">
<tr>
<th>Character</th>
<th>Class</th>
</tr>
</thead>
<tbody id="table-comparator-content">
</tbody>
</table>
<button id="btn-compare" class="button button-fill">Compare</button>
<a class="item-link smart-select smart-select-init" data-open-in="popup" data-searchbar="true" data-searchbar-placeholder="Search a character...">
<select id="select-compare" multiple maxlength="8">
</select>
<div class="item-content" hidden>
<div class="item-inner">
<div class="item-title">Comparator</div>
</div>
</div>
</a>
</div>
<div class="list no-hairlines-md">
<ul>
<li class="item-content item-input">
<div class="item-media">
<i class="icon demo-list-icon"></i>
</div>
</li>
</ul>
<figure class="highcharts-figure">
<div id="container-comparator"></div>
</figure>
<div class="block">
<p class="segmented segmented-raised segmented-round">
<button id="btn-graph-column-chart" class="button button-round button-active">Column chart</button>
<button id="btn-graph-spider-web" class="button button-round">Spider web</button>
</p>
</div>
</div>
</div>