Allow modification of particle speed

assets/help/help.json

@@ -22,6 +22,7 @@
             },
             "particles": {
                 "ptcl_size": "Sets the size range of a particle in pixels. It takes a random value between the two specified for each particle. For a constant size, use the same value twice. The order doesn't have any impact.",
+                "speed" : "Sets the speed of the particles.",
                 "flow_type": "Sets the type of flow for the particles. Their spawn and movement behaviour are linked to this setting",
                 "center_pos": "Sets the spawn position for a radial flow.",
                 "direction": "Sets the particle direction for a directional flow.",

docs/save.md

@@ -93,6 +93,7 @@ root
     "width": int >= 0, //(px)
     "height": int >= 0, //(px)
     "particle_radius_range": [min_int_radius, max_int_radius], //(px) (min > max possible)
+    "particle_speed": 10,
     "type": "radial"|"directional",
     "center": { //spawn position
         "x": int, //(px)
@@ -290,6 +291,7 @@ root
     "width": int >= 0, //(px)
     "height": int >= 0, //(px)
     "particle_radius_range": [min_int_radius, max_int_radius], //(px) (min > max possible)
+    "particle_speed": 10,
     "type": "radial"|"directional",
     "center": { //spawn position
         "x": int, //(px)
@@ -1057,6 +1059,10 @@ This is documented from a created save with default values. For more information
         - **type:** array
         - **allowed values:** array of length 2 of integers.
         - **description:** Range within which a random radius/size is picked for spawned particles.
+    - `particle_speed`:
+        - **type:** integer
+        - **allowed values:** decimal between 0 and 30
+        - **description:** Speed at which a particle travels across the space.
     - `flow_type`:
         - **type:** string
         - **allowed values:** `["radial","directional"]`

js/index.js

@@ -397,6 +397,7 @@ class SaveHandler {
             object.rotation = 0;
             object.svg_filter = old_object.svg_filters;
             object.particle_radius_range = JSON.parse(JSON.stringify(old_object.particle_radius_range));
+            object.particle_speed = old_object.particle_speed;
             object.flow_type = old_object.type;
             object.flow_center = JSON.parse(JSON.stringify(old_object.center));
             object.flow_direction = Math.round(old_object.particle_direction * 180 / Math.PI);

js/visual_objects/visual_object.js

@@ -693,6 +693,7 @@ export class VParticleFlow extends VisualObject {
         //#################
 
         this._properties["particle_radius_range"] = new property.VPParticleRadiusRange(this._save_handler, this);
+        this._properties["particle_speed"] = new property.VPParticleSpeed(this._save_handler, this);
         this._properties["flow_type"] = new property.VPFlowType(this._save_handler, this);
         this._properties["flow_center"] = new property.VPFlowCenter(this._save_handler, this);
         this._properties["flow_direction"] = new property.VPFlowDirection(this._save_handler, this);
@@ -729,6 +730,10 @@ export class VParticleFlow extends VisualObject {
         this._properties["particle_radius_range"].subscribeToEvent("value_changed", () => {
             this.regenUpdate();
         });
+
+        this._properties["particle_speed"].subscribeToEvent("value_changed", () => {
+            this.regenUpdate();
+        });
 
         this._properties["flow_type"].subscribeToEvent("value_changed", () => {
             this.regenUpdate();
@@ -873,7 +878,7 @@ class Particle {
         //radius and speed
         let radius_range = this._parent.properties["particle_radius_range"].getCurrentValue();
         this._radius = utils.RandomInt(radius_range[0], radius_range[1]);
-        this._speed = 0;
+        this._speed = this._parent.properties["particle_speed"].getCurrentValue();
         this._direction = 0;
 
         //coordinates
@@ -1009,7 +1014,7 @@ class Particle {
      */
     update() {
         //compute speed
-        this._speed = (this._parent.is_regen_update)? 10 : this._parent.volume/20;
+        //this._speed = (this._parent.is_regen_update)? 10 : this._parent.volume/20;
         this._x_velocity = Math.cos(this._direction) * this._speed;
         this._y_velocity = Math.sin(this._direction) * this._speed;
 

js/visual_objects/visual_object_property.js

@@ -66,6 +66,7 @@ const DEFAULTS = {
     BORDER_THICKNESS: 2,
 
     PARTICLE_RADIUS_RANGE: [1,2],
+    PARTICLE_SPEED: 10,
     FLOW_TYPE: "radial",
     FLOW_CENTER: {x: 0, y: 0},
     FLOW_DIRECTION: 0,
@@ -1921,7 +1922,73 @@ export class VPParticleRadiusRange extends VisualObjectProperty {
     }
 }
 
+/**
+ * Visual property for defining the speed of a particle
+ *
+ * @export
+ * @class VPParticleSpeed
+ * @extends {VisualObjectProperty}
+ */
+export class VPParticleSpeed extends VisualObjectProperty {
+    /**
+     * Creates an instance of VPParticleSpeed.
+     * @param {SaveHandler} save_handler The SaveHandler to read and write from.
+     * @param {object.VisualObject} visual_object The VisualObject that it manipulates.
+     * @memberof VPParticleSpeed
+     */
+    constructor(save_handler, visual_object) {
+        super(save_handler, visual_object, "particle_speed");
 
+        //create associated UI
+        if (!this._save_handler.owner_project.export_mode) {
+            this._ui_parameter = new ui_components.UIParameterNumInputList(
+                this._visual_object.parameter_rack,
+                "",
+                false,
+                [{
+                    title: "Particle speed",
+                    unit: "",
+                    default_value: this.getCurrentValue(),
+                    min: 0,
+                    max: 30,
+                    step: 0.1,
+                    callback: () => {
+                        this.setSaveUISafe(parseFloat(this._ui_parameter.value(0)));
+                    }
+                }]
+            );
+            this._ui_parameter.help_string = help.parameter.object.particles.speed;
+        }
+    }
+
+    /**
+     * Get the default value of the visual object property.
+     * If it is undefined, assign a value.
+     *
+     * @memberof VPParticleSpeed
+     * @override
+     * @return {Number}
+     */
+    getDefaultValue() {
+        if (this._default_value) return this._default_value;
+        else {
+            this._default_value = DEFAULTS.PARTICLE_SPEED;
+            return this._default_value;
+        };
+    }
+
+    /**
+     * The value is valid if it is a number between 1 and 100.
+     *
+     * @override
+     * @param {*} value
+     * @return {Boolean} is valid
+     * @memberof VPParticleSpeed
+     */
+    hasValidValue(value) {
+        return (!utils.IsUndefined(value) && utils.IsANumber(value) && value >= 0 && value <= 100)
+    }
+}
 
 /**
  * property to set the global flow type (behaviour)