child.html

<!DOCTYPE html>
<html>
<style>
  * {
    font-family: sans-serif;
  }
</style>

<head>
</head>

<body>
  <h4>iframed Game</h4>
  <div>
    <span>Paused:
      <span id="paused"></span>
    </span>
    <br>
    <span>Captions Muted:
      <span id="captions"></span>
    </span>
    <br>
    <span> Sound Muted:
      <span id="muted"></span>
    </span>
    <br>
  </div>


  <script>
    !function (e) { var t = {}; function n(i) { if (t[i]) return t[i].exports; var o = t[i] = { i: i, l: !1, exports: {} }; return e[i].call(o.exports, o, o.exports, n), o.l = !0, o.exports } n.m = e, n.c = t, n.d = function (e, t, i) { n.o(e, t) || Object.defineProperty(e, t, { enumerable: !0, get: i }) }, n.r = function (e) { "undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, { value: "Module" }), Object.defineProperty(e, "__esModule", { value: !0 }) }, n.t = function (e, t) { if (1 & t && (e = n(e)), 8 & t) return e; if (4 & t && "object" == typeof e && e && e.__esModule) return e; var i = Object.create(null); if (n.r(i), Object.defineProperty(i, "default", { enumerable: !0, value: e }), 2 & t && "string" != typeof e) for (var o in e) n.d(i, o, function (t) { return e[t] }.bind(null, o)); return i }, n.n = function (e) { var t = e && e.__esModule ? function () { return e.default } : function () { return e }; return n.d(t, "a", t), t }, n.o = function (e, t) { return Object.prototype.hasOwnProperty.call(e, t) }, n.p = "", n(n.s = 0) }([function (e, t, n) { "use strict"; n.r(t); var i = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (e) { return typeof e } : function (e) { return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e }, o = function (e, t) { if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function") }, s = function () { function e(e, t) { for (var n = 0; n < t.length; n++) { var i = t[n]; i.enumerable = i.enumerable || !1, i.configurable = !0, "value" in i && (i.writable = !0), Object.defineProperty(e, i.key, i) } } return function (t, n, i) { return n && e(t.prototype, n), i && e(t, i), t } }(), r = (function () { function e() { o(this, e) } s(e, null, [{ key: "minLevel", value: function (t) { e.initParams(), "number" != typeof t ? (t = t.toUpperCase(), e.isValidLevelName(t) ? window[e.paramKey].minLevel = e.LEVEL[t] : window[e.paramKey].minLevel = e.LEVEL.GENERAL) : window[e.paramKey].minLevel = t } }, { key: "initParams", value: function () { window[e.paramKey] || (window[e.paramKey] = { emitEnabled: !1, enabled: !0, minLevel: 1 }) } }, { key: "emit", value: function () { var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : "Debugger"; e.initParams(), e.params.emitEnabled && window.dispatchEvent(new Event(t)) } }, { key: "meetsLevelRequirement", value: function () { var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : "GENERAL"; return e.initParams(), !!(e.isValidLevelName(t) && e.LEVEL[t] >= e.params.minLevel) } }, { key: "log", value: function () { var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : "log"; if (e.initParams(), e.isEnabled()) { for (var n = arguments.length, i = Array(n > 1 ? n - 1 : 0), o = 1; o < n; o++)i[o - 1] = arguments[o]; switch (t.toLowerCase()) { case "info": var s; return !!e.meetsLevelRequirement("INFO") && ((s = console).info.apply(s, i), e.emit(), !0); case "debug": var r; return !!e.meetsLevelRequirement("DEBUG") && ((r = console).debug.apply(r, i), e.emit(), !0); case "error": var a; return !!e.meetsLevelRequirement("ERROR") && ((a = console).error.apply(a, i), e.emit(), !0); case "warn": var u; return !!e.meetsLevelRequirement("WARN") && ((u = console).warn.apply(u, i), e.emit(), !0); case "log": case "general": default: var l; return !!e.meetsLevelRequirement("GENERAL") && ((l = console).log.apply(l, i), e.emit(), !0) } } } }, { key: "isValidLevelName", value: function (t) { return e.initParams(), "GENERAL" == t || "DEBUG" == t || "INFO" == t || "WARN" == t || "ERROR" == t } }, { key: "assert", value: function (t) { if (e.initParams(), !t) throw "Assert Error: " + t } }, { key: "isEnabled", value: function () { return window[e.paramKey].enabled } }, { key: "enable", value: function (t) { e.initParams(), window[e.paramKey].enabled = t } }, { key: "params", get: function () { return e.initParams(), window[e.paramKey] } }, { key: "LEVEL", get: function () { return { GENERAL: 1, DEBUG: 2, INFO: 3, WARN: 4, ERROR: 5 } } }, { key: "paramKey", get: function () { return "__spring_roll_debugger_params__" } }]) }(), function () { function e() { var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : void 0; o(this, e), this.width = 1, this.height = 1, this.callback = void 0, t instanceof Function && this.enable(t), this.onResize = this.onResize.bind(this) } s(e, [{ key: "onResize", value: function (e) { var t = e.target.innerWidth, n = e.target.innerHeight; this.callback({ width: t, height: n, ratio: t / n }), this.width = t, this.height = n } }, { key: "enable", value: function () { var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : void 0; e instanceof Function ? (this.callback = e, window.addEventListener("resize", this.onResize)) : console.warn("Scale Manager was not passed a function") } }, { key: "disable", value: function () { window.removeEventListener("resize", this.onResize) } }]) }(), function () { function e() { var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {}, n = t.voice, i = void 0 === n ? 0 : n, s = t.rate, r = void 0 === s ? 1 : s, a = t.pitch, u = void 0 === a ? 0 : a, l = t.volume, c = void 0 === l ? 1 : l; o(this, e), this.voiceOptions = [], this.voicesLoaded = !1, this.queue = [], this.options = { voice: {}, rate: r, pitch: u, volume: c }; var h = function () { this.voiceOptions = window.speechSynthesis.getVoices(), this.voice = this.setVoice(i), this.voicesLoaded = !0 }.bind(this), f = window.speechSynthesis.getVoices(); Array.isArray(f) && 0 < f.length ? h() : window.speechSynthesis.addEventListener("voiceschanged", h, { once: !0 }) } s(e, [{ key: "pause", value: function () { this.speaking = !1, window.speechSynthesis.pause() } }, { key: "resume", value: function () { this.speaking = !0, window.speechSynthesis.resume() } }, { key: "cancel", value: function () { this.speaking = !1, this.pause(), this.queue.length = 0, window.speechSynthesis.cancel() } }, { key: "say", value: function (e) { var t = this; if (!this.speaking && this.voicesLoaded) { this.speaking = !0; var n = new SpeechSynthesisUtterance(e); Object.assign(n, this.options), n.onend = function () { t.speaking = !1, 0 < t.queue.length && t.say(t.queue.shift()) }, window.speechSynthesis.speak(n) } else this.queue.push(e) } }, { key: "rangeLimit", value: function (e, t, n) { return isNaN(n) ? (console.warn("'" + n + "' is not a valid number!"), e) : n >= t ? t : e >= n ? e : n } }, { key: "setVoice", value: function (e) { this.options.voice = this.voiceOptions[e] } }, { key: "getVoice", value: function () { return this.options.voice } }, { key: "rate", set: function (e) { this.options.rate = this.rangeLimit(.1, 10, e) }, get: function () { return this.options.rate } }, { key: "pitch", set: function (e) { this.options.pitch = this.rangeLimit(0, 2, e) }, get: function () { return this.options.pitch } }, { key: "volume", set: function (e) { this.options.volume = this.rangeLimit(0, 1, e) }, get: function () { return this.options.volume } }]) }(), function () { function e() { o(this, e), this.element = null, null === document.getElementById("color__filter__svg") && (document.head.innerHTML += '<svg\n      id="color__filter__svg" xmlns="http://www.w3.org/2000/svg"\n      version="1.1">\n      <defs>\n        <filter id="color__filter__protanopia">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.567, 0.433, 0,     0, 0\n                    0.558, 0.442, 0,     0, 0\n                    0,     0.242, 0.758, 0, 0\n                    0,     0,     0,     1, 0"/>\n        </filter>\n        <filter id="color__filter__protanomaly">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.817, 0.183, 0,     0, 0\n                    0.333, 0.667, 0,     0, 0\n                    0,     0.125, 0.875, 0, 0\n                    0,     0,     0,     1, 0"/>\n        </filter>\n        <filter id="color__filter__deuteranopia">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.625, 0.375, 0,   0, 0\n                    0.7,   0.3,   0,   0, 0\n                    0,     0.3,   0.7, 0, 0\n                    0,     0,     0,   1, 0"/>\n        </filter>\n        <filter id="color__filter__deuteranomaly">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.8,   0.2,   0,     0, 0\n                    0.258, 0.742, 0,     0, 0\n                    0,     0.142, 0.858, 0, 0\n                    0,     0,     0,     1, 0"/>\n        </filter>\n        <filter id="color__filter__tritanopia">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.95, 0.05,  0,     0, 0\n                    0,    0.433, 0.567, 0, 0\n                    0,    0.475, 0.525, 0, 0\n                    0,    0,     0,     1, 0"/>\n        </filter>\n        <filter id="color__filter__tritanomaly">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.967, 0.033, 0,     0, 0\n                    0,     0.733, 0.267, 0, 0\n                    0,     0.183, 0.817, 0, 0\n                    0,     0,     0,     1, 0"/>\n        </filter>\n        <filter id="color__filter__achromatopsia">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.299, 0.587, 0.114, 0, 0\n                    0.299, 0.587, 0.114, 0, 0\n                    0.299, 0.587, 0.114, 0, 0\n                    0,     0,     0,     1, 0"/>\n        </filter>\n        <filter id="color__filter__achromatomaly">\n          <feColorMatrix\n            in="SourceGraphic"\n            type="matrix"\n            values="0.618, 0.320, 0.062, 0, 0\n                    0.163, 0.775, 0.062, 0, 0\n                    0.163, 0.320, 0.516, 0, 0\n                    0,     0,     0,     1, 0"/>\n        </filter>\n      </defs>\n      </svg>\n      ') } s(e, [{ key: "applyFilter", value: function (e, t) { this.element = e, this.changeFilter(t) } }, { key: "changeFilter", value: function (e) { null !== this.element && (this.element.style.filter = "url(#color__filter__" + e + ")") } }, { key: "removeFilter", value: function () { this.element.style.filter = null } }, { key: "types", get: function () { return [{ name: "Protanopia", value: "protanopia" }, { name: "Protanomaly", value: "protanomaly" }, { name: "Deuteranopia", value: "deuteranopia" }, { name: "Deuteranomaly", value: "deuteranomaly" }, { name: "Tritanopia", value: "tritanopia" }, { name: "Tritanomaly", value: "tritanomaly" }, { name: "Achromatopsia", value: "achromatopsia" }, { name: "Achromatomaly", value: "achromatomaly" }] } }]) }(), function () { function e(t) { var n = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : function () { }, i = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : function () { }; o(this, e), this.key = t, this._state = 0, this.actions = { up: i, down: n } } return s(e, [{ key: "updateState", value: function () { var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : 0; e < 3 && e > -1 && (this._state = e) } }, { key: "action", value: function () { 1 === this.state ? this.actions.down() : 2 === this.state && (this.actions.up(), this.updateState(0)) } }, { key: "state", get: function () { return this._state } }]), e }()), a = (function () { function e() { var t = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : []; o(this, e), this.assignButtons(t), window.addEventListener("keydown", this.onKeyDown.bind(this)), window.addEventListener("keyup", this.onKeyUp.bind(this)) } s(e, [{ key: "update", value: function () { for (var e = 0, t = this.keys.length; e < t; e++)this.buttons[this.keys[e]].action() } }, { key: "onKeyDown", value: function (e) { this.onKey(e, 1) } }, { key: "onKeyUp", value: function (e) { this.onKey(e, 2) } }, { key: "assignButtons", value: function (e) { this.buttons = {}, this.keys = []; for (var t = 0, n = e.length; t < n; t++)this.keys.push(e[t].key), this.buttons[e[t].key] = new r(e[t].key, e[t].down, e[t].up) } }, { key: "onKey", value: function (e, t) { var n = e.key.toLowerCase(); this.buttons[n] && this.buttons[n].updateState(t) } }]) }(), "function" == typeof Symbol && "symbol" == i(Symbol.iterator) ? function (e) { return void 0 === e ? "undefined" : i(e) } : function (e) { return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : void 0 === e ? "undefined" : i(e) }), u = function (e, t) { if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function") }, l = function () { function e(e, t) { for (var n = 0; n < t.length; n++) { var i = t[n]; i.enumerable = i.enumerable || !1, i.configurable = !0, "value" in i && (i.writable = !0), Object.defineProperty(e, i.key, i) } } return function (t, n, i) { return n && e(t.prototype, n), i && e(t, i), t } }(), c = function (e, t) { if (!e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return !t || "object" != (void 0 === t ? "undefined" : i(t)) && "function" != typeof t ? e : t }, h = function () { function e() { u(this, e), this._listeners = {} } return l(e, [{ key: "on", value: function (e, t) { var n = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : 0; this._listeners[e] || (this._listeners[e] = []), t._priority = parseInt(n) || 0, -1 === this._listeners[e].indexOf(t) && (this._listeners[e].push(t), this._listeners[e].length > 1 && this._listeners[e].sort(this.listenerSorter)) } }, { key: "listenerSorter", value: function (e, t) { return e._priority - t._priority } }, { key: "off", value: function (e, t) { if (void 0 !== this._listeners[e]) if (void 0 !== t) { var n = this._listeners[e].indexOf(t); -1 < n && this._listeners[e].splice(n, 1) } else delete this._listeners[e] } }, { key: "trigger", value: function (e) { if ("string" == typeof e && (e = { type: e }), void 0 !== this._listeners[e.type]) for (var t = this._listeners[e.type].length - 1; t >= 0; t--)this._listeners[e.type][t](e) } }, { key: "destroy", value: function () { this._listeners = {} } }]), e }(), f = function (e) { function t() { var e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : 100 * Math.random() | 0; u(this, t); var n = c(this, (t.__proto__ || Object.getPrototypeOf(t)).call(this)); return n.id = "BELLHOP:" + e, n.connected = !1, n.isChild = !0, n.connecting = !1, n.origin = "*", n._sendLater = [], n.iframe = null, n } return function (e, t) { if ("function" != typeof t && null !== t) throw new TypeError("Super expression must either be null or a function, not " + (void 0 === t ? "undefined" : i(t))); e.prototype = Object.create(t && t.prototype, { constructor: { value: e, enumerable: !1, writable: !0, configurable: !0 } }), t && (Object.setPrototypeOf ? Object.setPrototypeOf(e, t) : e.__proto__ = t) }(t, h), l(t, [{ key: "receive", value: function (e) { this.target === e.source && ("connected" === e.data ? this.onConnectionReceived(e.data) : this.connected && "object" === a(e.data) && e.data.type && this.trigger(e.data)) } }, { key: "onConnectionReceived", value: function (e) { this.connecting = !1, this.connected = !0, this.trigger("connected"), this.isChild || this.target.postMessage(e, this.origin); for (var t = 0, n = this._sendLater.length; t < n; t++) { var i = this._sendLater[t], o = i.type, s = i.data; this.send(o, s) } this._sendLater.length = 0 } }, { key: "connect", value: function (e) { var t = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : "*"; this.connecting || (this.disconnect(), this.connecting = !0, e instanceof HTMLIFrameElement && (this.iframe = e), this.isChild = void 0 === e, this.origin = t, window.addEventListener("message", this.receive.bind(this)), this.isChild && (window === this.target ? this.trigger("failed") : this.target.postMessage("connected", this.origin))) } }, { key: "disconnect", value: function () { this.connected = !1, this.connecting = !1, this.origin = null, this.iframe = null, this.isChild = !0, this._sendLater.length = 0, window.removeEventListener("message", this.receive) } }, { key: "send", value: function (e) { var t = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {}; if ("string" != typeof e) throw "The event type must be a string"; var n = { type: e, data: t }; this.connecting ? this._sendLater.push(n) : this.target.postMessage(n, this.origin) } }, { key: "fetch", value: function (e, t) { var n = this, i = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : {}, o = arguments.length > 3 && void 0 !== arguments[3] && arguments[3]; if (!this.connecting && !this.connected) throw "No connection, please call connect() first"; this.on(e, function e(i) { o && n.off(i.type, e), t(i) }), this.send(e, i) } }, { key: "respond", value: function (e) { var t = this, n = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : {}, i = arguments.length > 2 && void 0 !== arguments[2] && arguments[2]; this.on(e, function o(s) { i && t.off(s.type, o), t.send(e, n) }) } }, { key: "destroy", value: function () { (function e(t, n, i) { null === t && (t = Function.prototype); var o = Object.getOwnPropertyDescriptor(t, n); if (void 0 === o) { var s = Object.getPrototypeOf(t); return null === s ? void 0 : e(s, n, i) } if ("value" in o) return o.value; var r = o.get; return void 0 !== r ? r.call(i) : void 0 })(t.prototype.__proto__ || Object.getPrototypeOf(t.prototype), "destroy", this).call(this), this.disconnect(), this._sendLater.length = 0 } }, { key: "target", get: function () { return this.isChild ? window.parent : this.iframe.contentWindow } }]), t }(), d = function () { function e(t) { var n = this; o(this, e), this._value = t, this.listeners = [], Object.defineProperty(this, "value", { get: function () { return n._value }, set: function (e) { n._value = e, n.notifyChange() } }) } return s(e, [{ key: "notifyChange", value: function () { var e = this; this.listeners.forEach(function (t) { t(e.value) }) } }, { key: "subscribe", value: function (e) { this.listeners.push(e) } }, { key: "unsubscribe", value: function (e) { this.listeners = this.listeners.filter(function (t) { return t !== e }) } }, { key: "hasListeners", get: function () { return this.listeners.length > 0 } }]), e }(), v = function () { function e() { o(this, e) } return s(e, [{ key: "addField", value: function (e, t) { if (void 0 !== this[e]) throw new Error('"' + e + '" is already a registered property'); return this[e] = new d(t), this[e] } }]), e }(), p = function () { function e() { var t = this, n = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : {}; o(this, e), this.state = new v, this.state.addField("ready", !1), this.state.addField("soundMuted", !1), this.state.addField("captionsMuted", !0), this.state.addField("musicMuted", !1), this.state.addField("voMuted", !1), this.state.addField("sfxMuted", !1), this.state.addField("pause", !1), this.features = Object.assign({ captions: !1, sound: !1, vo: !1, music: !1, sfxButton: !1 }, n), (this.features.vo || this.features.music || this.features.sfxButton) && (this.features.sound = !0), this.container = new f, this.container.connect(), this.container.send("features", this.features), this.container.send("keepFocus", !1), ["soundMuted", "captionsMuted", "musicMuted", "voMuted", "sfxMuted", "pause"].forEach(function (e) { var n = t.state[e]; t.container.on(e, function (e) { return n.value = e.data }) }), window.addEventListener("focus", function () { return t.container.send("focus", !0) }), window.addEventListener("blur", function () { return t.container.send("focus", !1) }), e._plugins.forEach(function (e) { return e.setup.call(t) }); var i = e._plugins.map(function (e) { return t.promisify(e.preload) }); Promise.all(i).catch(function (e) { console.warn(e) }).then(function () { t.validateListeners() }).catch(function (e) { console.warn(e) }).then(function () { t.container.send("loaded"), t.state.ready.value = !0 }) } return s(e, [{ key: "promisify", value: function (e) { var t = this; return 0 === e.length ? Promise.resolve(e.call(this)) : new Promise(function (n, i) { e.call(t, function (e) { e ? i(e) : n(e) }) }) } }, { key: "validateListeners", value: function () { var e = this, t = [], n = { captions: "captionsMuted", sound: "soundMuted", music: "musicMuted", vo: "voMuted", sfxButton: "sfxMuted" }; if (Object.keys(n).forEach(function (i) { var o = n[i]; e.features[i] && !e.state[o].hasListeners && t.push(o) }), this.state.pause.hasListeners || t.push("pause"), t.length) throw new Error("Application state is missing required listeners: " + t.join(", ") + ".") } }]), e }(); p._plugins = [], p.uses = function (e) { p._plugins.push(e), p._plugins.sort(function (e, t) { return t.priority - e.priority }) }; const y = new p({ captions: !0, sound: !0 }); function m(e, t) { document.getElementById(e).innerText = t } y.state.pause.subscribe(e => m("paused", e)), y.state.captionsMuted.subscribe(e => m("captions", e)), y.state.soundMuted.subscribe(e => m("muted", e)), window.app = y }]);
  </script>
</body>

</html>