From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 21 Jun 2023 14:08:42 +0000 (+0200)
Subject: wip #6064 @0.5
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=50e7149add9a3caeeb0b2ba284f9f02db8e5e16e;p=fluidbook-html5.git

wip #6064 @0.5
---

diff --git a/js/libs/fluidbook/fluidbook.loader.js b/js/libs/fluidbook/fluidbook.loader.js
index c80f8760..c1cdb5d8 100644
--- a/js/libs/fluidbook/fluidbook.loader.js
+++ b/js/libs/fluidbook/fluidbook.loader.js
@@ -420,7 +420,9 @@ FluidbookLoader.prototype = {
 
     getTextsURL: function (page) {
         return 'data/contents/p' + page + '.svg';
-    }, setBackground: function (page, callback) {
+    },
+
+    setBackground: function (page, callback) {
         var $this = this;
         var back = $("#page_" + page + ' .background');
         this._loadBackground(page, function () {
@@ -428,14 +430,18 @@ FluidbookLoader.prototype = {
             $(back).append($this.backgrounds[page]);
             callback();
         });
-    }, setOnStage: function (element) {
+    },
+
+    setOnStage: function (element) {
         if (element === undefined || element == null) {
             return;
         }
         if (!isOnStage(element)) {
             $("#loadedcontents").append($(element));
         }
-    }, _loadBackground: function (page, callback) {
+    },
+
+    _loadBackground: function (page, callback) {
         if (page <= 0 || page > this.fluidbook.settings.pages) {
             callback();
             return;
@@ -452,7 +458,9 @@ FluidbookLoader.prototype = {
                 this.__loadBackground(page, callback);
             }
         }
-    }, __loadBackground: function (page, callback) {
+    },
+
+    __loadBackground: function (page, callback) {
         if (page <= 0 || page > this.fluidbook.settings.pages) {
             callback();
             return;
@@ -463,7 +471,9 @@ FluidbookLoader.prototype = {
             return false;
         }
         this.backgrounds[page] = this.loadImage(url, null, null, null, page, callback);
-    }, needSeparateTextures: function (page) {
+    },
+
+    needSeparateTextures: function (page) {
         if (this._needSeparateTextures[page] === undefined) {
             var $this = this;
             this._needSeparateTextures[page] = false;
@@ -480,7 +490,9 @@ FluidbookLoader.prototype = {
             });
         }
         return this._needSeparateTextures[page];
-    }, loadTexture: function (page, callback, enter) {
+    },
+
+    loadTexture: function (page, callback, enter) {
         if (enter === undefined) {
             enter = true;
         }
@@ -602,6 +614,19 @@ FluidbookLoader.prototype = {
                     var top = parseFloat($(this).css('top')) * hr;
                     var width = parseFloat($(this).css('width')) * wr;
                     var height = parseFloat($(this).css('height')) * hr;
+
+                    var blendmode=$(this).data('blendmode');
+
+                    if (blendmode === 'normal') {
+                        ctx.globalCompositeOperation = 'source-over';
+                    } else {
+                        try {
+                            ctx.globalCompositeOperation = blendmode;
+                        } catch (e) {
+                            ctx.globalCompositeOperation = 'source-over';
+                        }
+                    }
+
                     if ($(this).is('[data-color]')) {
                         ctx.fillStyle = $(this).attr('data-color');
                         ctx.fillRect(left, top, width, height);