From 06aa2ffa6bc1a13d0ea919d34bcb8e2ce5d09ac1 Mon Sep 17 00:00:00 2001
From: Ethan O'Brien <77750390+ethanaobrien@users.noreply.github.com>
Date: Sat, 1 Jul 2023 13:59:39 -0500
Subject: [PATCH] Ads
---
index.html | 1 +
src/css/main.css | 53 ++++++++++++++++++++++++++++++++++++++++++++++++
src/emulator.js | 46 ++++++++++++++++++++++++++++++++++++++++-
src/loader.js | 1 +
4 files changed, 100 insertions(+), 1 deletion(-)
diff --git a/index.html b/index.html
index cb1cd1c..b560853 100644
--- a/index.html
+++ b/index.html
@@ -7,5 +7,6 @@
EJS_core = 'nes';
EJS_gameUrl = 'mega_mountain.nes';
EJS_DEBUG_XX = true;
+ EJS_AdUrl = "https://www.google.com/search?igu=1";
diff --git a/src/css/main.css b/src/css/main.css
index f19afcf..eda3c92 100644
--- a/src/css/main.css
+++ b/src/css/main.css
@@ -44,6 +44,59 @@
scrollbar-color:transparent #f5f5f5;
}
+.ejs_ad_iframe {
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ z-index: 1;
+ transform: translate(-50%, -50%);
+}
+.ejs_ad_close {
+ cursor: pointer;
+}
+.ejs_ad_close:after {
+ content: "";
+ position: absolute;
+ border-left: 20px solid transparent;
+ border-right: 20px solid #a7a7a77d;
+ border-top: 20px solid #a7a7a77d;
+ border-bottom: 20px solid transparent;
+ right: 0;
+}
+.ejs_ad_close a {
+ right: 4px;
+ top: 4px;
+ position: absolute;
+ border: 0;
+ padding: 0;
+ width: 15px;
+ height: 15px;
+ z-index: 99;
+}
+.ejs_ad_close a:before {
+ content: "";
+ border-bottom: 1px solid #fff;
+ transform: rotate(45deg) translateY(-45%);
+ width: 15px;
+ height: 15px;
+ display: block;
+ position: absolute;
+ top: 0;
+ right: 0;
+}
+.ejs_ad_close a:after {
+ content: "";
+ border-bottom: 1px solid #fff;
+ width: 15px;
+ height: 15px;
+ display: block;
+ position: absolute;
+ right: 0;
+ background: transparent;
+ top: 0;
+ transform: rotate(-45deg) translateY(-50%) translateX(0);
+}
+
.ejs_game {/* todo. User selectable background loading image */
width: 100%;
height: 100%;
diff --git a/src/emulator.js b/src/emulator.js
index 5eb57ec..6a7b89f 100644
--- a/src/emulator.js
+++ b/src/emulator.js
@@ -158,6 +158,7 @@ class EmulatorJS {
this.config = config;
this.setElements(element);
this.setColor(this.config.color || "");
+ if (this.config.adUrl) this.setupAds(this.config.adUrl);
this.canvas = this.createElement('canvas');
this.canvas.classList.add('ejs_canvas');
this.bindListeners();
@@ -200,6 +201,43 @@ class EmulatorJS {
}
this.elements.parent.setAttribute("style", "--ejs-primary-color:" + getColor(color) + ";");
}
+ setupAds(ads) {
+ const div = this.createElement("div");
+ div.classList.add("ejs_ad_iframe");
+ const frame = this.createElement("iframe");
+ frame.src = ads;
+ frame.setAttribute("scrolling", "no");
+ frame.setAttribute("frameborder", "no");
+ frame.style.width = "300px";
+ frame.style.height = "250px";
+
+ const closeParent = this.createElement("div");
+ closeParent.classList.add("ejs_ad_close");
+ const closeButton = this.createElement("a");
+ closeParent.appendChild(closeButton);
+ closeParent.setAttribute("hidden", "");
+ div.appendChild(closeParent);
+ div.appendChild(frame);
+ this.elements.parent.appendChild(div);
+ this.addEventListener(closeButton, "click", () => {
+ div.remove();
+ })
+
+ this.on("start", () => {
+ closeParent.removeAttribute("hidden");
+ })
+
+ }
+ functions = {};
+ on(event, func) {
+ if (!Array.isArray(this.functions[event])) this.functions[event] = [];
+ this.functions[event].push(func);
+ }
+ callEvent(event, data) {
+ if (!Array.isArray(this.functions[event])) return 0;
+ this.functions[event].forEach(e => e(data));
+ return this.functions[event].length;
+ }
setElements(element) {
const game = this.createElement("div");
const elem = document.querySelector(element);
@@ -593,6 +631,7 @@ class EmulatorJS {
this.updateCheatUI();
this.updateGamepadLabels();
this.elements.parent.focus();
+ this.callEvent("start");
}
bindListeners() {
this.createContextMenu();
@@ -840,8 +879,13 @@ class EmulatorJS {
let stateUrl;
addButton("Save State", '', async () => {
- if (stateUrl) URL.revokeObjectURL(stateUrl);
const state = await this.gameManager.getState();
+ const called = this.callEvent("save", {
+ screenshot: this.gameManager.screenshot(),
+ state: state
+ });
+ if (called > 0) return;
+ if (stateUrl) URL.revokeObjectURL(stateUrl);
const blob = new Blob([state]);
stateUrl = URL.createObjectURL(blob);
const a = this.createElement("a");
diff --git a/src/loader.js b/src/loader.js
index 6cf070a..a2759e0 100644
--- a/src/loader.js
+++ b/src/loader.js
@@ -49,6 +49,7 @@
config.biosUrl = window.EJS_biosUrl;
config.gameName = window.EJS_gameName;
config.color = window.EJS_color;
+ config.adUrl = window.EJS_AdUrl;
new EmulatorJS(EJS_player, config);