🔀 Merge pull request #285 from Kurtoid/main

kwin/build.sh

@@ -140,6 +140,7 @@ generate "energize-b"  "Energize B [Burn-My-Windows]"  "Using different transpor
 generate "fire"        "Fire [Burn-My-Windows]"        "The classic effect inspired by Compiz"
 generate "glide"       "Glide [Burn-My-Windows]"       "Fade the window to transparency with subtle 3D effects"
 generate "glitch"      "Glitch [Burn-My-Windows]"      "This effect applies some intentional graphics issues to your windows"
+generate "tvglitch"    "TVGlitch [Burn-My-Windows]"    "This effect applies some intentional graphics issues to your windows"
 generate "hexagon"     "Hexagon [Burn-My-Windows]"     "With glowing lines and hexagon-shaped tiles, this effect looks very sci-fi"
 generate "incinerate"  "Incinerate [Burn-My-Windows]"  "A less snappy but definitely more fancy take on the fire effect"
 generate "pixelate"    "Pixelate [Burn-My-Windows]"    "Pixelate the window and randomly hide the pixels"

kwin/tvglitch/config.ui

@@ -0,0 +1,137 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<!--
+SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
+SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
+<ui version="4.0">
+ <class>BMWConfigForm</class>
+ <widget class="QWidget" name="BMWConfigForm">
+  <property name="geometry">
+   <rect>
+    <x>0</x>
+    <y>0</y>
+    <width>562</width>
+    <height>365</height>
+   </rect>
+  </property>
+  <layout class="QGridLayout" name="gridLayout">
+   <item row="2" column="0">
+    <widget class="QLabel" name="label_3">
+     <property name="text">
+      <string>Scale</string>
+     </property>
+     <property name="alignment">
+      <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
+     </property>
+     <property name="buddy">
+      <cstring>kcfg_Color</cstring>
+     </property>
+    </widget>
+   </item>
+   <item row="5" column="0">
+    <widget class="QLabel" name="label_2">
+     <property name="text">
+      <string>Color</string>
+     </property>
+     <property name="alignment">
+      <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
+     </property>
+     <property name="buddy">
+      <cstring>kcfg_Color</cstring>
+     </property>
+    </widget>
+   </item>
+   <item row="0" column="0">
+    <widget class="QLabel" name="label">
+     <property name="text">
+      <string>Animation Time [ms]</string>
+     </property>
+     <property name="alignment">
+      <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
+     </property>
+    </widget>
+   </item>
+   <item row="5" column="1">
+    <widget class="KColorButton" name="kcfg_Color">
+     <property name="alphaChannelEnabled" stdset="0">
+      <bool>true</bool>
+     </property>
+    </widget>
+   </item>
+   <item row="0" column="1">
+    <widget class="QSpinBox" name="kcfg_Duration">
+     <property name="minimum">
+      <number>100</number>
+     </property>
+     <property name="maximum">
+      <number>9999</number>
+     </property>
+     <property name="singleStep">
+      <number>100</number>
+     </property>
+    </widget>
+   </item>
+   <item row="3" column="0">
+    <widget class="QLabel" name="label_4">
+     <property name="text">
+      <string>Strength</string>
+     </property>
+     <property name="alignment">
+      <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
+     </property>
+    </widget>
+   </item>
+   <item row="4" column="0">
+    <widget class="QLabel" name="label_5">
+     <property name="text">
+      <string>Speed</string>
+     </property>
+     <property name="alignment">
+      <set>Qt::AlignRight|Qt::AlignTrailing|Qt::AlignVCenter</set>
+     </property>
+    </widget>
+   </item>
+   <item row="2" column="1">
+    <widget class="QDoubleSpinBox" name="kcfg_Scale">
+     <property name="minimum">
+      <double>0.100000000000000</double>
+     </property>
+     <property name="maximum">
+      <double>10.000000000000000</double>
+     </property>
+    </widget>
+   </item>
+   <item row="3" column="1">
+    <widget class="QDoubleSpinBox" name="kcfg_Strength">
+     <property name="minimum">
+      <double>0.100000000000000</double>
+     </property>
+     <property name="maximum">
+      <double>10.000000000000000</double>
+     </property>
+    </widget>
+   </item>
+   <item row="4" column="1">
+    <widget class="QDoubleSpinBox" name="kcfg_Speed">
+     <property name="minimum">
+      <double>0.100000000000000</double>
+     </property>
+     <property name="maximum">
+      <double>10.000000000000000</double>
+     </property>
+    </widget>
+   </item>
+  </layout>
+ </widget>
+ <customwidgets>
+  <customwidget>
+   <class>KColorButton</class>
+   <extends>QPushButton</extends>
+   <header>kcolorbutton.h</header>
+  </customwidget>
+ </customwidgets>
+ <resources/>
+ <connections/>
+</ui>

