From: Alan Knowles <alan@roojs.com>
Date: Wed, 23 Jun 2021 08:14:06 +0000 (+0800)
Subject: Roo/svg/Canvas.js
X-Git-Url: http://git.roojs.org/?p=roojs1;a=commitdiff_plain;h=3d39dd77d9e9d02c8e0ff13a8442764f2f714c3f

Roo/svg/Canvas.js
---

diff --git a/Roo/svg/Canvas.js b/Roo/svg/Canvas.js
index ea2d02a679..789856e8fe 100644
--- a/Roo/svg/Canvas.js
+++ b/Roo/svg/Canvas.js
@@ -11,30 +11,34 @@
  *
  */
 
-Roo.namespace(Roo.svg);
+Roo.namespace('Roo.svg');
 
 Roo.svg.Canvas = function(cfg)
 {
-    Roo.svg.Canvas.superclass.constructor.call(this, config);
-    
+    Roo.svg.Canvas.superclass.constructor.call(this, cfg);
+    this.addEvents({
+        'click' : true,
+        'dblclick' : true,
+        'context' : true,
+    });
     
 }
 
-Roo.extend(Roo.svg.Canvas, Roo.BoxComponent,  {
+Roo.extend(Roo.svg.Canvas, Roo.bootstrap.Component,  {
+   
+    width: 100,
+    height : 100, // changeable...
+    
    
     getAutoCreate : function(){
         
-        var cfg = {
-            tag: this.tag,
-            // cls: this.cls, double assign in parent class Component.js :: onRender
-            html: this.html
-        };
+       
         return {
             ns: "svg",
             xmlns: "http://www.w3.org/2000/svg",
             tag: "svg",
-            width: this.wrapper.dom.clientWidth,
-            height: this.wrapper.dom.clientHeight,
+            width: this.width,
+            height: this.height,
             cn : [
                 {
                     ns: "svg",
@@ -47,22 +51,45 @@ Roo.extend(Roo.svg.Canvas, Roo.BoxComponent,  {
     
     initEvents: function() 
     {
-        Roo.bootstrap.Element.superclass.initEvents.call(this);
-        
-        if(this.clickable){
-            this.el.on('click', this.onClick, this);
-        }
+        Roo.svg.Canvas.superclass.initEvents.call(this);
+        // others...
         
+        this.el.on('click', this.relayEvent, this);
+        this.el.on('dblclick', this.relayEvent, this);
+        this.el.on('context', this.relayEvent, this); // ??? any others
+        this.g = this.el.select('g', true);
+         
         
     },
-    onClick : function(e)
+    
+    relayEvent: function(e)
     {
-        if(this.preventDefault){
-            e.preventDefault();
+        //e.type
+        var cel = e.getTarget().findParent('roo-svg-observable', false, true);
+        if (typeof(cel.listeners[e.type]) == 'undefined') {
+            this.fireEvent(e.type)
+            return;
         }
-        
-        this.fireEvent('click', this, e); // why was this double click before?
+        cel.listeners[e.type].fire(e, cel);
+          
     },
     
+    autoResizeToEl : function(el)
+    {
+        // should it fit Horizontal - as per this?
+        // or fit full ? // in which case pan/zoom done by drag?
+        
+        el.on('resize', function() {
+            var sz = el.getSize();
+            var gs = this.g.dom.getBBox();
+            this.svg.set({
+                width: (sz.width - 30),
+                height:  (sz.width -30) * (gs.height / gs.width)
+            });
+        });
+        
+    }
+    
+    
    
 });
\ No newline at end of file