feat: sensibility slider

background.js

@@ -15,6 +15,7 @@ let audioI = false;
 let midiI = false;
 let popup = false;
 let loopPlay = false;
+let sensibility = 0.95;
 let records = {
 	loop: [
 		[
@@ -59,6 +60,7 @@ chrome.runtime.onInstalled.addListener(() => {
 	chrome.storage.sync.set({ loopPlay });
 	chrome.storage.local.set({ records });
 	chrome.storage.sync.set({ debug });
+	chrome.storage.sync.set({ sensibility });
 });
 
 

content.js

@@ -9,6 +9,11 @@ var midi = false;
 var debug = false;
 var audioSample = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
 
+var sensibility;
+chrome.storage.sync.get(['sensibility'], function (result) {
+    sensibility = result.sensibility;
+});
+
 var parameterSave = {};
 function range(template, value) {
     if (template.options.includes('i')) {
@@ -265,9 +270,8 @@ async function gotStream(stream) {
     const node = new AudioWorkletNode(audioContext, 'vumeter');
     node.port.onmessage = event => {
         let _volume = 0
-        let _sensibility = 5
         if (event.data.volume)
-            _volume = event.data.volume;
+            _volume = event.data.volume * sensibility;
         meter = { volume: _volume };
     }
     mediaStreamSource.connect(node);

main.js

@@ -112,6 +112,9 @@ function initUi() {
 			$('.midiI').removeClass('active');
 		}
 	});
+	chrome.storage.sync.get(['sensibility'], function (result) {
+		$('#sensibility').val(result.sensibility);
+	});
 	chrome.storage.local.get(['records'], function (result) {
 		$('#loopList').text('');
 		for (let i = 0; i < result.records.loop.length; i++) {
@@ -377,6 +380,14 @@ $('.midiI').on('click', function () {
 	initUi();
 });
 
+/**
+ * @description Sensibility slider.
+ */
+$('#sensibility').on('change', function () {
+	console.log('cc');
+	chrome.storage.sync.set({ sensibility: $(this).val() });
+});
+
 /**
  * @description Duplicate the current row and save the parameters.
  */

popup.html

@@ -48,7 +48,6 @@
       </h3>
       <div>
         <div id="editor"></div>
-
       </div>
 
       <h3>
@@ -232,10 +231,52 @@
           </tr>
         </table>
       </div>
+
+      <h3>
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          class="icon icon-tabler icon-tabler-tool"
+          width="12"
+          height="12"
+          viewBox="0 0 24 24"
+          stroke-width="1.5"
+          stroke="currentColor"
+          fill="none"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        >
+          <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
+          <path
+            d="M7 10h3v-3l-3.5 -3.5a6 6 0 0 1 8 8l6 6a2 2 0 0 1 -3 3l-6 -6a6 6 0 0 1 -8 -8l3.5 3.5"
+          ></path>
+        </svg>
+        CONFIGURATION
+      </h3>
+      <div>
+        <table>
+          <tr>
+            <td>
+              <a id="debug">Mode debug</a>
+            </td>
+          </tr>
+          <tr>
+            <td>Sensibilite
+              <input
+                id="sensibility"
+                type="range"
+                min="0"
+                max="1"
+                step="0.01"
+                value="0.5">
+            </td>
+          </tr>
+        </table>
+      </div>
     </div>
 
     <p style="text-align: center">
-      &COPY; 2022 - Universite de Lille - <a id="doc">Voir la documentation</a> - <a id="debug">Mode debug</a> 
+      &COPY; 2022 - Universite de Lille -
+      <a id="doc">Voir la documentation</a>
     </p>
     <script src="cssParser.js" type="text/javascript" charset="utf-8"></script>
     <script src="ace/ace.js" type="text/javascript" charset="utf-8"></script>