kwin/tvglitch/main.xml

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<!--
+SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
+SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
+<kcfg xmlns="http://www.kde.org/standards/kcfg/1.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.kde.org/standards/kcfg/1.0
+                          http://www.kde.org/standards/kcfg/1.0/kcfg.xsd">
+  <kcfgfile name="" />
+  <group name="">
+    <entry name="Duration" type="UInt">
+      <default>750</default>
+    </entry>
+    <entry name="Scale" type="Double">
+      <default>1</default>
+    </entry>
+    <entry name="Strength" type="Double">
+      <default>2</default>
+    </entry>
+    <entry name="Speed" type="Double">
+      <default>2</default>
+    </entry>
+    <entry name="Color" type="Color">
+      <default>#64A0FF</default>
+    </entry>
+  </group>
+</kcfg>

kwin/tvglitch/onAnimationBegin.js

@@ -0,0 +1,7 @@
+// SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// This part is automatically included in the effect's source during the build process.
+// The code below is called whenever a window is closed or opened.
+
+effect.setUniform(this.shader, 'uSeed', Math.random());

kwin/tvglitch/onSettingsChanged.js

@@ -0,0 +1,12 @@
+// SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// This part is automatically included in the effect's source during the build process.
+// The code below is called whenever the user changes something in the configuration of
+// the effect.
+
+effect.setUniform(this.shader, 'uDuration', this.duration * 0.001);
+effect.setUniform(this.shader, 'uScale', effect.readConfig('Scale', 1.0));
+effect.setUniform(this.shader, 'uStrength', effect.readConfig('Strength', 1.0));
+effect.setUniform(this.shader, 'uSpeed', effect.readConfig('Speed', 1.0));
+effect.setUniform(this.shader, 'uColor', this.readRGBConfig('Color'));

resources/shaders/tvglitch.frag

