Dear All,
I have been working on a countdown timer and have achieved the following by utilising code and snippets from a number of resources, the html element shows the countdown from 1 min (60secs) down to zero (0), once the countdown timer hits zero (0) I would like it to run some code is this possible? I would also like for the below code to start onClick of a page button element ('#update') if anyone can help with this it would be greatly appreciated @Yisrael (Wix) ? :
<html>
<head>
<script type="text/javascript">
// when a message is received from the page code
window.onmessage = (event) => {
if (event.data) {
document.getElementById("clock").innerHTML = event.data;
}
};
// send message to the page code
function button_click() {
window.parent.postMessage(document.getElementById("theMessage").value, "*");
}
</script>
</head>
<body>
<div id="clock"></div>
</body>
<script type="text/javascript">
function countdown(element, minutes, seconds) {
// set time for the particular countdown
var time = minutes*60 + seconds;
var interval = setInterval(function() {
var el = document.getElementById(element);
// if the time is 0 then end the counter
if (time <= 0) {
var text = "Updating";
el.innerHTML = text;
setTimeout(function() {
countdown('clock', 0, 60);
}, 3000);
clearInterval(interval);
return;
}
}
var minutes = Math.floor( time / 60 );
if (minutes < 10) minutes = "0" + minutes;
var seconds = time % 60;
if (seconds < 10) seconds = "0" + seconds;
var text = minutes + ':' + seconds;
el.innerHTML = text;
time--;
}, 1000);
}
countdown('clock', 0, 60);
</script>
</html>
The short answer to your question: no
The long answer: No. The HtmlComponent was designed to contain vanilla HTML and it works just fine. However, it can't access the parent page. You can't try to trick it by using parent, window, top, etc. Same goes with the Javascript evaluate() function. It is sandboxed and does not allow access to the DOM.