HTML-Comp-Anfrage
by velo_ninja
HTML
<!doctype html>
<html>
<head>
<script type="text/javascript">
function create_Button() {
var button = document.createElement("button");
button.innerHTML = "Click me!";
button.style.height = '20px';
button.style.width = '40px';
button.style.position = "absolute";
button.style.top = "50%";
button.style.left = "50%";
button.style.transform = "translate(-50%, -50%)";
button.id = "centeredButton";
button.addEventListener("click", requestMicrophoneAccess);
document.body.appendChild(button);
}
function requestMicrophoneAccess() {
console.log("Button clicked! Requesting microphone access...");
navigator.mediaDevices.getUserMedia({ audio: true })
.then(function(stream) {console.log("Microphone access granted");})
.catch(function(error) {console.error("Error accessing microphone:", error);
});
}
//----------------------------------------------------
function init () {
window.onmessage = (event) => {
if (event.data) { console.log("HTML Code Element received a message!");
setTimeout(()=>{
var titleElement = document.getElementById('title'); console.log(titleElement);
if (titleElement) {titleElement.innerText = 'New Message';}
else {console.error('Element with ID "title" not found.');}
//var title = document.getElementById('title');
// title.style.textContent = 'xxxxxxxxxxxxxxx';
create_Button();
},1000);
}
}
}
// display received message
function insertMessage(msg) {
document.getElementById('demo').innerHTML = msg;
sendReturnMessage("Message from the HTML Component!");
}
// send message to the page code
function sendReturnMessage(msg) {
window.parent.postMessage(msg, "https://www.media-junkie.com/chatgpt");
}
</script>
</head>
<body onload="init();" style="background-color:lightgray;">
<h1>HTML Component Test</h1>
<p id="title">Message will go...
JavaScript
// Call the function to create the centered button