@@ -0,0 +1,122 @@
+//////////////////////////////////////////////////////////////////////////////////////////
+//          )                                                   (                       //
+//       ( /(   (  (               )    (       (  (  (         )\ )    (  (            //
+//       )\()) ))\ )(   (         (     )\ )    )\))( )\  (    (()/( (  )\))(  (        //
+//      ((_)\ /((_|()\  )\ )      )\  '(()/(   ((_)()((_) )\ )  ((_)))\((_)()\ )\       //
+//      | |(_|_))( ((_)_(_/(    _((_))  )(_))  _(()((_|_)_(_/(  _| |((_)(()((_|(_)      //
+//      | '_ \ || | '_| ' \))  | '  \()| || |  \ V  V / | ' \)) _` / _ \ V  V (_-<      //
+//      |_.__/\_,_|_| |_||_|   |_|_|_|  \_, |   \_/\_/|_|_||_|\__,_\___/\_/\_//__/      //
+//                                 |__/                                                 //
+//////////////////////////////////////////////////////////////////////////////////////////
+
+// SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// The content from common.glsl is automatically prepended to each shader effect.
+
+uniform vec3 uColor;
+uniform float uSeed;
+uniform float uScale;
+uniform float uStrength;
+uniform float uSpeed;
+
+// tv params
+
+const float BLUR_WIDTH = 0.01;  // Width of the gradients.
+const float TB_TIME    = 0.7;   // Relative time for the top/bottom animation.
+const float LR_TIME    = 0.4;   // Relative time for the left/right animation.
+const float LR_DELAY   = 0.6;   // Delay after which the left/right animation starts.
+const float FF_TIME    = 0.1;   // Relative time for the final fade to transparency.
+const float SCALING    = 0.5;   // Additional vertical scaling of the window.
+
+
+// Somewhat inspired by https://www.shadertoy.com/view/XtK3W3
+void main() {
+  float progress = easeInQuad(uForOpening ? 1.0 - uProgress : uProgress);
+  float time     = progress * uDuration * uSpeed;
+  float strength = uStrength * progress;
+  float displace = 1000.0 * strength / uSize.x;
+  float yPos     = uScale * uSize.y * (iTexCoord.y + uSeed * 10.0);
+
+  // Create large noise waves and add some smaller noise waves.
+  float noise = clamp(simplex2D(vec2(time, yPos * 0.002)) - 0.5, 0.0, 1.0);
+  noise += (simplex2D(vec2(time * 10.0, yPos * 0.05)) - 0.5) * 0.15;
+
+  // Apply the noise as x displacement for every line.
+  float xPos  = clamp(iTexCoord.x - displace * noise * noise, 0.0, 1.0);
+  vec4 oColor = getInputColor(vec2(xPos, iTexCoord.y));
+
+  // Mix in some random interference lines.
+  vec3 interference          = uColor * hash12(vec2(yPos * time));
+  float interferenceStrength = noise * min(strength, 1.0);
+  oColor.rgb                 = mix(oColor.rgb, interference, interferenceStrength);
+
+  // Mix in some grainy noise.
+  vec3 grain          = uColor * simplex2D(uSize * iTexCoord + vec2(time * 100.0));
+  float grainStrength = 0.2 * min(strength, 1.0);
+  oColor.rgb          = mix(oColor.rgb, grain, grainStrength);
+
+  // Add a subtle line pattern every 4 pixels.
+  if (floor(mod(yPos * 0.25, 2.0)) == 0.0) {
+    oColor.rgb = mix(uColor, oColor.rgb, 1.0 - (0.15 * noise));
+  }
+
+  // Shift green/blue channels.
+  float offset = 0.1 * noise * displace;
+  oColor.g     = mix(oColor.g, getInputColor(vec2(xPos + offset, iTexCoord.y)).g, 0.25);
+  oColor.b     = mix(oColor.b, getInputColor(vec2(xPos - offset, iTexCoord.y)).b, 0.25);
+
+  // Dissolve the window.
+  //   float fadeDelay = 1.5;
+  //   float alpha = clamp(noise + 1.0 + fadeDelay - (3.0 + fadeDelay) * progress, 0.0, 1.0);
+  //   oColor.a *= alpha;
+
+  // add tv effect - we just want the shape transforms
+
+  // add the tv effect sooner/later in the animation
+  float toffset = uForOpening ? 0.0 : 1.0;
+  float prog = clamp(uProgress * 2.0 - toffset, 0.0, 1.0);
+  prog = uForOpening ? 1.0 - easeOutQuad(prog) : easeOutQuad(prog);
+
+  // Scale down the window vertically.
+  float scale = 1.0 / mix(1.0, SCALING, prog) - 1.0;
+  vec2 coords = iTexCoord.st;
+  coords.y    = coords.y * (scale + 1.0) - scale * 0.5;
+
+  // All of these are in [0..1] during the different stages of the animation.
+  // tb refers to the top-bottom animation.
+  // lr refers to the left-right animation.
+  // ff refers to the final fade animation.
+  float tbProg = smoothstep(0.0, 1.0, clamp(prog / TB_TIME, 0.0, 1.0));
+  float lrProg = smoothstep(0.0, 1.0, clamp((prog - LR_DELAY) / LR_TIME, 0.0, 1.0));
+  float ffProg = smoothstep(0.0, 1.0, clamp((prog - 1.0 + FF_TIME) / FF_TIME, 0.0, 1.0));
+
+  // This is a top-center-bottom gradient in [0..1..0]
+  float tb = coords.y * 2.0;
+  tb       = tb < 1.0 ? tb : 2.0 - tb;
+
+  // This is a left-center-right gradient in [0..1..0]
+  float lr = coords.x * 2.0;
+  lr       = lr < 1.0 ? lr : 2.0 - lr;
+
+  // Combine the progress values with the gradients to create the alpha masks.
+  float tbMask = 1.0 - smoothstep(0.0, 1.0, clamp((tbProg - tb) / BLUR_WIDTH, 0.0, 1.0));
+  float lrMask = 1.0 - smoothstep(0.0, 1.0, clamp((lrProg - lr) / BLUR_WIDTH, 0.0, 1.0));
+  float ffMask = 1.0 - smoothstep(0.0, 1.0, ffProg);
+
+  // Assemble the final alpha value.
+  float mask = tbMask * lrMask * ffMask;
+
+  // vec4 oColor = getInputColor(coords);
+  // don't add another color transform
+  // oColor.rgb  = mix(oColor.rgb, uColor * oColor.a, smoothstep(0.0, 1.0, prog));
+  oColor.a *= mask;
+
+  // These are pretty useful for understanding how this works.
+  // oColor = vec4(vec3(tbMask), 1);
+  // oColor = vec4(vec3(lrMask), 1);
+  // oColor = vec4(vec3(ffMask), 1);
+  // oColor = vec4(vec3(mask), 1);
+
+  setOutputColor(oColor);
+}

