summaryrefslogtreecommitdiff
path: root/index.html
blob: 8c27089b3502a928c70a22a228d9257309229a66 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html>
<meta charset="utf-8">
<title>Manavis</title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link rel="stylesheet" type="text/css" href="js/dc/test/dc.css" />

<div id="body">
  <div id="side">
    <!-- Sketch things out. While this is technically functional and useful for prototyping, the sheer number of dimensions required will slow things to a standstill. -->
    <div class="chart-root">
      <h3>Experience gain instances by Stat Allocation</h3>
      <table>
        <tr>
          <th></th>
          <th>AGI</th>
          <th>VIT</th>
          <th>INT</th>
          <th>DEX</th>
          <th>LUK</th>
        <tr>
        <tr>
          <th>STR</th>
          <td><div id="agi-str" class="blob"></div></td>
          <td><div id="vit-str" class="blob"></div></td>
          <td><div id="int-str" class="blob"></div></td>
          <td><div id="dex-str" class="blob"></div></td>
          <td><div id="luk-str" class="blob"></div></td>
        </tr>
        <tr>
          <th>AGI</th>
          <td></td>
          <td><div id="vit-agi" class="blob"></div></td>
          <td><div id="int-agi" class="blob"></div></td>
          <td><div id="dex-agi" class="blob"></div></td>
          <td><div id="luk-agi" class="blob"></div></td>
        </tr>
        <tr>
          <th>VIT</th>
          <td></td>
          <td></td>
          <td><div id="int-vit" class="blob"></div></td>
          <td><div id="dex-vit" class="blob"></div></td>
          <td><div id="luk-vit" class="blob"></div></td>
        </tr>
        <tr>
          <th>INT</th>
          <td></td>
          <td></td>
          <td></td>
          <td><div id="dex-int" class="blob"></div></td>
          <td><div id="luk-int" class="blob"></div></td>
        </tr>
        <tr>
          <th>DEX</th>
          <td></td>
          <td></td>
          <td></td>
          <td></td>
          <td><div id="luk-dex" class="blob"></div></td>
        </tr>
      </table>
    </div>
    <div id="player-chart" class="chart-root">
      <h3>Experience gain instances by Character ID <span class="help" title="Older to newer characters appear left to right, respectively.">[?]</span> <a class="reset" style="display: none;" href="javascript:mv.pcChart.filterAll();dc.redrawAll();">clear</a></h3>
    </div>
    <div id="blvl-chart" class="chart-root">
      <h3>Experience gain instances by Character Base Level <a class="reset" style="display: none;" href="javascript:mv.blvlChart.filterAll();dc.redrawAll();">clear</a></h3>
    </div>
  </div>
  <div id="main">
<!--    <div id="status">
      Manavis
      TODO: Load icons et al for when new records need loading?
    </div>-->
    <div id="mask"><noscript>Javascript is required for this website.</noscript>
      <div id="loadinfo" class="fader">
        <h3>Select records to load and display</h3>
        <input type="file" id="input" name="records[]" multiple />
        <output id="list"></output>
        <div id="filesbar" class="progressbar fader">
          <div class="percent">0%</div>
        </div>
        <div id="loadbar" class="progressbar fader">
          <div class="percent">0%</div>
        </div>
      </div>
    </div>
    <div id="date-chart" class="chart-root">
      <h3>Experience gain instances by Date <a class="reset" style="display: none;" href="javascript:mv.dateChart.filterAll();dc.redrawAll();">clear</a></h3>
    </div>
    <div id="map-chart" class="chart-root">
      <h3>Experience gain by Map <span class="help" title="Bubble size indicates instances of experience gain for that map. X axis position indicates the sum of level experience gain for that map. Y axis position indicates the sum of job experience gain for that map.">[?]</span> <a class="reset" style="display: none;" href="#">reset</a></h3>
    </div>
    <div id="def-chart" class="chart-root">
      <h3>Definedness of records <span class="help" title="If logs are missing between server boot and the logs provided, not all information will be available for all records. Definedness of records falls into three categories. Records with undefined data; records with well defined data, but mixed in with records having undefined data, limiting validity of inferences; and records after any uncertain times, which are fully well defined. It is highly recommended that you filter results to only include records which are in fully well defined times; however, this may not always be possible.">[?]</span> <a class="reset" style="display: none;" href="javascript:mv.defChart.filterAll();dc.redrawAll();">clear</a></h3>
    </div>
  </div>
</div>

<!-- Libs -->
<script src="js/util/memoize.js"></script>
<script src="js/util/progress.js"></script>
<script src="js/d3/d3.js"></script>
<script src="js/crossfilter/crossfilter.js"></script>
<script src="js/dc/dc.js"></script>

<!-- Components -->
<script src="js/comp/map.js"></script>
<script src="js/comp/stat.js"></script><!-- Depends on crossfilter for crossfilter.bisect -->

<!-- Processing -->
<script src="js/mv.js"></script>