a basic mosquito, i got a bad feeling about this

tholman · Feb 23, 2020 · 717bee2 · 717bee2
1 parent a684f6e
commit 717bee2
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 0 deletions.
diff --git a/mosquito/index.html b/mosquito/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8" />
+		<title>Mosquito JS</title>
+		<link rel="stylesheet" href="./style.css" />
+	</head>
+	<body>
+		<header class="center">
+			<button>🦟</button>
+		</header>
+		<script src="./mosquito.js"></script>
+	</body>
+</html>
diff --git a/mosquito/mosquito.js b/mosquito/mosquito.js
@@ -0,0 +1,15 @@
+
+let context = new (window.AudioContext || window.webkitAudioContext)();
+
+let oscillator = context.createOscillator();
+oscillator.type = "sawtooth";
+oscillator.frequency.setValueAtTime(750, context.currentTime);
+
+const gainNode = context.createGain();
+gainNode.connect(context.destination);
+
+oscillator.connect(gainNode);
+
+document.querySelector("button").onclick = () => {
+  oscillator.start();
+};
diff --git a/mosquito/style.css b/mosquito/style.css
@@ -0,0 +1,22 @@
+* {
+  box-sizing: border-box;
+}
+
+html,
+body {
+  margin: 0;
+}
+
+.center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+header {
+  width: 100%;
+  height: 100vh;
+  background: #fff;
+  flex-direction: column;
+  border: 20px solid #eee;
+}