From e15a94dc7673b18d378664dab86a0e764e61836d Mon Sep 17 00:00:00 2001 From: flatsiedatsie Date: Tue, 16 Jan 2024 02:06:23 +0100 Subject: [PATCH] Add files via upload --- css/style.css | 37 +- floorplanEditor.js | 56 +- index.html | 1614 +++++++++++++++++++++++--------------------- qSVG.js | 29 +- 4 files changed, 928 insertions(+), 808 deletions(-) diff --git a/css/style.css b/css/style.css index 537bc36..b751e4a 100644 --- a/css/style.css +++ b/css/style.css @@ -1203,7 +1203,7 @@ g#extension-floorplanner-boxbind{ } #extension-floorplanner-labelBox{ - width:100%; + width:30rem; font-size:1.1rem; border-radius:5px; background-color:white; @@ -1262,7 +1262,9 @@ g#extension-floorplanner-boxbind{ #extension-floorplanner-floorplans-list{ position:fixed; right:2rem; - top:15rem; + top:17rem; + bottom:10rem; + overflow:auto; display:flex; flex-direction:column; align-items:center; @@ -1328,7 +1330,7 @@ g#extension-floorplanner-boxbind{ #extension-floorplanner-current-filename-container{ - display:none; + opacity:.3; text-align:center; opacity:.7; z-index:2; @@ -1459,7 +1461,7 @@ g#extension-floorplanner-boxbind{ } .extension-floorplanner-floorplan-icon-current{ - background-color:red; + background-color:red!important; } @@ -1516,6 +1518,23 @@ g#extension-floorplanner-boxbind{ +#extension-floorplanner-modal-new-floorplan-name-input{ + background-color:#eee; + color:black; + padding:1rem; + font-size:1.6rem; + margin-bottom:2rem; + width:100%; + box-sizing: border-box; + border-radius:.5rem; +} + + + + + + + @media screen and ( max-height: 950px ){ #extension-floorplanner-content #extension-floorplanner-panel button{ padding:.3rem; @@ -1645,6 +1664,16 @@ g#extension-floorplanner-boxbind{ #extension-floorplanner-content button{ padding:.4rem .5rem; } + + #extension-floorplanner-floorplans-list{ + top:12rem; + bottom:8rem; + } + #extension-floorplanner-content #extension-floorplanner-areaValue{ + bottom:5rem; + right:1rem; + padding:0; + } } diff --git a/floorplanEditor.js b/floorplanEditor.js index 8ff7534..6dab5b3 100644 --- a/floorplanEditor.js +++ b/floorplanEditor.js @@ -515,8 +515,6 @@ var floorplanEditor = { else shift = -shift + 10; } - - sizeText[n] = document.createElementNS('http://www.w3.org/2000/svg', 'text'); var startText = qSVG.middle(ribMaster[t][n - 1].coords.x, ribMaster[t][n - 1].coords.y, ribMaster[t][n].coords.x, ribMaster[t][n].coords.y); sizeText[n].setAttributeNS(null, 'x', startText.x); @@ -604,7 +602,7 @@ var floorplanEditor = { "stroke-width": 1, fill: cc[tt].fill, stroke: cc[tt].stroke, - 'class':'path-' + type + '-' + tt, + 'class':'path-' + type + '-' + tt, 'stroke-dasharray': cc[tt].strokeDashArray, opacity: cc[tt].opacity }); @@ -618,7 +616,7 @@ var floorplanEditor = { "stroke-width": cc[tt].strokeWidth, 'font-family': 'sans-serif', 'text-anchor': 'middle', - 'class':'path-text-' + type + '-' + tt, + 'class':'path-text-' + type + '-' + tt, fill: cc[tt].fill }); blank.textContent = cc[tt].text; @@ -632,8 +630,9 @@ var floorplanEditor = { bbox.y = (bbox.y * factor) - (offset.top * factor) + originY_viewbox; bbox.origin = { x: this.x, y: this.y }; this.bbox = bbox; - this.realBbox = [{ x: -this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: this.thick / 2 }, { x: -this.size / 2, y: this.thick / 2 }]; - //this.realBbox = [{ x: -this.size, y: -this.thick }, { x: this.size, y: -this.thick }, { x: this.size, y: this.thick }, { x: -this.size, y: this.thick }]; + //this.realBbox = [{ x: -this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: this.thick / 2 }, { x: -this.size / 2, y: this.thick / 2 }]; + this.realBbox = [{ x: -this.size / 4, y: -this.thick / 4 }, { x: this.size / 4, y: -this.thick / 4 }, { x: this.size / 4, y: this.thick / 4 }, { x: -this.size / 4, y: this.thick / 4 }]; + //this.realBbox = [{ x: -this.size, y: -this.thick }, { x: this.size, y: -this.thick }, { x: this.size, y: this.thick }, { x: -this.size, y: this.thick }]; if (family == "byObject") this.family = cc.family; this.params = cc.params; // (bindBox, move, resize, rotate) if(load == false && typeof cc.params.width != 'undefined'){ @@ -645,13 +644,13 @@ var floorplanEditor = { this.thick = thick } - console.log("obj2D: original size and thick at end of init: ", this.size); + //console.log("obj2D: original size and thick at end of init: ", this.size); this.original_size = this.size; this.original_thick = this.thick; this.update = function () { - console.log("in update. this.size, this.thick, meter: ", this.size, this.thick); + //console.log("in update. this.size, this.thick, meter: ", this.size, this.thick); if(this.class == 'energy' || this.class == 'text'){ if(document.querySelector('#extension-floorplanner-tool-root.extension-floorplanner-scale-linked')){ this.thick = this.size; @@ -667,26 +666,26 @@ var floorplanEditor = { } - console.log("floorplanEditor: obj2D: update: calling cc with: classe, type, size, thick, value", this.class, this.type, this.size, this.thick, this.value); - cc = carpentryCalc(this.class, this.type, this.size, this.thick, this.value); - console.log("floorplanEditor: obj2D: update: cc result: ", cc); - for (var tt = 0; tt < cc.length; tt++) { - if (cc[tt].path) { - this.graph.querySelectorAll('path')[tt].setAttribute("d", cc[tt].path); - } - else { - console.error("cc update would have set text now..."); - //this.graph.find('text').context.textContent = cc[tt].text; - //this.graph.querySelectorAll('text')[tt].context.textContent = cc[tt].text; - } + //console.log("floorplanEditor: obj2D: update: calling cc with: classe, type, size, thick, value", this.class, this.type, this.size, this.thick, this.value); + cc = carpentryCalc(this.class, this.type, this.size, this.thick, this.value); + //console.log("floorplanEditor: obj2D: update: cc result: ", cc); + for (var tt = 0; tt < cc.length; tt++) { + if (cc[tt].path) { + this.graph.querySelectorAll('path')[tt].setAttribute("d", cc[tt].path); + } + else { + console.error("cc update would have set text now... cc[tt]:", cc[tt]); + //this.graph.find('text').context.textContent = cc[tt].text; + //this.graph.querySelectorAll('text')[tt].context.textContent = cc[tt].text; } - var hingeStatus = this.hinge; // normal - reverse - var hingeUpdate; - if (hingeStatus == 'normal') hingeUpdate = 1; - else hingeUpdate = -1; + } + var hingeStatus = this.hinge; // normal - reverse + var hingeUpdate; + if (hingeStatus == 'normal') hingeUpdate = 1; + else hingeUpdate = -1; if(this.class == 'energy' || this.class == 'text'){ // || this.class == 'measure' - console.warn("UPDATE: this.width: ", this.width); + //console.warn("UPDATE: this.width: ", this.width); if(this.class != 'measure' && document.querySelector('#extension-floorplanner-scale-link-toggle-button-container').classList.contains('extension-floorplanner-scale-linked')){ this.height = this.width; } @@ -713,8 +712,11 @@ var floorplanEditor = { */ var angleRadian = -(this.angle) * (Math.PI / 180); - this.realBbox = [{ x: -this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: this.thick / 2 }, { x: -this.size / 2, y: this.thick / 2 }]; - var newRealBbox = [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }]; + //this.realBbox = [{ x: -this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: -this.thick / 2 }, { x: this.size / 2, y: this.thick / 2 }, { x: -this.size / 2, y: this.thick / 2 }]; + //this.realBbox = [{ x: -this.size / 4, y: -this.thick / 4 }, { x: this.size / 4, y: -this.thick / 4 }, { x: this.size / 4, y: this.thick / 4 }, { x: -this.size / 4, y: this.thick / 4 }]; + this.realBbox = [{ x: -this.size / 3, y: -this.thick / 3 }, { x: this.size / 3, y: -this.thick / 3 }, { x: this.size / 3, y: this.thick / 3 }, { x: -this.size / 3, y: this.thick / 3 }]; + + var newRealBbox = [{ x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }, { x: 0, y: 0 }]; newRealBbox[0].x = (this.realBbox[0].y * Math.sin(angleRadian) + this.realBbox[0].x * Math.cos(angleRadian)) + this.x; newRealBbox[1].x = (this.realBbox[1].y * Math.sin(angleRadian) + this.realBbox[1].x * Math.cos(angleRadian)) + this.x; newRealBbox[2].x = (this.realBbox[2].y * Math.sin(angleRadian) + this.realBbox[2].x * Math.cos(angleRadian)) + this.x; diff --git a/index.html b/index.html index 570271f..820549e 100644 --- a/index.html +++ b/index.html @@ -313,151 +313,153 @@

