-
Notifications
You must be signed in to change notification settings - Fork 48
/
index.html
138 lines (94 loc) · 5.97 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
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=0.75">
<link rel="icon" type="image/png" href="./assets/icons/app-logo-128x128.png">
<link rel="icon" type="image/png" sizes="192x192" href="./assets/icons/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="./assets/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="./assets/icons/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="./assets/icons/favicon-16x16.png">
<link rel="icon" type="image/ico" href="./assets/icons/favicon.ico">
<link rel="apple-touch-icon" sizes="57x57" href="./assets/icons/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="./assets/icons/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="./assets/icons/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="./assets/icons/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="./assets/icons/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="./assets/icons/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="./assets/icons/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="./assets/icons/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="./assets/icons/apple-icon-180x180.png">
<title>Beyond Reality Face SDK - BRFv5 - Face Tracking for Browser/JavaScript</title>
<style>
html, body {
margin: 0; padding: 0; width: 100vw; height: 100vw; background-color: #ffffff;
-ms-text-size-adjust: none; -moz-text-size-adjust: none; -webkit-text-size-adjust: none;
}
</style>
<link rel="stylesheet" type="text/css" href="./js/highlight/highlight_tomorrow.css">
<script src="./js/highlight/highlight.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./css/brfv5_examples.css">
<link rel="stylesheet" type="text/css" href="./css/brfv5_select.css">
</head>
<body>
<div id="__brfv5" class="__brfv5">
<div class="fixed tr10 ontop o6" style="width: 256px">
<div class="__brfv5_select_container">
<label for="__brfv5_select_example"></label>
<select id="__brfv5_select_example">
<!-- See js/examples/, all examples use the camera setup (setup__camera__example.js) -->
<option value="face_detection__basics">Face Detection (Basics)</option>
<option value="face_detection__details">Face Detection (Details)</option>
<option value="face_detection__small_faces">Face Detection (Small faces)</option>
<option value="face_tracking__track_one_face" selected>Face Tracking (1 face)</option>
<option value="face_tracking__track_two_faces">Face Tracking (2 faces)</option>
<option value="face_tracking__choose_model">Choosing The Right Model</option>
<option value="face_tracking__region_of_interest">Region of Interest</option>
<option value="face_tracking__blink_detection">Blink Detection (1 face)</option>
<option value="face_tracking__smile_detection">Smile Detection (1 face)</option>
<option value="face_tracking__yawn_detection">Yawn Detection (1 face)</option>
<option value="face_tracking__face_extended#1">Extended Face Shape (1 face)</option>
<option value="face_tracking__face_extended#2">Extended Face Shape (2 faces)</option>
<option value="face_tracking__coloring_libs#1">Coloring Lips (1 face)</option>
<option value="face_tracking__coloring_libs#2">Coloring Lips (2 faces)</option>
<option value="face_tracking__png_overlay#1">PNG Overlay (1 face)</option>
<option value="face_tracking__png_overlay#2">PNG Overlay (2 faces)</option>
<!-- if face_tracking__threejs_overlay is manually set selected, 42l type model
will be loaded and some examples won't work as intended. Choose any other
examples (selected) to also set 68l type model for ThreeJS. -->
<option value="face_tracking__threejs_overlay#1">ThreeJS Overlay (1 face)</option>
<option value="face_tracking__threejs_overlay#2">ThreeJS Overlay (2 faces)</option>
<option value="face_tracking__texture_overlay#1">Texture Overlay (1 face)</option>
<option value="face_tracking__texture_overlay#2">Texture Overlay (2 faces)</option>
<option value="face_tracking__texture_exporter">Texture Exporter</option>
<option value="face_tracking__texture_overlay_extended#1">Texture Overlay Extended (1 face)</option>
<option value="face_tracking__texture_overlay_extended#2">Texture Overlay Extended (2 faces)</option>
<option value="face_tracking__texture_exporter_extended">Texture Exporter Extended</option>
<option value="face_tracking__face_swap">Face Swap (2 faces)</option>
</select>
</div>
<div class="__brfv5_select_container">
<label for="__brfv5_select_setup"></label>
<select id="__brfv5_select_setup">
<option value="camera" selected>Setup Camera</option>
<option value="image">Setup Image</option>
</select>
</div>
<div class="__brfv5_select_container">
<label for="__brfv5_select_image"></label>
<select id="__brfv5_select_image">
<option value="brfv5_portrait_marcel.jpg" selected>Marcel (1 face)</option>
<option value="brfv5_portrait_chris.jpg">Chris (1 face)</option>
<option value="brfv5_two_faces.jpg">Marcel and Chris (2 faces)</option>
<option value="brfv5_woman_old.jpg">Old woman (1 faces)</option>
<option value="brfv5_women_young.jpg">Two women (2 faces)</option>
</select>
</div>
</div>
<div id='__brfv5__code_container' class="swl mc bg-pb">
<pre><code class="javascript" id="__brfv5_code"></code></pre>
</div>
</div>
<script src="js/examples/setup__selects.js"></script>
</body>
</html>