/
index.html
89 lines (88 loc) · 4.32 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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>TimeTubes Web</title>
<!-- change this up! http://www.bootstrapcdn.com/bootswatch/ -->
<!-- <link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.6/cosmo/bootstrap.min.css" type="text/css"-->
<!-- rel="stylesheet"/>-->
<!--<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>-->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<!--<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">-->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.2/js/jquery.tablesorter.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.2/js/jquery.tablesorter.widgets.min.js"></script>
<link href="https://bootswatch.com/4/sandstone/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<div id="app"></div>
<script src="client.min.js"></script>
<!-- <script src="js/slider.js"></script>-->
<script type="x-shader/x-vertex" id="vertexShader_tube">
precision mediump float;
attribute vec3 colorData;
attribute float selected;
varying vec3 vNormal;
varying vec3 vWorldPosition;
varying vec3 vColor;
varying float vSelected;
#include <clipping_planes_pars_vertex>
void main() {
#include <begin_vertex>
vNormal = normalMatrix * normal;
vec4 worldPosition = modelMatrix * vec4(position, 1.0);
vWorldPosition = worldPosition.xyz;
vColor = colorData;
vSelected = selected;
gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
#include <clipping_planes_vertex>
}
</script>
<script type="x-shader/x-fragment" id="fragmentShader_tube">
precision mediump float;
varying vec3 vNormal;
varying vec3 vWorldPosition;
varying vec3 vColor;
varying float vSelected;
uniform vec3 lightPosition;
uniform sampler2D texture;
uniform int tubeNum;
uniform bool shade;
uniform vec2 minmaxH;
uniform vec2 minmaxV;
uniform bool flagH;
uniform bool flagV;
#include <clipping_planes_pars_fragment>
void main()
{
#include <clipping_planes_fragment>
vec3 lightDirection = normalize(lightPosition - vWorldPosition);
vec2 T;
if (flagH)
T.x = (vColor.x - minmaxH.x) / (minmaxH.y - minmaxH.x);
else
T.x = 0.5;
if (flagV)
T.y = (vColor.y - minmaxV.x) / (minmaxV.y - minmaxV.x);
else
T.y = 0.5;
vec4 resultColor = texture2D(texture, T);
float c = max(0.0, dot(vNormal, lightDirection)) * 0.3;
float opacity = vColor.z;//1.0 / float(tubeNum);//vPositionx;//vWorldPosition.x;//1.0 / float(TUBE_NUM);
if (shade)
gl_FragColor = vec4(resultColor.r + c, resultColor.g + c, resultColor.b + c, opacity);
else
gl_FragColor = vec4(resultColor.r, resultColor.g, resultColor.b, opacity);
if (vSelected != 0.0) {
gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
}
}
</script>
</body>
</html>