Add blending mode effect (#1499)

Core/GDCore/Extensions/Builtin/SpriteExtension/SpriteExtension.cpp

@@ -380,7 +380,7 @@ void GD_CORE_API BuiltinExtensionsImplementer::ImplementsSpriteExtension(
   obj.AddAction("ChangeBlendMode",
                 _("Blend mode"),
                 _("Change the number of the blend mode of an object.\nThe "
-                  "default blend mode is 0 (Alpha)."),
+                  "default blend mode is 0 (Normal)."),
                 _("Change Blend mode of _PARAM0_ to _PARAM1_"),
                 _("Effects"),
                 "res/actions/color24.png",
@@ -388,7 +388,7 @@ void GD_CORE_API BuiltinExtensionsImplementer::ImplementsSpriteExtension(
 
       .AddParameter("object", _("Object"), "Sprite")
       .AddParameter("expression",
-                    _("Mode (0 : Alpha, 1 : Add, 2 : Multiply, 3 : None)"))
+                    _("Mode (0: Normal, 1: Add, 2: Multiply, 3: Screen)"))
       .MarkAsSimple();
 
   obj.AddAction("FlipX",

Extensions/Effects/JsExtension.js

@@ -39,6 +39,28 @@ module.exports = {
         .setType('number')
     );
 
+    const blendingModeEffect = extension
+      .addEffect('BlendingMode')
+      .setFullName(_('Blending mode'))
+      .setDescription(
+        _('Alter the rendered image with the specified blend mode.')
+      )
+      .addIncludeFile('Extensions/Effects/pixi-filters/filter-alpha.js')
+      .addIncludeFile('Extensions/Effects/blending-mode-pixi-filter.js');
+    const blendingModeProperties = blendingModeEffect.getProperties();
+    blendingModeProperties.set(
+      'blendmode',
+      new gd.PropertyDescriptor(/* defaultValue= */ '0')
+        .setLabel(_('Mode (0: Normal, 1: Add, 2: Multiply, 3: Screen)'))
+        .setType('number')
+    );
+    blendingModeProperties.set(
+      'opacity',
+      new gd.PropertyDescriptor(/* defaultValue= */ '1')
+        .setLabel(_('Opacity (between 0 and 1)'))
+        .setType('number')
+    );
+
     const blurEffect = extension
       .addEffect('Blur')
       .setFullName(_('Blur'))

Extensions/Effects/blending-mode-pixi-filter.js

@@ -0,0 +1,18 @@
+gdjs.PixiFiltersTools.registerFilterCreator('BlendingMode', {
+  makePIXIFilter: function(layer, effectData) {
+    var blendingModeFilter = new PIXI.filters.AlphaFilter();
+
+    return blendingModeFilter;
+  },
+  update: function(filter, layer) {},
+  updateDoubleParameter: function(filter, parameterName, value) {
+    if (parameterName === 'alpha') {
+      filter.alpha = value;
+    }
+    if (parameterName === 'blendmode') {
+      filter.blendMode = value;
+    }
+  },
+  updateStringParameter: function(filter, parameterName, value) {},
+  updateBooleanParameter: function(filter, parameterName, value) {},
+});

Extensions/Effects/pixi-filters/filter-alpha.js

@@ -0,0 +1,9 @@
+/*!
+ * @pixi/filter-alpha - v5.2.1
+ * Compiled Tue, 28 Jan 2020 23:33:11 UTC
+ *
+ * @pixi/filter-alpha is licensed under the MIT License.
+ * http://www.opensource.org/licenses/mit-license
+ */
+this.PIXI=this.PIXI||{},this.PIXI.filters=this.PIXI.filters||{};var _pixi_filter_alpha=function(t,r){"use strict";var e="varying vec2 vTextureCoord;\n\nuniform sampler2D uSampler;\nuniform float uAlpha;\n\nvoid main(void)\n{\n   gl_FragColor = texture2D(uSampler, vTextureCoord) * uAlpha;\n}\n",i=function(t){function i(i){void 0===i&&(i=1),t.call(this,r.defaultVertex,e,{uAlpha:1}),this.alpha=i}t&&(i.__proto__=t),i.prototype=Object.create(t&&t.prototype),i.prototype.constructor=i;var a={alpha:{configurable:!0}};return a.alpha.get=function(){return this.uniforms.uAlpha},a.alpha.set=function(t){this.uniforms.uAlpha=t},Object.defineProperties(i.prototype,a),i}(r.Filter);return t.AlphaFilter=i,t}({},PIXI);Object.assign(this.PIXI.filters,_pixi_filter_alpha);
+//# sourceMappingURL=filter-alpha.min.js.map

GDJS/tsconfig.json

@@ -20,6 +20,7 @@
     "Runtime/Cordova",
     "Runtime/Electron",
     "Runtime/FacebookInstantGames",
-    "Runtime/libs/CocoonJS"
+    "Runtime/libs/CocoonJS",
+    "../Extensions/Effects/pixi-filters/filter-alpha.js"
   ]
 }