🎉 focus (again)

README.md

@@ -34,7 +34,8 @@ This extension is not only more useless than the cube, but it is also much more
 | **Doom** <br> Melt your windows. Inspired by the legendary screen transitions of the original Doom.                                                                               | <img src ="docs/pics/doom.gif" />                                                     |
 | **Energize A** <br> Beam your windows away!                                                                                                                                       | <img src ="docs/pics/energize-a.gif" />                                               |
 | **Energize B** <br> Using different transporter technology results in an alternative visual effect.                                                                               | <img src ="docs/pics/energize-b.gif" />                                               |
-| **Fire** <br> The classic effect inspired by Compiz. However, this is implemented using a GLSL shader and not with a particle system like in the old days.                        | <img src ="docs/pics/fire.gif" />                                                     |
+| **Fire** <br> The classic effect inspired by Compiz. However, this is implemented using a GLSL shader and not with a particle system like in the old days.                        | <img src ="docs/pics/fire.gif" />                                                    |
+| **Focus** <br> Focus Dude, Focus                                                                                   | <img src ="docs/pics/focus.gif" />                                                    |
 | **Glide** <br> This very simple effect fades the window to transparency with subtle 3D effects.                                                                                   | <img src ="docs/pics/glide.gif" />                                                    |
 | **Glitch** <br> This effect applies some intentional graphics issues to your windows.                                                                                             | <img src ="docs/pics/glitch.gif" />                                                   |
 | **Hexagon** <br> With glowing lines and hexagon-shaped tiles, this effect looks very sci-fi.                                                                                      | <img src ="docs/pics/hexagon.gif" />                                                  |
@@ -70,6 +71,8 @@ Below is a table which summarizes the current availability for all effects.
 <tr><td>Energize A</td>              <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
 <tr><td>Energize B</td>              <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
 <tr><td>Fire</td>                    <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
+<tr><td>Focus</td>                   <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
+<!--^this is hypothetical ...i hope you don't mind-->
 <tr><td>Glide</td>                   <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
 <tr><td>Glitch</td>                  <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
 <tr><td>Hexagon</td>                 <td>✅</td>   <td>✅</td>  <td>✅</td> <td>✅</td>   </tr>
