From 6275de50c2ee14656c2465a292051d67fd4213b9 Mon Sep 17 00:00:00 2001
From: ruymon <ruystfrancis@gmail.com>
Date: Tue, 9 Mar 2021 19:07:42 -0300
Subject: [PATCH 1/2] :sparkles: Add Save Video

---
 src/index.html |  4 +--
 src/render.js  | 76 ++++++++++++++++++++++++++++++++++++++++++++++++--
 2 files changed, 75 insertions(+), 5 deletions(-)

diff --git a/src/index.html b/src/index.html
index 3818105..8e477fd 100644
--- a/src/index.html
+++ b/src/index.html
@@ -52,7 +52,7 @@
                   text-center 
                   bg-green-500 
                   hover:bg-green-700">
-                  🎬 <br/> Start
+                  🎬 <br /> Start
       </button>
 
       <button id="stopBtn" class="py-1 px-4 
@@ -63,7 +63,7 @@
                   text-center
                   bg-red-500
                   hover:bg-red-700">
-                  🛑 <br/> Stop
+                  🛑 <br /> Stop
       </button>
 
     </div>
diff --git a/src/render.js b/src/render.js
index 9160227..2c84e9a 100644
--- a/src/render.js
+++ b/src/render.js
@@ -1,12 +1,52 @@
+const { desktopCapturer, remote } = require('electron');
+
+const { dialog, Menu } = remote;
+
+const { writeFile } = require('fs');
+const { start } = require('repl');
+
+
+
+// Global States
+let mediaRecorder;
+const recordedChunks = [];
+
+
+
 //Buttons
 const videoElement = document.querySelector('video');
+
 const startBtn = document.getElementById('startBtn');
+startBtn.onclick = e => {
+    mediaRecorder.start();
+
+    startBtn.classList.remove('bg-green-500');
+    startBtn.classList.remove('hover:bg-green-700');
+
+    startBtn.classList.add('bg-blue-500');
+    startBtn.classList.add('hover:bg-blue-700');
+
+    startBtn.innerHTML = "📼 <br /> Recording";
+};
+
+
 const stopBtn = document.getElementById('stopBtn');
+stopBtn.onclick = e => {
+    mediaRecorder.stop();
+
+    startBtn.classList.remove('bg-blue-500');
+    startBtn.classList.remove('hover:bg-blue-700');
+
+    startBtn.classList.add('bg-green-500');
+    startBtn.classList.add('hover:bg-green-700');
+
+    startBtn.innerHTML = "🎬 <br /> Start";
+};
+
+
 const videoSelectBtn = document.getElementById('videoSelectBtn');
 videoSelectBtn.onclick = getVideoSources;
 
-const { desktopCapturer, remote } = require('electron');
-const { Menu } = remote;
 
 // Get the available video sources
 async function getVideoSources() {
@@ -23,7 +63,6 @@ async function getVideoSources() {
         })
     );
 
-
     videoOptionsMenu.popup();
 }
 
@@ -50,5 +89,36 @@ async function selectSource(source) {
     videoElement.srcObject = stream;
     videoElement.play();
 
+    // Create the Media Recorder
+    const options = { mimeType: 'video/webm; codecs=vp9' };
+    mediaRecorder = new MediaRecorder(stream, options);
+
+    // Register Event Handlers
+    mediaRecorder.ondataavailable = handleDataAvailable;
+    mediaRecorder.onstop = handleStop;
+}
 
+// Captures all Recorded Chunks
+function handleDataAvailable(e) {
+    console.log('Video data available')
+    recordedChunks.push(e.data);
 }
+
+
+// Saves the video file on stop
+async function handleStop(e) {
+    const blob = new Blob(recordedChunks, {
+        type: 'video/webm; codecs=vp9',
+    });
+
+    const buffer = Buffer.from(await blob.arrayBuffer());
+
+    const { filePath } = await dialog.showSaveDialog({
+        buttonLabel: 'Save video',
+        defaultPath: `vid-${Date.now()}.webm`
+    })
+
+    console.log(filePath);
+    
+    filePath ? writeFile(filePath, buffer, () => console.log('Video saved successfully!')) : console.log('No File Path!');
+}
\ No newline at end of file

From cac1e5b9dd2ea866129d021fb4c41c280c395811 Mon Sep 17 00:00:00 2001
From: ruymon <ruystfrancis@gmail.com>
Date: Tue, 9 Mar 2021 20:37:31 -0300
Subject: [PATCH 2/2] :bug: Fix Toolbar Hide, Console Show on prod

---
 package.json | 6 +++---
 src/index.js | 6 +++++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index d1a0d0b..70e622f 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "electron-screen-recorder",
   "productName": "electron-screen-recorder",
   "version": "1.0.0",
-  "description": "My Electron application description",
+  "description": "A Electron based Screen Recorder. Built with Tailwind-CSS.",
   "main": "src/index.js",
   "scripts": {
     "start": "electron-forge start",
@@ -13,7 +13,7 @@
   },
   "keywords": [],
   "author": {
-    "name": "ruymon",
+    "name": "Ruy Monteiro",
     "email": "ruystfrancis@gmail.com"
   },
   "license": "MIT",
@@ -24,7 +24,7 @@
         {
           "name": "@electron-forge/maker-squirrel",
           "config": {
-            "name": "electron_screen_recorder"
+            "name": "Electron Screen Recorder"
           }
         },
         {
diff --git a/src/index.js b/src/index.js
index 2d4afc3..33e1150 100644
--- a/src/index.js
+++ b/src/index.js
@@ -18,11 +18,15 @@ const createWindow = () => {
     }
   });
 
+  mainWindow.removeMenu();
+
   // and load the index.html of the app.
   mainWindow.loadFile(path.join(__dirname, 'index.html'));
 
+
+
   // Open the DevTools.
-  mainWindow.webContents.openDevTools();
+  //mainWindow.webContents.openDevTools();
 };
 
 // This method will be called when Electron has finished