Merge pull request #258 from DARC-e-V/refactor/modulators

Refactor/modulators
2026-08-11 00:51:33 +02:00
parent 840d761f7d 6a0afae413
commit e4e3522a04
10 changed files with 423 additions and 44 deletions
@@ -0,0 +1,12 @@
+<html>
+  <iframe
+    class="circuitjs-simulation"
+    title="Interaktive Simulation eines AM-Modulators"
+    width="100%"
+    height="600"
+    style="border: 0;"
+    loading="lazy"
+    src="/assets/circuitjs/circuitjs.html?ctz=DwYwlgTgBAZgvAIgAwKgFwM6KQOif-AVlTBEQEZy8AOANgHYAmR+8xwgTmrdtRACNEtDqgAOghABYAzKgBuERMSgBbTEoCmAWkoIAfACgoUYHKgAPRJOpRy9WlGtQWjVPATleUAO7vybxQRCfFQVAENzOWwcYgB6Q2NTCwoORlt7W1TnJjcKL18KAIoCFFUIqIRXeKMTAHNkqRsXRxtpJElc5ARqxPrLDyzm8iy2jthsboSTaH6nOwcnDi93UsDyAkma4BmUtPnMtKXO1eKQnpNvBsWHYcPlifPgABMG9gclqGlCO+PQgHsKAA5ST4DqPS79W5QD5vaH3LrghqESSSOFQZGo+a-RH9DHpBYfLHjBFTYAQpQo-HorJElabRLkqSEjKSQmpbGkxmcPYZbkHDlbLmUj60ag2I7ElCPUQNUXihxy-nE2SqDQTKAYMgeVAQNUeEobR59IRig5QRWjAWJEBXNlpVkON6-KBaqiMA0egiMbTUEgVXD4fwawKlORPRBaXBsRjUJDkbhtQjSRii6T0ekmAA2SJpWT5TslqEz0SQzBIWtKYBLgcI9A4IKQ9Go9CT1GkKIzZNtjqY6MpLitFxzaWaeIHhaNSP7vbxlonnIaXzujmTcMHXdxgxng0I8KlC9mMN7Ducu-XNtmq4+eIldJdVhw9E9nskPr91aDGBD8nDyDw5GkaRUi+NtY3YRgOBbTts0vZcZB5Pci2iQDy3VKs-xKaR4y+RsxXbLgmFkSdYKpeDPnadcdiCSl9jHHJCygQJRTOUk-igDQADsKGUDBREKYlzHdUsxAmKZEhlf1UE1aJaFrYZpFoJBZPjUVaH8R5Yj+Vj2K4jweL4qROnMBsRO1MSTAk9VpKkfctk0wxgFicAIEMIA&amp;whiteBackground=true&amp;positiveColor=%2300ADEF&amp;negativeColor=%23FE756C&amp;neutralColor=%23000000&amp;selectColor=%230068A5&amp;currentColor=%2300ADEF&amp;euroResistors=true&amp;hideMenu=true&amp;hideSidebar=false&amp;editable=true&amp;lang=de">
+  </iframe>
+  <br>
+</html>
@@ -0,0 +1,11 @@
+<html>
+  <iframe
+    class="circuitjs-simulation"
+    title="Interaktive DSP-Simulation"
+    width="100%"
+    height="600"
+    style="border: 0;"
+    loading="lazy"
+    src="assets/circuitjs/circuitjs.html?ctz=DwYwlgTgBAZgvAIgIwKgFwM6IAwDpsEEpRgiICs+ATAMxUDsVVAnABz3autLmogBGiKsQAOghOWyoAbhAqoAtpgoBTALRIUAPgBQUKMGlQAHolbYoVACwXzUOlNg5UAd3jJUMOckKKAhsbSOLi8APS6+sAA5iZmFg5QdjTkVJ7O4XoGILEIdtYWSABsFvlpCI5k5fiExGBB5agY3o7SACbB2Cws9PQ0hf1WhVY2rAgZka05RSU2lrPTZalQCgD2iK0qMH4ArgA2aGMRBpOmCPlQ0-ZUM47uS6vrmzv7h5nAJ4gJ5+cOi4prCA2Wz2B3GxxyP2uF2Kc1uQn+j2BLzB0RyX1mySosLKUhRLgh8xhNgKxRxr0i+NOkIsxKucIaKJEaBytMuw3i1zKxAUfkQSF8UBEALwvCgGF2iAAKhAACdRFQQPz8KK7FSkAAW5IMRlO7NhUD1VnMZKgbnhsG8-IFPMC8hRMV1syNNNm5CQS3cuKOwEpiFZRLsCycDO9voQtISzrpZJRkpZgZh5Bhv2DjjAADsOsRFXy+MLcMxC64wHzSVAQNgOth+TRmJIUlRWIVyDRhrQ+EhEGo8IQaPRCq33X0Bv2ioUtcBoKckySLDPo6nUJbfPacvOEuuUjHvQB5Ncwy5DWcmjCVL1vYxoqyWflQZhY4Q0MpWRol5Av9AqRAAOQAYhcoAAawACQALwnS9dXIcgDSoGD5ysRtn1fPkPzQL8EB3DBQLAXZdj8NAVmgW8QPAlFIIoegYKQKwYP6GgLiNZCxTfGjUHQxAABEAGUACE1AAQW2DAoj8dMoggtFyGvGiYOGQpGNGYMPwwVi0Iw6U5QVJUVTVEBNRRFYoBUTNkCUjARD9MpjCWSyGiOSIRCgepHFPIQQgnUIVm9IyTL5cy7KKaziVQQKEAcgwnJcxoz1wbh7y1RznM+GKq2rTzvJ0YBQnACBdCAA&amp;whiteBackground=true&amp;positiveColor=%2300ADEF&amp;negativeColor=%23FE756C&amp;neutralColor=%23000000&amp;selectColor=%230068A5&amp;currentColor=%2300ADEF&amp;euroResistors=true&amp;hideMenu=true&amp;hideSidebar=false&amp;editable=true&amp;lang=de">
+  </iframe>
+</html>
@@ -0,0 +1,85 @@
+<html>
+  <style>
+    .dsp-filter-applet {
+      width: 100%;
+    }
+
+    .dsp-filter-applet-controls {
+      margin-bottom: 2rem;
+    }
+
+    .dsp-filter-applet figure {
+      margin-bottom: 3rem;
+    }
+
+    .dsp-filter-applet figure img {
+      display: block;
+      width: 100%;
+      min-width: 0;
+      max-width: 100%;
+      max-height: none;
+    }
+
+    @media (min-width: 800px) {
+      .course .dsp-filter-applet {
+        width: 59.3%;
+      }
+
+      .course .margin .dsp-filter-applet {
+        width: 100%;
+      }
+    }
+  </style>
+
+  Das folgende Applet visualisiert eine mögliche Filtermethode für die Einseitenbandmodulation. Mit den Buttons kann zwischen LSB und USB gewechselt werden. Die Frequenzen und das Spektrum werden entsprechend angepasst.<br><br>
+
+  <section class="dsp-filter-applet" aria-label="Filtermethode für Einseitenbandmodulation">
+    <div class="btn-group dsp-filter-applet-controls" role="group" aria-label="Seitenband auswählen">
+      <button type="button" class="btn btn-primary" data-sideband="lsb" aria-pressed="true">LSB</button>
+      <button type="button" class="btn btn-outline-primary" data-sideband="usb" aria-pressed="false">USB</button>
+    </div>
+
+    <div data-sideband-panel="lsb">
+      <figure>
+        <img src="pictures/831.svg" alt="Frequenzen mit der Filtermethode bei LSB">
+      </figure>
+      <figure>
+        <img src="pictures/940.svg" alt="Spektrum mit der Filtermethode bei LSB">
+      </figure>
+    </div>
+
+    <div data-sideband-panel="usb" hidden>
+      <figure>
+        <img src="pictures/832.svg" alt="Frequenzen mit der Filtermethode bei USB">
+      </figure>
+      <figure>
+        <img src="pictures/941.svg" alt="Spektrum mit der Filtermethode bei USB">
+      </figure>
+    </div>
+
+    <script>
+      (() => {
+        const applet = document.currentScript.closest(".dsp-filter-applet");
+        const buttons = applet.querySelectorAll("[data-sideband]");
+        const panels = applet.querySelectorAll("[data-sideband-panel]");
+
+        function showSideband(sideband) {
+          buttons.forEach((button) => {
+            const selected = button.dataset.sideband === sideband;
+            button.classList.toggle("btn-primary", selected);
+            button.classList.toggle("btn-outline-primary", !selected);
+            button.setAttribute("aria-pressed", selected);
+          });
+
+          panels.forEach((panel) => {
+            panel.hidden = panel.dataset.sidebandPanel !== sideband;
+          });
+        }
+
+        buttons.forEach((button) => {
+          button.addEventListener("click", () => showSideband(button.dataset.sideband));
+        });
+      })();
+    </script>
+  </section>
+</html>