jsxgraph 1.3.0 → 1.4.1

package/src/renderer/svg.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,
@@ -51,7 +51,7 @@ define([
 
     /**
      * Uses SVG to implement the rendering methods defined in {@link JXG.AbstractRenderer}.
-     * @class JXG.AbstractRenderer
+     * @class JXG.SVGRenderer
      * @augments JXG.AbstractRenderer
      * @param {Node} container Reference to a DOM node containing the board.
      * @param {Object} dim The dimensions of the board
@@ -103,6 +103,7 @@ define([
 
         this.svgRoot = this.container.ownerDocument.createElementNS(this.svgNamespace, "svg");
         this.svgRoot.style.overflow = 'hidden';
+        this.svgRoot.style.display = 'block';
 
         this.resize(dim.width, dim.height);
 
@@ -169,11 +170,12 @@ define([
             this.svgRoot.appendChild(this.layer[i]);
         }
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         this.supportsForeignObject = document.implementation.hasFeature("http://w3.org/TR/SVG11/feature#Extensibility", "1.1");
 
         if (this.supportsForeignObject) {
             this.foreignObjLayer = this.container.ownerDocument.createElementNS(this.svgNamespace, 'foreignObject');
+            this.foreignObjLayer.setAttribute("display", "none");
             this.foreignObjLayer.setAttribute("x", 0);
             this.foreignObjLayer.setAttribute("y", 0);
             this.foreignObjLayer.setAttribute("width", "100%");
@@ -390,7 +392,7 @@ define([
 
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         _setArrowWidth: function (node, width, parentNode, size) {
             var s, d;
 
@@ -477,7 +479,7 @@ define([
          *    Text related stuff
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         displayCopyright: function (str, fontsize) {
             var node = this.createPrim('text', 'licenseText'),
                 t;
@@ -489,7 +491,7 @@ define([
             this.appendChildPrim(node, 0);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         drawInternalText: function (el) {
             var node = this.createPrim('text', el.id);
 
@@ -505,7 +507,7 @@ define([
             return node;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateInternalText: function (el) {
             var content = el.plaintext, v,
                 ev_ax = el.getAnchorX(),
@@ -571,7 +573,7 @@ define([
          *    Image related stuff
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         drawImage: function (el) {
             var node = this.createPrim('image', el.id);
 
@@ -582,7 +584,7 @@ define([
             this.updateImage(el);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         transformImage: function (el, t) {
             var s, m,
                 node = el.rendNode,
@@ -597,7 +599,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateImageURL: function (el) {
             var url = Type.evaluate(el.url);
 
@@ -612,18 +614,42 @@ define([
             return false;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateImageStyle: function (el, doHighlight) {
             var css = Type.evaluate(doHighlight ? el.visProp.highlightcssclass : el.visProp.cssclass);
 
             el.rendNode.setAttributeNS(null, 'class', css);
         },
 
+        // Already documented in JXG.AbstractRenderer
+        drawForeignObject: function (el) {
+            el.rendNode = this.appendChildPrim(this.createPrim('foreignObject', el.id),
+                                    Type.evaluate(el.visProp.layer));
+
+            this.appendNodesToElement(el, 'foreignObject');
+            this.updateForeignObject(el);
+        },
+
+        // Already documented in JXG.AbstractRenderer
+        updateForeignObject: function(el) {
+            if (el._useUserSize) {
+                el.rendNode.style.overflow = 'hidden';
+            } else {
+                el.rendNode.style.overflow = 'visible';
+            }
+
+            this.updateRectPrim(el.rendNode, el.coords.scrCoords[1],
+                el.coords.scrCoords[2] - el.size[1], el.size[0], el.size[1]);
+
+            el.rendNode.innerHTML = el.content;
+            this._updateVisual(el, {stroke: true, dash: true}, true);
+        },
+
         /* **************************
          * Render primitive objects
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         appendChildPrim: function (node, level) {
             if (!Type.exists(level)) { // trace nodes have level not set
                 level = 0;
@@ -636,7 +662,7 @@ define([
             return node;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         createPrim: function (type, id) {
             var node = this.container.ownerDocument.createElementNS(this.svgNamespace, type);
             node.setAttributeNS(null, 'id', this.container.id + '_' + id);
@@ -649,14 +675,14 @@ define([
             return node;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         remove: function (shape) {
             if (Type.exists(shape) && Type.exists(shape.parentNode)) {
                 shape.parentNode.removeChild(shape);
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setLayer: function (el, level) {
             if (!Type.exists(level)) {
                 level = 0;
@@ -667,7 +693,7 @@ define([
             this.layer[level].appendChild(el.rendNode);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         makeArrows: function (el, a) {
             var node2,
                 ev_fa = a.evFirst,
@@ -719,7 +745,7 @@ define([
             el.visPropOld.lastarrow = ev_la;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateEllipsePrim: function (node, x, y, rx, ry) {
             var huge = 1000000;
 
@@ -737,7 +763,7 @@ define([
             node.setAttributeNS(null, 'ry', Math.abs(ry));
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateLinePrim: function (node, p1x, p1y, p2x, p2y) {
             var huge = 1000000;
 
@@ -757,7 +783,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathPrim: function (node, pointString) {
             if (pointString === '') {
                 pointString = 'M 0 0';
@@ -765,7 +791,7 @@ define([
             node.setAttributeNS(null, 'd', pointString);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathStringPoint: function (el, size, type) {
             var s = '',
                 scr = el.coords.scrCoords,
@@ -811,7 +837,7 @@ define([
             return s;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathStringPrim: function (el) {
             var i, scr, len,
                 symbm = ' M ',
@@ -867,7 +893,7 @@ define([
             return pStr;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathStringBezierPrim: function (el) {
             var i, j, k, scr, lx, ly, len,
                 symbm = ' M ',
@@ -922,7 +948,7 @@ define([
             return pStr;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePolygonPrim: function (node, el) {
             var i,
                 pStr = '',
@@ -952,7 +978,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateRectPrim: function (node, x, y, w, h) {
             node.setAttributeNS(null, 'x', x);
             node.setAttributeNS(null, 'y', y);
@@ -1261,6 +1287,11 @@ define([
                     if (c === 'none') {  // This is done only for non-images
                         // because images have no fill color.
                         oo = 0;
+                        // This is necessary if there is a foreignObject below.
+                        node.setAttributeNS(null, 'pointer-events', 'visibleStroke');
+                    } else {
+                        // This is the default
+                        node.setAttributeNS(null, 'pointer-events', 'visiblePainted');
                     }
                     this._setAttribute(function () {
                         node.setAttributeNS(null, 'fill-opacity', oo);
@@ -1413,10 +1444,13 @@ define([
 
         // documented in AbstractRenderer
         resize: function (w, h) {
-            this.svgRoot.style.width = parseFloat(w) + 'px';
-            this.svgRoot.style.height = parseFloat(h) + 'px';
-            this.svgRoot.setAttribute("width", parseFloat(w));
-            this.svgRoot.setAttribute("height", parseFloat(h));
+            // this.svgRoot.style.width  = parseFloat(w) + 'px';
+            // this.svgRoot.style.height = parseFloat(h) + 'px';
+
+            this.svgRoot.setAttribute('width',  parseFloat(w));
+            this.svgRoot.setAttribute('height', parseFloat(h));
+            // this.svgRoot.setAttribute('width',  '100%');
+            // this.svgRoot.setAttribute('height', '100%');
         },
 
         // documented in JXG.AbstractRenderer
@@ -1545,7 +1579,6 @@ define([
                     canvas.height = images[i].getAttribute("height");
                     try {
                         ctx.drawImage(images[i], 0, 0, canvas.width, canvas.height);
-                        //ctx.drawImage(document.getElementById('testimg2'), 0, 0, canvas.width, canvas.height);
 
                         // If the image is not png, the format must be specified here
                         ur = canvas.toDataURL();
@@ -1553,7 +1586,6 @@ define([
                     } catch (err) {
                         console.log("CORS problem! Image can not be used", err);
                     }
-                    //};
                 }
                 //canvas.remove();
             }
@@ -1565,7 +1597,7 @@ define([
          * The SVG code of the construction is base64 encoded. The return string starts
          * with "data:image/svg+xml;base64,...".
          *
-         * @param {Boolean} ignoreTexts If true, the foreignObject tag is taken out from the SVG root.
+         * @param {Boolean} ignoreTexts If true, the foreignObject tag is set to display=none.
          * This is necessary for older versions of Safari. Default: false
          * @returns {String}  data URI string
          */
@@ -1583,6 +1615,9 @@ define([
             // input values are not copied. This can be verified by looking at an innerHTML output
             // of an input element. Therefore, we do it "by hand".
             if (this.container.hasChildNodes() && Type.exists(this.foreignObjLayer)) {
+                if (!ignoreTexts) {
+                    this.foreignObjLayer.setAttribute('display', 'inline');
+                }
                 while (svgRoot.nextSibling) {
 
                     // Copy all value attributes
@@ -1590,13 +1625,6 @@ define([
 
                     this.foreignObjLayer.appendChild(svgRoot.nextSibling);
                 }
-                if (ignoreTexts === true) {
-                    // Take out foreignObjLayer, so that it will not be visible
-                    // in the dump.
-                    doc = this.container.ownerDocument;
-                    virtualNode = doc.createElement('div');
-                    virtualNode.appendChild(this.foreignObjLayer);
-                }
             }
 
             this._getImgDataURL(svgRoot);
@@ -1620,8 +1648,8 @@ define([
             // }
 
             // In IE we have to remove the namespace again.
-            if ((svg.match(/xmlns=\"http:\/\/www.w3.org\/2000\/svg\"/g) || []).length > 1) {
-                svg = svg.replace(/xmlns=\"http:\/\/www.w3.org\/2000\/svg\"/g, '');
+            if ((svg.match(/xmlns="http:\/\/www.w3.org\/2000\/svg"/g) || []).length > 1) {
+                svg = svg.replace(/xmlns="http:\/\/www.w3.org\/2000\/svg"/g, '');
             }
 
             // Safari fails if the svg string contains a " "
@@ -1631,20 +1659,16 @@ define([
             // Move all HTML tags back from
             // the foreignObject element to the container
             if (Type.exists(this.foreignObjLayer) && this.foreignObjLayer.hasChildNodes()) {
-                if (ignoreTexts === true) {
-                    // Put foreignObjLayer back into the SVG
-                    svgRoot.appendChild(this.foreignObjLayer);
-                }
                 // Restore all HTML elements
                 while (this.foreignObjLayer.firstChild) {
                     this.container.appendChild(this.foreignObjLayer.firstChild);
                 }
+                this.foreignObjLayer.setAttribute("display", "none");
             }
 
             return 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svg)));
         },
 
-
         /**
          * Convert the SVG construction into an HTML canvas image.
          * This works for all SVG supporting browsers. Implemented as Promise.
@@ -1670,17 +1694,16 @@ define([
          * 	setTimeout(function() { console.log('done'); }, 400);
          */
         dumpToCanvas: function (canvasId, w, h, ignoreTexts) {
-            var //svgRoot = this.svgRoot,
-                svg, tmpImg, cv, ctx;
-                // wOrg, hOrg;
-
-            // wOrg = svgRoot.getAttribute('width');
-            // hOrg = svgRoot.getAttribute('height');
+            var svg, tmpImg, cv, ctx;
 
             // Prepare the canvas element
             cv = document.getElementById(canvasId);
+
             // Clear the canvas
+            /* eslint-disable no-self-assign */
             cv.width = cv.width;
+            /* eslint-enable no-self-assign */
+
             ctx = cv.getContext("2d");
             if (w !== undefined && h !== undefined) {
                 cv.style.width = parseFloat(w) + 'px';
@@ -1767,8 +1790,8 @@ define([
                 return this;
             }
 
-            w = bas.scale * parseFloat(this.container.style.width);
-            h = bas.scale * parseFloat(this.container.style.height);
+            w = bas.scale * this.container.getBoundingClientRect().width;
+            h = bas.scale * this.container.getBoundingClientRect().height;
 
             if (imgId === undefined || imgId === '') {
                 newImg = true;

package/src/renderer/vml.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,
@@ -51,10 +51,14 @@ define([
 
     /**
      * Uses VML to implement the rendering methods defined in {@link JXG.AbstractRenderer}.
-     * @class JXG.AbstractRenderer
+     * VML was used in very old Internet Explorer versions upto IE 8.
+     * 
+     * 
+     * @class JXG.VMLRenderer
      * @augments JXG.AbstractRenderer
      * @param {Node} container Reference to a DOM node containing the board.
      * @see JXG.AbstractRenderer
+     * @deprecated
      */
     JXG.VMLRenderer = function (container) {
         this.type = 'vml';
@@ -99,7 +103,7 @@ define([
 
     JXG.VMLRenderer.prototype = new AbstractRenderer();
 
-    JXG.extend(JXG.VMLRenderer.prototype, /** @lends JXG.VMLRenderer */ {
+    JXG.extend(JXG.VMLRenderer.prototype, /** @lends JXG.VMLRenderer.prototype */ {
 
         /**
          * Sets attribute <tt>key</tt> of node <tt>node</tt> to <tt>value</tt>.
@@ -165,7 +169,7 @@ define([
          *    Text related stuff
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         displayCopyright: function (str, fontsize) {
             var node, t;
 
@@ -303,7 +307,7 @@ define([
          *    Image related stuff
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         drawImage: function (el) {
             // IE 8: Bilder ueber data URIs werden bis 32kB unterstuetzt.
             var node;
@@ -325,7 +329,7 @@ define([
             this.updateImage(el);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         transformImage: function (el, t) {
             var m, s, maxX, maxY, minX, minY, i, nt,
                 node = el.rendNode,
@@ -375,7 +379,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateImageURL: function (el) {
             var url = Type.evaluate(el.url);
 
@@ -386,7 +390,7 @@ define([
          * Render primitive objects
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         appendChildPrim: function (node, level) {
             // For trace nodes
             if (!Type.exists(level)) {
@@ -399,7 +403,7 @@ define([
             return node;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         appendNodesToElement: function (el, type) {
             if (type === 'shape' || type === 'path' || type === 'polygon') {
                 el.rendNodePath = this.getElementById(el.id + '_path');
@@ -410,7 +414,7 @@ define([
             el.rendNode = this.getElementById(el.id);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         createPrim: function (type, id) {
             var node, pathNode,
                 fillNode = this.createNode('fill'),
@@ -449,14 +453,14 @@ define([
             return node;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         remove: function (node) {
             if (Type.exists(node)) {
                 node.removeNode(true);
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         makeArrows: function (el) {
             var nodeStroke,
                 ev_fa = Type.evaluate(el.visProp.firstarrow),
@@ -492,7 +496,7 @@ define([
             el.visPropOld.lastarrow = ev_la;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateEllipsePrim: function (node, x, y, rx, ry) {
             node.style.left = Math.floor(x - rx) + 'px';
             node.style.top =  Math.floor(y - ry) + 'px';
@@ -500,7 +504,7 @@ define([
             node.style.height = Math.floor(Math.abs(ry) * 2) + 'px';
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateLinePrim: function (node, p1x, p1y, p2x, p2y, board) {
             var s, r = this.resolution;
 
@@ -510,7 +514,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathPrim: function (node, pointString, board) {
             var x = board.canvasWidth,
                 y = board.canvasHeight;
@@ -523,7 +527,7 @@ define([
             this._setAttr(node, 'path', pointString.join(""));
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathStringPoint: function (el, size, type) {
             var s = [],
                 mround = Math.round,
@@ -588,7 +592,7 @@ define([
             return s;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathStringPrim: function (el) {
             var i, scr,
                 pStr = [],
@@ -659,7 +663,7 @@ define([
             return pStr;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePathStringBezierPrim: function (el) {
             var i, j, k, scr, lx, ly,
                 pStr = [],
@@ -723,7 +727,7 @@ define([
             return pStr;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updatePolygonPrim: function (node, el) {
             var i,
                 len = el.vertices.length,
@@ -761,7 +765,7 @@ define([
             this.updatePathPrim(node, pStr, el.board);
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         updateRectPrim: function (node, x, y, w, h) {
             node.style.left = Math.floor(x) + 'px';
             node.style.top = Math.floor(y) + 'px';
@@ -779,7 +783,7 @@ define([
          *  Set Attributes
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setPropertyPrim: function (node, key, val) {
             var keyVml = '',
                 v;
@@ -802,7 +806,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         display: function(el, val) {
             if (el && el.rendNode) {
                 el.visPropOld.visible = val;
@@ -814,7 +818,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         show: function (el) {
             JXG.deprecated('Board.renderer.show()', 'Board.renderer.display()');
 
@@ -823,7 +827,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         hide: function (el) {
             JXG.deprecated('Board.renderer.hide()', 'Board.renderer.display()');
 
@@ -832,7 +836,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setDashStyle: function (el, visProp) {
             var node;
             if (visProp.dash >= 0) {
@@ -841,7 +845,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setGradient: function (el) {
             var nodeFill = el.rendNodeFill,
                 ev_g = Type.evaluate(el.visProp.gradient);
@@ -863,7 +867,7 @@ define([
             }
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setObjectFillColor: function (el, color, opacity) {
             var rgba = Type.evaluate(color), c, rgbo,
                 o = Type.evaluate(opacity), oo,
@@ -918,7 +922,7 @@ define([
             el.visPropOld.fillopacity = o;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setObjectStrokeColor: function (el, color, opacity) {
             var rgba = Type.evaluate(color), c, rgbo, t,
                 o = Type.evaluate(opacity), oo,
@@ -978,7 +982,7 @@ define([
             el.visPropOld.strokeopacity = o;
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setObjectStrokeWidth: function (el, width) {
             var w = Type.evaluate(width),
                 node;
@@ -1002,7 +1006,7 @@ define([
 
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         setShadow: function (el) {
             var nodeShadow = el.rendNodeShadow,
                 ev_s = Type.evaluate(el.visProp.shadow);
@@ -1027,12 +1031,12 @@ define([
          * renderer control
          * **************************/
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         suspendRedraw: function () {
             this.container.style.display = 'none';
         },
 
-        // already documented in JXG.AbstractRenderer
+        // Already documented in JXG.AbstractRenderer
         unsuspendRedraw: function () {
             this.container.style.display = '';
         }

package/src/server/server.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,