🔀 Merge pull request #15 from Schneegans/feature/tv-effect

This commit is contained in:
Simon Schneegans
2021-12-31 20:36:56 +01:00
committed by GitHub
6 changed files with 102 additions and 224 deletions
+4
View File
@@ -4,6 +4,10 @@
**Release Date:** TBD
#### New Features
* Added a new simple close-animation: the TV-Effect!
#### Other Enhancements
* The fire shader now uses a `smoothstep` to make it less blocky.
+4
View File
@@ -24,6 +24,7 @@ const Me = imports.misc.extensionUtils.getCurrentExtension();
const utils = Me.imports.src.common.utils;
const FireShader = Me.imports.src.extension.FireShader.FireShader;
const MatrixShader = Me.imports.src.extension.MatrixShader.MatrixShader;
const TVEffectShader = Me.imports.src.extension.TVEffectShader.TVEffectShader;
//////////////////////////////////////////////////////////////////////////////////////////
// This extensions modifies the window-close animation to look like the window was set //
@@ -154,6 +155,9 @@ class Extension {
shader = new FireShader(this._settings);
} else if (mode == 2) {
shader = new MatrixShader(this._settings);
} else if (mode == 3) {
shader = new TVEffectShader(this._settings);
tweakTransition('scale-y', 0.5);
}
if (shader) {
+4 -224
View File
@@ -13,8 +13,8 @@
<col id="1">fire</col>
</row>
<row>
<col id="0">Matrix</col>
<col id="1">matrix</col>
<col id="0">TV Effect</col>
<col id="1">tv</col>
</row>
</data>
</object>
@@ -88,7 +88,7 @@
<object class="GtkListBox">
<property name="selection-mode">none</property>
<!-- <child>
<child>
<object class="GtkListBoxRow">
<property name="margin-start">10</property>
<property name="margin-end">10</property>
@@ -138,7 +138,7 @@
</object>
</child>
</object>
</child> -->
</child>
<child>
<object class="GtkListBoxRow">
@@ -459,226 +459,6 @@
</object>
</child>
<!-- <child>
<object class="GtkBox">
<property name="margin-top">30</property>
<property name="margin-bottom">10</property>
<child>
<object class="GtkLabel">
<property name="label">Matrix Animation Options</property>
<property name="xalign">0</property>
<property name="hexpand">1</property>
<style>
<class name="title-4" />
</style>
</object>
</child>
</object>
</child> -->
<!-- <child>
<object class="GtkFrame">
<child>
<object class="GtkListBox">
<property name="selection-mode">none</property>
<style>
<class name="rich-list" />
</style>
<child>
<object class="GtkListBoxRow">
<property name="margin-start">10</property>
<property name="margin-end">10</property>
<property name="margin-top">10</property>
<property name="margin-bottom">10</property>
<property name="activatable">0</property>
<child>
<object class="GtkBox">
<property name="spacing">8</property>
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">Scale</property>
<property name="xalign">0</property>
<property name="halign">start</property>
<property name="valign">center</property>
<property name="hexpand">1</property>
</object>
</child>
<child>
<object class="GtkScale">
<property name="halign">end</property>
<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">matrix-scale</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-matrix-scale">
<child>
<object class="GtkImage">
<property name="icon-name">edit-clear-symbolic</property>
<property name="icon-size">1</property>
</object>
</child>
<property name="tooltip-text">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
<child>
<object class="GtkListBoxRow">
<property name="margin-start">10</property>
<property name="margin-end">10</property>
<property name="margin-top">10</property>
<property name="margin-bottom">10</property>
<property name="activatable">0</property>
<child>
<object class="GtkBox">
<property name="spacing">8</property>
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">Randomness</property>
<property name="xalign">0</property>
<property name="halign">start</property>
<property name="valign">center</property>
<property name="hexpand">1</property>
</object>
</child>
<child>
<object class="GtkScale">
<property name="halign">end</property>
<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">matrix-randomness</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-matrix-randomness">
<child>
<object class="GtkImage">
<property name="icon-name">edit-clear-symbolic</property>
<property name="icon-size">1</property>
</object>
</child>
<property name="tooltip-text">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
<child>
<object class="GtkListBoxRow">
<property name="margin-start">10</property>
<property name="margin-end">10</property>
<property name="margin-top">10</property>
<property name="margin-bottom">10</property>
<property name="activatable">0</property>
<child>
<object class="GtkBox">
<property name="spacing">8</property>
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">Trail Color</property>
<property name="xalign">0</property>
<property name="halign">start</property>
<property name="valign">center</property>
<property name="hexpand">1</property>
</object>
</child>
<child>
<object class="GtkColorButton" id="matrix-trail-color">
<property name="use_alpha">1</property>
<property name="show_editor">1</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-matrix-trail-color">
<child>
<object class="GtkImage">
<property name="icon-name">edit-clear-symbolic</property>
<property name="icon-size">1</property>
</object>
</child>
<property name="tooltip-text">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
<child>
<object class="GtkListBoxRow">
<property name="margin-start">10</property>
<property name="margin-end">10</property>
<property name="margin-top">10</property>
<property name="margin-bottom">10</property>
<property name="activatable">0</property>
<child>
<object class="GtkBox">
<property name="spacing">8</property>
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">Tip Color</property>
<property name="xalign">0</property>
<property name="halign">start</property>
<property name="valign">center</property>
<property name="hexpand">1</property>
</object>
</child>
<child>
<object class="GtkColorButton" id="matrix-tip-color">
<property name="use_alpha">1</property>
<property name="show_editor">1</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-matrix-tip-color">
<child>
<object class="GtkImage">
<property name="icon-name">edit-clear-symbolic</property>
<property name="icon-size">1</property>
</object>
</child>
<property name="tooltip-text">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</child> -->
</object>
</child>
</object>
+4
View File
@@ -16,6 +16,10 @@
<col id="0">Matrix</col>
<col id="1">matrix</col>
</row>
<row>
<col id="0">TV Effect</col>
<col id="1">tv</col>
</row>
</data>
</object>
@@ -4,6 +4,7 @@
<enum id='org.gnome.shell.extensions.burn-my-windows.AnimationType'>
<value value='1' nick='fire' />
<value value='2' nick='matrix' />
<value value='3' nick='tv' />
</enum>
<schema path="/org/gnome/shell/extensions/burn-my-windows/" id="org.gnome.shell.extensions.burn-my-windows">
+85
View File
@@ -0,0 +1,85 @@
//////////////////////////////////////////////////////////////////////////////////////////
// ) ( //
// ( /( ( ( ) ( ( ( ( )\ ) ( ( //
// )\()) ))\ )( ( ( )\ ) )\))( )\ ( (()/( ( )\))( ( //
// ((_)\ /((_|()\ )\ ) )\ '(()/( ((_)()((_) )\ ) ((_)))\((_)()\ )\ //
// | |(_|_))( ((_)_(_/( _((_)) )(_)) _(()((_|_)_(_/( _| |((_)(()((_|(_) //
// | '_ \ || | '_| ' \)) | ' \()| || | \ V V / | ' \)) _` / _ \ V V (_-< //
// |_.__/\_,_|_| |_||_| |_|_|_| \_, | \_/\_/|_|_||_|\__,_\___/\_/\_//__/ //
// |__/ //
// Copyright (c) 2021 Simon Schneegans //
// Released under the GPLv3 or later. See LICENSE file for details. //
//////////////////////////////////////////////////////////////////////////////////////////
'use strict';
const {Clutter, GObject} = imports.gi;
const ExtensionUtils = imports.misc.extensionUtils;
const Me = imports.misc.extensionUtils.getCurrentExtension();
const shaderSnippets = Me.imports.src.extension.shaderSnippets;
//////////////////////////////////////////////////////////////////////////////////////////
// The TVEffectShader hides the actor by making it first transparent from top and //
// bottom towards the middle and then hiding the resulting line from left and right //
// towards the center. //
//////////////////////////////////////////////////////////////////////////////////////////
var TVEffectShader = GObject.registerClass(
{Properties: {}, Signals: {}}, class TVEffectShader extends Clutter.ShaderEffect {
_init(settings) {
super._init({shader_type: Clutter.ShaderType.FRAGMENT_SHADER});
this.set_shader_source(`
// Inject some common shader snippets.
${shaderSnippets.standardUniforms()}
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.2; // Relative time for the final fade to transparency.
void main() {
// 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 tbProgress = smoothstep(0, 1, clamp(uProgress/TB_TIME, 0, 1));
float lrProgress = smoothstep(0, 1, clamp((uProgress - LR_DELAY)/LR_TIME, 0, 1));
float ffProgress = smoothstep(0, 1, clamp((uProgress - 1.0 + FF_TIME)/FF_TIME, 0, 1));
// This is a top-center-bottom gradient in [0..1..0]
float tb = cogl_tex_coord_in[0].t * 2;
tb = tb < 1 ? tb : 2 - tb;
// This is a left-center-right gradient in [0..1..0]
float lr = cogl_tex_coord_in[0].s * 2;
lr = lr < 1 ? lr : 2 - lr;
// Combine the progress values with the gradients to create the alpha masks.
float tbMask = 1 - smoothstep(0, 1, clamp((tbProgress - tb) / BLUR_WIDTH, 0, 1));
float lrMask = 1 - smoothstep(0, 1, clamp((lrProgress - lr) / BLUR_WIDTH, 0, 1));
float ffMask = 1 - smoothstep(0, 1, ffProgress);
// Assemble the final alpha value.
float mask = tbMask * lrMask * ffMask;
vec4 windowColor = texture2D(uTexture, cogl_tex_coord_in[0].st);
vec4 effectColor = vec4(1, 1, 1, 1) * windowColor.a;
windowColor.rgb = mix(windowColor.rgb, effectColor.rgb, smoothstep(0, 1, uProgress));
cogl_color_out = windowColor * mask;
// These are pretty useful for understanding how this works.
// cogl_color_out = vec4(vec3(tbMask), 1);
// cogl_color_out = vec4(vec3(lrMask), 1);
// cogl_color_out = vec4(vec3(ffMask), 1);
// cogl_color_out = vec4(vec3(mask), 1);
}
`);
};
});