From 04ccd4f6ea87ab6791efff26f2b61806777294ac Mon Sep 17 00:00:00 2001 From: Benjamin Auder <benjamin.auder@somewhere> Date: Wed, 7 Feb 2018 02:44:34 +0100 Subject: [PATCH] Complete fix + add option in index.html for output type --- index.html | 29 +++++++++++++++++------------ parser.js | 13 ++++++------- 2 files changed, 23 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index 429232c..4aa7e9e 100644 --- a/index.html +++ b/index.html @@ -11,8 +11,13 @@ <button onClick="processGraphDesc()">Send</button> <div> <span>MCD graph type:</span> - <input type="radio" name="output" value="compact" checked/> compact - <input type="radio" name="output" value="bubble"/> bubble + <input type="radio" name="mcd" value="compact" checked/> compact + <input type="radio" name="mcd" value="bubble"/> bubble + </div> + <div> + <span>Output type:</span> + <input type="radio" name="output" value="graph" checked/> drawn graph + <input type="radio" name="output" value="text"/> graphviz input </div> <textarea id="graphDesc" rows="15" style="width:100%"></textarea> @@ -29,19 +34,19 @@ <script src="parser.js"></script> <script> const result = document.getElementById("result"); - function processGraphDesc() { - const graphDesc = document.getElementById("graphDesc").value; - const er = new ErDiags(graphDesc); - let mode = "compact"; - for (let el of document.getElementsByName("output")) + function getRadioValue(name) { + for (let el of document.getElementsByName(name)) { if (el.checked) - { - mode = el.value; - break; - } + return el.value; } - er.drawMcd("mcd", mode); + } + function processGraphDesc() { + const graphDesc = document.getElementById("graphDesc").value; + const mcdType = getRadioValue("mcd"); + const outputType = getRadioValue("output"); + const er = new ErDiags(graphDesc, outputType); + er.drawMcd("mcd", mcdType); er.drawMld("mld"); er.fillSql("sql"); result.style.display = "block"; diff --git a/parser.js b/parser.js index 3d31d8d..218906c 100644 --- a/parser.js +++ b/parser.js @@ -1,7 +1,7 @@ // ER diagram description parser class ErDiags { - constructor(description, callDot) + constructor(description, output) { this.entities = { }; this.inheritances = [ ]; @@ -9,8 +9,8 @@ class ErDiags this.tables = { }; this.mcdParsing(description); this.mldParsing(); - this.callDot = !!callDot; - if (this.callDot) + this.output = output; + if (output == "graph") { // Cache SVG graphs returned by server (in addition to server cache = good perfs) this.mcdGraph = ""; @@ -174,12 +174,11 @@ class ErDiags name: attr.name, type: attr.type, isKey: attr.isKey, - qualifiers: attr.qualifiers, }; if (!!attr.qualifiers && !!attr.qualifiers.match(/references/i)) { Object.assign(newField, {ref: attr.qualifiers.match(/references ([^\s]+)/i)[1]}); - attr.qualifiers = attr.qualifiers.replace(/references [^\s]+/i, ""); + newField.qualifiers = attr.qualifiers.replace(/references [^\s]+/i, ""); } newTable.push(newField); }); @@ -424,7 +423,7 @@ class ErDiags }); }); mcdDot += '}'; - if (this.callDot) + if (this.output == "graph") { // Draw graph in element ErDiags.AjaxGet(mcdDot, graphSvg => { @@ -470,7 +469,7 @@ class ErDiags }); mldDot += links + '\n'; mldDot += '}'; - if (this.callDot) + if (this.output == "graph") { ErDiags.AjaxGet(mldDot, graphSvg => { this.mldGraph = graphSvg; -- 2.44.0