Use promises when drawing extra objects in TGeo painter

Prepare to use it for points drawing

Author: linev

scripts/JSRoot.geom.js

@@ -2658,21 +2658,25 @@ JSROOT.define(['d3', 'three', 'geobase', 'painter', 'base3d'], (d3, THREE, geo,
          if (!func) return Promise.reject(Error(`Function ${funcname} not found`));
 
          return func(obj, opt).then(tracks => {
-            if (tracks) {
-               this.drawExtras(tracks, "", false); // FIXME: probably tracks should be remembered??
+            if (!tracks) return this;
+
+            // FIXME: probably tracks should be remembered??
+            return this.drawExtras(tracks, "", false).then(()=> {
                this.updateClipping(true);
                this.render3D(100);
-            }
-            return this;
+               return this;
+            });
          });
       }
 
-      if (this.drawExtras(obj, itemname)) {
-         if (hitem) hitem._painter = this; // set for the browser item back pointer
-         this.render3D(100);
-      }
+      return this.drawExtras(obj, itemname).then(is_any => {
+         if (is_any) {
+            if (hitem) hitem._painter = this; // set for the browser item back pointer
+            this.render3D(100);
+         }
 
-      return Promise.resolve(this);
+         return this;
+      });
    }
 
    /** @summary function called when mouse is going over the item in the browser */
