Support GED in RCanvas without ui5

Author: linev

scripts/JSRoot.v7gpad.js

@@ -3644,7 +3644,7 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
 
    /** @summary Add buttons for pad or canvas
      * @private */
-   RPadPainter.prototype.addPadButtons = function(/* is_online */) {
+   RPadPainter.prototype.addPadButtons = function(is_online) {
 
       this.addPadButton("camera", "Create PNG", this.iscan ? "CanvasSnapShot" : "PadSnapShot", "Ctrl PrintScreen");
 
@@ -3655,6 +3655,12 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
 
       if (add_enlarge || this.enlargeMain('verify'))
          this.addPadButton("circle", "Enlarge canvas", "enlargePad");
+
+      if (is_online && this.brlayout) {
+         this.addPadButton("diamand", "Toggle Ged", "ToggleGed");
+         this.addPadButton("three_circles", "Toggle Status", "ToggleStatus");
+      }
+
    }
 
    /** @summary Show pad buttons
@@ -4224,9 +4230,126 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
       }
    }
 
+   /** @summary Handle pad button click event
+     * @private */
+   RCanvasPainter.prototype.clickPadButton = function(funcname, evnt) {
+      if (funcname == "ToggleGed") return this.activateGed(this, null, "toggle");
+      if (funcname == "ToggleStatus") return this.activateStatusBar("toggle");
+      RPadPainter.prototype.clickPadButton.call(this, funcname, evnt);
+   }
+
    /** @summary returns true when event status area exist for the canvas */
    RCanvasPainter.prototype.hasEventStatus = function() {
-      return this.has_event_status;
+      if (this.testUI5()) return false;
+      return this.brlayout ? this.brlayout.hasStatus() : false;
+   }
+
+   /** @summary Show/toggle event status bar
+     * @private */
+   RCanvasPainter.prototype.activateStatusBar = function(state) {
+      if (this.testUI5()) return;
+      if (this.brlayout)
+         this.brlayout.createStatusLine(23, state);
+      this.processChanges("sbits", this);
+   }
+
+   /** @summary Returns true if GED is present on the canvas */
+   RCanvasPainter.prototype.hasGed = function() {
+      if (this.testUI5()) return false;
+      return this.brlayout ? this.brlayout.hasContent() : false;
+   }
+
+   /** @summary Function used to de-activate GED
+     * @private */
+   RCanvasPainter.prototype.removeGed = function() {
+      if (this.testUI5()) return;
+
+      this.registerForPadEvents(null);
+
+      if (this.ged_view) {
+         this.ged_view.getController().cleanupGed();
+         this.ged_view.destroy();
+         delete this.ged_view;
+      }
+      if (this.brlayout)
+         this.brlayout.deleteContent();
+
+      this.processChanges("sbits", this);
+   }
+
+   /** @summary Function used to activate GED
+     * @returns {Promise} when GED is there
+     * @private */
+   RCanvasPainter.prototype.activateGed = function(objpainter, kind, mode) {
+      if (this.testUI5() || !this.brlayout)
+         return Promise.resolve(false);
+
+      if (this.brlayout.hasContent()) {
+         if ((mode === "toggle") || (mode === false)) {
+            this.removeGed();
+         } else {
+            let pp = objpainter ? objpainter.getPadPainter() : null;
+            if (pp) pp.selectObjectPainter(objpainter);
+         }
+
+         return Promise.resolve(true);
+      }
+
+      if (mode === false)
+         return Promise.resolve(false);
+
+      let btns = this.brlayout.createBrowserBtns();
+
+      JSROOT.require('interactive').then(inter => {
+
+         inter.ToolbarIcons.createSVG(btns, inter.ToolbarIcons.diamand, 15, "toggle fix-pos mode")
+                            .style("margin","3px").on("click", () => this.brlayout.toggleKind('fix'));
+
+         inter.ToolbarIcons.createSVG(btns, inter.ToolbarIcons.circle, 15, "toggle float mode")
+                            .style("margin","3px").on("click", () => this.brlayout.toggleKind('float'));
+
+         inter.ToolbarIcons.createSVG(btns, inter.ToolbarIcons.cross, 15, "delete GED")
+                            .style("margin","3px").on("click", () => this.removeGed());
+      });
+
+      // be aware, that jsroot_browser_hierarchy required for flexible layout that element use full browser area
+      this.brlayout.setBrowserContent("<div class='jsroot_browser_hierarchy' id='ged_placeholder'>Loading GED ...</div>");
+      this.brlayout.setBrowserTitle("GED");
+      this.brlayout.toggleBrowserKind(kind || "float");
+
+      return new Promise(resolveFunc => {
+
+         JSROOT.require('openui5').then(() => {
+
+            d3.select("#ged_placeholder").text("");
+
+            sap.ui.define(["sap/ui/model/json/JSONModel", "sap/ui/core/mvc/XMLView"], (JSONModel,XMLView) => {
+
+               let oModel = new JSONModel({ handle: null });
+
+               XMLView.create({
+                  viewName: "rootui5.canv.view.Ged"
+               }).then(oGed => {
+
+                  oGed.setModel(oModel);
+
+                  oGed.placeAt("ged_placeholder");
+
+                  this.ged_view = oGed;
+
+                  // TODO: should be moved into Ged controller - it must be able to detect canvas painter itself
+                  this.registerForPadEvents(oGed.getController().padEventsReceiver.bind(oGed.getController()));
+
+                  let pp = objpainter ? objpainter.getPadPainter() : null;
+                  if (pp) pp.selectObjectPainter(objpainter);
+
+                  this.processChanges("sbits", this);
+
+                  resolveFunc(true);
+               });
+            });
+         });
+      });
    }
 
    /** @summary produce JSON for RCanvas, which can be used to display canvas once again
@@ -4236,7 +4359,6 @@ JSROOT.define(['d3', 'painter'], (d3, jsrp) => {
       return "";
    }
 
-
    function drawRCanvas(divid, can /*, opt */) {
       let nocanvas = !can;
       if (nocanvas)