jsxgraph 1.3.1 → 1.4.2

package/src/utils/color.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,
@@ -45,7 +45,8 @@
  * Stoyan Stefanov <sstoo@gmail.com> (see http://www.phpied.com/rgb-color-parser-in-javascript/)
  */
 
-define(['jxg', 'utils/type', 'math/math'], function (JXG, Type, Mat) {
+define(['jxg', 'utils/type', 'math/math'],
+    function (JXG, Type, Mat) {
 
     "use strict";
 
@@ -198,9 +199,10 @@ define(['jxg', 'utils/type', 'math/math'], function (JXG, Type, Mat) {
             yellow: 'ffff00',
             yellowgreen: '9acd32'
         },
+
         // array of color definition objects
         colorDefs = [{
-            re: /^\s*rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*([\d\.]{1,3})\s*\)\s*$/,
+            re: /^\s*rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*([\d.]{1,3})\s*\)\s*$/,
             example: ['rgba(123, 234, 45, 0.5)', 'rgba(255,234,245,1.0)'],
             process: function (bits) {
                 return [
@@ -872,5 +874,147 @@ define(['jxg', 'utils/type', 'math/math'], function (JXG, Type, Mat) {
         return lightColor;
     };
 
+    /**
+     * Use the color scheme of JSXGraph up to version 1.3.2.
+     * This method has to be called before JXG.JSXGraph.initBoard();
+     *
+     * @see JXG.palette
+     * @see JXG.paletteWong
+     *
+     * @example
+     *
+     * JXG.setClassicColors();
+     * var board = JXG.JSXGraph.initBoard('jxgbox', {boundingbox: [-5, 5, 5,-5]});
+     *
+     */
+    JXG.setClassicColors = function() {
+        JXG.Options.elements.strokeColor = 'blue';
+        JXG.Options.elements.fillColor = 'red';
+        JXG.Options.hatch.strokeColor = 'blue';
+        JXG.Options.angle.fillColor = '#ff7f00';
+        JXG.Options.angle.highlightFillColor = '#ff7f00';
+        JXG.Options.angle.strokeColor = '#ff7f00';
+        JXG.Options.angle.label.strokeColor = 'blue';
+        JXG.Options.arc.strokeColor = 'blue';
+        JXG.Options.circle.center.fillColor = 'red';
+        JXG.Options.circle.center.strokeColor = 'blue';
+        JXG.Options.circumcircle.strokeColor = 'blue';
+        JXG.Options.circumcircle.center.fillColor = 'red';
+        JXG.Options.circumcircle.center.strokeColor = 'blue';
+        JXG.Options.circumcirclearc.strokeColor = 'blue';
+        JXG.Options.circumcirclesector.strokeColor = 'blue';
+        JXG.Options.circumcirclesector.fillColor = 'green';
+        JXG.Options.circumcirclesector.highlightFillColor = 'green';
+        JXG.Options.conic.strokeColor = 'blue';
+        JXG.Options.curve.strokeColor = 'blue';
+        JXG.Options.incircle.strokeColor = 'blue';
+        JXG.Options.incircle.center.fillColor = 'red';
+        JXG.Options.incircle.center.strokeColor = 'blue';
+        JXG.Options.inequality.fillColor = 'red';
+        JXG.Options.integral.fillColor = 'red';
+        JXG.Options.integral.curveLeft.color = 'red';
+        JXG.Options.integral.curveRight.color = 'red';
+        JXG.Options.line.strokeColor = 'blue';
+        JXG.Options.point.fillColor = 'red';
+        JXG.Options.point.strokeColor = 'red';
+        JXG.Options.polygon.fillColor = 'green';
+        JXG.Options.polygon.highlightFillColor = 'green';
+        JXG.Options.polygon.vertices.strokeColor = 'red';
+        JXG.Options.polygon.vertices.fillColor = 'red';
+        JXG.Options.regularpolygon.fillColor = 'green';
+        JXG.Options.regularpolygon.highlightFillColor = 'green';
+        JXG.Options.regularpolygon.vertices.strokeColor = 'red';
+        JXG.Options.regularpolygon.vertices.fillColor = 'red';
+        JXG.Options.riemannsum.fillColor = 'yellow';
+        JXG.Options.sector.fillColor = 'green';
+        JXG.Options.sector.highlightFillColor = 'green';
+        JXG.Options.semicircle.center.fillColor = 'red';
+        JXG.Options.semicircle.center.strokeColor = 'blue';
+        JXG.Options.slopetriangle.fillColor = 'red';
+        JXG.Options.slopetriangle.highlightFillColor = 'red';
+        JXG.Options.turtle.arrow.strokeColor = 'blue';
+    };
+
+    JXG.extend(JXG, /** @lends JXG */ {
+        /**
+         * Bang Wong color palette,
+         * optimized for various type
+         * of color blindness.
+         * It contains values for
+         * <ul>
+         * <li> 'black'
+         * <li> 'orange'
+         * <li> 'skyblue'
+         * <li> 'bluishgreen'
+         * <li> 'yellow'
+         * <li> 'darkblue'
+         * <li> 'vermillion'
+         * <li> 'reddishpurple'
+         * </ul>
+         *
+         * As substitutes for standard colors, it contains the following aliases:
+         *
+         * <ul>
+         * <li> black (= #000000)
+         * <li> blue (= darkblue)
+         * <li> green (= bluishgreen)
+         * <li> purple (= reddishpurple)
+         * <li> red (= vermillion)
+         * <li> white (= #ffffff)
+         * </ul>
+         *
+         * See <a href="https://www.nature.com/articles/nmeth.1618">Bang Wong: "Points of view: Color blindness"</a>
+         * and
+         * <a href="https://davidmathlogic.com/colorblind/">https://davidmathlogic.com/colorblind/</a>.
+         *
+         * @name JXG.paletteWong
+         * @type Object
+         * @see JXG.palette
+         * @example
+         * var p = board.create('line', [[-1, 1], [2, -3]], {strokeColor: JXG.paletteWong.yellow});
+         */
+        paletteWong: {
+            black: '#000000',
+            orange: '#E69F00',
+            skyblue: '#56B4E9',
+            bluishgreen: '#009E73',
+            yellow: '#F0E442',
+            darkblue: '#0072B2',
+            vermillion: '#D55E00',
+            reddishpurple: '#CC79A7',
+
+            blue: '#0072B2',
+            red: '#D55E00',   // vermillion
+            green: '#009E73', // bluishgreen
+            purple: '#CC79A7', // reddishpurple
+            white: '#ffffff'
+        }
+    });
+
+    /**
+     * Default color palette.
+     * Contains at least color values for
+     * <ul>
+     * <li> black
+     * <li> blue
+     * <li> green
+     * <li> purple
+     * <li> red
+     * <li> white
+     * <li> yellow
+     * </ul>
+     *
+     * @name JXG.palette
+     * @type Object
+     * @default JXG.paletteWong
+     * @see JXG.paletteWong
+     *
+     * @example
+     *
+     * var p = board.create('line', [[-1, 1], [2, -3]], {strokeColor: JXG.palette.yellow});
+     *
+     */
+    JXG.palette = JXG.paletteWong;
+
     return JXG;
 });

package/src/utils/dump.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,
@@ -209,15 +209,6 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
 
             this.addMarkers(board, 'dumped', false);
 
-            // This has been moved to toJavaScript and toJessie
-            /*
-            methods.push({
-                obj: '$board',
-                method: 'setBoundingBox',
-                params: [board.getBoundingBox(), true]
-            });
-            */
-
             for (e = 0; e < len; e++) {
                 obj = board.objectsList[e];
                 element = {};
@@ -313,7 +304,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
                 }
                 return 'null';
             case 'string':
-                return '\'' + obj.replace(/(["'])/g, '\\$1') + '\'';
+                return '\'' + obj.replace(/\\/g,'\\\\').replace(/(["'])/g, '\\$1') + '\'';
             case 'number':
             case 'boolean':
                 return obj.toString();
@@ -328,7 +319,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * @returns {String} JessieCode
          */
         toJessie: function (board) {
-            var i, elements,
+            var i, elements, id,
                 dump = this.dump(board),
                 script = [];
 
@@ -340,8 +331,15 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
                 if (elements[i].attributes.name.length > 0) {
                     script.push('// ' + elements[i].attributes.name);
                 }
-
                 script.push('s' + i + ' = ' + elements[i].type + '(' + elements[i].parents.join(', ') + ') ' + this.toJCAN(elements[i].attributes).replace(/\n/, '\\n') + ';');
+
+                if (elements[i].type === 'axis') {
+                    // Handle the case that remove[All]Ticks had been called.
+                    id = elements[i].attributes.id;
+                    if (board.objects[id].defaultTicks === null) {
+                        script.push('s' + i + '.removeAllTicks();');
+                    }
+                }
                 script.push('');
             }
 
@@ -364,7 +362,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * @returns {String} JavaScript
          */
         toJavaScript: function (board) {
-            var i, elements,
+            var i, elements, id,
                 dump = this.dump(board),
                 script = [];
 
@@ -374,6 +372,14 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
 
             for (i = 0; i < elements.length; i++) {
                 script.push('board.create("' + elements[i].type + '", [' + elements[i].parents.join(', ') + '], ' + Type.toJSON(elements[i].attributes) + ');');
+
+                if (elements[i].type === 'axis') {
+                    // Handle the case that remove[All]Ticks had been called.
+                    id = elements[i].attributes.id;
+                    if (board.objects[id].defaultTicks === null) {
+                        script.push('board.objects["' + id + '"].removeTicks(board.objects["' + id + '"].defaultTicks);');
+                    }
+                }
             }
 
             for (i = 0; i < dump.methods.length; i++) {

package/src/utils/env.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,
@@ -51,8 +51,9 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
     JXG.extendConstants(JXG, /** @lends JXG */{
         /**
          * Determines the property that stores the relevant information in the event object.
-         * @type {String}
+         * @type String
          * @default 'touches'
+         * @private
          */
         touchProperty: 'touches',
     });
@@ -73,7 +74,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * @returns {Boolean}
          */
         isPointerEvent: function (evt) {
-            return JXG.exists(evt['pointerId']);
+            return JXG.exists(evt.pointerId);
         },
 
         /**
@@ -131,12 +132,16 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * @default false
          */
         supportsES6: function () {
+            var testMap;
+            /* jshint ignore:start */
             try {
+                // This would kill the old uglifyjs: testMap = (a = 0) => a;
                 new Function('(a = 0) => a');
                 return true;
             } catch (err) {
                 return false;
             }
+            /* jshint ignore:end */
         },
 
         /**
@@ -248,7 +253,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * @returns {Boolean}
          */
         isWebkitApple: function () {
-            return this.isApple() && (navigator.userAgent.search(/Mobile\/[0-9A-Za-z\.]*Safari/) > -1);
+            return this.isApple() && (navigator.userAgent.search(/Mobile\/[0-9A-Za-z.]*Safari/) > -1);
         },
 
         /**
@@ -797,8 +802,8 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * @see JXG.Board#fullscreenListener
          * @private
          */
-        _getScaleFactors: function(node) {
-            var width  = node.getBoundingClientRect().width,
+        _getScaleFactors: function (node) {
+            var width = node.getBoundingClientRect().width,
                 height = node.getBoundingClientRect().height,
 
                 // Determine the maximum scale factor.
@@ -809,7 +814,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
                 vshift = (window.screen.height - height) * 0.5,
 
                 // Scaling factor: if not supplied, it's taken as large as possible
-                scale = scale || Math.min(r_w, r_h);
+                scale = Math.min(r_w, r_h);
 
             // Adapt vshift and scale for landscape on tablets
             if (window.matchMedia && window.matchMedia('(orientation:landscape)').matches &&
@@ -822,7 +827,7 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
             }
             scale *= 0.85;
 
-            return {scale: scale, vshift: vshift};
+            return { scale: scale, vshift: vshift, width: width };
         },
 
         /**
@@ -830,21 +835,21 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
          * inside of a parent DOM
          * element which is set to fullscreen.
          * This is realized with a CSS transformation.
-         *
+         *          *
          * @param  {String} wrap_id  id of the parent DOM element which is in fullscreen mode
-         * @param  {String} inner_id id of the DOM element which is scaled and shifted-
+         * @param  {String} inner_id id of the DOM element which is scaled and shifted
          * @param  {Number} scale    Scaling factor
          * @param  {Number} vshift   Vertical shift (in pixel)
          *
          * @private
-         * @see JXG#toFullscreen
+         * @see JXG.Board#toFullscreen
          * @see JXG.Board#fullscreenListener
-         * 
+         *
          */
         scaleJSXGraphDiv: function (wrap_id, inner_id, scale, vshift) {
             var len = document.styleSheets.length, style,
 
-                pseudo_keys = [':fullscreen', ':-webkit-full-screen', ':-moz-full-screen',':-ms-fullscreen'],
+                pseudo_keys = [':fullscreen', ':-webkit-full-screen', ':-moz-full-screen', ':-ms-fullscreen'],
                 len_pseudo = pseudo_keys.length, i,
 
                 // CSS rules to center the inner div horizontally and vertically.
@@ -852,10 +857,10 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
 
                 // A previously installed CSS rule to center the JSXGraph div has to
                 // be searched and removed again.
-                regex = new RegExp('.*' + wrap_id + ':.*full.*screen.*' + inner_id + '.*auto;.*transform:.*matrix');
+                regex = new RegExp('.*#' + wrap_id + ':.*full.*screen.*#' + inner_id + '.*auto;.*transform:.*matrix');
 
             if (len === 0) {
-                // In case there is not a single CSS rule defined.
+                // In case there is not a single CSS rule defined at all.
                 style = document.createElement('style');
                 // WebKit hack :(
                 style.appendChild(document.createTextNode(''));
@@ -875,57 +880,16 @@ define(['jxg', 'utils/type'], function (JXG, Type) {
             // Install a CSS rule to center the JSXGraph div at the first position of the list.
             for (i = 0; i < len_pseudo; i++) {
                 try {
-                    document.styleSheets[len - 1].insertRule(wrap_id + pseudo_keys[i] + ' ' + inner_id + rule_inner, 0);
+                    document.styleSheets[len - 1].insertRule('#' + wrap_id + pseudo_keys[i] + ' #' + inner_id + rule_inner, 0);
                     break;
                 } catch (err) {
-                    console.log('JXG.scaleJSXGraphDiv: Could not add CSS rule "' + pseudo_keys[i] + '".');
-                    console.log('One possible reason could be that the id of the JSXGraph container does not start with a letter.');
+                    // console.log('JXG.scaleJSXGraphDiv: Could not add CSS rule "' + pseudo_keys[i] + '".');
+                    // console.log('One possible reason could be that the id of the JSXGraph container does not start with a letter.');
                 }
             }
-        },
-
-        /**
-         * Set the DOM element with id='wrap_id' containing the JSXGraph div
-         * element in fullscreen mode.
-         * The JSXGraph element is scaled as large as possible while
-         * retaining its proportions.
-         *
-         * @param  {String} wrap_id     id of DOM element containing the JSXGraph
-         * div element.
-         *
-         * @example
-         *
-         * &lt;div id="outer" class="JXG_wrap_private"&gt;
-         *      &lt;div id='jxgbox' class='jxgbox' style='width:300px; height:300px;'&gt;&lt;/div&gt;
-         * &lt;/div&gt;
-         * &lt;button onClick="JXG.toFullscreen('outer')"&gt;Fullscreen&lt;/button&gt;
-         * &lt;script&gt;
-         *     var board = JXG.JSXGraph.initBoard('jxgbox', {axis:true, boundingbox:[-8, 8, 8,-8]});
-         *     var p = board.create('point', [0, 1]);
-         * &lt;/script&gt;
-         *
-         * </pre><div id="JXGf9b973ea4_outer" class="JXG_wrap_private"><div id="JXGd9b973ea4-fd43-11e8-ab14-901b0e1b8723" class="jxgbox" style="width: 300px; height: 300px;"></div></div>
-         * <button onClick="JXG.toFullscreen('JXGf9b973ea4_outer')">Fullscreen</button>
-         * <script type="text/javascript">
-         *     (function() {
-         *         var board = JXG.JSXGraph.initBoard('JXGd9b973ea4-fd43-11e8-ab14-901b0e1b8723',
-         *             {boundingbox: [-8, 8, 8,-8], axis: true, showcopyright: false, shownavigation: false});
-         *         var p = board.create('point', [0, 1]);
-         *     })();
-         * </script><pre>
-         *
-         */
-        toFullscreen: function (wrap_id) {
-            var elem = document.getElementById(wrap_id);
-
-            // Trigger the fullscreen mode
-            elem.requestFullscreen = elem.requestFullscreen ||
-                elem.webkitRequestFullscreen ||
-                elem.mozRequestFullScreen ||
-                elem.msRequestFullscreen;
-
-            if (elem.requestFullscreen) {
-                elem.requestFullscreen();
+            if (i === len_pseudo) {
+                console.log('JXG.scaleJSXGraphDiv: Could not add any CSS rule.');
+                console.log('One possible reason could be that the id of the JSXGraph container does not start with a letter.');
             }
         }
     });

package/src/utils/event.js

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

package/src/utils/expect.js

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

package/src/utils/type.js

@@ -1,5 +1,5 @@
 /*
-    Copyright 2008-2021
+    Copyright 2008-2022
         Matthias Ehmann,
         Michael Gerhaeuser,
         Carsten Miller,
@@ -196,18 +196,29 @@ define([
          * @param {Boolean} [checkEmptyString=false] If set to true, it is also checked whether v is not equal to ''.
          * @returns {Boolean} True, if v is neither undefined nor null.
          */
-        exists: (function (undef) {
-            return function (v, checkEmptyString) {
-                var result = !(v === undef || v === null);
-
-                checkEmptyString = checkEmptyString || false;
-                
-                if (checkEmptyString) {
-                    return result && v !== '';
-                }
-                return result;
-            };
-        }()),
+        exists: function (v, checkEmptyString) {
+            /* eslint-disable eqeqeq */
+            var result = !(v == undefined || v === null);
+            /* eslint-enable eqeqeq */
+            checkEmptyString = checkEmptyString || false;
+
+            if (checkEmptyString) {
+                return result && v !== '';
+            }
+            return result;
+        },
+        // exists: (function (undef) {
+        //     return function (v, checkEmptyString) {
+        //         var result = !(v === undef || v === null);
+
+        //         checkEmptyString = checkEmptyString || false;
+
+        //         if (checkEmptyString) {
+        //             return result && v !== '';
+        //         }
+        //         return result;
+        //     };
+        // }()),
 
         /**
          * Checks if v is an empty object or empty.
@@ -703,12 +714,12 @@ define([
          * is returned by JavaScript's toFixed()
          *
          * @memberOf JXG
-         * @param  {Number} num       Number tp be rounded
-         * @param  {Number} precision Decimal digits
-         * @return {String}           Rounded number is returned as string
+         * @param  {Number} num    Number tp be rounded
+         * @param  {Number} digits Decimal digits
+         * @return {String}        Rounded number is returned as string
          */
-        toFixed: function (num, precision) {
-            return this._round10(num, -precision).toFixed(precision);
+        toFixed: function (num, digits) {
+            return this._round10(num, -digits).toFixed(digits);
         },
 
         /**
@@ -1155,7 +1166,7 @@ define([
          * @returns {String}
          */
         unescapeHTML: function (str) {
-            // this regex is NOT insecure. We are replacing everything found with ''
+            // This regex is NOT insecure. We are replacing everything found with ''
             /*jslint regexp:true*/
             return str.replace(/<\/?[^>]+>/gi, '').replace(/&amp;/g, '&').replace(/&lt;/g, '<').replace(/&gt;/g, '>');
         },

package/src/utils/xml.js

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

package/src/utils/zip.js

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