src/TVGlitch.js

@@ -0,0 +1,120 @@
+//////////////////////////////////////////////////////////////////////////////////////////
+//          )                                                   (                       //
+//       ( /(   (  (               )    (       (  (  (         )\ )    (  (            //
+//       )\()) ))\ )(   (         (     )\ )    )\))( )\  (    (()/( (  )\))(  (        //
+//      ((_)\ /((_|()\  )\ )      )\  '(()/(   ((_)()((_) )\ )  ((_)))\((_)()\ )\       //
+//      | |(_|_))( ((_)_(_/(    _((_))  )(_))  _(()((_|_)_(_/(  _| |((_)(()((_|(_)      //
+//      | '_ \ || | '_| ' \))  | '  \()| || |  \ V  V / | ' \)) _` / _ \ V  V (_-<      //
+//      |_.__/\_,_|_| |_||_|   |_|_|_|  \_, |   \_/\_/|_|_||_|\__,_\___/\_/\_//__/      //
+//                                 |__/                                                 //
+//////////////////////////////////////////////////////////////////////////////////////////
+
+// SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+'use strict';
+
+const GObject = imports.gi.GObject;
+
+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 ShaderFactory  = Me.imports.src.ShaderFactory.ShaderFactory;
+
+//////////////////////////////////////////////////////////////////////////////////////////
+// This effect applies some intentional graphics issues to your windows.                //
+//////////////////////////////////////////////////////////////////////////////////////////
+
+// 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 Glitch = class {
+
+  // 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._uSeed     = shader.get_uniform_location('uSeed');
+      shader._uColor    = shader.get_uniform_location('uColor');
+      shader._uScale    = shader.get_uniform_location('uScale');
+      shader._uStrength = shader.get_uniform_location('uStrength');
+      shader._uSpeed    = shader.get_uniform_location('uSpeed');
+
+      // 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('glitch-color'))[1];
+
+        // If we are performing an integration tests, we use a fixed seed.
+        const testMode = settings.get_boolean('test-mode');
+
+        // clang-format off
+        shader.set_uniform_float(shader._uSeed,  1, [testMode ? 0 : Math.random()]);
+        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('glitch-scale')]);
+        shader.set_uniform_float(shader._uStrength, 1, [settings.get_double('glitch-strength')]);
+        shader.set_uniform_float(shader._uSpeed, 1, [settings.get_double('glitch-speed')]);
+        // clang-format on
+      });
+    });
+  }
+
+  // ---------------------------------------------------------------------------- metadata
+
+  // The effect is available on all GNOME Shell versions supported by this extension.
+  getMinShellVersion() {
+    return [3, 36];
+  }
+
+  // This will be called in various places where a unique identifier for this effect is
+  // required. It should match the prefix of the settings keys which store whether the
+  // effect is enabled currently (e.g. '*-close-effect'), and its animation time
+  // (e.g. '*-animation-time').
+  getNick() {
+    return 'tvglitch';
+  }
+
+  // This will be shown in the sidebar of the preferences dialog as well as in the
+  // drop-down menus where the user can choose the effect.
+  getLabel() {
+    return _('TVGlitch');
+  }
+
+  // -------------------------------------------------------------------- API for prefs.js
+
+  // This is called by the preferences dialog. It loads the settings page for this effect,
+  // and binds all properties to the settings.
+  getPreferences(dialog) {
+
+    // Add the settings page to the builder.
+    dialog.getBuilder().add_from_resource(`/ui/${utils.getUIDir()}/TVGlitch.ui`);
+
+    // Bind all properties.
+    dialog.bindAdjustment('glitch-animation-time');
+    dialog.bindAdjustment('glitch-scale');
+    dialog.bindAdjustment('glitch-speed');
+    dialog.bindAdjustment('glitch-strength');
+    dialog.bindColorButton('glitch-color');
+
+    // Finally, return the new settings page.
+    return dialog.getBuilder().get_object('tvglitch-prefs');
+  }
+
+  // ---------------------------------------------------------------- API for extension.js
+
+  // 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};
+  }
+}