@@ -2720,7 +2724,7 @@ JSROOT.define(['d3', 'three', 'geobase', 'painter', 'base3d'], (d3, THREE, geo,
       let itemname = hpainter.itemFullName(hitem),
           indx = this._extraObjects.opt.indexOf(itemname);
 
-      if ((indx<0) && hitem._obj) {
+      if ((indx < 0) && hitem._obj) {
          indx = this._extraObjects.arr.indexOf(hitem._obj);
          // workaround - if object found, replace its name
          if (indx>=0) this._extraObjects.opt[indx] = itemname;
@@ -2736,66 +2740,79 @@ JSROOT.define(['d3', 'three', 'geobase', 'painter', 'base3d'], (d3, THREE, geo,
 
          let mesh = null;
          // either found painted object or just draw once again
-         this._toplevel.traverse(function(node) { if (node.geo_object === obj) mesh = node; });
+         this._toplevel.traverse(node => { if (node.geo_object === obj) mesh = node; });
 
-         if (mesh) mesh.visible = res; else
-         if (res) {
-            this.drawExtras(obj, "", false);
-            this.updateClipping(true);
+         if (mesh) {
+            mesh.visible = res;
+            this.render3D();
+         } else if (res) {
+            this.drawExtras(obj, "", false).then(()=> {
+               this.updateClipping(true);
+               this.render3D();
+            });
          }
-
-         if (mesh || res) this.render3D();
       }
 
       return res;
    }
 
    /** @summary Draw extra object like tracks
-     * @returns {Promise} when ready */
+     * @returns {Promise} for ready */
    TGeoPainter.prototype.drawExtras = function(obj, itemname, add_objects) {
-      if (!obj || !obj._typename)
-         return false;
-
       // if object was hidden via menu, do not redraw it with next draw call
-      if (!add_objects && obj.$hidden_via_menu)
-         return false;
+      if (!obj || !obj._typename || (!add_objects && obj.$hidden_via_menu))
+         return Promise.resolve(false);
 
-      let is_any = false, do_render = false;
+      let do_render = false;
       if (add_objects === undefined) {
          add_objects = true;
          do_render = true;
       }
 
+      let promise = false;
+
       if ((obj._typename === "TList") || (obj._typename === "TObjArray")) {
          if (!obj.arr) return false;
-         for (let n=0;n<obj.arr.length;++n) {
+         let parr = [];
+         for (let n = 0; n < obj.arr.length; ++n) {
             let sobj = obj.arr[n], sname = obj.opt ? obj.opt[n] : "";
             if (!sname) sname = (itemname || "<prnt>") + "/[" + n + "]";
-            if (this.drawExtras(sobj, sname, add_objects)) is_any = true;
+            parr.push(this.drawExtras(sobj, sname, add_objects));
          }
+         promise = Promise.all(parr).then(ress => ress.indexOf(true) >= 0);
       } else if (obj._typename === 'THREE.Mesh') {
          // adding mesh as is
          this.addToExtrasContainer(obj);
+         promise = Promise.resolve(true);
          is_any = true;
       } else if (obj._typename === 'TGeoTrack') {
-         if (add_objects && !this.addExtra(obj, itemname)) return false;
-         is_any = this.drawGeoTrack(obj, itemname);
+         if (!add_objects || this.addExtra(obj, itemname))
+            promise = this.drawGeoTrack(obj, itemname);
       } else if ((obj._typename === 'TEveTrack') || (obj._typename === 'ROOT::Experimental::TEveTrack')) {
-         if (add_objects && !this.addExtra(obj, itemname)) return false;
-         is_any = this.drawEveTrack(obj, itemname);
+         if (!add_objects || this.addExtra(obj, itemname))
+            promise = this.drawEveTrack(obj, itemname);
       } else if ((obj._typename === 'TEvePointSet') || (obj._typename === "ROOT::Experimental::TEvePointSet") || (obj._typename === "TPolyMarker3D")) {
-         if (add_objects && !this.addExtra(obj, itemname)) return false;
-         is_any = this.drawHit(obj, itemname);
+         if (!add_objects || this.addExtra(obj, itemname))
+            promise = this.drawHit(obj, itemname);
       } else if ((obj._typename === "TEveGeoShapeExtract") || (obj._typename === "ROOT::Experimental::REveGeoShapeExtract")) {
-         if (add_objects && !this.addExtra(obj, itemname)) return false;
-         is_any = this.drawExtraShape(obj, itemname);
+         if (!add_objects || this.addExtra(obj, itemname))
+            promise = this.drawExtraShape(obj, itemname);
       }
 
-      if (do_render && is_any) {
-         this.updateClipping(true);
-         this.render3D(100);
-      }
-      return is_any;
+      if (!jsrp.isPromise(promise))
+         promise = Promise.resolve(promise);
+
+      if (!do_render)
+         return promise;
+
+      return promise.then(is_any => {
+         if (is_any) {
+            this.updateClipping(true);
+            this.render3D(100);
+         }
+
+         return is_any;
+      });
    }
 
    /** @summary returns container for extra objects */
@@ -2944,7 +2961,7 @@ JSROOT.define(['d3', 'three', 'geobase', 'painter', 'base3d'], (d3, THREE, geo,
           projz = (this.ctrl.project === "z"),
           pnts = new jsrp.PointsCreator(size, this._webgl, hit_size);
 
-      for (let i=0;i<size;i++)
+      for (let i = 0; i < size; i++)
          pnts.addPoint(projx ? projv : hit.fP[i*3],
                        projy ? projv : hit.fP[i*3+1],
                        projz ? projv : hit.fP[i*3+2]);
@@ -3289,7 +3306,7 @@ JSROOT.define(['d3', 'three', 'geobase', 'painter', 'base3d'], (d3, THREE, geo,
       if (take_time > 300) {
          jsrp.showProgress('Rendering geometry');
          this.showDrawInfo("Rendering");
-         return setTimeout(this.completeDraw.bind(this, true), 10);
+         return setTimeout(() => this.completeDraw(true), 10);
       }
 
       this.completeDraw(true);
@@ -3809,107 +3826,116 @@ JSROOT.define(['d3', 'three', 'geobase', 'painter', 'base3d'], (d3, THREE, geo,
       this._complete_handler = callback;
    }
 
-   /** @summary Completes drawing procedure */
+   /** @summary Completes drawing procedure
+     * @returns {Promise} for ready */
    TGeoPainter.prototype.completeDraw = function(close_progress) {
 
       let first_time = false, full_redraw = false, check_extras = true;
 
       if (!this.ctrl) {
          console.warn('ctrl object does not exist in completeDraw - something went wrong');
-         return;
+         return Promise.resolve(this);
       }
 
+      let promise = Promise.resolve(true);
+
       if (!this._clones) {
          check_extras = false;
          // if extra object where append, redraw them at the end
          this.getExtrasContainer("delete"); // delete old container
          let extras = (this._main_painter ? this._main_painter._extraObjects : null) || this._extraObjects;
-         this.drawExtras(extras, "", false);
+         promise = this.drawExtras(extras, "", false);
       } else if (this._first_drawing || this._full_redrawing) {
          if (this.ctrl.tracks && this.geo_manager)
-            this.drawExtras(this.geo_manager.fTracks, "<prnt>/Tracks");
+            promise = this.drawExtras(this.geo_manager.fTracks, "<prnt>/Tracks");
       }
 
-      if (this._full_redrawing) {
-         this.adjustCameraPosition(true);
-         this._full_redrawing = false;
-         full_redraw = true;
-         this.changedDepthMethod("norender");
-      }
+      return promise.then(() => {
 
-      if (this._first_drawing) {
-         this.adjustCameraPosition(true);
-         this.showDrawInfo();
-         this._first_drawing = false;
-         first_time = true;
-         full_redraw = true;
-      }
+         if (this._full_redrawing) {
+            this.adjustCameraPosition(true);
+            this._full_redrawing = false;
+            full_redraw = true;
+            this.changedDepthMethod("norender");
+         }
 
-      if (this.ctrl.transparency!==0)
-         this.changedGlobalTransparency(this.ctrl.transparency, true);
+         if (this._first_drawing) {
+            this.adjustCameraPosition(true);
+            this.showDrawInfo();
+            this._first_drawing = false;
+            first_time = true;
+            full_redraw = true;
+         }
 
-      if (first_time)
-         this.completeScene();
+         if (this.ctrl.transparency !== 0)
+            this.changedGlobalTransparency(this.ctrl.transparency, true);
 
-      if (full_redraw && (this.ctrl.trans_radial || this.ctrl.trans_z))
-         this.changedTransformation("norender");
+         if (first_time)
+            this.completeScene();
 
-      if (full_redraw && this.ctrl._axis)
-         this.drawSimpleAxis(true);
+         if (full_redraw && (this.ctrl.trans_radial || this.ctrl.trans_z))
+            this.changedTransformation("norender");
 
-      this._scene.overrideMaterial = null;
+         if (full_redraw && this.ctrl._axis)
+            this.drawSimpleAxis(true);
 
-      if (this._provided_more_nodes !== undefined) {
-         this.appendMoreNodes(this._provided_more_nodes, true);
-         delete this._provided_more_nodes;
-      }
+         this._scene.overrideMaterial = null;
 
-      if (check_extras) {
-         // if extra object where append, redraw them at the end
-         this.getExtrasContainer("delete"); // delete old container
-         let extras = (this._main_painter ? this._main_painter._extraObjects : null) || this._extraObjects;
-         this.drawExtras(extras, "", false);
-      }
+         if (this._provided_more_nodes !== undefined) {
+            this.appendMoreNodes(this._provided_more_nodes, true);
+            delete this._provided_more_nodes;
+         }
 
-      this.updateClipping(true); // do not render
+         if (check_extras) {
+            // if extra object where append, redraw them at the end
+            this.getExtrasContainer("delete"); // delete old container
+            let extras = (this._main_painter ? this._main_painter._extraObjects : null) || this._extraObjects;
+            return this.drawExtras(extras, "", false);
+         }
+      }).then(() => {
 
-      this.render3D(0, true);
+         this.updateClipping(true); // do not render
 
-      if (close_progress) jsrp.showProgress();
+         this.render3D(0, true);
 
-      this.addOrbitControls();
+         if (close_progress) jsrp.showProgress();
 
-      this.addTransformControl();
+         this.addOrbitControls();
 
-      if (first_time) {
+         this.addTransformControl();
 
-         // after first draw check if highlight can be enabled
-         if (this.ctrl.highlight === false)
-            this.ctrl.highlight = (this.first_render_tm < 1000);
+         if (first_time) {
 
-         // also highlight of scene object can be assigned at the first draw
-         if (this.ctrl.highlight_scene === false)
-            this.ctrl.highlight_scene = this.ctrl.highlight;
+            // after first draw check if highlight can be enabled
+            if (this.ctrl.highlight === false)
+               this.ctrl.highlight = (this.first_render_tm < 1000);
 
-         // if rotation was enabled, do it
-         if (this._webgl && this.ctrl.rotate && !this.ctrl.project) this.autorotate(2.5);
-         if (this._webgl && this.ctrl.show_controls && !JSROOT.batch_mode) this.showControlOptions(true);
-      }
+            // also highlight of scene object can be assigned at the first draw
+            if (this.ctrl.highlight_scene === false)
+               this.ctrl.highlight_scene = this.ctrl.highlight;
 
-      this.setAsMainPainter();
+            // if rotation was enabled, do it
+            if (this._webgl && this.ctrl.rotate && !this.ctrl.project) this.autorotate(2.5);
+            if (this._webgl && this.ctrl.show_controls && !JSROOT.batch_mode) this.showControlOptions(true);
+         }
 
-      if (typeof this._resolveFunc == 'function') {
-         this._resolveFunc(this);
-         delete this._resolveFunc;
-      }
+         this.setAsMainPainter();
 
-      if (typeof this._complete_handler == 'function')
-         this._complete_handler(this);
+         if (typeof this._resolveFunc == 'function') {
+            this._resolveFunc(this);
+            delete this._resolveFunc;
+         }
 
-      if (this._draw_nodes_again)
-         return this.startDrawGeometry(); // relaunch drawing
+         if (typeof this._complete_handler == 'function')
+            this._complete_handler(this);
 
-      this._drawing_ready = true; // indicate that drawing is completed
+         if (this._draw_nodes_again)
+            this.startDrawGeometry(); // relaunch drawing
+         else
+            this._drawing_ready = true; // indicate that drawing is completed
+
+         return this;
+      });
    }
 
    /** @summary Returns true if geometry drawing is completed */