sliderListener
<html style="overflow: hidden">
<head>
<script>
var PDFZ_src =
"https://dev-apicreator.argoflow.io/aura/media/608029707d48fb059fe10711/content";
</script>
<link
rel="stylesheet"
type="text/css"
href="https://fonts.googleapis.com/css?family=Nunito"
/>
</head>
<body>
<br />
<span id="msg1" style="font-family: Nunito, sans-serif; font-size: 3vw"
>Your energy bill could be as low as </span
><span
id="msg2"
style="
font-family: Helvetica, sans-serif;
font-size: 4vw;
font-weight: bold;
color: #10a3c8;
"
>$465.75 </span
><span id="msg3" style="font-family: Nunito, sans-serif; font-size: 3vw"
>by upgrading your windows to
</span>
<span
id="msg4"
style="font-family: Nunito, sans-serif; font-size: 3vw; font-weight: bold"
></span>
<script>
var slideIndex = 1;
var msgSpans = [
document.getElementById("msg1"),
document.getElementById("msg2"),
document.getElementById("msg3"),
document.getElementById("msg4"),
];
// Inter-webviews message bus
function onMessage(event) {
console.log(
"iframe2 onMessage",
event,
event.data,
event.data.slideIndex,
msgSpans
);
event.source.postMessage("ACK", "*");
if (event.data) {
console.log("span", msgSpans, msgSpans[0].innerHTML);
var model = "";
var saved = 0;
switch (event.data.slideIndex) {
case 1:
model = "Single Glazed JELD-WEN Windows";
saved = 50;
break;
case 2:
model = "Double Glazed JELD-WEN Windows";
saved = 60;
break;
case 3:
model = "Triple Glazed JELD-WEN Windows";
saved = 75;
break;
}
msgSpans[0].innerHTML = "Your energy bill could be as low as ";
msgSpans[1].innerHTML = "$" + ((405 - saved) * 1.15).toFixed(2) + " ";
msgSpans[2].innerHTML = "by upgrading your windows to ";
msgSpans[3].innerHTML = model;
}
}
window.addEventListener("message", onMessage);
</script>
</body>
</html>