Modify door/window

Room

- - Name: -
- + Name: +
+ + +
Room @@ -493,7 +495,7 @@

Room

-

Room Colors

+

Background

@@ -821,8 +823,13 @@

๐Ÿ“ƒ Start a new floorplan

-

This will remove your current floorplan!

+

Last chance to save your current floorplan!

+ +
+

New floorplan name:

+ +
Select a plan type: @@ -835,11 +842,11 @@

-
-
+

@@ -984,11 +991,18 @@

in object mode"); snap = calcul_snap(event, grid_snap); + console.log("---> object mode: snap: ", snap); if (typeof (binder) != 'undefined') { if(typeof binder.family != 'undefined'){ if ((binder.family != 'stick' && binder.family != 'collision') || WALLS.length == 0) { - console.log("object mode: not stick/collision type, and walls length is 0") - console.log("binder: ", binder); + //console.log("object mode: not stick/collision type, and walls length is 0") + //console.log("binder: ", binder); binder.x = snap.x; binder.y = snap.y; binder.oldX = binder.x; @@ -1343,7 +1343,7 @@

setting binder as obj2D boundingbox"); + //console.warn("select_mode: OBJTARGET HAS BINDBOX -> setting binder as obj2D boundingbox"); if (typeof (binder) == 'undefined') { - binder = new floorplanEditor.obj2D("free", "boundingBox", "", objTarget.bbox.origin, objTarget.angle, 0, objTarget.size*0.5, "normal", objTarget.thick*0.5, objTarget.realBbox); + //binder = new floorplanEditor.obj2D("free", "boundingBox", "", objTarget.bbox.origin, objTarget.angle, 0, objTarget.size*0.5, "normal", objTarget.thick*0.5, objTarget.realBbox); + binder = new floorplanEditor.obj2D("free", "boundingBox", "", objTarget.bbox.origin, objTarget.angle, 0, objTarget.size*0.3, "normal", objTarget.thick*0.3, objTarget.realBbox); binder.update(); binder.obj = objTarget; binder.type = 'boundingBox'; @@ -1673,7 +1674,7 @@

