🔧 Use factory to create shaders

src/EnergizeA.js

@@ -20,7 +20,7 @@ const _ = imports.gettext.domain('burn-my-windows').gettext;
 const ExtensionUtils = imports.misc.extensionUtils;
 const Me             = imports.misc.extensionUtils.getCurrentExtension();
 const utils          = Me.imports.src.utils;
-const Effect         = Me.imports.src.Effect.Effect;
+const ShaderFactory  = Me.imports.src.ShaderFactory.ShaderFactory;
 
 //////////////////////////////////////////////////////////////////////////////////////////
 // This effect looks a bit like the transporter effect from TOS.                        //
@@ -29,7 +29,34 @@ const Effect         = Me.imports.src.Effect.Effect;
 // The effect class can be used to get some metadata (like the effect's name or supported
 // GNOME Shell versions), to initialize the respective page of the settings dialog, as
 // well as to create the actual shader for the effect.
-var EnergizeA = class EnergizeA extends Effect {
+var EnergizeA = class EnergizeA {
+
+  // The constructor creates a ShaderFactory which will be used by extension.js to create
+  // shader instances for this effect. The shaders will be automagically created using the
+  // GLSL file in resources/shaders/<nick>.glsl. The callback will be called for each
+  // newly created shader instance.
+  constructor() {
+    this.shaderFactory = new ShaderFactory(this.getNick(), (shader) => {
+      // We import Clutter in this function as it is not available in the preferences
+      // process. This creator function of the ShaderFactory is only called within GNOME
+      // Shell's process.
+      const Clutter = imports.gi.Clutter;
+
+      // Store uniform locations of newly created shaders.
+      shader._uColor = shader.get_uniform_location('uColor');
+      shader._uScale = shader.get_uniform_location('uScale');
+
+      // Write all uniform values at the start of each animation.
+      shader.connect('begin-animation', (shader, settings) => {
+        const c = Clutter.Color.from_string(settings.get_string('energize-a-color'))[1];
+
+        // clang-format off
+        shader.set_uniform_float(shader._uColor, 3, [c.red / 255, c.green / 255, c.blue / 255]);
+        shader.set_uniform_float(shader._uScale, 1, [settings.get_double('energize-a-scale')]);
+        // clang-format on
+      });
+    });
+  }
 
   // ---------------------------------------------------------------------------- metadata
 
@@ -72,43 +99,10 @@ var EnergizeA = class EnergizeA extends Effect {
 
   // ---------------------------------------------------------------- API for extension.js
 
-  // This is called by the effect's base class whenever a new shader is required. Since
-  // this shader depends on classes by GNOME Shell, we register it locally in this method
-  // as this file is also included from the preferences dialog where those classes would
-  // not be available.
-  createShader() {
-
-    // Only register the shader class when this method is called for the first time.
-    if (!this._ShaderClass) {
-
-      const Clutter = imports.gi.Clutter;
-      const Shader  = Me.imports.src.Shader.Shader;
-
-      this._ShaderClass = GObject.registerClass({}, class ShaderClass extends Shader {
-        // We use the constructor of the shader to store all required uniform locations.
-        _init(effect) {
-          super._init(effect);
-
-          this._uColor = this.get_uniform_location('uColor');
-          this._uScale = this.get_uniform_location('uScale');
-        }
-
-        // This is called once each  time the shader is used. This can be used to retrieve
-        // the configuration from the settings and update all uniforms accordingly.
-        beginAnimation(actor, settings, forOpening) {
-          super.beginAnimation(actor, settings, forOpening);
-
-          const c = Clutter.Color.from_string(settings.get_string('energize-a-color'))[1];
-
-          // clang-format off
-          this.set_uniform_float(this._uColor, 3, [c.red / 255, c.green / 255, c.blue / 255]);
-          this.set_uniform_float(this._uScale, 1, [settings.get_double('energize-a-scale')]);
-          // clang-format on
-        }
-      });
-    }
-
-    // Finally, return a new instance of the shader class.
-    return new this._ShaderClass(this);
+  // The getActorScale() is called from extension.js to adjust the actor's size during the
+  // animation. This is useful if the effect requires drawing something beyond the usual
+  // bounds of the actor. This only works for GNOME 3.38+.
+  getActorScale(settings) {
+    return {x: 1.0, y: 1.0};
   }
 }