diff --git a/docs/how-to-create-new-effects.md b/docs/how-to-create-new-effects.md index 2a5714d..7392f69 100644 --- a/docs/how-to-create-new-effects.md +++ b/docs/how-to-create-new-effects.md @@ -34,14 +34,14 @@ Of course, you can replace any occurrence of this name and its nick `simple-fade Three simple steps are required to create a new effect. You will have to ... -1. add a preferences key for enabling the effect, +1. add preferences keys for enabling the effect, 2. create an additional effects class, and finally 3. register the new effect in two places. ### 1. Expanding the Schema -For enabling the new effect, the boolean settings key `simple-fade-close-effect` is required. -In this example, we also add an integer valued settings key for storing the animation time of the new effect and a floating point value for storing another property of the effect - we will use them later in the tutorial. +For enabling the new effect, the boolean settings keys `simple-fade-open-effect`, `simple-fade-close-effect`, and `simple-fade-animation-time` are required. +In this example, we also add a floating point value for storing another property of the effect - we will use them later in the tutorial. Just copy the XML code below to the file [`schemas/org.gnome.shell.extensions.burn-my-windows.gschema.xml`](../schemas/org.gnome.shell.extensions.burn-my-windows.gschema.xml). Just remember to replace `simple-fade` with your custom name! @@ -56,6 +56,12 @@ Just remember to replace `simple-fade` with your custom name! Use the Simple Fade effect for window closing. + + false + Simple Fade Open Effect + Use the Simple Fade effect for window opening. + + 1500 Simple Fade Animation Time @@ -146,8 +152,8 @@ var SimpleFade = class SimpleFade { // ---------------------------------------------------------------- API for extension.js // This is called from extension.js whenever a window is closed with this effect. - static createShader(actor, settings) { - return new Shader(settings); + static createShader(actor, settings, forOpening) { + return new Shader(settings, forOpening); } // The tweakTransition() is called from extension.js to tweak a window's open / close @@ -182,7 +188,7 @@ if (utils.isInShellProcess()) { const shaderSnippets = Me.imports.src.shaderSnippets; Shader = GObject.registerClass({}, class Shader extends Clutter.ShaderEffect { - _init(settings) { + _init(settings, forOpening) { super._init({shader_type: Clutter.ShaderType.FRAGMENT_SHADER}); this.set_shader_source(` @@ -207,8 +213,10 @@ if (utils.isInShellProcess()) { // Radial distance from window edge to the window's center. float dist = length(cogl_tex_coord_in[0].st - 0.5) * 2.0 / sqrt(2.0); - // This gradually dissolves from [1..0] from the outside to the center. - float mask = (1.0 - uProgress * (1.0 + FADE_WIDTH) - dist + FADE_WIDTH) / FADE_WIDTH; + // This gradually dissolves from [1..0] from the outside to the center. We + // switch the direction for opening and closing. + float progress = ${forOpening ? '1.0 - uProgress' : 'uProgress'}; + float mask = (1.0 - progress * (1.0 + FADE_WIDTH) - dist + FADE_WIDTH) / FADE_WIDTH; // Make the mask smoother. mask = smoothstep(0, 1, mask);