biipadmin/Burn-My-Windows
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🎉 Add initial portal effect

Browse Source
This commit is contained in:
Simon Schneegans
2022-12-19 20:15:23 +01:00
parent 1116b012e8
commit c92a2d4fb7
8 changed files with 634 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
extension.js
+1
View File
@@ -64,6 +64,7 @@ class Extension {
new Me.imports.src.Pixelate.Pixelate(),
new Me.imports.src.PixelWheel.PixelWheel(),
new Me.imports.src.PixelWipe.PixelWipe(),
new Me.imports.src.Portal.Portal(),
new Me.imports.src.SnapOfDisintegration.SnapOfDisintegration(),
new Me.imports.src.TRexAttack.TRexAttack(),
new Me.imports.src.TVEffect.TVEffect(),
prefs.js
+1
View File
@@ -60,6 +60,7 @@ var PreferencesDialog = class PreferencesDialog {
new Me.imports.src.Pixelate.Pixelate(),
new Me.imports.src.PixelWheel.PixelWheel(),
new Me.imports.src.PixelWipe.PixelWipe(),
new Me.imports.src.Portal.Portal(),
new Me.imports.src.SnapOfDisintegration.SnapOfDisintegration(),
new Me.imports.src.TRexAttack.TRexAttack(),
new Me.imports.src.TVEffect.TVEffect(),
resources/shaders/portal.frag
+121
View File
@@ -0,0 +1,121 @@
//////////////////////////////////////////////////////////////////////////////////////////
// ) ( //
// ( /( ( ( ) ( ( ( ( )\ ) ( ( //
// )\()) ))\ )( ( ( )\ ) )\))( )\ ( (()/( ( )\))( ( //
// ((_)\ /((_|()\ )\ ) )\ '(()/( ((_)()((_) )\ ) ((_)))\((_)()\ )\ //
// | |(_|_))( ((_)_(_/( _((_)) )(_)) _(()((_|_)_(_/( _| |((_)(()((_|(_) //
// | '_ \ || | '_| ' \)) | ' \()| || | \ 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;
const float PORTAL_OPEN_TIME = 0.3;
const float PORTAL_CLOSE_TIME = 0.4;
const float PORTAL_ROTATION_SPEED = 0.5;
const float PORTAL_WARPING = 2.0;
const float WINDOW_ANIMATION_TIME = 0.4;
const float WINDOW_SCALE = 0.3;
const float WINDOW_SQUISH = 1.0;
const float WINDOW_TILT = -1.0;
const float WINDOW_SHIFT = 0.0;
const float GLOW_EDGE_WIDTH = 0.02;
vec4 getPortalColor() {
// We simply inverse the progress for opening windows.
float progress = uForOpening ? 1.0 - uProgress : uProgress;
// Put coordinate origin to the center of the window and make ensure a 1:1 aspect ratio.
vec2 coords = (iTexCoord.st - vec2(0.5)) * 2.0 * uSize / vec2(min(uSize.x, uSize.y));
// Add some margin for the elastic overshooting.
coords *= 1.5;
float scale = 1.0;
if (uProgress < PORTAL_OPEN_TIME) {
scale = easeOutBack(uProgress / PORTAL_OPEN_TIME);
} else if (uProgress > 1.0 - PORTAL_CLOSE_TIME) {
scale = easeOutBack(1.0 - (uProgress - 1.0 + PORTAL_CLOSE_TIME) / PORTAL_CLOSE_TIME);
}
coords /= max(scale, 0.01);
// Apply some whirling.
// The math for the whirling is inspired by this post:
float rotation = PORTAL_ROTATION_SPEED * uProgress;
float warping = PORTAL_WARPING * (1.0 + 0.5 * uProgress);
coords = whirl(coords, warping, rotation);
float xDisplace = simplex2D(coords * 2.0) - 0.5;
float yDisplace = simplex2D(coords * 2.0 + vec2(12.0, 123.0)) - 0.5;
coords += vec2(xDisplace, yDisplace) * 0.1;
float dist = length(coords);
vec3 backgroundColor = mix(0.2 * uColor, 0.8 * uColor, clamp(pow(dist, 5.0), 0.0, 1.0));
float alpha = dist > 1.0 ? 0.0 : 1.0;
vec4 color = vec4(backgroundColor, alpha);
float glowingEdge =
pow(clamp((1.0 - abs(dist - 1.0)) + GLOW_EDGE_WIDTH, 0.0, 1.0), 100.0);
color = alphaOver(color, vec4(vec3(1.0), glowingEdge));
float bands = simplex2D(coords * 4.0) > 0.7 ? alpha : 0.0;
color = alphaOver(color, vec4(uColor, bands));
float stars = pow((simplex3D(vec3(coords * 5.0, uProgress * uDuration))) + 0.2, 50.0);
color.rgb += vec3(stars);
color.a *= pow(clamp(scale, 0.0, 1.0), 2.0);
return clamp(color, 0.0, 1.0);
}
vec4 getWindowColor() {
float progress = (uForOpening ? (1.0 - uProgress) : uProgress) / WINDOW_ANIMATION_TIME;
progress = easeInBack(clamp(progress, 0.0, 1.0));
// Put texture coordinate origin to center of window.
vec2 coords = iTexCoord.st * 2.0 - 1.0;
// Scale image texture with progress.
coords /= mix(1.0, WINDOW_SCALE, progress);
// Squish image texture vertically.
coords.y /= mix(1.0, (1.0 - 0.2 * WINDOW_SQUISH), progress);
// 'Tilt' image texture around x-axis.
coords.x /= mix(1.0, 1.0 - 0.1 * WINDOW_TILT * coords.y, progress);
// Move image texture vertically.
coords.y += WINDOW_SHIFT * progress;
// Move texture coordinate center to corner again.
coords = coords * 0.5 + 0.5;
vec4 oColor = getInputColor(coords);
// Dissolve window.
oColor.a *= clamp((1.0 - progress) * 3.0, 0.0, 1.0);
return oColor;
}
void main() {
vec4 portal = getPortalColor();
vec4 window = getWindowColor();
setOutputColor(alphaOver(portal, window));
// setOutputColor(portal);
// setOutputColor(window);
}
resources/ui/adw/Portal.ui
+73
View File
@@ -0,0 +1,73 @@
<?xml version="1.0" encoding="UTF-8"?>
<!--
SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
SPDX-License-Identifier:
GPL-3.0-or-later
-->
<interface domain="burn-my-windows">
<object class="AdwExpanderRow" id="portal-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">
<object class="GtkAdjustment" id="portal-animation-time">
<property name="upper">5000</property>
<property name="lower">100</property>
<property name="step-increment">1</property>
<property name="page-increment">100</property>
</object>
</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-portal-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">Color</property>
<property name="activatable-widget">portal-color</property>
<child>
<object class="GtkColorButton" id="portal-color">
<property name="valign">center</property>
<property name="width-request">250</property>
<property name="use_alpha">0</property>
<property name="show_editor">1</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-portal-color">
<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>
resources/ui/gtk3/Portal.ui
+184
View File
@@ -0,0 +1,184 @@
<?xml version="1.0" encoding="UTF-8"?>
<!--
SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
SPDX-License-Identifier:
GPL-3.0-or-later
-->
<interface domain="burn-my-windows">
<object class="GtkAdjustment" id="portal-animation-time">
<property name="upper">5000</property>
<property name="lower">100</property>
<property name="step-increment">1</property>
<property name="page-increment">100</property>
</object>
<object class="GtkBox" id="portal-prefs">
<property name="orientation">vertical</property>
<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">Animation Time [ms]</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">
portal-animation-time</property>
</object>
</child>
<child>
<object class="GtkButton"
id="reset-portal-animation-time">
<child>
<object class="GtkImage">
<property name="icon-name">
edit-clear-symbolic</property>
<property name="icon-size">1</property>
</object>
</child>
<property name="tooltip-text" translatable="yes">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">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">2</property>
<property name="value-pos">left</property>
<property name="width-request">300</property>
<property name="adjustment">portal-scale</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-portal-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" translatable="yes">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">
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">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="portal-color">
<property name="use_alpha">0</property>
<property name="show_editor">1</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-portal-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" translatable="yes">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</interface>
resources/ui/gtk4/Portal.ui
+114
View File
@@ -0,0 +1,114 @@
<?xml version="1.0" encoding="UTF-8"?>
<!--
SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
SPDX-License-Identifier:
GPL-3.0-or-later
-->
<interface domain="burn-my-windows">
<object class="GtkBox" id="portal-prefs">
<property name="orientation">vertical</property>
<child>
<object class="GtkFrame">
<child>
<object class="GtkListBox">
<property name="selection-mode">none</property>
<property name="show-separators">1</property>
<style>
<class name="rich-list" />
</style>
<child>
<object class="GtkListBoxRow">
<property name="activatable">0</property>
<child>
<object class="GtkBox">
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">Animation Time [ms]</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">
<object class="GtkAdjustment"
id="portal-animation-time">
<property name="upper">5000</property>
<property name="lower">100</property>
<property name="step-increment">1</property>
<property name="page-increment">100</property>
</object>
</property>
</object>
</child>
<child>
<object class="GtkButton"
id="reset-portal-animation-time">
<property name="icon-name">edit-clear-symbolic</property>
<property name="tooltip-text" translatable="yes">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
<child>
<object class="GtkListBoxRow">
<property name="activatable">0</property>
<child>
<object class="GtkBox">
<child>
<object class="GtkLabel">
<property name="label" translatable="yes">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="portal-color">
<property name="use_alpha">0</property>
<property name="show_editor">1</property>
</object>
</child>
<child>
<object class="GtkButton" id="reset-portal-color">
<property name="icon-name">edit-clear-symbolic</property>
<property name="tooltip-text" translatable="yes">Reset to Default Value</property>
<style>
<class name="flat" />
</style>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</child>
</object>
</interface>
schemas/org.gnome.shell.extensions.burn-my-windows.gschema.xml
+34 -3
View File
@@ -2,12 +2,14 @@
<!--
SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
SPDX-License-Identifier: CC0-1.0
SPDX-License-Identifier:
CC0-1.0
-->
<schemalist>
<schema path="/org/gnome/shell/extensions/burn-my-windows/" id="org.gnome.shell.extensions.burn-my-windows">
<schema path="/org/gnome/shell/extensions/burn-my-windows/"
id="org.gnome.shell.extensions.burn-my-windows">
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- General Options -->
@@ -40,7 +42,8 @@ SPDX-License-Identifier: CC0-1.0
<key name="test-mode" type="b">
<default>false</default>
<summary>Test Mode</summary>
<description>If set to true, all animations will show only one still frame to allow for continuous integration tests.</description>
<description>If set to true, all animations will show only one still frame to allow for
continuous integration tests.</description>
</key>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
@@ -715,6 +718,34 @@ SPDX-License-Identifier: CC0-1.0
<description>Use the pointer location for the broken glass effect.</description>
</key>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- Portal Options -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<key name="portal-close-effect" type="b">
<default>false</default>
<summary>Portal Close Effect</summary>
<description>Use the Portal effect for window closing.</description>
</key>
<key name="portal-open-effect" type="b">
<default>false</default>
<summary>Portal Open Effect</summary>
<description>Use the Portal effect for window opening.</description>
</key>
<key name="portal-animation-time" type="i">
<default>1000</default>
<summary>Portal Animation Time</summary>
<description>The time the Portal effect takes.</description>
</key>
<key name="portal-color" type="s">
<default>"rgb(155, 255, 50)"</default>
<summary>Portal Color</summary>
<description>The color of the effect.</description>
</key>
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
<!-- Snap of Disintegration Effect Options -->
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->
src/Portal.js
+106
View File
@@ -0,0 +1,106 @@
//////////////////////////////////////////////////////////////////////////////////////////
// ) ( //
// ( /( ( ( ) ( ( ( ( )\ ) ( ( //
// )\()) ))\ )( ( ( )\ ) )\))( )\ ( (()/( ( )\))( ( //
// ((_)\ /((_|()\ )\ ) )\ '(()/( ((_)()((_) )\ ) ((_)))\((_)()\ )\ //
// | |(_|_))( ((_)_(_/( _((_)) )(_)) _(()((_|_)_(_/( _| |((_)(()((_|(_) //
// | '_ \ || | '_| ' \)) | ' \()| || | \ 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;
//////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////////////
// 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 Portal = 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._uColor = shader.get_uniform_location('uColor');
// 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('portal-color'))[1];
// clang-format off
shader.set_uniform_float(shader._uColor, 3, [c.red / 255, c.green / 255, c.blue / 255]);
// 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 'portal';
}
// 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 _('Portal');
}
// -------------------------------------------------------------------- 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()}/Portal.ui`);
// Bind all properties.
dialog.bindAdjustment('portal-animation-time');
dialog.bindColorButton('portal-color');
// Finally, return the new settings page.
return dialog.getBuilder().get_object('portal-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};
}
}