Commit 886894b9 by ramdayalmunda

starting recording from floating bar

parent 532e22c0
...@@ -20,7 +20,16 @@ var getUserDetails = null ...@@ -20,7 +20,16 @@ var getUserDetails = null
imageNumber = 0 imageNumber = 0
} }
loggedIn = true loggedIn = true
sendResponse({ message: "Logged In", success: true }) sendResponse({
message: "Logged In",
success: true,
userDetails,
tutorShotOid: tutorShotId,
imageNumber: imageNumber,
status: tutorShotId?(recording?"recording":"paused"):"stopped",
})
sendMessageToActiveTab("loggedIn")
return return
} }
...@@ -29,6 +38,8 @@ var getUserDetails = null ...@@ -29,6 +38,8 @@ var getUserDetails = null
userDetails, userDetails,
loggedIn, loggedIn,
recording, recording,
tutorShotOid: tutorShotId,
imageNumber: imageNumber,
status: tutorShotId?(recording?"recording":"paused"):"stopped" status: tutorShotId?(recording?"recording":"paused"):"stopped"
}) })
return return
...@@ -38,13 +49,25 @@ var getUserDetails = null ...@@ -38,13 +49,25 @@ var getUserDetails = null
imageNumber = 0 imageNumber = 0
recording = true; recording = true;
tutorShotId = request.tutorShotId tutorShotId = request.tutorShotId
sendResponse({ userDetails, loggedIn, recording }); sendResponse({
userDetails,
loggedIn,
recording,
status: tutorShotId?(recording?"recording":"paused"):"stopped"
});
sendMessageToActiveTab("recordingStarted")
return return
} }
if (loggedIn && request.action === 'stopRecording') { if (loggedIn && request.action === 'stopRecording') {
recording = false; recording = false;
tutorShotId = null tutorShotId = null
sendResponse({ userDetails, loggedIn, recording }); sendResponse({
userDetails,
loggedIn,
recording,
status: tutorShotId?(recording?"recording":"paused"):"stopped"
});
sendMessageToActiveTab("recordingStopped")
return return
} }
...@@ -70,9 +93,9 @@ var getUserDetails = null ...@@ -70,9 +93,9 @@ var getUserDetails = null
tutorShotOid: tutorShotId, tutorShotOid: tutorShotId,
action: 'SSCaptured', action: 'SSCaptured',
dataUrl: dataUrl, imageNumber: imageNumber++, dataUrl: dataUrl, imageNumber: imageNumber++,
status: tutorShotId?(recording?"recording":"paused"):"stopped",
...request.captureInfo ? request.captureInfo : {} ...request.captureInfo ? request.captureInfo : {}
} }
console.log('SS captured', message)
// to send message to the content instance of the // to send message to the content instance of the
chrome.tabs.sendMessage(activeTab.id, message); chrome.tabs.sendMessage(activeTab.id, message);
}) })
...@@ -95,4 +118,24 @@ var getUserDetails = null ...@@ -95,4 +118,24 @@ var getUserDetails = null
} }
return dataSet return dataSet
} }
function sendMessageToActiveTab(messageObj){
try{
chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
if (tabs && tabs.length && tabs[0].url.slice(0,6)!='chrome') { // if any tab is active
let message = {
userDetails,
tutorShotOid: tutorShotId,
imageNumber: imageNumber,
status: tutorShotId?(recording?"recording":"paused"):"stopped",
message: messageObj
}
console.log('sending message:', message)
chrome.tabs.sendMessage(tabs[0].id, message);
}
})
}catch(err){
console.log(err)
}
}
}() }()
...@@ -4,6 +4,7 @@ ...@@ -4,6 +4,7 @@
var loggedIn = false; var loggedIn = false;
var floatingBar = null; var floatingBar = null;
const origin = "http://localhost:3039" const origin = "http://localhost:3039"
var userDetails = {};
var btn = {} var btn = {}
!(async function () { !(async function () {
...@@ -173,28 +174,40 @@ async function login() { ...@@ -173,28 +174,40 @@ async function login() {
async function getCaptureData() { async function getCaptureData() {
let statusData = await chrome.runtime.sendMessage({ action: "checkStatus" }) let statusData = await chrome.runtime.sendMessage({ action: "checkStatus" })
userDetails = statusData.userDetails
return statusData return statusData
} }
function reRenderFloatingBar(data) { function reRenderFloatingBar(data) {
console.log('reset floting bar data', data) console.log('reRenderFloatingBar', data)
if (!btn.play) btn.play = document.querySelector('[tutor-shot="play-btn"]') if (!btn.play){
btn.play = document.querySelector('[tutor-shot="play-btn"]')
btn.play.addEventListener('click', startRecording)
}
if (!btn.playText) btn.playText = document.querySelector('[tutor-shot="play-text"]') if (!btn.playText) btn.playText = document.querySelector('[tutor-shot="play-text"]')
if (!btn.pause) btn.pause = document.querySelector('[tutor-shot="pause-btn"]') if (!btn.pause) btn.pause = document.querySelector('[tutor-shot="pause-btn"]')
if (!btn.stop) btn.stop = document.querySelector('[tutor-shot="stop-btn"]') if (!btn.stop) btn.stop = document.querySelector('[tutor-shot="stop-btn"]')
if (!btn.restart) btn.restart = document.querySelector('[tutor-shot="restart-btn"]') if (!btn.restart) btn.restart = document.querySelector('[tutor-shot="restart-btn"]')
if (data?.state=='paused'){ if (!btn.counter) btn.counter = document.querySelector('[tutor-shot="counter"]')
if (data?.hasOwnProperty('imageNumber')){
console.log('set', data.imageNumber, btn.counter.innerHTML)
btn.counter.innerHTML = `${data.imageNumber}`
if (data.imageNumber<=0) btn.counter.style.display='none'
else btn.counter.style.display='flex'
}
if (data?.state == 'paused') {
btn.play.style.display = 'flex' btn.play.style.display = 'flex'
btn.pause.style.display = 'none' btn.pause.style.display = 'none'
btn.stop.style.display = 'flex' btn.stop.style.display = 'flex'
btn.playText.innerHTML = 'CONTINUE' btn.playText.innerHTML = 'CONTINUE'
} }
else if (data?.status=='recording'){ else if (data?.status == 'recording') {
btn.play.style.display = 'none' btn.play.style.display = 'none'
btn.pause.style.display = 'flex' btn.pause.style.display = 'flex'
btn.stop.style.display = 'flex' btn.stop.style.display = 'flex'
} }
else{ // stopped else { // stopped
btn.play.style.display = 'flex' btn.play.style.display = 'flex'
btn.pause.style.display = 'none' btn.pause.style.display = 'none'
btn.stop.style.display = 'none' btn.stop.style.display = 'none'
...@@ -213,8 +226,12 @@ const api = axios.create({ ...@@ -213,8 +226,12 @@ const api = axios.create({
}); });
window.addEventListener('mousedown', async function (e) { window.addEventListener('mousedown', async function (e) {
// to prevent the event when clicking inside the floating bar
if (floatingBar.contains(e.target)){
return
}
if (e.button === 0) { // only left click allowed if (e.button === 0) { // only left click allowed
console.log('click received')
let captureInfo = { let captureInfo = {
targetDimensions: e.target.getBoundingClientRect(), // this is for the backdrop targetDimensions: e.target.getBoundingClientRect(), // this is for the backdrop
...@@ -248,8 +265,25 @@ chrome.runtime.onMessage.addListener(async function (message, sender, sendRespon ...@@ -248,8 +265,25 @@ chrome.runtime.onMessage.addListener(async function (message, sender, sendRespon
if (message.action == 'tabChanged') { if (message.action == 'tabChanged') {
// console.log('tabChanged', message) // console.log('tabChanged', message)
} }
if (message.status){
console.log('got message status', message)
}
let data = await getCaptureData() let data = await getCaptureData()
reRenderFloatingBar(data) reRenderFloatingBar(data)
}); });
async function startRecording() {
console.log('startRecording')
try {
await getCaptureData();
let { data } = await api.post('/tutor-shot', { title: "Some random title" }, { headers: { userId: userDetails.uid } })
if (data.success) {
await chrome.runtime.sendMessage({ action: "startRecording", tutorShotId: data.tutorShot._id })
}
} catch (err) {
console.log('error while starting to record', err)
inProgress = false
}
}
!function () { !function () {
const origin = "http://localhost:3039"
console.log('popup', chrome); console.log('popup', chrome);
const api = axios.create({ const api = axios.create({
baseURL: "http://localhost:3039/api", // the base URL for nodeserver is okay but NGINX is giving error baseURL: `${origin}/api`, // the base URL for nodeserver is okay but NGINX is giving error
headers: { headers: {
'Access-Control-Allow-Origin': '*', // Replace '*' with the origin you need 'Access-Control-Allow-Origin': '*', // Replace '*' with the origin you need
'Content-Type': 'application/json', 'Content-Type': 'application/json',
}, },
}); });
console.log('api',api)
let origin = "http://localhost:3039"
let recording = false; let recording = false;
let loggedIn = false; let loggedIn = false;
let startBtn = document.getElementById('start-btn') let startBtn = document.getElementById('start-btn')
...@@ -34,7 +33,6 @@ ...@@ -34,7 +33,6 @@
} }
inProgress = true inProgress = true
try{ try{
console.log('apis', api)
let { data } = await api.post('/tutor-shot', { title: "Some random title" }, { headers: { userId: userDetails.uid } } ) let { data } = await api.post('/tutor-shot', { title: "Some random title" }, { headers: { userId: userDetails.uid } } )
console.log('creating reponse',data) console.log('creating reponse',data)
if (data.success){ if (data.success){
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment