-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
120 lines (110 loc) · 6.28 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
<!DOCTYPE html>
<html lang="eu" data-theme="light">
<head>
<link rel="stylesheet" type="text/css" href="resources/css/style.css">
<link rel="stylesheet" type="text/css" href="resources/css/mediaqueries.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/mousetrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js.cookie.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/toolcool-range-slider.min.js"></script>
<script src="https://kit.fontawesome.com/cc9f7fa694.js" crossorigin="anonymous"></script>
<script src="./resources/js/index.js"></script>
<title>PTZ-Optics - Main</title>
</head>
<body ondragstart="return false">
<section id='header'>
<div class="linkContainer">
<a href='javascript:transition("none","./assignPresets.php")' class="navLink">Assign Presets</a>
</div>
<div id='logoBox'>
<div id="logo"></div>
<h1 id='title'>PTZ-OPTICS</h1>
</div>
<div class="linkContainer">
<a href='javascript:transition("none","./preferenceMenu.html")' class="navLink">Preferences</a>
</div>
</section>
<a href='#' id='infoLink'><i class='ion-ios-information'></i></a>
<a href="#" class="transitionLink" id="leftTransitionLink" onClick="javascript:transition('left','./assignPresets.php')"><i class="fa-solid fa-circle-chevron-left fa-lg"></i></a>
<a href="#" class="transitionLink" id="rightTransitionLink" onClick="javascript:transition('right','./preferenceMenu.html')"><i class="fa-solid fa-circle-chevron-right fa-lg"></i></a>
<section id='wrapper'>
<section id='prevContainer'>
<div id='preview'>
<img id="presetPreview">
</div>
</section>
<section id='ctrlContainer'>
<div id='controls'>
<div id='slidersContainer'>
<div id='zoom'>
<a href='#' class='zoom plus'><i class="fa-solid fa-plus fa-xl" style="color: #91a0a8"></i></a>
<tc-range-slider class="q a"
theme="slider"
css-links="./resources/css/style.css"
type="vertical"
btt="true"
slider-width="8px"
slider-height="140px"
pointer-width="30px"
pointer-height="30px"
pointer-bg="#fff url(./resources/images/zoom.svg) no-repeat 50% 50%"
generate-labels="true"
value="50"
id="zoomSlider">
</tc-range-slider>
<a href='#' class='zoom minus'><i class="fa-solid fa-minus fa-xl" style="color: #91a0a8"></i></a>
</div>
<div id='focus'>
<a href='#' class='focus plus'><i class="fa-solid fa-plus fa-xl" style="color: #91a0a8"></i></a>
<tc-range-slider class="w s"
theme="slider"
css-links="./resources/css/style.css"
type="vertical"
btt="true"
slider-width="8px"
slider-height="140px"
pointer-width="30px"
pointer-height="30px"
pointer-bg="#fff url(./resources/images/focus.svg) no-repeat 50% 50%"
generate-labels="true"
value="50"
id="focusSlider">
</tc-range-slider>
<a href='#' class='focus minus'><i class="fa-solid fa-minus fa-xl" style="color: #91a0a8"></i></a>
</div>
</div>
<div id='ptzContainer'>
<div class="grid-container control">
<div class='up ctrlBtn'><a href='#' class='ptzButton' id='up'><i class="fa-solid fa-caret-up fa-3x"></i></a></div>
<div class='left ctrlBtn'><a href='#' class='ptzButton' id='left'><i class="fa-solid fa-caret-left fa-3x"></i></a></div>
<div class='home ctrlBtn'><a href='#' class='ptzButton' id='esc'><i class="fa-solid fa-house fa-2x"></i></a></div>
<div class='right ctrlBtn'><a href='#' class='ptzButton' id='right'><i class="fa-solid fa-caret-right fa-3x"></i></a></div>
<div class='down ctrlBtn'><a href='#' class='ptzButton' id='down'><i class="fa-solid fa-caret-down fa-3x"></i></a></div>
</div>
</div>
</div>
</section>
<section id='pstContainer'>
<div id='presets'>
<div id='presetTitleContainer'>
<h1 id='presetTitle1'>Presets</h1>
</div>
<div id='pstBtnContainer'>
<div class="grid-container presets">
<div class='pstBtn'><a href='#' id='pst1' class='presetButton'>1</a></div>
<div class='pstBtn'><a href='#' id='pst2' class='presetButton'>2</a></div>
<div class='pstBtn'><a href='#' id='pst3' class='presetButton'>3</a></div>
<div class='pstBtn'><a href='#' id='pst4' class='presetButton'>4</a></div>
<div class='pstBtn'><a href='#' id='pst5' class='presetButton'>5</a></div>
<div class='pstBtn'><a href='#' id='pst6' class='presetButton'>6</a></div>
<div class='pstBtn'><a href='#' id='pst7' class='presetButton'>7</a></div>
<div class='pstBtn'><a href='#' id='pst8' class='presetButton'>8</a></div>
<div class='pstBtn'><a href='#' id='pst9' class='presetButton'>9</a></div>
<div class='clearPresets'><a href='#' id='clearBtn'>Clear Presets</a></div>
</div>
</div>
</div>
</section>
</section>
</body>
</html>