@@ -190,6 +193,7 @@ Here are links to all effects which are currently available in the KDE store:
 | [Energize A](https://store.kde.org/p/1884310)  | [Energize A](https://store.kde.org/p/2133829)  |
 | [Energize B](https://store.kde.org/p/1884311)  | [Energize B](https://store.kde.org/p/2133828)  |
 | [Fire](https://store.kde.org/p/1884307)        | [Fire](https://store.kde.org/p/2133822)        |
+| [Focus - coming soon,maybe]                    | [Focus - coming soon,maybe]                    |
 | [Glide](https://store.kde.org/p/1935778)       | [Glide](https://store.kde.org/p/2133839)       |
 | [Glitch](https://store.kde.org/p/1972813)      | [Glitch](https://store.kde.org/p/2133844)      |
 | [Hexagon](https://store.kde.org/p/1884309)     | [Hexagon](https://store.kde.org/p/2133836)     |

extension.js

@@ -28,6 +28,7 @@ import Doom from './src/effects/Doom.js';
 import EnergizeA from './src/effects/EnergizeA.js';
 import EnergizeB from './src/effects/EnergizeB.js';
 import Fire from './src/effects/Fire.js';
+import Focus from './src/effects/Focus.js';
 import Glide from './src/effects/Glide.js';
 import Glitch from './src/effects/Glitch.js';
 import Hexagon from './src/effects/Hexagon.js';
@@ -44,6 +45,7 @@ import TVEffect from './src/effects/TVEffect.js';
 import TVGlitch from './src/effects/TVGlitch.js';
 import Wisps from './src/effects/Wisps.js';
 
+
 import * as Main from 'resource:///org/gnome/shell/ui/main.js';
 import {Workspace} from 'resource:///org/gnome/shell/ui/workspace.js';
 import {WindowPreview} from 'resource:///org/gnome/shell/ui/windowPreview.js';
@@ -69,26 +71,13 @@ export default class BurnMyWindows extends Extension {
 
     // New effects must be registered here and in prefs.js.
     this._ALL_EFFECTS = [
-      new Apparition(),
-      new BrokenGlass(),
-      new Doom(),
-      new EnergizeA(),
-      new EnergizeB(),
-      new Fire(),
-      new Glide(),
-      new Glitch(),
-      new Hexagon(),
-      new Incinerate(),
-      new Matrix(),
-      new PaintBrush(),
-      new Pixelate(),
-      new PixelWheel(),
-      new PixelWipe(),
-      new Portal(),
-      new SnapOfDisintegration(),
-      new TRexAttack(),
-      new TVEffect(),
-      new TVGlitch(),
+      new Apparition(), new BrokenGlass(), new Doom(),
+      new EnergizeA(),  new EnergizeB(),   new Fire(),
+      new Focus(),      new Glide(),       new Glitch(),
+      new Hexagon(),    new Incinerate(),  new Matrix(),
+      new PaintBrush(), new Pixelate(),    new PixelWheel(),
+      new PixelWipe(),  new Portal(),      new SnapOfDisintegration(),
+      new TRexAttack(), new TVEffect(),    new TVGlitch(),
       new Wisps(),
     ];
 

prefs.js

@@ -29,6 +29,7 @@ import Doom from './src/effects/Doom.js';
 import EnergizeA from './src/effects/EnergizeA.js';
 import EnergizeB from './src/effects/EnergizeB.js';
 import Fire from './src/effects/Fire.js';
+import Focus from './src/effects/Focus.js';
 import Glide from './src/effects/Glide.js';
 import Glitch from './src/effects/Glitch.js';
 import Hexagon from './src/effects/Hexagon.js';
@@ -45,6 +46,7 @@ import TVEffect from './src/effects/TVEffect.js';
 import TVGlitch from './src/effects/TVGlitch.js';
 import Wisps from './src/effects/Wisps.js';
 
+
 import {ExtensionPreferences, gettext as _} from 'resource:///org/gnome/Shell/Extensions/js/extensions/prefs.js';
 
 // Currently, the extension supports only one set of UI files. In the past, there were
@@ -69,29 +71,13 @@ export default class BurnMyWindowsPreferences extends ExtensionPreferences {
 
     // New effects must be registered here and in extension.js.
     this._ALL_EFFECTS = [
-      Apparition,
-      BrokenGlass,
-      Doom,
-      EnergizeA,
-      EnergizeB,
-      Fire,
-      Glide,
-      Glitch,
-      Hexagon,
-      Incinerate,
-      Matrix,
-      PaintBrush,
-      Pixelate,
-      PixelWheel,
-      PixelWipe,
-      Portal,
-      SnapOfDisintegration,
-      TRexAttack,
-      TVEffect,
-      TVGlitch,
-      Wisps,
+      Apparition, BrokenGlass, Doom,       EnergizeA, EnergizeB,  Fire,
+      Focus,      Glide,       Glitch,     Hexagon,   Incinerate, Matrix,
+      PaintBrush, Pixelate,    PixelWheel, PixelWipe, Portal,     SnapOfDisintegration,
+      TRexAttack, TVEffect,    TVGlitch,   Wisps,
     ];
 
+
     // Load all of our resources.
     this._resources =
       Gio.Resource.load(this.path + '/resources/burn-my-windows.gresource');
@@ -105,6 +91,7 @@ export default class BurnMyWindowsPreferences extends ExtensionPreferences {
     this._builder.add_from_resource(`/ui/common/menus.ui`);
     this._builder.add_from_resource(`/ui/${getUIDir()}/prefs.ui`);
 
+
     // Store a reference to the general settings object.
     this._settings = this.getSettings();
 
@@ -134,6 +121,7 @@ export default class BurnMyWindowsPreferences extends ExtensionPreferences {
       // Maybe the service is masked...
     }
 
+
     let powerProfileRow = this._builder.get_object('profile-power-profile');
     powerProfileRow.set_visible(hasPowerProfiles);
 
@@ -173,6 +161,7 @@ export default class BurnMyWindowsPreferences extends ExtensionPreferences {
         }
       });
 
+
     // This is our top-level widget which we will return later.
     this._widget = this._builder.get_object('general-prefs');
 
@@ -274,6 +263,7 @@ export default class BurnMyWindowsPreferences extends ExtensionPreferences {
       }
     });
 
+
     // Some things can only be done once the widget is shown as we do not have access to
     // the toplevel widget before.
     this._widget.connect('realize', (widget) => {

resources/shaders/focus.frag

@@ -0,0 +1,86 @@
+//////////////////////////////////////////////////////////////////////////////////////////
+//          )                                                   (                       //
+//       ( /(   (  (               )    (       (  (  (         )\ )    (  (            //
+//       )\()) ))\ )(   (         (     )\ )    )\))( )\  (    (()/( (  )\))(  (        //
+//      ((_)\ /((_|()\  )\ )      )\  '(()/(   ((_)()((_) )\ )  ((_)))\((_)()\ )\       //
+//      | |(_|_))( ((_)_(_/(    _((_))  )(_))  _(()((_|_)_(_/(  _| |((_)(()((_|(_)      //
+//      | '_ \ || | '_| ' \))  | '  \()| || |  \ V  V / | ' \)) _` / _ \ V  V (_-<      //
+//      |_.__/\_,_|_| |_||_|   |_|_|_|  \_, |   \_/\_/|_|_||_|\__,_\___/\_/\_//__/      //
+//                                 |__/                                                 //
+//////////////////////////////////////////////////////////////////////////////////////////
+
+// SPDX-FileCopyrightText: Justin Garza [email protected]
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// The content from common.glsl is automatically prepended to each shader effect. This
+// provides the standard input:
+
+// vec2  iTexCoord:     Texture coordinates for retrieving the window input color.
+// bool  uIsFullscreen: True if the window is maximized or in fullscreen mode.
+// bool  uForOpening:   True if a window-open animation is ongoing, false otherwise.
+// float uProgress:     A value which transitions from 0 to 1 during the animation.
+// float uDuration:     The duration of the current animation in seconds.
+// vec2  uSize:         The size of uTexture in pixels.
+// float uPadding:      The empty area around the actual window (e.g. where the shadow
+//                      is drawn). For now, this will only be set on GNOME.
+
+// Furthermore, there are two global methods for reading the window input color and
+// setting the shader output color. Both methods assume straight alpha:
+
+// vec4 getInputColor(vec2 coords)
+// void setOutputColor(vec4 outColor)
+
+
+// Ease-in-out cubic for alpha
+float easeInOutCubic(float x) {
+    return x < 0.5 ? 4.0 * x * x * x : 1.0 - pow(-2.0 * x + 2.0, 3.0) / 2.0;
+}
+
+// Ease-in-out sine for blur
+float easeInOutSine(float x) {
+    return -(cos(3.14159265 * x) - 1.0) / 2.0;
+}
+
+// A simple blur function
+vec4 blur(vec2 uv, float radius, float samples) {
+  vec4 color = vec4(0.0);
+
+  const float tau        = 6.28318530718;
+  const float directions = 15.0;
+
+  for (float d = 0.0; d < tau; d += tau / directions) {
+    for (float s = 0.0; s < 1.0; s += 1.0 / samples) {
+      vec2 offset = vec2(cos(d), sin(d)) * radius * (1.0 - s) / uSize;
+      color += getInputColor(uv + offset);
+    }
+  }
+
+  return color / samples / directions;
+}
+
+
+// The width of the fading effect is loaded from the settings.
+uniform float uBlurAmount;
+uniform float uBlurQuality;
+
+void main() {
+
+    float progl = uForOpening ? uProgress : 1.0 - uProgress;
+
+    float easedProgressBlur = easeInOutSine(progl);  // Blur easing
+    float easedProgressAlpha = easeInOutCubic(progl);  // Alpha easing
+
+    // Control blur amount using easedProgressBlur
+    float blurAmount = mix(uBlurAmount, 0.0, easedProgressBlur);
+
+    // Apply blur
+    vec4 texColor = blur( iTexCoord.st, blurAmount, uBlurQuality);
+
+    // Control alpha using easedProgressAlpha
+    float alpha = easedProgressAlpha;
+
+    // Set final color with alpha transition
+    texColor.a *= alpha;
+
+    setOutputColor(texColor);
+}

resources/ui/adw/focus.ui

@@ -0,0 +1,114 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<!--
+SPDX-FileCopyrightText: Your Name <[email protected]>
+SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
+<interface domain="burn-my-windows">
+
+  <object class="GtkAdjustment" id="focus-animation-time">
+    <property name="upper">5000</property>
+    <property name="lower">100</property>
+    <property name="step-increment">10</property>
+    <property name="page-increment">100</property>
+  </object>
+
+  <object class="GtkAdjustment" id="focus-blur-amount">
+    <property name="upper">100</property>
+    <property name="lower">0</property>
+    <property name="step-increment">1</property>
+    <property name="page-increment">10</property>
+  </object>
+
+  <object class="GtkAdjustment" id="focus-blur-quality">
+    <property name="upper">20</property>
+    <property name="lower">1</property>
+    <property name="step-increment">1</property>
+    <property name="page-increment">5</property>
+  </object>
+
+  <object class="AdwExpanderRow" id="focus-prefs">
+
+    <child>
+      <object class="AdwActionRow">
+        <property name="title" translatable="yes">Animation Time [ms]</property>
+        <child>
+          <object class="GtkScale">
+            <property name="valign">center</property>
+            <property name="draw-value">1</property>
+            <property name="digits">0</property>
+            <property name="value-pos">left</property>
+            <property name="width-request">300</property>
+            <property name="adjustment">focus-animation-time</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkButton" id="reset-focus-animation-time">
+            <property name="icon-name">edit-clear-symbolic</property>
+            <property name="valign">center</property>
+            <property name="tooltip-text" translatable="yes">Reset to Default Value</property>
+            <style>
+              <class name="flat" />
+            </style>
+          </object>
+        </child>
+      </object>
+    </child>
+
+    <child>
+      <object class="AdwActionRow">
+        <property name="title" translatable="yes">Blur Amount</property>
+        <child>
+          <object class="GtkScale">
+            <property name="valign">center</property>
+            <property name="draw-value">1</property>
+            <property name="digits">2</property>
+            <property name="value-pos">left</property>
+            <property name="width-request">300</property>
+            <property name="adjustment">focus-blur-amount</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkButton" id="reset-focus-blur-amount">
+            <property name="icon-name">edit-clear-symbolic</property>
+            <property name="valign">center</property>
+            <property name="tooltip-text" translatable="yes">Reset to Default Value</property>
+            <style>
+              <class name="flat" />
+            </style>
+          </object>
+        </child>
+      </object>
+    </child>
+
+    <child>
+      <object class="AdwActionRow">
+        <property name="title" translatable="yes">Blur Quality</property>
+        <child>
+          <object class="GtkScale">
+            <property name="valign">center</property>
+            <property name="draw-value">1</property>
+            <property name="digits">2</property>
+            <property name="value-pos">left</property>
+            <property name="width-request">300</property>
+            <property name="adjustment">focus-blur-quality</property>
+          </object>
+        </child>
+        <child>
+          <object class="GtkButton" id="reset-focus-blur-quality">
+            <property name="icon-name">edit-clear-symbolic</property>
+            <property name="valign">center</property>
+            <property name="tooltip-text" translatable="yes">Reset to Default Value</property>
+            <style>
+              <class name="flat" />
+            </style>
+          </object>
+        </child>
+
+      </object>
+    </child>
+
+  </object>
+
+</interface>

schemas/org.gnome.shell.extensions.burn-my-windows-profile.gschema.xml

@@ -821,6 +821,35 @@ SPDX-License-Identifier: CC0-1.0
       <description>The color of the dust.</description>
     </key>
 
+
+    <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+    <!-- Simple Fade Effect Options                                                    -->
+    <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
+
+    <key name="focus-enable-effect" type="b">
+      <default>false</default>
+      <summary>Focus Enable Effect</summary>
+      <description>Use the Focus effect.</description>
+    </key>
+
+    <key name="focus-animation-time" type="i">
+      <default>500</default>
+      <summary>Focus Animation Time</summary>
+      <description>The time the Focus effect takes.</description>
+    </key>
+
+    <key name="focus-blur-amount" type="i">
+      <default>50</default>
+      <summary>Focus Blur Amount</summary>
+      <description>The Blur Amount before Focusing.</description>
+    </key>
+
+    <key name="focus-blur-quality" type="i">
+      <default>5</default>
+      <summary>Focus Blur Quality</summary>
+      <description>The Quality of the Blur (Setting this too high may increase GPU load and affect performance)</description>
+    </key>
+
   </schema>
 
 </schemalist>