1) wallBind = wallBind[wallBind.length - 1]; if (wallBind && typeof (binder) == 'undefined') { var objWall = floorplanEditor.objFromWall(wallBind); @@ -2033,7 +2034,7 @@

'; if (selText != 'None') document.querySelector('#extension-floorplanner-roomName').value = selText; else document.querySelector('#extension-floorplanner-roomName').value = ''; @@ -4782,14 +4823,14 @@

89 || angleText < -89) { - angleText -= 180; - if (ribMaster[t][n - 1].side === 'down') { - shift = -5; - } else shift = -shift + 10; - } - - - sizeText[n] = document.createElementNS('http://www.w3.org/2000/svg', 'text'); - let startText = qSVG.middle(ribMaster[t][n - 1].coords.x, ribMaster[t][n - 1].coords.y, ribMaster[t][n].coords.x, - ribMaster[t][n].coords.y); - sizeText[n].setAttributeNS(null, 'x', startText.x); - sizeText[n].setAttributeNS(null, 'y', (startText.y) + shift); - sizeText[n].setAttributeNS(null, 'text-anchor', 'middle'); - sizeText[n].setAttributeNS(null, 'font-family', 'sans-serif'); - sizeText[n].setAttributeNS(null, 'stroke', '#ffffff'); - sizeText[n].textContent = valueText.toFixed(2); - if (sizeText[n].textContent < 1) { - sizeText[n].setAttributeNS(null, 'font-size', '0.8em'); - sizeText[n].textContent = sizeText[n].textContent.substring(1, sizeText[n].textContent.length); - } else sizeText[n].setAttributeNS(null, 'font-size', '1em'); - sizeText[n].setAttributeNS(null, 'stroke-width', '0.27px'); - sizeText[n].setAttributeNS(null, 'fill', '#666666'); - sizeText[n].setAttribute("transform", "rotate(" + angleText + " " + startText.x + "," + (startText.y) + ")"); - - document.querySelector('#extension-floorplanner-boxRib').append(sizeText[n]); - } - } - } + if (!option) document.querySelector('#extension-floorplanner-boxRib').replaceChildren(); //.innerHTML = ''; + ribMaster = []; + ribMaster.push([]); + ribMaster.push([]); + let inter; + let distance; + let cross; + let angleTextValue = wall.angle * (180 / Math.PI); + let objWall = floorplanEditor.objFromWall(wall); // LIST OBJ ON EDGE + if (objWall.length == 0) return + ribMaster[0].push({ wall: wall, crossObj: false, side: 'up', coords: wall.coords[0], distance: 0 }); + ribMaster[1].push({ wall: wall, crossObj: false, side: 'down', coords: wall.coords[1], distance: 0 }); + let objTarget = null + for (let ob in objWall) { + objTarget = objWall[ob]; + objTarget.up = [ + qSVG.nearPointOnEquation(wall.equations.up, objTarget.limit[0]), + qSVG.nearPointOnEquation(wall.equations.up, objTarget.limit[1]) + ]; + objTarget.down = [ + qSVG.nearPointOnEquation(wall.equations.down, objTarget.limit[0]), + qSVG.nearPointOnEquation(wall.equations.down, objTarget.limit[1]) + ]; + + distance = qSVG.measure(wall.coords[0], objTarget.up[0]) / meter; + ribMaster[0].push({ + wall: objTarget, + crossObj: ob, + side: 'up', + coords: objTarget.up[0], + distance: distance.toFixed(2) + }); + distance = qSVG.measure(wall.coords[0], objTarget.up[1]) / meter; + ribMaster[0].push({ + wall: objTarget, + crossObj: ob, + side: 'up', + coords: objTarget.up[1], + distance: distance.toFixed(2) + }); + distance = qSVG.measure(wall.coords[1], objTarget.down[0]) / meter; + ribMaster[1].push({ + wall: objTarget, + crossObj: ob, + side: 'down', + coords: objTarget.down[0], + distance: distance.toFixed(2) + }); + distance = qSVG.measure(wall.coords[1], objTarget.down[1]) / meter; + ribMaster[1].push({ + wall: objTarget, + crossObj: ob, + side: 'down', + coords: objTarget.down[1], + distance: distance.toFixed(2) + }); + } + distance = qSVG.measure(wall.coords[0], wall.coords[3]) / meter; + ribMaster[0].push({ wall: objTarget, crossObj: false, side: 'up', coords: wall.coords[3], distance: distance }); + distance = qSVG.measure(wall.coords[1], wall.coords[2]) / meter; + ribMaster[1].push({ wall: objTarget, crossObj: false, side: 'down', coords: wall.coords[2], distance: distance }); + ribMaster[0].sort(function (a, b) { + return (a.distance - b.distance).toFixed(2); + }); + ribMaster[1].sort(function (a, b) { + return (a.distance - b.distance).toFixed(2); + }); + for (let t in ribMaster) { + for (let n = 1; n < ribMaster[t].length; n++) { + let found = true; + let shift = -5; + let valueText = Math.abs(ribMaster[t][n - 1].distance - ribMaster[t][n].distance); + let angleText = angleTextValue; + if (found) { + if (ribMaster[t][n - 1].side === 'down') { + shift = -shift + 10; + } + if (angleText > 89 || angleText < -89) { + angleText -= 180; + if (ribMaster[t][n - 1].side === 'down') { + shift = -5; + } else shift = -shift + 10; + } + + + sizeText[n] = document.createElementNS('http://www.w3.org/2000/svg', 'text'); + let startText = qSVG.middle(ribMaster[t][n - 1].coords.x, ribMaster[t][n - 1].coords.y, ribMaster[t][n].coords.x, ribMaster[t][n].coords.y); + sizeText[n].setAttributeNS(null, 'x', startText.x); + sizeText[n].setAttributeNS(null, 'y', (startText.y) + shift); + sizeText[n].setAttributeNS(null, 'text-anchor', 'middle'); + sizeText[n].setAttributeNS(null, 'font-family', 'sans-serif'); + sizeText[n].setAttributeNS(null, 'stroke', '#ffffff'); + sizeText[n].textContent = valueText.toFixed(2); + if (sizeText[n].textContent < 1) { + sizeText[n].setAttributeNS(null, 'font-size', '0.8em'); + sizeText[n].textContent = sizeText[n].textContent.substring(1, sizeText[n].textContent.length); + } else sizeText[n].setAttributeNS(null, 'font-size', '1em'); + sizeText[n].setAttributeNS(null, 'stroke-width', '0.27px'); + sizeText[n].setAttributeNS(null, 'fill', '#666666'); + sizeText[n].setAttribute("transform", "rotate(" + angleText + " " + startText.x + "," + (startText.y) + ")"); + + document.querySelector('#extension-floorplanner-boxRib').append(sizeText[n]); + } + } + } } function rib(shift = 5) { - console.log("in rib. shift: ", shift); + console.log("in rib. shift: ", shift); // return false; let ribMaster = []; ribMaster.push([]); @@ -5383,7 +5423,7 @@

