Arrow functions as onclick handlers

This commit is contained in:
Filip Troníček 2021-02-08 15:52:15 +01:00
parent c487bed906
commit 8c4c1cd040

View File

@ -57,97 +57,97 @@ As for the actually details for methods and options available to dynamically con
```js ```js
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Mute Speaker"; button.innerHTML = "Mute Speaker";
button.onclick = function(){iframe.contentWindow.postMessage({"mute":true}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "mute": true }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Un-Mute Speaker"; button.innerHTML = "Un-Mute Speaker";
button.onclick = function(){iframe.contentWindow.postMessage({"mute":false}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "mute": false }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Toggle Speaker"; button.innerHTML = "Toggle Speaker";
button.onclick = function(){iframe.contentWindow.postMessage({"mute":"toggle"}, '*');} button.onclick = () => { iframe.contentWindow.postMessage({ "mute": "toggle" }, '*'); }
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Mute Mic"; button.innerHTML = "Mute Mic";
button.onclick = function(){iframe.contentWindow.postMessage({"mic":false}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "mic": false }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Un-Mute Mic"; button.innerHTML = "Un-Mute Mic";
button.onclick = function(){iframe.contentWindow.postMessage({"mic":true}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "mic": true }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Toggle Mic"; button.innerHTML = "Toggle Mic";
button.onclick = function(){iframe.contentWindow.postMessage({"mic":"toggle"}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "mic": "toggle" }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Disconnect"; button.innerHTML = "Disconnect";
button.onclick = function(){iframe.contentWindow.postMessage({"close":true}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "close": true }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Low Bitrate"; button.innerHTML = "Low Bitrate";
button.onclick = function(){iframe.contentWindow.postMessage({"bitrate":30}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "bitrate": 30 }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "High Bitrate"; button.innerHTML = "High Bitrate";
button.onclick = function(){iframe.contentWindow.postMessage({"bitrate":5000}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "bitrate": 5000 }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Default Bitrate"; button.innerHTML = "Default Bitrate";
button.onclick = function(){iframe.contentWindow.postMessage({"bitrate":-1}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "bitrate": -1 }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Reload"; button.innerHTML = "Reload";
button.onclick = function(){iframe.contentWindow.postMessage({"reload":true}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "reload": true }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "50% Volume"; button.innerHTML = "50% Volume";
button.onclick = function(){iframe.contentWindow.postMessage({"volume":0.5}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "volume": 0.5 }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "100% Volume"; button.innerHTML = "100% Volume";
button.onclick = function(){iframe.contentWindow.postMessage({"volume":1.0}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "volume": 1.0 }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Request Stats"; button.innerHTML = "Request Stats";
button.onclick = function(){iframe.contentWindow.postMessage({"getStats":true}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "getStats": true }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Request Loudness Levels"; button.innerHTML = "Request Loudness Levels";
button.onclick = function(){iframe.contentWindow.postMessage({"getLoudness":true}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "getLoudness": true }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Stop Sending Loudness Levels"; button.innerHTML = "Stop Sending Loudness Levels";
button.onclick = function(){iframe.contentWindow.postMessage({"getLoudness":false}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "getLoudness": false }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "Say Hello"; button.innerHTML = "Say Hello";
button.onclick = function(){iframe.contentWindow.postMessage({"sendChat":"Hello!"}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "sendChat": "Hello!" }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "previewWebcam()"; button.innerHTML = "previewWebcam()";
button.onclick = function(){iframe.contentWindow.postMessage({"function":"previewWebcam"}, '*');}; button.onclick = () => { iframe.contentWindow.postMessage({ "function": "previewWebcam" }, '*'); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
const button = document.createElement("button"); const button = document.createElement("button");
button.innerHTML = "CLOSE IFRAME"; button.innerHTML = "CLOSE IFRAME";
button.onclick = function(){iframeContainer.parentNode.removeChild(iframeContainer);}; button.onclick = () => { iframeContainer.parentNode.removeChild(iframeContainer); };
iframeContainer.appendChild(button); iframeContainer.appendChild(button);
As for listening events, where the parent listens for responses or events from the OBSN child frame: As for listening events, where the parent listens for responses or events from the OBSN child frame: