tonic-image-builder - npm Package Compare versions

Comparing version 0.1.0 to 0.2.0

lib/builder/MultiColorBySortedComposite/index.js

@@ -36,3 +36,3 @@ var Monologue = require('monologue.js'),
     this.compositor = this.compositors[1];
-    this.controlWidgets = [ "LookupTableManagerWidget", "LightPropertiesWidget", "EqualizerWidget", "CompositeControl", "QueryDataModelWidget" ];
+    this.controlWidgets = [ "LookupTableManagerWidget", "LightPropertiesWidget", "CompositeControl", "QueryDataModelWidget" ];
     this.resetOpacities();
@@ -60,2 +60,6 @@
     });
+
+    this.opacitySubscription = this.pipelineModel.onOpacityChange((data, envelope) => {
+        this.updateOpacities(data);
+    });
 }
@@ -115,2 +119,5 @@
   this.pipelineSubscription = null;
+
+  this.opacitySubscription.unsubscribe();
+  this.opacitySubscription = null;
 };
@@ -154,19 +161,2 @@
 
-MultiColorBySortedCompositeImageBuilder.prototype.getEqualizerLevels = function() {
-    return this.opacities;
-};
-
-// --------------------------------------------------------------------------
-
-MultiColorBySortedCompositeImageBuilder.prototype.getEqualizerCallback = function() {
-    if(!this.eqCallback) {
-        this.eqCallback = (opacity) => {
-            this.updateOpacities(opacity);
-        };
-    }
-    return this.eqCallback;
-};
-
-// --------------------------------------------------------------------------
-
 MultiColorBySortedCompositeImageBuilder.prototype.resetOpacities = function() {
@@ -173,0 +163,0 @@ this.opacities = [];

lib/model/PipelineState/index.js

@@ -1,142 +0,220 @@
-var Monologue = require('monologue.js'),
-    CHANGE_TOPIC = 'pipeline.change';
+const Monologue = require('monologue.js'),
+      CHANGE_TOPIC = 'pipeline.change',
+      OPACITY_CHANGE_TOPIC = 'opacity.change',
+      LAYER_CODE = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
 
-export default function CompositePipelineModel(jsonData) {
-    this.originalData = jsonData;
-    this.visibilityState = {};
-    this.activeState = {};
-    this.editMode = {};
-    this.activeColors = {};
-    this.noTrigger = true;
+export default class CompositePipelineModel {
 
-    // Handle default pipeline if any
-    var pipelineQuery = jsonData.CompositePipeline.default_pipeline;
-    function isLayerVisible(layers) {
-        if(!pipelineQuery || layers.length > 1) {
-            return true;
+    constructor(jsonData, hasOpacity = false) {
+        this.originalData = jsonData;
+        this.visibilityState = {};
+        this.activeState = {};
+        this.editMode = {};
+        this.activeColors = {};
+        this.noTrigger = true;
+        this.handleOpacity = hasOpacity;
+        this.opacityMap = {};
+        this.nbLayers = 0;
+
+        // Handle default pipeline if any
+        let pipelineQuery = jsonData.CompositePipeline.default_pipeline;
+        function isLayerVisible(layers) {
+            if(!pipelineQuery || layers.length > 1) {
+                return true;
+            }
+
+            let layerIdx = LAYER_CODE.indexOf(layers[0]);
+
+            return (pipelineQuery[layerIdx*2+1] !== '_');
         }
 
-        var layerCode = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ',
-            layerIdx = layerCode.indexOf(layers[0]);
+        // Fill visibility and activate all layers
+        jsonData.CompositePipeline.pipeline.forEach(item => {
+            this.setLayerVisible(item.ids.join(''), true);
+        });
+        jsonData.CompositePipeline.layers.forEach(item => {
+            this.activeState[item] = isLayerVisible(item);
+            this.activeColors[item] = jsonData.CompositePipeline.layer_fields[item][0];
 
-        return (pipelineQuery[layerIdx*2+1] !== '_');
+            // Initialize opacity
+            this.opacityMap[item] = 100.0;
+            this.nbLayers++;
+        });
+
+        this.noTrigger = false;
+        this.triggerChange();
     }
 
-    // Fill visibility and activate all layers
-    jsonData.CompositePipeline.pipeline.forEach(item => {
-        this.setLayerVisible(item.ids.join(''), true);
-    });
-    jsonData.CompositePipeline.layers.forEach(item => {
-        this.activeState[item] = isLayerVisible(item);
-        this.activeColors[item] = jsonData.CompositePipeline.layer_fields[item][0];
-    });
+    // ------------------------------------------------------------------------
 
-    this.noTrigger = false;
-    this.triggerChange();
-}
+    onChange(listener) {
+        return this.on(CHANGE_TOPIC, listener);
+    }
 
-// Add Observer pattern using Monologue.js
-Monologue.mixInto(CompositePipelineModel);
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.onChange = function(listener) {
-    return this.on(CHANGE_TOPIC, listener);
-}
+    onOpacityChange(listener) {
+        return this.on(OPACITY_CHANGE_TOPIC, listener);
+    }
 
-CompositePipelineModel.prototype.TopicChange = function() {
-    return CHANGE_TOPIC;
-}
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.triggerChange = function() {
-    if(this.noTrigger) {
-        return;
+    TopicChange() {
+        return CHANGE_TOPIC;
     }
 
-    var pipelineQuery = this.getPipelineQuery();
-    this.emit(CHANGE_TOPIC, pipelineQuery);
-}
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.isLayerActive = function(layerId) {
-    return this.activeState[layerId];
-}
+    triggerChange() {
+        if(this.noTrigger) {
+            return;
+        }
 
-CompositePipelineModel.prototype.setLayerActive = function(layerId, active) {
-    if(this.activeState[layerId] !== active) {
-        this.activeState[layerId] = active;
+        let pipelineQuery = this.getPipelineQuery();
+        this.emit(CHANGE_TOPIC, pipelineQuery);
+    }
+
+    // ------------------------------------------------------------------------
+
+    isLayerActive(layerId) {
+        return this.activeState[layerId];
+    }
+
+    // ------------------------------------------------------------------------
+
+    setLayerActive(layerId, active) {
+        if(this.activeState[layerId] !== active) {
+            this.activeState[layerId] = active;
+            this.triggerChange();
+        }
+    }
+
+    // ------------------------------------------------------------------------
+
+    toggleLayerActive(layerId) {
+        this.activeState[layerId] = !this.activeState[layerId];
         this.triggerChange();
     }
-}
 
-CompositePipelineModel.prototype.toggleLayerActive = function(layerId) {
-    this.activeState[layerId] = !this.activeState[layerId];
-    this.triggerChange();
-}
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.isLayerVisible = function(layerId) {
-    return this.visibilityState[layerId];
-}
+    isLayerVisible(layerId) {
+        return this.visibilityState[layerId];
+    }
 
-CompositePipelineModel.prototype.setLayerVisible = function(layerId, visible) {
-    if(this.visibilityState[layerId] !== visible) {
-        this.visibilityState[layerId] = visible;
-        var count = layerId.length;
-        while(count--) {
-            this.visibilityState[layerId[count]] = visible;
+    // ------------------------------------------------------------------------
+
+    setLayerVisible(layerId, visible) {
+        if(this.visibilityState[layerId] !== visible) {
+            this.visibilityState[layerId] = visible;
+            let count = layerId.length;
+            while(count--) {
+                this.visibilityState[layerId[count]] = visible;
+            }
+            this.triggerChange();
         }
+    }
+
+    // ------------------------------------------------------------------------
+
+    toggleLayerVisible(layerId) {
+        this.setLayerVisible(layerId, !this.visibilityState[layerId]);
+    }
+
+    // ------------------------------------------------------------------------
+
+    toggleEditMode(layerId) {
+        this.editMode[layerId] = !this.editMode[layerId];
         this.triggerChange();
     }
-}
 
-CompositePipelineModel.prototype.toggleLayerVisible = function(layerId) {
-    this.setLayerVisible(layerId, !this.visibilityState[layerId]);
-}
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.toggleEditMode = function(layerId) {
-    this.editMode[layerId] = !this.editMode[layerId];
-    this.triggerChange();
-}
+    isLayerInEditMode(layerId) {
+        for(let key in this.editMode) {
+            if(this.editMode[key] && key.indexOf(layerId) !== -1) {
+                return true;
+            }
+        }
+        return false;
+    }
 
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.isLayerInEditMode = function(layerId) {
-    for(var key in this.editMode) {
-        if(this.editMode[key] && key.indexOf(layerId) !== -1) {
-            return true;
+    getColor(layerId) {
+        return this.originalData.CompositePipeline.layer_fields[layerId[0]];
+    }
+
+    // ------------------------------------------------------------------------
+
+    getColorToLabel(colorCode) {
+        return this.originalData.CompositePipeline.fields[colorCode];
+    }
+
+    // ------------------------------------------------------------------------
+
+    isActiveColor(layerId, colorCode) {
+        return this.activeColors[layerId[0]] === colorCode;
+    }
+
+    // ------------------------------------------------------------------------
+
+    setActiveColor(layerId, colorCode) {
+        let count = layerId.length;
+        while(count--) {
+            this.activeColors[layerId[count]] = colorCode;
         }
+        this.triggerChange();
     }
-    return false;
-}
 
-CompositePipelineModel.prototype.getColor = function(layerId) {
-    return this.originalData.CompositePipeline.layer_fields[layerId[0]];
-}
+    // ------------------------------------------------------------------------
+    // Return the encoding of the pipeline configuration
 
-CompositePipelineModel.prototype.getColorToLabel = function(colorCode) {
-    return this.originalData.CompositePipeline.fields[colorCode];
-}
+    getPipelineQuery() {
+        let query = "";
+        this.originalData.CompositePipeline.layers.forEach(item => {
+            let color = this.isLayerActive(item) && this.isLayerVisible(item) ? this.activeColors[item] : '_';
+            query += item;
+            query += color;
+        });
+        return query;
+    }
 
-CompositePipelineModel.prototype.isActiveColor = function(layerId, colorCode) {
-    return this.activeColors[layerId[0]] === colorCode;
-}
+    // ------------------------------------------------------------------------
 
-CompositePipelineModel.prototype.setActiveColor = function(layerId, colorCode) {
-    var count = layerId.length;
-    while(count--) {
-        this.activeColors[layerId[count]] = colorCode;
+    getPipelineDescription() {
+       return this.originalData.CompositePipeline.pipeline;
     }
-    this.triggerChange();
-}
 
-// Return the encoding of the pipeline configuration
-CompositePipelineModel.prototype.getPipelineQuery = function() {
-    var query = "";
-    this.originalData.CompositePipeline.layers.forEach(item => {
-        var color = this.isLayerActive(item) && this.isLayerVisible(item) ? this.activeColors[item] : '_';
-        query += item;
-        query += color;
-    });
-    return query;
+    // ------------------------------------------------------------------------
+
+    getOpacity(layerCode) {
+        return this.opacityMap[layerCode];
+    }
+
+    // ------------------------------------------------------------------------
+
+    hasOpacity() {
+        return this.handleOpacity;
+    }
+
+    // ------------------------------------------------------------------------
+
+    setOpacity(layerCode, alpha) {
+        if(this.opacityMap[layerCode] !== alpha) {
+            this.opacityMap[layerCode] = alpha;
+
+            let opacityArray = [];
+            for(let i = 0; i < this.nbLayers; ++i) {
+                opacityArray.push(this.opacityMap[LAYER_CODE[i]] / 100.0);
+            }
+
+            this.emit(OPACITY_CHANGE_TOPIC, opacityArray);
+        }
+
+    }
+
 }
 
-CompositePipelineModel.prototype.getPipelineDescription = function() {
-    return this.originalData.CompositePipeline.pipeline;
-};
-
+// Add Observer pattern using Monologue.js
+Monologue.mixInto(CompositePipelineModel);

package.json

 {
   "name": "tonic-image-builder",
   "description": "JavaScript library used to gather image generation based on various input data.",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "license": "BSD-3-Clause",
@@ -6,0 +6,0 @@ "main": "./src/index.js",

New alerts

AI-detected potential code anomaly

Supply chain risk

AI has identified unusual behaviors that may pose a security risk.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2138127

0.14%

Lines of code

12568

0.33%

Worsened metrics

Number of low supply chain risk alerts

1

Infinity%

No dependency changes