diff --git a/graph-editor.js b/graph-editor.js index 7927ee0..18016e7 100644 --- a/graph-editor.js +++ b/graph-editor.js @@ -1,18 +1,27 @@ window.onload = function() { - var graphModel; - if ( !localStorage.getItem( "graph-diagram-markup" ) ) - { - graphModel = gd.model(); - graphModel.createNode().x( 0 ).y( 0 ); - save( formatMarkup() ); - } - if ( localStorage.getItem( "graph-diagram-style" ) ) - { - d3.select( "link.graph-style" ) - .attr( "href", localStorage.getItem( "graph-diagram-style" ) ); - } - graphModel = parseMarkup( localStorage.getItem( "graph-diagram-markup" ) ); + var graphModel, + settings = { + markup: { + name: 'graph-diagram-markup', + default: '' + }, + style: { + name: 'graph-diagram-style', + default: 'style/graph-style-chunky.css' + }, + internalScale: { + name: 'internalScale', default: 1.0 + } + }; + + d3.select('link.graph-style').attr('href', valueOrDefault(settings.style)); + d3.select('#internalScale').node().value = valueOrDefault(settings.internalScale); + d3.select('input[name=styleChoice][value="' + valueOrDefault(settings.style).match(/style\/(.*)/)[1] + '"]') + .property('checked', true); + graphModel = parseMarkup(valueOrDefault(settings.markup)); var svg = d3.select("#canvas") .append("svg:svg") @@ -96,8 +105,9 @@ window.onload = function() function save( markup ) { - localStorage.setItem( "graph-diagram-markup", markup ); - localStorage.setItem( "graph-diagram-style", d3.select( "link.graph-style" ).attr( "href" ) ); + saveSetting(settings.markup, markup); + saveSetting(settings.style, d3.select('link.graph-style').attr('href')); + saveSetting(settings.internalScale, d3.select('#internalScale').node().value); } var newNode = null; @@ -331,6 +341,14 @@ window.onload = function() .on( "click", cancelModal ); } + function valueOrDefault(setting) { + return localStorage.getItem(setting.name) || setting.default; + } + + function saveSetting(setting, value) { + localStorage.setItem(setting.name, value); + } + var exportMarkup = function () { appendModalBackdrop(); @@ -380,17 +398,19 @@ window.onload = function() d3.select("link.graph-style") .attr("href", "style/" + selectedStyle); - graphModel = parseMarkup( localStorage.getItem( "graph-diagram-markup" ) ); + graphModel = parseMarkup(valueOrDefault(settings.markup)); save(formatMarkup()); draw(); cancelModal(); }); function changeInternalScale() { - graphModel.internalScale(d3.select("#internalScale").node().value); - draw(); + var internalScale = d3.select('#internalScale').node().value; + saveSetting(settings.internalScale, internalScale); + + graphModel.internalScale(internalScale); + draw(); } - d3.select("#internalScale").node().value = graphModel.internalScale(); d3.select(window).on("resize", draw); d3.select("#internalScale" ).on("change", changeInternalScale); @@ -402,5 +422,8 @@ window.onload = function() d3.event.stopPropagation(); } ); - draw(); + setTimeout(function() { + graphModel = parseMarkup(valueOrDefault(settings.markup)); + changeInternalScale(); + }, 0); };