0){ current_filename = copy_filename; save_to_floorplans(); @@ -6500,8 +6543,8 @@

{ - console.log("floorplan icon clicked. key: ", key); - console.log("floorplans x: ", floorplans[key]); - console.log("current_filename: ", current_filename); - console.log("unsaved: ", unsaved); + //console.log("floorplan icon clicked. key: ", key); + //console.log("floorplans x: ", floorplans[key]); + //console.log("current_filename: ", current_filename); + //console.log("unsaved: ", unsaved); //var safe_to_save = false; - console.log("types: ", typeof floorplans[key].name, typeof floorplans[key].floorplan); + //console.log("types: ", typeof floorplans[key].name, typeof floorplans[key].floorplan); if(typeof floorplans[key].name == 'string' && typeof floorplans[key].floorplan == 'string'){ - console.log("types are both string, ok"); + //console.log("types are both string, ok"); if(floorplans[key].name != current_filename){ if(unsaved){ - if(confirm("Should the changes you have made be saved first?")){ - save_to_floorplans(); - } + //if(confirm("Should the changes you have made be saved first?")){ + save_to_floorplans(); + //} } - console.log("calling load_from_floorplans"); + //zoom_maker('zoomreset',0,0); + //console.log("calling load_from_floorplans"); load_from_floorplans(details); + unsaved = false; } else{ if(unsaved){ if(confirm("Are you sure you want to revert to the old version of the floorplan? This will undo any changes you have made.")){ load_from_floorplans(details); + unsaved = false; } } else{ load_from_floorplans(details); + unsaved = false; } } } @@ -6600,6 +6671,7 @@

{ - console.log("dragEnd"); + //console.log("dragEnd"); var icon_index=0; for (let it of items) { it.classList.remove("extension-floorplanner-slist-hint"); @@ -6714,14 +6797,14 @@

{ - console.log("object icon clicked. key,details: ", key, details); + //console.log("object icon clicked. key,details: ", key, details); root_el.classList.remove('extension-floorplanner-do-not-pulsate'); objTarget = details; mode = 'bind_mode'; force_obj_edit(details); - console.log('hacky binder: ', binder); - console.log('hacky objTarget: ', objTarget); + //console.log('hacky binder: ', binder); + //console.log('hacky objTarget: ', objTarget); }); if(object_icon != '??'){ object_list_el.appendChild(object_el); @@ -6887,8 +6970,8 @@

0) { zoom_maker('zoomin', 20 * absolute_deltaY); @@ -6919,13 +7002,13 @@

BOUNDINGBOX TOOL bye_binder(); - console.warn("select_mode: OBJTARGET HAS BINDBOX -> setting binder as obj2D boundingbox"); + //console.warn("select_mode: OBJTARGET HAS BINDBOX -> setting binder as obj2D boundingbox"); if (typeof (binder) == 'undefined') { binder = new floorplanEditor.obj2D("free", "boundingBox", "", objTarget.bbox.origin, objTarget.angle, 0, objTarget.size*0.5, "normal", objTarget.thick*0.5, objTarget.realBbox); binder.update(); @@ -6936,7 +7019,7 @@

{ - document.getElementById('extension-floorplanner-zoomBox').style.transform = "translateX(-165px)"; - },300); - setTimeout(()=>{ - document.getElementById('extension-floorplanner-zoomBox2').style.transform = "translateX(-165px)"; - },300); - - if(Object.keys(floorplans).length == 0 || currently_editing == true){ - start_floorplanner(); - } - }); + function start_floorplanner(){ console.log("STARTING FLOORPLANNER"); floorplanner_started = true; - localStorage.setItem('extension-floorplanner-currently-editing',true); + localStorage.setItem('extension-floorplanner-currently-editing',JSON.stringify(true)); //document.querySelector('#extension-floorplanner-recover').innerHTML = "

Select a plan type.

"; @@ -7067,18 +7137,18 @@

{ + console.log("in window.addEventListener LOAD"); + document.getElementById('extension-floorplanner-moveBox').style.transform = "translateX(-215px)"; + setTimeout(()=>{ + document.getElementById('extension-floorplanner-zoomBox').style.transform = "translateX(-165px)"; + },300); + setTimeout(()=>{ + document.getElementById('extension-floorplanner-zoomBox2').style.transform = "translateX(-165px)"; + },300); + console.log("window load: currently_editing,current_filename: ", currently_editing,current_filename); + + if(currently_editing === true){ + console.log("window load: starting floorplanner because was already editing"); + start_floorplanner(); + } + else if(Object.keys(floorplans).length == 0){ + console.log("window load: starting floorplanner because there are no floorplans yet"); + start_floorplanner(); + } + else{ + console.log("what the hack is going on. currently_editing: ", typeof currently_editing, currently_editing); + } + }); diff --git a/qSVG.js b/qSVG.js index b095636..1b63446 100644 --- a/qSVG.js +++ b/qSVG.js @@ -15,7 +15,7 @@ var qSVG = { for (var k in attrs) { //console.log("setting shape attributes: ", k, attrs[k]); if(k == 'fill' && attrs[k] == ''){ - console.log("path with empty fill"); + //console.log("path with empty fill"); shape.setAttribute('fill-opacity', '.5'); } shape.setAttribute(k, attrs[k]); @@ -915,7 +915,7 @@ var qSVG = { }, textOnDiv: function(label, pos, styled, div) { - console.log('in textOnDiv. label, pos, styled, div: ', label, pos, styled, div); + //console.log('in textOnDiv. label, pos, styled, div: ', label, pos, styled, div); if (typeof(pos) != 'undefined') { var text = document.createElementNS('http://www.w3.org/2000/svg', 'text'); text.setAttributeNS(null, 'x', pos.x); @@ -923,22 +923,19 @@ var qSVG = { text.setAttribute("style","fill:"+styled.color+";font-weight:"+styled.fontWeight+";font-size:"+styled.fontSize); text.setAttributeNS(null, 'text-anchor', 'middle'); text.textContent = label; - // This check shouldn't be here - console.log("textOnDiv: div: ", div); - if(div){ - if(typeof div == 'string'){ - document.getElementById(div).appendChild(text); - } - else{ - div.appendChild(text); - } - - - } - - + // This check shouldn't be here + //console.log("textOnDiv: div: ", div); + if(div){ + if(typeof div == 'string'){ + document.getElementById(div).appendChild(text); + } + else{ + div.appendChild(text); + } + } } } + }; //----------------------- END Quick SVG LIBRARY --------------------------------------------------s