-
Notifications
You must be signed in to change notification settings - Fork 3
/
miband4-selfie.html
67 lines (62 loc) · 2.75 KB
/
miband4-selfie.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=UTF-8 />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="Description" content="take photo with miband4">
<meta name="mobile-web-app-capable" content="yes">
<link rel="icon" sizes="192x192" href="favicon.png">
<title>Mi Band 4</title>
<style>
button>span {color:orange; border: 1px solid red;}
a[target] {position:absolute; right:4px}
</style>
</head>
<body>
<!-- <button title='Activate' onclick='if(audio.paused) audio.play(); else audio.pause()' style='position:absolute; right:4px; color:blue'>►</button> -->
<a href='https://github.com/dj0001/miband3-selfie/blob/master/miband4-selfie.html' target='g'>GitHub</a>
<aside> <!-- webcam here -->
<select >
<option>select source</option>
</select>
<select id='res'>
<option>VGA</option>
<option>HD</option>
</select>
<div id="container">
<video autoplay="true" id="videoElement"></video>
<a target="show" id="log"><canvas id="canvas"></canvas></a>
</div>
<div style='background:#cfd8dc'>
capture: <input type="number" name="update" min="1" value="600" size="3" title="interval">s File: <input type="text" name="fname" value="out" title="(path+)name">.
<select name="ft"><option>png</option><option selected>jpeg</option></select>
<button id="shot" disabled><span>🔍︎</span> start</button>
<select name="effect">
<option> none</option>
<option>◐gray</option>
<option>⇱zoom</option>
<option>↷rotate</option>
<option>⇤crop</option>
<option>⇢motion</option>
</select>
<!-- grayscale:<input type="checkbox" id="bw"> -->
Overlay: <input type="text" name="overlay" value="%D" title="%d = date">
motion<input type="checkbox" id="md" onclick='if(this.checked) document.getElementsByName("update")[0].value=1' title="detection">
½<input type="checkbox" id="sz" title="size">
<a id='link' download='mypic.jpg'>⇩download</a>
</div>
</aside>
<script src="webcam.js"></script></body>
<script>
/*
var audio=new Audio()
audio.src='https://upload.wikimedia.org/wikipedia/commons/c/c6/Sound_Classic_Metronome_96.ogg'
audio.loop=true //
audio.onpause=function(){shot.click()} //press pause on miband audioplayer //don't work
//document.querySelector('button').disabled=true; videoElement.onloadstart=function(){document.querySelector('button').disabled=false} //
*/
if(navigator.bluetooth && !location.search) window.onblur=function(){shot.click()}; else document.querySelector('button>span').textContent='⦿' //press search handy on miband
videoElement.onloadstart=function(){shot.disabled=false}
link.addEventListener('click',function(){this.download=this.download.replace('%D',new Date().toJSON().slice(0,-5))}) //
</script>
</html>