Skip to content

Refactor screen recording feature #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
farhan-momin wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Refactor screen recording feature #1

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 9 additions & 28 deletions js/activity.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1671,6 +1671,7 @@ class Activity {
let mediaRecorder;
var clickEvent = new Event("click");
let flag = 0;
let stream = null;

/**
* Records the screen using the browser's media devices API.
Expand All @@ -1693,8 +1694,6 @@ class Activity {
});
}

const that = this;

/**
* Saves the recorded chunks as a video file.
* @param {Blob[]} recordedChunks - The recorded video chunks.
Expand All @@ -1711,7 +1710,6 @@ class Activity {
alert(_("File save canceled"));
flag = 0;
recording();
doRecordButton();
return; // Exit without saving the file
}

Expand All @@ -1726,18 +1724,13 @@ class Activity {
flag = 0;
// eslint-disable-next-line no-use-before-define
recording();
doRecordButton();
that.textMsg(_("Click on stop saving"));
}
/**
* Stops the recording process.
*/
function stopRec() {
flag = 0;
mediaRecorder.stop();
const node = document.createElement("p");
node.textContent = "Stopped recording";
document.body.appendChild(node);
}

/**
Expand All @@ -1748,13 +1741,11 @@ class Activity {
*/
function createRecorder(stream, mimeType) {
flag = 1;
recInside.classList.add("blink");
start.removeEventListener("click", createRecorder, true);
let recordedChunks = [];
const mediaRecorder = new MediaRecorder(stream);

stream.oninactive = function () {
// eslint-disable-next-line no-console
console.log("Recording is ready to save");
stopRec();
flag = 0;
};
Expand All @@ -1773,11 +1764,9 @@ class Activity {
};

mediaRecorder.start(200);
setTimeout(() => {
// eslint-disable-next-line no-console
console.log("Resizing for Record", that.canvas.height);
that._onResize();
}, 500);
recInside.classList.add("blink");
recInside.setAttribute("fill", "red");
start.addEventListener("click", stopRec);
return mediaRecorder;
}

Expand All @@ -1786,31 +1775,23 @@ class Activity {
*/
function recording() {
start.addEventListener("click", async function handler() {
const stream = await recordScreen();
if (!stream || stream.active == false) {
stream = await recordScreen();
}
const mimeType = "video/webm";
mediaRecorder = createRecorder(stream, mimeType);
if (flag == 1) {
this.removeEventListener("click", handler);
}
const node = document.createElement("p");
node.textContent = "Started recording";
document.body.appendChild(node);
recInside.setAttribute("fill", "red");
});
}

// Start recording process if not already executing
if (flag == 0 && isExecuting) {
if (flag == 0) {
recording();
start.dispatchEvent(clickEvent);
flag = 1;
}

// Stop recording if already executing
if (flag == 1 && isExecuting) {
start.addEventListener("click", stopRec);
flag = 0;
}
};

/*
Expand Down
Loading