Correctly cleanup frame painter from TCanvas/RCanvas drawings

In RCanvas ROOT6 frame painter has to be deleted
In TCanvas if frame painter cleaned up, one need to recreate basic
elements

Author: linev

scripts/JSRoot.core.js

@@ -105,7 +105,7 @@
 
    /** @summary JSROOT version date
      * @desc Release date in format day/month/year like "6/01/2021"*/
-   JSROOT.version_date = "8/01/2021";
+   JSROOT.version_date = "11/01/2021";
 
    /** @summary JSROOT version id and date
      * @desc Produced by concatenation of {@link JSROOT.version_id} and {@link JSROOT.version_date}

scripts/JSRoot.gpad.js

@@ -934,6 +934,10 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
    /** @summary Returns frame painter - object itself */
    TFramePainter.prototype.getFramePainter = function() { return this; }
 
+   /** @summary Returns true if it is ROOT6 frame
+     * @private */
+   TFramePainter.prototype.is_root6 = function() { return true; }
+
    /** @summary Returns frame or sub-objects, used in GED editor */
    TFramePainter.prototype.getObject = function(place) {
       if (place === "xaxis") return this.xaxis;
@@ -1539,6 +1543,10 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
       delete this._dblclick_handler;
       delete this.enabledKeys;
 
+      let pp = this.getPadPainter();
+      if (pp && (pp.frame_painter_ref === this))
+         delete pp.frame_painter_ref;
+
       JSROOT.ObjectPainter.prototype.cleanup.call(this);
    }
 
@@ -3106,6 +3114,7 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
       }
 
       if (!isanyfound) {
+         // TODO: maybe just remove frame painter?
          let fp = this.getFramePainter();
          for (let k=0;k<this.painters.length;++k)
             if (fp !== this.painters[k])
@@ -3115,6 +3124,7 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
          if (fp) {
             this.painters.push(fp);
             fp.cleanFrameDrawings();
+            fp.redraw();
          }
          if (this.removePadButtons) this.removePadButtons();
          this.addPadButtons(true);

scripts/JSRoot.painter.js

@@ -2434,6 +2434,7 @@ JSROOT.define(['d3'], (d3) => {
      * @protected */
    ObjectPainter.prototype.scaleTextDrawing = function(factor, draw_g) {
       if (!draw_g) draw_g = this.draw_g;
+      if (!draw_g || draw_g.empty()) return;
       if (factor && (factor > draw_g.property('text_factor')))
          draw_g.property('text_factor', factor);
    }
@@ -2594,6 +2595,7 @@ JSROOT.define(['d3'], (d3) => {
       if (!arg.text) arg.text = "";
 
       arg.draw_g = arg.draw_g || this.draw_g;
+      if (!arg.draw_g || arg.draw_g.empty()) return;
 
       let font = arg.draw_g.property('text_font');
       arg.font = font; // use in latex conversion
@@ -2711,6 +2713,9 @@ JSROOT.define(['d3'], (d3) => {
      * @protected */
    ObjectPainter.prototype.finishTextDrawing = function(draw_g) {
       if (!draw_g) draw_g = this.draw_g;
+      if (!draw_g || draw_g.empty())
+         return Promise.resolve(false);
+
       draw_g.property('draw_text_completed', true); // mark that text drawing is completed
 
       return new Promise(resolveFunc => {

scripts/JSRoot.v7gpad.js

@@ -1462,8 +1462,13 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
 
    RFramePainter.prototype = Object.create(JSROOT.ObjectPainter.prototype);
 
+   /** @summary Returns frame painter - object itself */
    RFramePainter.prototype.getFramePainter = function() { return this; }
 
+   /** @summary Returns true if it is ROOT6 frame
+    * @private */
+   RFramePainter.prototype.is_root6 = function() { return false; }
+
    /** @summary Set active flag for frame - can block some events
     * @private */
    RFramePainter.prototype.setFrameActive = function(on) {
@@ -1894,6 +1899,10 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
       delete this._click_handler;
       delete this._dblclick_handler;
 
+      let pp = this.getPadPainter();
+      if (pp && (pp.frame_painter_ref === this))
+         delete pp.frame_painter_ref;
+
       JSROOT.ObjectPainter.prototype.cleanup.call(this);
    }
 
@@ -3262,8 +3271,11 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
          let sub = this.painters[k];
          if (sub.snapid===undefined) continue; // look only for painters with snapid
 
-         for (let i=0;i<snap.fPrimitives.length;++i)
-            if (snap.fPrimitives[i].fObjectID === sub.snapid) { sub = null; isanyfound = true; break; }
+         snap.fPrimitives.forEach(prim => {
+            if (sub && (prim.fObjectID === sub.snapid)) {
+               sub = null; isanyfound = true;
+            }
+         });
 
          if (sub) {
             // remove painter which does not found in the list of snaps
@@ -3279,14 +3291,17 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
 
       if (!isanyfound) {
          let fp = this.getFramePainter();
+         // cannot preserve ROOT6 frame - it must be recreated
+         if (fp && fp.is_root6()) fp = null;
          for (let k = 0; k < this.painters.length; ++k)
-            if (fp !== this.painters[k])
+             if (fp !== this.painters[k])
                this.painters[k].cleanup();
          this.painters = [];
          delete this.main_painter_ref;
          if (fp) {
             this.painters.push(fp);
             fp.cleanFrameDrawings();
+            fp.redraw(); // need to create all layers again
          }
          if (this.removePadButtons) this.removePadButtons();
          this.addPadButtons(true);
@@ -3953,13 +3968,14 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
    /** @summary Hanler for websocket close event
      * @private */
    RCanvasPainter.prototype.onWebsocketClosed = function(/*handle*/) {
+      console.log('WebSocket closed!!');
       jsrp.closeCurrentWindow();
    }
 
    /** @summary Hanler for websocket message
      * @private */
    RCanvasPainter.prototype.onWebsocketMsg = function(handle, msg) {
-      console.log("GET MSG " + msg.substr(0,30));
+      console.log("GET_MSG " + msg.substr(0,30));
 
       if (msg == "CLOSE") {
          this.onWebsocketClosed();