mirror of
https://github.com/amark/gun.git
synced 2025-06-05 21:56:51 +00:00
video example in ~90 lines
This commit is contained in:
parent
fcf105aaab
commit
d56e06fec7
@ -1,59 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
|
|
||||||
<video id="video" width="100%"></video>
|
|
||||||
<center>
|
|
||||||
<button id="record">Record</button>
|
|
||||||
<button id="play">Play</button>
|
|
||||||
</center>
|
|
||||||
|
|
||||||
<script src="../jquery.js"></script>
|
|
||||||
<script src="../../../gun/gun.js"></script>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
var gun = Gun(location.origin + '/gun');
|
|
||||||
var record = {recorder: null, recording: false};
|
|
||||||
|
|
||||||
$('#record').on('click', ()=>{
|
|
||||||
if(!record.ing){ return record.stream() }
|
|
||||||
$('#record').text("Record");
|
|
||||||
if(record.ing.stop){ record.ing.stop() }
|
|
||||||
record.ing = false;
|
|
||||||
})
|
|
||||||
|
|
||||||
record.stream = function(){
|
|
||||||
navigator.mediaDevices.getDisplayMedia({ video: true }).then(stream => {
|
|
||||||
var chunks = []; // we have a stream, we can record it
|
|
||||||
record.ing = new MediaRecorder(stream);
|
|
||||||
record.ing.ondataavailable = eve => chunks.push(eve.data);
|
|
||||||
record.ing.onstop = eve => record.save(new Blob(chunks));
|
|
||||||
record.ing.start()
|
|
||||||
$('#record').text("End");
|
|
||||||
}, err => { console.log(err) });
|
|
||||||
}
|
|
||||||
|
|
||||||
record.save = function(data){
|
|
||||||
record.file = record.file || new FileReader();
|
|
||||||
record.file.readAsDataURL(data);
|
|
||||||
record.file.onloadend = function(){
|
|
||||||
var b64 = record.file.result;
|
|
||||||
b64 = "data:video/webm" + b64.slice(b64.indexOf(';'));
|
|
||||||
gun.get('test').get('screen').put(b64);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$('#play').on('click', ()=>{
|
|
||||||
if(record.playing){
|
|
||||||
$('#play').text("Play")
|
|
||||||
$('#video').get(0).stop();
|
|
||||||
record.playing = false;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
$('#play').text("Stop");
|
|
||||||
record.playing = true;
|
|
||||||
gun.get('test').get('screen').once((data)=>{
|
|
||||||
if(!data){ return }
|
|
||||||
$('#video').get(0).src = data;
|
|
||||||
$('#video').get(0).play()
|
|
||||||
})
|
|
||||||
})
|
|
||||||
</script>
|
|
83
examples/basic/video.html
Normal file
83
examples/basic/video.html
Normal file
@ -0,0 +1,83 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
|
||||||
|
<video id="video" width="100%"></video>
|
||||||
|
<center>
|
||||||
|
<input id="pass" placeholder="password">
|
||||||
|
<button id="play">Play</button>
|
||||||
|
Record <button class="record">Camera</button> or <button class="record">Screen</button>
|
||||||
|
</center>
|
||||||
|
|
||||||
|
<script src="../jquery.js"></script>
|
||||||
|
<script src="../../../gun/gun.js"></script>
|
||||||
|
<script src="../../../gun/sea.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var gun = Gun(location.origin + '/gun');
|
||||||
|
var record = {recorder: null, recording: false};
|
||||||
|
|
||||||
|
$('.record').on('click', function(){
|
||||||
|
if(record.ing){ return }
|
||||||
|
record.stream($(this).text());
|
||||||
|
})
|
||||||
|
|
||||||
|
record.stream = function(type){
|
||||||
|
if('Camera' === type){
|
||||||
|
navigator.getMedia({ video: true, audio: true }, stream, error);
|
||||||
|
}
|
||||||
|
if('Screen' === type){
|
||||||
|
navigator.mediaDevices.getDisplayMedia({ video: true, audio: true }).then(stream, error);
|
||||||
|
}
|
||||||
|
function stream(stream){
|
||||||
|
var chunks = []; // we have a stream, we can record it
|
||||||
|
record.ing = new MediaRecorder(stream);
|
||||||
|
record.ing.ondataavailable = eve => chunks.push(eve.data);
|
||||||
|
record.ing.onstop = eve => record.save(new Blob(chunks));
|
||||||
|
record.ing.start()
|
||||||
|
$('#play').text("End");
|
||||||
|
}
|
||||||
|
function error(err){ console.log(err) }
|
||||||
|
}
|
||||||
|
|
||||||
|
record.save = function(data){
|
||||||
|
record.file = record.file || new FileReader();
|
||||||
|
record.file.readAsDataURL(data);
|
||||||
|
record.file.onloadend = async function(){
|
||||||
|
var b64 = record.file.result, pass;
|
||||||
|
b64 = $('#video').get(0).src = "data:video/webm" + b64.slice(b64.indexOf(';'));
|
||||||
|
if($('#pass').val()){ b64 = await SEA.encrypt(b64, $('#pass').val()) }
|
||||||
|
gun.get('test').get('video').put(b64);
|
||||||
|
$('#play').trigger('click');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#play').on('click', function(){
|
||||||
|
if(record.ing){
|
||||||
|
if(record.ing.stop){ record.ing.stop() }
|
||||||
|
record.ing = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if(record.playing){
|
||||||
|
$('#video').get(0).pause();
|
||||||
|
$('#play').text("Play");
|
||||||
|
record.playing = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if($('#video').get(0).src){
|
||||||
|
$('#video').get(0).play();
|
||||||
|
$('#play').text("Pause");
|
||||||
|
record.playing = true;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
$('#play').text("Loading");
|
||||||
|
gun.get('test').get('video').once(async function(data){
|
||||||
|
if($('#pass').val()){ data = await SEA.decrypt(data, $('#pass').val()) }
|
||||||
|
try{ $('#video').get(0).src = data }catch(e){}
|
||||||
|
$('#play').trigger('click');
|
||||||
|
})
|
||||||
|
})
|
||||||
|
$('#video').on('ended', function(){ $('#play').trigger('click') })
|
||||||
|
$('#video').on('error', function(){ $('#play').text("Failed"); })
|
||||||
|
|
||||||
|
navigator.getMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia
|
||||||
|
|| navigator.mozGetUserMedia || navigator.msGetUserMedia);
|
||||||
|
</script>
|
@ -2866,6 +2866,28 @@ describe('Gun', function(){
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('once put once', function(done){
|
||||||
|
gun.get('opo').get('a').put('yay!');
|
||||||
|
var ref = gun.get('opo').get('a');
|
||||||
|
setTimeout(function(){
|
||||||
|
ref.once(function(data){
|
||||||
|
expect(data).to.be('yay!');
|
||||||
|
|
||||||
|
setTimeout(function(){
|
||||||
|
gun.get('opo').get('a').put('z');
|
||||||
|
|
||||||
|
|
||||||
|
setTimeout(function(){
|
||||||
|
ref.once(function(data){
|
||||||
|
expect(data).to.be('z');
|
||||||
|
done();
|
||||||
|
});
|
||||||
|
}, 25);
|
||||||
|
}, 25);
|
||||||
|
})
|
||||||
|
}, 25);
|
||||||
|
});
|
||||||
|
|
||||||
it('get node after recursive field', function(done){
|
it('get node after recursive field', function(done){
|
||||||
var bob = {age: 29, name: "Bob!"};
|
var bob = {age: 29, name: "Bob!"};
|
||||||
var cat = {name: "Fluffy", species: "kitty"};
|
var cat = {name: "Fluffy", species: "kitty"};
|
||||||
|
Loading…
x
Reference in New Issue
Block a user