forked from pyalot/WebGL-City-SSAO
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
127 lines (123 loc) · 7.75 KB
/
index.html
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
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<!doctype html>
<!--
:copyright: 2011 by Florian Boesch <[email protected]>.
:license: GNU AGPL3, see LICENSE for more details.
-->
<html>
<head>
<link rel="stylesheet" type="text/css" href="jquery/css/ui-darkness/jquery-ui-1.8.11.custom.css"/>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script type="text/javascript" src="jquery/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="jquery/js/jquery-ui-1.8.11.custom.min.js"></script>
<script type="text/javascript" src="jquery/jquery.cookie.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">google.load('visualization', '1', {packages:['gauge']});</script>
<!-- glee -->
<script type="text/javascript" src="glee/glee.js"></script>
<script type="text/javascript" src="glee/matrix.js"></script>
<script type="text/javascript" src="glee/vector.js"></script>
<script type="text/javascript" src="glee/cube.js"></script>
<script type="text/javascript" src="glee/sphere.js"></script>
<script type="text/javascript" src="glee/plane.js"></script>
<script type="text/javascript" src="glee/shader.js"></script>
<script type="text/javascript" src="glee/vbo.js"></script>
<script type="text/javascript" src="glee/model.js"></script>
<script type="text/javascript" src="glee/resources.js"></script>
<script type="text/javascript" src="glee/schedule.js"></script>
<script type="text/javascript" src="glee/clock.js"></script>
<script type="text/javascript" src="glee/texture.js"></script>
<script type="text/javascript" src="glee/cubemap.js"></script>
<script type="text/javascript" src="glee/renderbuffer.js"></script>
<script type="text/javascript" src="glee/fbo.js"></script>
<script type="text/javascript" src="glee/processor.js"></script>
<script type="text/javascript" src="glee/error.js"></script>
<script type="text/javascript" src="glee/keys.js"></script>
<script type="text/javascript" src="glee/viewpoint.js"></script>
<script type="text/javascript" src="glee/picks.js"></script>
<!-- app -->
<script type="text/javascript" src="census.js"></script>
<script type="text/javascript" src="util.js"></script>
<script type="text/javascript" src="sky/sky.js"></script>
<script type="text/javascript" src="normaldepth/normaldepth.js"></script>
<script type="text/javascript" src="mix/mix.js"></script>
<script type="text/javascript" src="ssao/ssao.js"></script>
<script type="text/javascript" src="blur/blur.js"></script>
<script type="text/javascript" src="statistic.js"></script>
<script type="text/javascript" src="scene/scene.js"></script>
<script type="text/javascript" src="shadow/shadow.js"></script>
<script type="text/javascript" src="graph.js"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<!-- a href="http://github.com/pyalot/WebGL-City-SSAO"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://a248.e.akamai.net/assets.github.com/img/6429057dfef9e98189338d22e7f6646c6694f032/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f6c6566745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub"></a -->
<div class="content">
<div class="left">
<canvas class="demo" width="1024" height="640"></canvas>
<div class="tree">
<table>
<tr>
<td>
<div class="node">
<input type="checkbox" id="enable-ssao1" name="enable"><label for="enable-ssao1">SSAO 1</label>
<input type="radio" id="edit-ssao1" value="ssao1" name="edit"><label for="edit-ssao1">Properties</label>
<input type="radio" id="view-ssao1" name="view"><label for="view-ssao1">View</label>
</div>
</td>
</tr>
<tr>
<td class="down"><img src="down.png"></td>
</tr>
<tr>
<td>
<div class="node">
<input checked="checked" type="radio" value="avg" id="avg-combine" name="combine"><label for="avg-combine">Avg</label>
<input type="radio" id="min-combine" value="min" name="combine"><label for="min-combine">Min</label>
<input type="radio" id="max-combine" value="max" name="combine"><label for="max-combine">Max</label>
<input type="radio" id="top-combine" value="top" name="combine"><label for="top-combine">Top</label>
<input type="radio" id="bot-combine" value="bot" name="combine"><label for="bot-combine">Bot</label>
<input type="radio" id="mul-combine" value="mul" name="combine"><label for="mul-combine">Mul</label>
<input type="radio" id="view-combine" name="view"><label for="view-combine">View</label>
</div>
</td>
<td class="right"><img src="right.png"></td>
<td>
<div class="node">
<input type="checkbox" id="enable-blur3" name="enable"><label for="enable-blur3">Blur</label>
<input type="radio" id="edit-blur3" value="blur3" name="edit"><label for="edit-blur3">Properties</label>
<input type="radio" id="view-blur3" name="view"><label for="view-blur3">View</label>
</div>
</td>
<td class="right"><img src="right.png"></td>
<td>
<div class="node">
<input checked="checked" type="radio" id="edit-scene" value="scene" name="edit"><label for="edit-scene">Scene</label>
<input checked="checked" type="radio" id="view-scene" name="view"><label for="view-scene">View</label>
</div>
</td>
</tr>
<tr>
<td class="up"/><img src="up.png"><td/>
</tr>
<tr>
<td>
<div class="node">
<input type="checkbox" id="enable-ssao2" name="enable"><label for="enable-ssao2">SSAO 2</label>
<input type="radio" id="edit-ssao2" value="ssao2" name="edit"><label for="edit-ssao2">Properties</label>
<input type="radio" id="view-ssao2" name="view"><label for="view-ssao2">View</label>
</div>
</td>
</tr>
</table>
</div>
</div>
<div class="right">
<div id="status">
<h1>Performance</h1>
<div id="gauge"></div>
<canvas width="150" height="120" class="graph"></canvas>
</div>
<div id="properties"></div>
</div>
</div>
</body>
</html>