-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
100 lines (88 loc) · 3.45 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
<!doctype html>
<html>
<head>
<title>SmartMirror - RAID</title>
<link rel="stylesheet" href="css/home.css" type="text/css" />
<link rel="stylesheet" href="css/overlays.css" type="text/css" />
<link rel="stylesheet" href="css/weather.css" type="text/css" />
<link rel="stylesheet" href="css/slider.css" type="text/css" />
<link rel="stylesheet" href="css/standby.css" type="text/css" />
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/webcam_mirror.js"></script>
<script src="js/swipe_overlays.js"></script>
<script src="js/weather/jquery.simpleWeather.js"></script>
<script src="js/weather/weather.js"></script>
<script src="js/tracking-min.js"></script>
<script src="js/point-detection.js"></script>
<script src="js/ccv.js"></script>
<script src="js/face.js"></script>
<script src="js/face-detection.js"></script>
</head>
<body>
<div class="layer-container set-deimention">
<div class="layer">
<video id="webcam_video" height="800" preload autoplay loop muted></video>
</div>
<div class="layer">
<canvas id="pointTrackDebug" height="800"></canvas>
</div>
<div class="layer">
<canvas id="faceTrackDebug" height="800"></canvas>
</div>
<div class="layer" id="standby-screen">
<div class="raid-logo">
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="81mm" height="37mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewbox="0 0 8100 3700" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<style type="text/css">
<![CDATA[
.white {fill:#FEFEFE}
.red {fill:#C33438}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<g id="_2221279186320">
<polygon class="red" points="3674,3109 4053,3677 5000,3677 2727,77 2727,3677 3674,3677 "/>
<polygon class="red" points="6327,3677 5379,3677 3106,77 4053,77 "/>
<polygon class="red" points="3674,3109 4053,3677 5000,3677 2727,77 2727,3677 3674,3677 "/>
<polygon class="red" points="6327,3677 5379,3677 3106,77 4053,77 "/>
<path class="white" d="M4432 77l2274 3600c994,0 1387,-806 1387,-1800 0,-994 -806,-1800 -1800,-1800l-1861 0z"/>
<path class="white" d="M800 2588l-726 1089 947 0 379 -568 0 568 948 0 0 -1344 0 -1857 0 -399 -948 0c-732,0 -1326,594 -1326,1327 0,517 295,965 726,1184z"/>
</g>
</g>
</svg>
</div>
</div>
<div class="layer" id="overlay-container">
<div class="overlay">
<div id="dateTime">
<div id="time">00:00</div>
<div id="date">day/month year day</div>
</div>
<div id="fadedBackgroundTime">
<div id="backgroundTime">88:88</div>
</div>
</div>
<div class="overlay">
<div id="weather">
<img src="img/weatherTypes/rain.png" alt="weatherImg" />
<div id="location"></div>
<div id="temperature"></div>
<div id="wind"></div>
</div>
</div>
<div class="overlay">
<div id="calandar">
<!-- Rounded switch -->
<label class="switch">
<input type="checkbox">
<div class="slider round"></div>
</label>
</div>
</div>
</div>
</div>
</body>
</html>