WIP #46 - document own code using JSDoc3

myServer.js - moved drawsvg function in own file src/oi/DrawIdeas.js - added documentation src/oi/DrawSvg.js - replaced old (and not used) svg generation code for client side with server side code to generate svg src/oi/SideIdea.js - added documentation - updated var to let - reformated the code src/oi/SideLoginRegister.js - added documentation - updated var to let - reformated the code src/oi/SidePanel.js - added documentation - updated var to let - reformated the code src/oi/SideShowIdea.js - added documentation - updated var to let - reformated the code src/oi/autocomplete.js - added documentation src/oi/filterTags.js - added documentation src/oi/showInfo.js - added documentation
jdohm · Apr 4, 2021 · c8ce35f · c8ce35f
1 parent 20995aa
commit c8ce35f
Show file tree

Hide file tree

Showing 10 changed files with 577 additions and 461 deletions.
diff --git a/myServer.js b/myServer.js
@@ -14,6 +14,7 @@ const session = require("express-session");
 const methodOverride = require("method-override");
 const matrix = require("./src/oi/matrix");
 const db = require("./src/oi/sqliteDb");
+const svg = require("./src/oi/DrawSvg");
 
 const app = express();
 const http = express();
@@ -100,25 +101,7 @@ app.get("/getIdeas", checkAuthenticated, async function (req, res) {
 //get svgs
 app.get("/svgTest", async function (req, res) {
   let ideaData = await db.getIdea(req.query.IdeaID, true);
-  var SVG = `
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-        xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-        width="300"
-        height="300"
-        viewBox="0 0 300 300"
-        version="1.1"
-    >
-    <rect width="300" height="300" fill="#FFFFFF"/>
-    <text x="000" y="200" fill="#000000" font-size="2.0em">#${ideaData.ID}</text>
-    <text x="100" y="200" fill="#000000" font-size="2.0em">#${ideaData.ID}</text>
-    <text x="200" y="200" fill="#000000" font-size="2.0em">#${ideaData.ID}</text>
-    <text x="050" y="170" fill="#000000" transform="rotate(-90, 050, 170)" font-size="1.0em">${ideaData.title}</text>
-    <text x="150" y="170" fill="#000000" transform="rotate(-90, 150, 170)" font-size="1.0em">${ideaData.title}</text>
-    <text x="250" y="170" fill="#000000" transform="rotate(-90, 250, 170)" font-size="1.0em">${ideaData.title}</text>
-    </svg>
-  `;
+    let SVG = svg.draw(ideaData);
   res.type("svg");
   res.send(SVG);
 });

diff --git a/src/oi/DrawIdeas.js b/src/oi/DrawIdeas.js
@@ -1,6 +1,17 @@
+/**
+ * @fileOverview this file provides functions to generate, filter and display ideas as entities
+ * @name DrawIdeas.js
+ * @author Jannis Dohm
+ * @license MIT
+ */
 import { Entity } from './../og/entity/Entity.js';
 import { Vector } from './../og/layer/Vector.js';
 
+/**
+ * function to create and display entities representing the ideas on the globe
+ * @param {Object} pointLayer - created entities will be added to this layer
+ * @param {string[]} [filter] - placeholder
+ */
 function draw(pointLayer, filter) {
     var xhttp = new XMLHttpRequest();
     xhttp.onreadystatechange = function() {
@@ -26,6 +37,13 @@ function draw(pointLayer, filter) {
     }
 export{ draw }
 
+/**
+ * function to filter ideas, an empty filter will result in the display of all ideas.
+ * adding strings (tags) to the filter array will reduce the displayed ideas to these
+ *  matching one of the strings.
+ * @param {Object} pointLayer - containing the idea entities to be filtered
+ * @param {string[]} filter - array of strings which contain the filter keywords.
+ */
 function filterIdeas(pointLayer, filter) {
     //if filter is set check filter
     if(filter !== null && filter.length !== 0) {

diff --git a/src/oi/DrawSvg.js b/src/oi/DrawSvg.js
@@ -1,48 +1,38 @@
-
-function draw(id){
-    var doc = document.implementation.createDocument("", "", null);
-
-    var svg = doc.createElement("svg");
-    svg.setAttribute("xmlns", "http://www.w3.org/2000/svg");
-    svg.setAttribute("xmlns:sodipodi", "http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd");
-    svg.setAttribute("xmlns:inkscape", "http://www.inkscape.org/namespaces/inkscape");
-    svg.setAttribute("width", "150");
-    svg.setAttribute("height", "150");
-    svg.setAttribute("viewBox", "0 0 150 150");
-    svg.setAttribute("version", "1.1");
-
-    var newRect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
-    newRect.setAttributeNS(null,"width", "150");
-    newRect.setAttributeNS(null,"height", "150");
-    newRect.setAttributeNS(null,"fill", "#FFFFFF");
-    svg.appendChild(newRect);
-
-    setID(svg,id);
-
-    svg.appendChild(setText({x:25, y:100, fill:'#000000', transform:'rotate(-90, 25,100)'}, "test"));
-    svg.appendChild(setText({x:75, y:100, fill:'#000000', transform:'rotate(-90, 75,100)'}, "test"));
-    svg.appendChild(setText({x:125, y:100, fill:'#000000', transform:'rotate(-90, 125,100)'}, "test"));
-
-    // return svg;
-    return testSVG;
+/**
+ * @fileOverview this file provides a svg which can be used as a texture for the idea entities
+ * @name DrawSvg.js
+ * @author Jannis Dohm
+ * @license MIT
+ */
+
+/**
+ * function to create and return svg
+ * @param {Object} ideaData
+ * @param {number} ideaData.ID - number of idea
+ * @param {string} ideaData.title - title of idea
+ */
+function draw(ideaData){
+    var SVG = `
+    <svg
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+        xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+        width="300"
+        height="300"
+        viewBox="0 0 300 300"
+        version="1.1"
+    >
+    <rect width="300" height="300" fill="#FFFFFF"/>
+    <text x="000" y="200" fill="#000000" font-size="2.0em">#${ideaData.ID}</text>
+    <text x="100" y="200" fill="#000000" font-size="2.0em">#${ideaData.ID}</text>
+    <text x="200" y="200" fill="#000000" font-size="2.0em">#${ideaData.ID}</text>
+    <text x="050" y="170" fill="#000000" transform="rotate(-90, 050, 170)" font-size="1.0em">${ideaData.title}</text>
+    <text x="150" y="170" fill="#000000" transform="rotate(-90, 150, 170)" font-size="1.0em">${ideaData.title}</text>
+    <text x="250" y="170" fill="#000000" transform="rotate(-90, 250, 170)" font-size="1.0em">${ideaData.title}</text>
+    </svg>
+  `;
+    return SVG;
 }
-export {draw}
-
-
-
-function setID(svg, id) {
-    svg.appendChild(setText({x:0,   y:50, fill:'#000000'}, "#"+id));
-    svg.appendChild(setText({x:50,  y:50, fill:'#000000'}, "#"+id));
-    svg.appendChild(setText({x:100, y:50, fill:'#000000'}, "#"+id));
-}
-
-var svgNS = "http://www.w3.org/2000/svg";
-function setText(v, t) {
-    let elem = document.createElementNS("http://www.w3.org/2000/svg", 'text');
-    for (var p in v)
-        elem.setAttributeNS(null, p, v[p]);
-    elem.textContent = t;
-    return elem;
-}
-
-var testSVG = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="150" height="150" viewBox="0 0 150 150" version="1.1"> <rect width="150" height="150" fill="#FFFFFF"/> </svg>`
+module.exports = {
+    draw,
+};