summaryrefslogtreecommitdiff
path: root/public/index.html
blob: a016fb14a862532b58095f390e117cadf5e7153a (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
<!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" />

<body onload="mv.init();">
  <div id="vis" class="vis-hide">
    <div class="side med col3">
      <div id="connect-status">
        <h3>Manavis users</h3>
        <div id="users-status"></div>
      </div>
      <div id="blvl-chart">
        <h3>Character base level <a class="reset" style="display: none;" href="javascript:mv.charts.blvl.filterAll();dc.redrawAll();">clear</a></h3>
      </div>
      <div id="stat-chart">
        <h3>Stat allocation</h3>
      </div>
    </div>
    <div class="side thin col2">
      <div id="type-chart">
        <h3>Experience type <a class="reset" style="display: none;" href="javascript:mv.charts.type.filterAll();dc.redrawAll();">clear</a></h3>
      </div>
      <div id="killxp-charts">
        <div id="target-chart">
          <h3>Target <a class="reset" style="display: none;" href="javascript:mv.charts.target.filterAll();dc.redrawAll();">clear</a></h3>
        </div>
        <div id="wpn-chart">
          <h3>Weapon <a class="reset" style="display: none;" href="javascript:mv.charts.wpn.filterAll();dc.redrawAll();">clear</a></h3>
        </div>
        <div id="num-attackers-chart">
          <h3>Number of attackers <a class="reset" style="display: none;" href="javascript:mv.charts.numAttackers.filterAll();dc.redrawAll();">clear</a><h3>
        </div>
      </div>
    </div>
    <div id="main" class="col1">
      <div id="date-chart">
        <h3>Date <a class="reset" style="display: none;" href="javascript:mv.charts.date.filterAll();dc.redrawAll();">clear</a></h3>
      </div>
      <div id="map-chart">
        <h3>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="javascript:mv.charts.map.filterAll();dc.redrawAll();">clear</a></h3>
      </div>
    </div>
  </div>
  <div id="mask"><noscript><h1>Javascript is required for this website.</h1></noscript>
    <div id="loadinfo" class="fader">
      <h1>Manavis</h1>
      <p>Manavis shows experience gain from combat logs generated by The Mana World's server, tmwAthena.<p>
      <p>Manavis can operate in two modes, offline and online, depending on the selection of the checkbox below.</p>
      <p>While offline, you can still analyse everything yourself as you would normally.</p>
      <p>
        In online mode, active filters are made public, similar to multiplayer notepad or etherpad. This can help others understand manavis and the logs, and could be used to improve manavis and the game.
      </p>
      <p>
        Currently, all changes are applied from everyone in online mode.<br/>
        This can be inconvenient, and should be changed in the near future.
      </p>
      <input id="connect-option" name="connect" type="checkbox" checked></input>
      <label for="connect">Online mode</label>
      <h2>Select records to load and display</h2>
      <p>You can load any number of files at once.</p>
      <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>
</body>

<!-- 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>

<script src="/socket.io/socket.io.js"></script>

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

<!-- Processing -->
<script src="js/mv/chart.js"></script>
<script src="js/mv/connect.js"></script>
<script src="js/mv/heap.js"></script>
<script src="js/mv/load.js"></script>
<script src="js/mv/main.js"></script>
<script src="js/mv/parse.js"></script>
<script src="js/util/trellis-chart.js"></script>