diff --git a/app/static/app/js/vendor/potree/build/potree/potree.js b/app/static/app/js/vendor/potree/build/potree/potree.js index 6367cce0..c8f384dd 100644 --- a/app/static/app/js/vendor/potree/build/potree/potree.js +++ b/app/static/app/js/vendor/potree/build/potree/potree.js @@ -75386,6 +75386,7 @@ ENDSEC Time:
+ `); @@ -75395,6 +75396,52 @@ ENDSEC animation.play(); }); + function record(canvas, time) { + var recordedChunks = []; + return new Promise(function (res, rej) { + var stream = canvas.captureStream(29.97 /*fps*/); + let mediaRecorder = new MediaRecorder(stream, { + mimeType: "video/webm; codecs=vp9" + }); + + //ondataavailable will fire in interval of `time || 4000 ms` + mediaRecorder.start(time || 4000); + + mediaRecorder.ondataavailable = function (event) { + recordedChunks.push(event.data); + // after stop `dataavilable` event run one more time + if (mediaRecorder.state === 'recording') { + mediaRecorder.stop(); + } + + } + + mediaRecorder.onstop = function (event) { + var blob = new Blob(recordedChunks, {type: "video/webm" }); + var url = URL.createObjectURL(blob); + res(url); + } + }) + } + + const elRecord = this.elContent.find("input[name=record]"); + elRecord.click( () => { + const t = parseFloat(elDuration.val()) * 1000 + 1000; + this.viewer.toggleSidebar(); + animation.setVisible(false); + setTimeout(() => { + animation.play(); + record(this.viewer.renderer.domElement, t).then(url => { + let link = document.createElement('a'); + link.setAttribute('href', url); + link.setAttribute('download', 'recording.webm'); + link.click(); + this.viewer.toggleSidebar(); + animation.setVisible(true); + }); + }, 1000); + }); + const elSlider = this.elContent.find('#sldTime'); elSlider.slider({ value: 0,