bug: playPause by n° loop

README.md

@@ -85,7 +85,7 @@ To ***save*** your template, it's automatic ! Just type, edit what you want. It
 ### MIDI Variables
 
 | Midi Event  | Parameter | Informations                                        |
-|-------------|-----------|------------------------------------------|
+|-------------|-----------|-----------------------------------------------------|
 | note        | id        | Note on, use case : note:21                         |
 | cc          | id        | Control change, use case : cc:10                    |
 | pb          |           | Pitchbend, use case : pb                            |
@@ -93,7 +93,7 @@ To ***save*** your template, it's automatic ! Just type, edit what you want. It
 ### Audio Variables
 
 | Audio Event | Parameter | Informations                                        |
-|-------------|-----------|------------------------------------------|
+|-------------|-----------|-----------------------------------------------------|
 | low         |           | low energy, use case : low                          |
 | lomi        |           | lomi energy, use case : lomi                        |
 | low         |           | mid energy, use case : mid                          |
@@ -106,14 +106,14 @@ To ***save*** your template, it's automatic ! Just type, edit what you want. It
 ### Types
 
 | Option      | Informations                                                    |
-|-------------|------------------------------------------------------|
+|-------------|-----------------------------------------------------------------|
 | min:max     | Decimal or hexadecimal min and max splited by ":"               |
 | A;B;C       | Array splited by ";"                                            |
 
 ### Options
 
 | Option      | Informations                                                    |
-|-------------|------------------------------------------------------|
+|-------------|-----------------------------------------------------------------|
 | r           | Random value between type object                                |
 | i:1         | Incremental value between type object, increment can be negative|
 | d           | Linear value between type object                                |

background.js

@@ -16,7 +16,8 @@ let audioI = false;
 let midiI = false;
 let popup = false;
 let loopPlay = false;
-let records = [
+let records = {
+	loop: [
 		[
 			{
 				time: 1,
@@ -37,7 +38,14 @@ let records = [
 		[],
 		[],
 		[]
-];
+	],
+	info: [
+		{isLoop:false},
+		{isLoop:false},
+		{isLoop:false},
+		{isLoop:false}
+	]
+};
 let all = "";
 
 //Initialize the CSS storage on startup

content.js

@@ -356,31 +356,34 @@ function freqToBin(freq, rounding = 'round') {
 }
 
 // Allow to store the current note in an index, for duration computation
-const CURRENT = {};
-// const RECORDED = [];
 chrome.storage.sync.get(['records'], function (result) {
-    RECORDED = result.records;
+    RECORDED = result.records.loop;
+    INFOLOOP = result.records.info;
 });
 
 let recordCount = 0;
 let isRecording = false;
-let isLoop = false;
 let recordingTime = 0;
 let theLoop;
 const record = (status, number) => {
     isRecording = status;
+    if (status) {
         recordingTime = performance.now();
         recordCount = number;
+    }
+    else {
+        chrome.storage.sync.set({ 'records': { loop: RECORDED, info: INFOLOOP } });
+    }
 };
 
 
 // Start loop
 const loop = (number) => {
-    isLoop = !isLoop;
+    INFOLOOP[number].isLoop = !INFOLOOP[number].isLoop;
     isRecording = false;
     if (RECORDED[number].length) {
         const loopLength = RECORDED[number][RECORDED[number].length - 1].time;
-        if (isLoop) {
+        if (INFOLOOP[number].isLoop) {
             loopNotes(number);
             theLoop = setInterval(() => loopNotes(number), loopLength);
         } else {
@@ -392,10 +395,8 @@ const loop = (number) => {
 const loopNotes = (number) => {
     RECORDED[number].forEach(note => {
         setTimeout(() => {
-            // Prevent to keep playing also after stop
-            if (!isLoop) return;
+            if (!INFOLOOP[number].isLoop) return;
             midiEvent(note.type, note.data)
-            // setTimeout(() => play(note.note, 0), 200)
         }, note.time);
     })
 }
@@ -404,7 +405,7 @@ const reset = (number) => {
     RECORDED[number].length = 0;
     isRecording = false;
     isLoop = false;
-    chrome.storage.sync.set({ 'records': RECORDED });
+    chrome.storage.sync.set({ 'records': { loop: RECORDED, info: INFOLOOP } });
 }
 
 function audioEvent() {
@@ -549,12 +550,10 @@ function onMessage({ type, data }) {
             break;
         }
         case 'playLoop': {
+            chrome.storage.sync.get(['activate'], function (result) {
+                if (result.activate) {
                     loop(data);
-            break;
                 }
-        case 'getLoop': {
-            chrome.storage.sync.get(['records'], function (result) {
-                chrome.runtime.sendMessage({ type: 'midiRecords', data: result.records });
             });
             break;
         }
@@ -564,9 +563,7 @@ function onMessage({ type, data }) {
         }
         case 'resetLoop': {
             reset(data);
-            chrome.storage.sync.get(['records'], function (result) {
-                chrome.runtime.sendMessage({ type: 'midiRecords', data: result.records });
-            });
+            chrome.runtime.sendMessage({ type: 'updateUi', data: false });
             break;
         }
     }

main.js

@@ -109,12 +109,17 @@ function initUi() {
 			$('.midiI').removeClass('active');
 		}
 	});
-	chrome.tabs.query({ active: true, currentWindow: true },
-		function (tabs) {
-			chrome.tabs.sendMessage(tabs[0].id, { type: 'getLoop', data: false });
+	chrome.storage.sync.get(['records'], function (result) {
+		$('#loopList').text('');
+		for (let i = 0; i < result.records.loop.length; i++) {
+			if (result.records.loop[i].length > 0) {
+				$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td>' + result.records.loop[i][result.records.loop[i].length - 1].time + 'ms</td><td>' + result.records.loop[i].length + '</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><button id="loopPlay" value="' + i + '">' + (result.records.info[i].isLoop?pauseIcon:playIcon) + '</button><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
 			}
-	);
-
+			else {
+				$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td></td><td>0</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><button id="loopPlay" value="' + i + '">' + playIcon + '</button><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
+			}
+		}
+	});
 	chrome.storage.sync.get(['parameters'], function (result) {
 		parameters = JSON.parse(result.parameters);
 		var tbl_body = "";
@@ -348,19 +353,6 @@ function onMessage({ type, data }) {
 			$('#midiDevices').text(data);
 			break;
 		}
-		case 'midiRecords': {
-			$('#loopList').text('');
-			console.log(data);
-			for (let i = 0; i < data.length; i++) {
-				if (data[i].length > 0) {
-					$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td>' + data[i][data[i].length - 1].time + 'ms</td><td>' + data[i].length + '</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><button id="loopPlay" value="' + i + '">' + playIcon + '</button><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
-				}
-				else {
-					$('#loopList').append('<tr><td>Boucle n°' + (i + 1) + '</td><td></td><td>0</td><td><button id="record" value="' + i + '">' + recordIcon + '</button><button id="loopPlay" value="' + i + '">' + playIcon + '</button><button id="loopReset" value="' + i + '">' + trashIcon + '</button></td></tr>');
-				}
-			}
-			break;
-		}
 	}
 }