Extended shader configuration format and custom shaders (#802)

* extended shaders configuration

* EJS_shaders configuration

* additional shaders

data/GameManager.js

@@ -118,10 +118,13 @@ class EJS_GameManager {
                "savefile_directory = \"/data/saves\"\n";
     }
     initShaders() {
-        if (!window.EJS_SHADERS) return;
+        if (!this.EJS.config.shaders) return;
         this.mkdir("/shader");
-        for (const shader in window.EJS_SHADERS) {
+        for (const shaderFileName in this.EJS.config.shaders) {
-            this.FS.writeFile('/shader/'+shader, window.EJS_SHADERS[shader]);
+            const shader = this.EJS.config.shaders[shaderFileName];
+            if (typeof shader === 'string') {
+                this.FS.writeFile(`/shader/${shaderFileName}`, shader);
+            }
         }
     }
     clearEJSResetTimer() {

data/emulator.js

@@ -3879,15 +3879,7 @@ class EmulatorJS {
         this.saveSettings();
         if (this.debug) console.log(option, value);
         if (option === "shader") {
-            try {
+            this.enableShader(value);
-                this.Module.FS.unlink("/shader/shader.glslp");
-            } catch(e) {}
-            if (value === "disabled") {
-                this.gameManager.toggleShader(0);
-                return;
-            }
-            this.Module.FS.writeFile("/shader/shader.glslp", window.EJS_SHADERS[value]);
-            this.gameManager.toggleShader(1);
             return;
         } else if (option === "disk") {
             this.gameManager.setCurrentDisk(value);
@@ -4270,16 +4262,34 @@ class EmulatorJS {
             nested.appendChild(menu);
         }
 
-        if (window.EJS_SHADERS) {
+        if (this.config.shaders) {
-            addToMenu(this.localization('Shaders'), 'shader', {
+            const builtinShaders = {
-                'disabled': this.localization("Disabled"),
                 '2xScaleHQ.glslp': this.localization("2xScaleHQ"),
                 '4xScaleHQ.glslp': this.localization("4xScaleHQ"),
-                'crt-easymode.glslp': this.localization('CRT easymode'),
                 'crt-aperture.glslp': this.localization('CRT aperture'),
+                'crt-beam': this.localization('CRT beam'),
+                'crt-caligari': this.localization('CRT caligari'),
+                'crt-easymode.glslp': this.localization('CRT easymode'),
                 'crt-geom.glslp': this.localization('CRT geom'),
-                'crt-mattias.glslp': this.localization('CRT mattias')
+                'crt-lottes': this.localization('CRT lottes'),
-            }, 'disabled');
+                'crt-mattias.glslp': this.localization('CRT mattias'),
+                'crt-yeetron': this.localization('CRT yeetron'),
+                'crt-zfast': this.localization('CRT zfast'),
+                'sabr': this.localization('SABR'),
+                'bicubic': this.localization('Bicubic'),
+                'mix-frames': this.localization('Mix frames'),
+            };
+            let shaderMenu = {
+                'disabled': this.localization("Disabled"),
+            };
+            for (const shaderName in this.config.shaders) {
+                if (builtinShaders[shaderName]) {
+                    shaderMenu[shaderName] = builtinShaders[shaderName];
+                } else {
+                    shaderMenu[shaderName] = shaderName;
+                }
+            }
+            addToMenu(this.localization('Shaders'), 'shader', shaderMenu, 'disabled');
         }
         
         addToMenu(this.localization('FPS'), 'fps', {
@@ -5168,6 +5178,33 @@ class EmulatorJS {
         this.gameManager.setCheat(index, checked, code);
     }
 
+    enableShader(name) {
+        try {
+            this.Module.FS.unlink("/shader/shader.glslp");
+        } catch(e) {}
+
+        if (name === "disabled" || !this.config.shaders[name]) {
+            this.gameManager.toggleShader(0);
+            return;
+        }
+
+        const shaderConfig = this.config.shaders[name];
+
+        if (typeof shaderConfig === 'string') {
+            this.Module.FS.writeFile("/shader/shader.glslp", shaderConfig, {}, 'w+');
+        } else {
+            const shader = shaderConfig.shader;
+            this.Module.FS.writeFile('/shader/shader.glslp', shader.type === 'base64' ? atob(shader.value) : shader.value, {}, 'w+');
+            if (shaderConfig.resources && shaderConfig.resources.length) {
+                shaderConfig.resources.forEach(resource => {
+                    this.Module.FS.writeFile(`/shader/${resource.name}`, resource.type === 'base64' ? atob(resource.value) : resource.value, {}, 'w+');
+                });
+            }
+        }
+
+        this.gameManager.toggleShader(1);
+    }
+
     collectScreenRecordingMediaTracks(canvasEl, fps) {
         let videoTrack = null;
         const videoTracks = canvasEl.captureStream(fps).getVideoTracks();

data/loader.js

@@ -113,6 +113,7 @@
     config.disableLocalStorage = window.EJS_disableLocalStorage;
     config.forceLegacyCores = window.EJS_forceLegacyCores;
     config.noAutoFocus = window.EJS_noAutoFocus;
+    config.shaders = Object.assign({}, window.EJS_SHADERS, window.EJS_shaders ? window.EJS_shaders : {});
     
     if (typeof window.EJS_language === "string" && window.EJS_language !== "en-US") {
         try {