Skip to content

Commit 1d19310

Browse files
video logging add
1 parent bf41d02 commit 1d19310

File tree

3 files changed

+61
-9
lines changed

3 files changed

+61
-9
lines changed

mockup.html

+15-2
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,13 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
66
</head>
77
<body style="padding:2vh;">
8+
<script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-app.js"></script>
9+
<script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-analytics.js"></script>
10+
<script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-auth.js"></script>
11+
<script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-database.js"></script>
12+
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-firestore.js"></script>
13+
<script src="https://www.gstatic.com/firebasejs/7.6.0/firebase-storage.js"></script>
14+
<script src="./init-firebase.js"></script>
815
<style>
916
.switch {
1017
position: relative;
@@ -75,17 +82,23 @@ <h5>Total Screen Time (as subset of Total Recorded Time):50%</h5>
7582
<h5>Total Focused Level : 33%</h5>
7683
</div>
7784
</div>
85+
<video id="video" width="640" height="480" autoplay></video>
86+
<button id="start">Start</button>
87+
<button id="stop">Stop</button>
88+
<div id="timer">00:00</div>
7889
<div style="margin-top:5vh;display:flex">
7990
<label class="switch">
80-
<input type="checkbox">
91+
<input type="checkbox" id="start">
8192
<span class="slider round"></span>
8293
</label>
83-
<h3 style="margin-left:30px">Record button</h3>
94+
<h3 style="margin-left:30px" >Record button</h3>
8495
<label class="switch" style="margin-left: 300px;">
8596
<input type="checkbox">
8697
<span class="slider round"></span>
8798
</label>
8899
<h3 style="margin-left:30px">Upload button</h3>
100+
<button id="download">Download</button>
101+
<script src="./videoRecord.js"></script>
89102
</div>
90103
</body>
91104
</html>

sites.js

+10-2
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,8 @@ Sites.prototype._updateTime = function() {
7373
* Provide url=null if Chrome is out of focus.
7474
*/
7575
Sites.prototype.setCurrentFocus = function(url) {
76+
//sum all time
77+
7678
// console.log("setCurrentFocus: " + url);
7779
this._updateTime();
7880
if (url == null) {
@@ -83,12 +85,18 @@ Sites.prototype.setCurrentFocus = function(url) {
8385
38: 'images/icon_paused38.png'}});
8486
} else {
8587
if(globt>1 && prev_url!=="" && prev_domain!==null){
88+
var sy = start_time.split("-")[0];
89+
var sm = start_time.split("-")[1];
90+
var sd = start_time.slice(8,10);
91+
var sh = start_time.slice(11,13);
92+
var smin = start_time.split("-")[3];
93+
var ss = start_time.split("-")[4];
8694
siteInfo={
8795
url:prev_url,
8896
site:prev_domain,
8997
time:globt,
90-
start_time: start_time,
91-
uploading_time:getTimestamp()
98+
start_time: new Date(sy,sm,sd,sh,smin,ss,"00"),
99+
uploading_time: new Date()
92100
}
93101
console.log(siteInfo);
94102
uploadInfo(siteInfo);

videoRecord.js

+36-5
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,15 @@ var sourceBuffer;
1010
var intervalTimer;
1111
var autoUploading;
1212
var startTime;
13+
var start_time;
1314
var finishTime;
1415
var uploadTimer;
1516
var gumVideo = document.querySelector('#video');
1617
var $timer = document.querySelector('#timer');
1718
var $stopBtn = document.querySelector('#stop');
1819
var $startBtn= document.querySelector("#start");
20+
var db = firebase.firestore();
21+
var videoinfo;
1922

2023
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
2124

@@ -133,7 +136,7 @@ function stopRecording() {
133136
upload();
134137
var stream = video.srcObject;
135138
var tracks = stream.getTracks();
136-
139+
finishTime = new Date();
137140
for (var i = 0; i < tracks.length; i++) {
138141
var track = tracks[i];
139142
track.stop();
@@ -176,22 +179,49 @@ console.log(recordedBlobs);
176179
function init() {
177180
$timer.innerHTML = '00:00';
178181
navigator.getUserMedia(constraints, successCallback, errorCallback);
182+
start_time = getTimestamp();
179183
startTime = new Date();
180-
uploadTimer= new Date();
181184
intervalTimer = window.setInterval(function() {
182185
timerTick();
183186
}, 1000);
184-
autoUploading = window.setInterval(function(){
187+
autoUploading = function(){
185188
startTime = new Date();
186189
$timer.innerHTML = '00:00';
187-
stopRecording();
188190
navigator.getUserMedia(constraints, successCallback, errorCallback);
189191
intervalTimer = window.setInterval(function() {
190192
timerTick();
191193
}, 1000);
192-
},9999999);
194+
};
195+
}
196+
197+
function videolog (videoinfo){
198+
db.collection("videolog_test")
199+
.add(videoinfo)
200+
.then(function (docRef) {
201+
console.log("Document written with ID: ", docRef.id);
202+
})
203+
.catch(function (error) {
204+
console.error("Error adding document: ", error);
205+
});
193206
}
194207

208+
function videoupload(){
209+
var sy = start_time.split("-")[0];
210+
var sm = start_time.split("-")[1];
211+
var sd = start_time.slice(8,10);
212+
var sh = start_time.slice(11,13);
213+
var smin = start_time.split("-")[3];
214+
var ss = start_time.split("-")[4];
215+
videoinfo={
216+
"start_time": new Date(sy, sm, sd, sh, smin, ss, "00"),
217+
"finish_time": finishTime,
218+
"upload_time": new Date(),
219+
}
220+
console.log(videoinfo);
221+
videolog(videoinfo);
222+
}
223+
224+
195225
function stopAutoUploading(){
196226
window.clearInterval(autoUploading);
197227
}
@@ -200,6 +230,7 @@ if($startBtn){
200230
$startBtn.addEventListener('click',init);
201231
$stopBtn.addEventListener('click', stopRecording);
202232
$stopBtn.addEventListener('click', stopAutoUploading);
233+
$stopBtn.addEventListener('click', videoupload);
203234
}
204235

205236
function getTimestamp() {

0 commit comments

Comments
 (0)