jessquery
Version:
Modern JavaScript is pretty good, but typing document.querySelector() is a pain. This is a tiny library that makes DOM manipulation easy. jQuery is around 80kb (30kb gzipped), while this is only around 8kb (3.5kb gzipped). Lots of JSDoc comments so it's s
39 lines (35 loc) • 1.09 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Web Audio API</title>
</head>
<body>
<button class="play-sound">Play Sound</button>
<script type="module">
import { $, promisify } from "../index.js"
const playSound = promisify(
(resolve) => {
const context = new AudioContext()
const osc = context.createOscillator()
osc.type = "sine"
osc.frequency.value = 440 // 440 Hz is the "Middle A" pitch
osc.connect(context.destination)
osc.start()
osc.stop(context.currentTime + 2) // play for 2 seconds
osc.onended = resolve
},
5000,
{ fnName: "playSound" }
)
$(".play-sound").on("click", () => {
$(".play-sound")
.text("Playing...")
.do(playSound)
.text("Sound played!")
.css("background-color", "lime")
})
</script>
</body>
</html>