diff --git a/i/css/home.css b/i/css/home.css index de1fc9a..cac7975 100755 --- a/i/css/home.css +++ b/i/css/home.css @@ -240,6 +240,11 @@ z-index: 10; } +.MarginLeft +{ + margin-right: 32px !important; +} + ::-webkit-scrollbar { -webkit-appearance: none; width: 7px; @@ -298,7 +303,6 @@ max-width:350px; } - @media only screen and (max-width: 650px) { #canvasSection { diff --git a/lang/en/home.php b/lang/en/home.php index 108f228..b0f3d77 100755 --- a/lang/en/home.php +++ b/lang/en/home.php @@ -18,7 +18,7 @@ $g_lang["orint_edge"] = "Directed"; $g_lang["not_orint_edge"] = "Undirected"; $g_lang["show_adjacency_matrix"] = "Adjacency Matrix"; - $g_lang["save"] = "Save graph"; + $g_lang["save"] = "Save"; $g_lang["cancel"] = "Cancel"; $g_lang["adjacency_matrix_description"] = "Setup adjacency matrix. Use comma \",\" as separator"; $g_lang["adjacency_matrix_bad_format"] = "Matrix is incorrect. Use comma \",\" as separator. Matrix should be square"; @@ -144,4 +144,20 @@ $g_lang["undo"] = "Undo"; $g_lang["opensource_message"] = "Our project is now open source. More details..."; + + $g_lang["settings"] = "Settings"; + $g_lang["common_vertex_settings"] = "Common vertexes"; + $g_lang["selected_vertex_settings"] = "Selected vertexes"; + $g_lang["common_edge_settings"] = "Common edges"; + $g_lang["selected_edge_settings"] = "Selected edges"; + + $g_lang["common_color"] = "Common Color"; + $g_lang["stroke_color"] = "Stroke Color"; + $g_lang["stroke_size"] = "Thickness"; + $g_lang["text_color"] = "Text Color"; + $g_lang["save_graph"] = "Save graph"; + $g_lang["default"] = "Default"; + $g_lang["vertex_draw_style"] = "Vertex Style"; + $g_lang["text_background"] = "Text background"; + $g_lang["edge_draw_style"] = "Edge Style"; ?> diff --git a/lang/ru/home.php b/lang/ru/home.php index f8d0c8f..057170f 100755 --- a/lang/ru/home.php +++ b/lang/ru/home.php @@ -18,7 +18,7 @@ $g_lang["orint_edge"] = "Ориентированную"; $g_lang["not_orint_edge"] = "Неориентированную"; $g_lang["show_adjacency_matrix"] = "Матрица смежности"; - $g_lang["save"] = "Сохранить граф"; + $g_lang["save"] = "Сохранить"; $g_lang["cancel"] = "Отмена"; $g_lang["adjacency_matrix_description"] = "Задайте матрицу смежности. Используйте запятую \",\" в качестве разделителя"; $g_lang["adjacency_matrix_bad_format"] = "Мартрица имеет неправильный формат. Используйте запятую \",\" в качестве разделителя. Матрица должна иметь одинаковое количество столбцов и строк."; @@ -147,4 +147,21 @@ $g_lang["undo"] = "Отменить"; $g_lang["opensource_message"] = "Наш проект стал проектом с открытым исходным кодом. Подробнее..."; + + $g_lang["settings"] = "Настройки"; + $g_lang["common_vertex_settings"] = "Обычных вершин"; + $g_lang["selected_vertex_settings"] = "Выделенных вершин"; + $g_lang["common_edge_settings"] = "Обычных дуг"; + $g_lang["selected_edge_settings"] = "Выделенных дуг"; + + $g_lang["common_color"] = "Основой цвет"; + $g_lang["stroke_color"] = "Цвет обводки"; + $g_lang["stroke_size"] = "Толщина обводки"; + $g_lang["text_color"] = "Цвет текста"; + $g_lang["save_graph"] = "Сохранить граф"; + $g_lang["default"] = "По умолчанию"; + $g_lang["vertex_draw_style"] = "Стиль отрисовки вершины"; + $g_lang["text_background"] = "Фон текста"; + $g_lang["edge_draw_style"] = "Стиль отрисовки дуги"; + ?> diff --git a/script/Appilcation.js b/script/Appilcation.js index 964570c..1021f51 100644 --- a/script/Appilcation.js +++ b/script/Appilcation.js @@ -26,17 +26,21 @@ function Application(document, window) this.userAction = function(){}; this.undoStack = []; - this.edgeCommonStyle = new CommonEdgeStyle(); - this.edgeSelectedStyles = DefaultSelectedEdgeStyles; + this.edgeCommonStyle = new CommonEdgeStyle(); + this.isEdgeCommonStyleCustom = false; + this.edgeSelectedStyles = DefaultSelectedEdgeStyles.slice(); + this.isEdgeSelectedStylesCustom = false; this.edgePrintCommonStyle = new CommonPrintEdgeStyle(); - this.edgePrintSelectedStyles = DefaultPrintSelectedEdgeStyles; + this.edgePrintSelectedStyles = DefaultPrintSelectedEdgeStyles.slice(); - this.vertexCommonStyle = new CommonVertexStyle(); - this.vertexSelectedVertexStyles = DefaultSelectedGraphStyles; + this.vertexCommonStyle = new CommonVertexStyle(); + this.isVertexCommonStyleCustom = false; + this.vertexSelectedVertexStyles = DefaultSelectedGraphStyles.slice(); + this.isVertexSelectedVertexStylesCustom = false; this.vertexPrintCommonStyle = new CommonPrintVertexStyle(); - this.vertexPrintSelectedVertexStyles = DefaultPrintSelectedGraphStyles; + this.vertexPrintSelectedVertexStyles = DefaultPrintSelectedGraphStyles.slice(); }; // List of graph. @@ -634,6 +638,26 @@ Application.prototype.SetHandlerMode = function(mode) var groupRenameVertices = new GroupRenameVertices(this); groupRenameVertices.show(); } + else if (mode == "setupVertexStyle") + { + var setupVertexStyle = new SetupVertexStyle(this); + setupVertexStyle.show(0); + } + else if (mode == "setupVertexStyleSelected") + { + var setupVertexStyle = new SetupVertexStyle(this); + setupVertexStyle.show(1); + } + else if (mode == "setupEdgeStyle") + { + var setupEdgeStyle = new SetupEdgeStyle(this); + setupEdgeStyle.show(0); + } + else if (mode == "setupEdgeStyleSelected") + { + var setupEdgeStyle = new SetupEdgeStyle(this); + setupEdgeStyle.show(1); + } else if (g_AlgorithmIds.indexOf(mode) >= 0) { this.handler = new AlgorithmGraphHandler(this, g_Algorithms[g_AlgorithmIds.indexOf(mode)](this.graph, this)); @@ -870,7 +894,9 @@ Application.prototype.SetIncidenceMatrixSmart = function (matrix) Application.prototype.SaveGraphOnDisk = function () { - var graphAsString = this.graph.SaveToXML(); + var graphAsString = this.graph.SaveToXML(this.SaveUserSettings()); + + var styleSave = this.SaveUserSettings(); if (this.savedGraphName.length <= 0) { @@ -963,7 +989,13 @@ Application.prototype.SaveFullGraphImageOnDisk = function (showDialogCallback, f Application.prototype.LoadGraphFromString = function (str) { var graph = new Graph(); - graph.LoadFromXML(str); + + //console.log(str); + + var userSettings = {}; + graph.LoadFromXML(str, userSettings); + if (userSettings.hasOwnProperty("data") && userSettings["data"].length > 0) + this.LoadUserSettings(userSettings["data"]); this.SetDefaultTransformations(); this.graph = graph; this.AutoAdjustViewport(); @@ -1212,7 +1244,7 @@ Application.prototype.PushToStack = function(actionName) { var object = {}; object.actionName = actionName; - object.graphSave = this.graph.SaveToXML(); + object.graphSave = this.graph.SaveToXML(""); this.undoStack.push(object); @@ -1229,7 +1261,8 @@ Application.prototype.Undo = function() var state = this.undoStack.pop(); this.graph = new Graph(); - this.graph.LoadFromXML(state.graphSave); + var empty; + this.graph.LoadFromXML(state.graphSave, empty); this.redrawGraph(); } @@ -1242,7 +1275,7 @@ Application.prototype.IsUndoStackEmpty = function() { return (this.undoStack.length <= 0); } -/* + Application.prototype.SaveUserSettings = function() { var res = "{"; @@ -1250,82 +1283,84 @@ Application.prototype.SaveUserSettings = function() var needEnd = false; var checkValue = []; - checkValue.push({check: !CommonEdgeStyle.prototype.isPrototypeOf(this.edgeCommonStyle), - field: "edgeCommonStyle", - value: this.edgeCommonStyle}); + checkValue.push({field: "edgeCommonStyle", + value: this.edgeCommonStyle, + check: this.isEdgeCommonStyleCustom}); - checkValue.push({check: this.edgeSelectedStyles != DefaultSelectedEdgeStyles, - field: "edgeSelectedStyles", - value: this.edgeSelectedStyles}); + checkValue.push({field: "edgeSelectedStyles", + value: this.edgeSelectedStyles, + check: this.isEdgeSelectedStylesCustom}); - checkValue.push({check: !CommonPrintEdgeStyle.prototype.isPrototypeOf(this.edgePrintCommonStyle), - field: "edgePrintCommonStyle", - value: this.edgePrintCommonStyle}); + //checkValue.push({field: "edgePrintCommonStyle", + // value: this.edgePrintCommonStyle}); - checkValue.push({check: this.edgePrintSelectedStyles != DefaultPrintSelectedEdgeStyles, - field: "edgePrintSelectedStyles", - value: this.edgePrintSelectedStyles}); + //checkValue.push({field: "edgePrintSelectedStyles", + // value: this.edgePrintSelectedStyles}); - checkValue.push({check: !CommonVertexStyle.prototype.isPrototypeOf(this.vertexCommonStyle), - field: "vertexCommonStyle", - value: this.vertexCommonStyle}); + checkValue.push({field: "vertexCommonStyle", + value: this.vertexCommonStyle, + check: this.isVertexCommonStyleCustom}); - checkValue.push({check: this.vertexSelectedVertexStyles != DefaultSelectedGraphStyles, - field: "vertexSelectedVertexStyles", - value: this.vertexSelectedVertexStyles}); + checkValue.push({field: "vertexSelectedVertexStyles", + value: this.vertexSelectedVertexStyles, + check: this.isVertexSelectedVertexStylesCustom}); - checkValue.push({check: !CommonPrintVertexStyle.prototype.isPrototypeOf(this.vertexPrintCommonStyle), - field: "vertexPrintCommonStyle", - value: this.vertexPrintCommonStyle}); + //checkValue.push({field: "vertexPrintCommonStyle", + // value: this.vertexPrintCommonStyle}); - checkValue.push({check: this.vertexPrintSelectedVertexStyles != DefaultPrintSelectedGraphStyles, - field: "vertexPrintSelectedVertexStyles", - value: this.vertexPrintSelectedVertexStyles}); + //checkValue.push({field: "vertexPrintSelectedVertexStyles", + // value: this.vertexPrintSelectedVertexStyles}); checkValue.forEach(function(entry) { - if (entry.check) - { - if (needEnd) - res = res + ","; + if (!entry.check) + return; - res = res + entry.field + ":" + JSON.stringify(entry.value); - } + if (needEnd) + res = res + ","; + + res = res + "\"" + entry.field + "\"" + ":" + JSON.stringify(entry.value); + needEnd = true; }); res = res + "}"; - return res; + return this.EncodeToHTML(res); } -Application.prototype.LoadUserSettings = function() +Application.prototype.LoadUserSettings = function(json) { var checkValue = []; checkValue.push({field: "edgeCommonStyle", - value: this.edgeCommonStyle}); + value: this.edgeCommonStyle, + check: "isEdgeCommonStyleCustom"}); checkValue.push({field: "edgeSelectedStyles", - value: this.edgeSelectedStyles}); + value: this.edgeSelectedStyles, + check: "isEdgeSelectedStylesCustom"}); - checkValue.push({field: "edgePrintCommonStyle", - value: this.edgePrintCommonStyle}); + //checkValue.push({field: "edgePrintCommonStyle", + // value: this.edgePrintCommonStyle}); - checkValue.push({field: "edgePrintSelectedStyles", - value: this.edgePrintSelectedStyles}); + //checkValue.push({field: "edgePrintSelectedStyles", + // value: this.edgePrintSelectedStyles}); checkValue.push({field: "vertexCommonStyle", - value: this.vertexCommonStyle}); + value: this.vertexCommonStyle, + check: "isVertexCommonStyleCustom"}); checkValue.push({field: "vertexSelectedVertexStyles", - value: this.vertexSelectedVertexStyles}); + value: this.vertexSelectedVertexStyles, + check: "isVertexSelectedVertexStylesCustom"}); - checkValue.push({field: "vertexPrintCommonStyle", - value: this.vertexPrintCommonStyle}); + //checkValue.push({field: "vertexPrintCommonStyle", + // value: this.vertexPrintCommonStyle}); - checkValue.push({field: "vertexPrintSelectedVertexStyles", - value: this.vertexPrintSelectedVertexStyles}); + //checkValue.push({field: "vertexPrintSelectedVertexStyles", + // value: this.vertexPrintSelectedVertexStyles}); - var parsedSave = JSON.parse(json); + var decoderStr = this.DecodeFromHTML(json); + var parsedSave = JSON.parse(decoderStr); var app = this; @@ -1334,7 +1369,82 @@ Application.prototype.LoadUserSettings = function() { for(var k in parsedSave[entry.field]) entry.value[k] = parsedSave[entry.field][k]; + + app[entry.check] = true; } }); } -*/ + +Application.prototype.EncodeToHTML = function (str) +{ + return str.replace(/&/g, '&') + .replace(//g, '>') + .replace(/"/g, '"') + .replace(/'/g, '''); +} + +Application.prototype.DecodeFromHTML = function (str) +{ + return str.replace(/'/g, "'") + .replace(/"/g, '"') + .replace(/>/g, '>') + .replace(/</g, '<') + .replace(/&/g, '&'); +} + +Application.prototype.SetVertexStyle = function (index, style) +{ + if (index == 0) + { + this.vertexCommonStyle = style; + this.isVertexCommonStyleCustom = true; + } + else + { + this.vertexSelectedVertexStyles[index - 1] = style; + this.isVertexSelectedVertexStylesCustom = true; + } +} + +Application.prototype.ResetVertexStyle = function (index) +{ + if (index == 0) + { + this.vertexCommonStyle = new CommonVertexStyle(); + this.isVertexCommonStyleCustom = false; + } + else + { + this.vertexSelectedVertexStyles = DefaultSelectedGraphStyles.slice(); + this.isVertexSelectedVertexStylesCustom = false; + } +} + +Application.prototype.SetEdgeStyle = function (index, style) +{ + if (index == 0) + { + this.edgeCommonStyle = style; + this.isEdgeCommonStyleCustom = true; + } + else + { + this.edgeSelectedStyles[index - 1] = style; + this.isEdgeSelectedStylesCustom = true; + } +} + +Application.prototype.ResetEdgeStyle = function (index) +{ + if (index == 0) + { + this.edgeCommonStyle = new CommonEdgeStyle(); + this.isEdgeCommonStyleCustom = false; + } + else + { + this.edgeSelectedStyles = DefaultSelectedEdgeStyles.slice(); + this.isEdgeSelectedStylesCustom = false; + } +} diff --git a/script/BaseEdgeDrawer.js b/script/BaseEdgeDrawer.js index f8bc92e..796d084 100644 --- a/script/BaseEdgeDrawer.js +++ b/script/BaseEdgeDrawer.js @@ -16,13 +16,11 @@ function CommonEdgeStyle() function CommonPrintEdgeStyle() { + CommonEdgeStyle.apply(this, arguments); + this.strokeStyle = '#000000'; this.weightText = '#000000'; this.fillStyle = '#FFFFFF'; - this.textPadding = 4; - this.textStrockeWidth = 2; - this.sizeOfLoop = 24; - this.loopShiftAngel = Math.PI / 6; } function SelectedEdgeStyle0() diff --git a/script/BaseVertexDrawer.js b/script/BaseVertexDrawer.js index 669cfd9..b7381fa 100644 --- a/script/BaseVertexDrawer.js +++ b/script/BaseVertexDrawer.js @@ -5,7 +5,7 @@ // Common style of Graphs. function CommonVertexStyle() { - this.lineWidth = 1; + this.lineWidth = 2; this.strokeStyle = '#c7b7c7'; this.fillStyle = '#68aeba'; this.mainTextColor = '#f0d543'; @@ -13,7 +13,9 @@ function CommonVertexStyle() function CommonPrintVertexStyle() { - this.lineWidth = 1; + CommonVertexStyle.apply(this, arguments); + + this.lineWidth = 2; this.strokeStyle = '#000000'; this.fillStyle = '#FFFFFF'; this.mainTextColor = '#000000'; @@ -179,7 +181,6 @@ BaseVertexDrawer.prototype.SetupStyle = function(style) BaseVertexDrawer.prototype.DrawShape = function(baseGraph) { - this.context.lineWidth = 2; this.context.beginPath(); this.context.arc(baseGraph.position.x, baseGraph.position.y, baseGraph.model.diameter / 2.0, 0, 2 * Math.PI); this.context.closePath(); diff --git a/script/EventHandlers.js b/script/EventHandlers.js index 5b1fd59..6762452 100644 --- a/script/EventHandlers.js +++ b/script/EventHandlers.js @@ -1100,3 +1100,200 @@ GroupRenameVertices.prototype.show = function() dialogClass: 'EdgeDialog' }); } + + +/** + * Setup Vertex Style rename vertices. + * + */ +function SetupVertexStyle(app) +{ + BaseHandler.apply(this, arguments); + this.message = ""; +} + +// inheritance. +SetupVertexStyle.prototype = Object.create(BaseHandler.prototype); + +SetupVertexStyle.prototype.show = function(index) +{ + var handler = this; + var dialogButtons = {}; + var graph = this.app.graph; + var app = this.app; + var style = Object.assign({}, (index == 0 ? app.vertexCommonStyle : app.vertexSelectedVertexStyles[index - 1])); + + var fillFields = function() + { + $( "#vertexFillColor" ).val(style.fillStyle); + $( "#vertexStrokeColor" ).val(style.strokeStyle); + $( "#vertexTextColor" ).val(style.mainTextColor); + $( "#vertexStrokeSize" ).val(style.lineWidth); + } + + var redrawVertex = function() + { + style.fillStyle = $( "#vertexFillColor" ).val(); + style.strokeStyle = $( "#vertexStrokeColor" ).val(); + style.mainTextColor = $( "#vertexTextColor" ).val(); + style.lineWidth = $( "#vertexStrokeSize" ).val(); + + var canvas = document.getElementById( "VertexPreview" ); + var context = canvas.getContext('2d'); + + context.save(); + + context.fillStyle = "#FFFFFF"; + context.fillRect(0, 0, canvas.width, canvas.height); + + var graphDrawer = new BaseVertexDrawer(context); + var baseVertex = new BaseVertex(canvas.width / 2, canvas.height / 2, new BaseEnumVertices(this)); + baseVertex.mainText = "1"; + baseVertex.upText = "Up Text"; + + graphDrawer.Draw(baseVertex, style); + + context.restore(); + } + + //var dialogButtons = []; + + dialogButtons[g_default] = + { + text : g_default, + class : "MarginLeft", + click : function() { + app.ResetVertexStyle(index); + app.redrawGraph(); + $( this ).dialog( "close" ); + } + }; + + dialogButtons[g_save] = function() { + app.SetVertexStyle(index, style); + app.redrawGraph(); + $( this ).dialog( "close" ); + }; + dialogButtons[g_cancel] = function() { + $( this ).dialog( "close" ); + }; + + fillFields(); + + $( "#SetupVertexStyleDialog" ).dialog({ + resizable: false, + height: "auto", + width: "auto", + modal: true, + title: g_vertexDraw, + buttons: dialogButtons, + dialogClass: 'EdgeDialog' + }); + + redrawVertex(); + + $( "#vertexFillColor" ).unbind(); + $( "#vertexStrokeColor" ).unbind(); + $( "#vertexTextColor" ).unbind(); + $( "#vertexStrokeSize" ).unbind(); + + $( "#vertexFillColor" ).change(redrawVertex); + $( "#vertexStrokeColor" ).change(redrawVertex); + $( "#vertexTextColor" ).change(redrawVertex); + $( "#vertexStrokeSize" ).change(redrawVertex); +} + +/** + * Setup Vertex Style rename vertices. + * + */ +function SetupEdgeStyle(app) +{ + BaseHandler.apply(this, arguments); + this.message = ""; +} + +// inheritance. +SetupEdgeStyle.prototype = Object.create(BaseHandler.prototype); + +SetupEdgeStyle.prototype.show = function(index) +{ + var handler = this; + var dialogButtons = {}; + var graph = this.app.graph; + var app = this.app; + var style = Object.assign({}, (index == 0 ? app.edgeCommonStyle : app.edgeSelectedStyles[index - 1])); + + var fillFields = function() + { + $( "#edgeFillColor" ).val(style.fillStyle); + $( "#edgeStrokeColor" ).val(style.strokeStyle); + $( "#edgeTextColor" ).val(style.weightText); + } + + var redrawVertex = function() + { + style.fillStyle = $( "#edgeFillColor" ).val(); + style.strokeStyle = $( "#edgeStrokeColor" ).val(); + style.weightText = $( "#edgeTextColor" ).val(); + + var canvas = document.getElementById( "EdgePreview" ); + var context = canvas.getContext('2d'); + + context.save(); + + context.fillStyle = "#FFFFFF"; + context.fillRect(0, 0, canvas.width, canvas.height); + + var graphDrawer = new BaseEdgeDrawer(context); + var baseVertex1 = new BaseVertex(0, canvas.height / 2, new BaseEnumVertices(this)); + var baseVertex2 = new BaseVertex(canvas.width, canvas.height / 2, new BaseEnumVertices(this)); + var baseEdge = new BaseEdge(baseVertex1, baseVertex2, true, 10); + + graphDrawer.Draw(baseEdge, style); + + context.restore(); + } + + dialogButtons[g_default] = + { + text : g_default, + class : "MarginLeft", + click : function() { + app.ResetEdgeStyle(index); + app.redrawGraph(); + $( this ).dialog( "close" ); + } + }; + + dialogButtons[g_save] = function() { + app.SetEdgeStyle(index, style); + app.redrawGraph(); + $( this ).dialog( "close" ); + }; + dialogButtons[g_cancel] = function() { + $( this ).dialog( "close" ); + }; + + fillFields(); + + $( "#SetupEdgeStyleDialog" ).dialog({ + resizable: false, + height: "auto", + width: "auto", + modal: true, + title: g_edgeDraw, + buttons: dialogButtons, + dialogClass: 'EdgeDialog' + }); + + redrawVertex(); + + $( "#edgeFillColor" ).unbind(); + $( "#edgeStrokeColor" ).unbind(); + $( "#edgeTextColor" ).unbind(); + + $( "#edgeFillColor" ).change(redrawVertex); + $( "#edgeStrokeColor" ).change(redrawVertex); + $( "#edgeTextColor" ).change(redrawVertex); +} diff --git a/script/Graph.js b/script/Graph.js index 8bd5e05..1062ffd 100644 --- a/script/Graph.js +++ b/script/Graph.js @@ -763,7 +763,7 @@ Graph.prototype.SplitMatrixString = function (line, separator) } -Graph.prototype.SaveToXML = function () +Graph.prototype.SaveToXML = function (additionalData) { var mainHeader = ""; var header = ""; @@ -783,11 +783,17 @@ Graph.prototype.SaveToXML = function () } xmlBoby = xmlBoby + ""; + + additionalField = ""; + if (additionalData.length > 0) + { + additionalField = "" + } - return mainHeader + header + xmlBoby + ""; + return mainHeader + header + xmlBoby + "" + additionalField + ""; } -Graph.prototype.LoadFromXML = function (xmlText) +Graph.prototype.LoadFromXML = function (xmlText, additionalData) { xmlDoc = $.parseXML( xmlText ); var $xml = $( xmlDoc ); @@ -833,6 +839,12 @@ Graph.prototype.LoadFromXML = function (xmlText) }); this.edges = edges; + + $additional = $xml.find( "additional" ); + if ($additional.length != 0 && additionalData != null) + { + additionalData["data"] = $additional.attr('data'); + } } Graph.prototype.hasDirectEdge = function () diff --git a/script/main.js b/script/main.js index 8ca1541..ef08620 100644 --- a/script/main.js +++ b/script/main.js @@ -412,7 +412,27 @@ function postLoadPage() application.SetHandlerMode("default"); document.getElementById('Default').className = "btn btn-primary btn-sm"; } - + document.getElementById('SetupVertexStyle').onclick = function () + { + userAction(this.id); + application.SetHandlerMode("setupVertexStyle"); + } + document.getElementById('SetupVertexStyleSelected').onclick = function () + { + userAction(this.id); + application.SetHandlerMode("setupVertexStyleSelected"); + } + document.getElementById('SetupEdgeStyle').onclick = function () + { + userAction(this.id); + application.SetHandlerMode("setupEdgeStyle"); + } + document.getElementById('SetupEdgeStyleSelected').onclick = function () + { + userAction(this.id); + application.SetHandlerMode("setupEdgeStyleSelected"); + } + document.getElementById('runUserScript').onclick = function () { var el = document.getElementById('userScript'); @@ -471,7 +491,7 @@ function postLoadPage() { userAction(this.id); - var graphAsString = application.graph.SaveToXML(); + var graphAsString = application.graph.SaveToXML(""); var savedGraphName = application.GetNewGraphName(); var element = document.createElement('a'); diff --git a/script/texts.js b/script/texts.js index bf55517..9200d18 100644 --- a/script/texts.js +++ b/script/texts.js @@ -23,6 +23,7 @@ var g_notOrintEdge = "not Orient"; var g_adjacencyMatrixText = "Adjacency Matrix"; var g_save = "Save"; var g_cancel = "Cancel"; +var g_save_graph = "Save Graph"; var g_shortestDistance = "lowest-distance is "; var g_incidenceMatrixText = "Incidence Matrix"; @@ -98,6 +99,9 @@ var g_traversalOrder = "Traversal order: "; var g_curveEdge = "Curved edge"; var g_Undo = "Undo"; +var g_default = "default"; +var g_vertexDraw = "Vertex draw style"; +var g_edgeDraw = "Edge draw style"; function loadTexts() { @@ -120,9 +124,9 @@ function loadTexts() g_save = document.getElementById("Save").innerHTML; g_cancel = document.getElementById("Cancel").innerHTML; - g_shortestDistance = document.getElementById("shortestDist").innerHTML; + g_shortestDistance = document.getElementById("shortestDist").innerHTML; - g_incidenceMatrixText = document.getElementById("IncidenceMatrixText").innerHTML; + g_incidenceMatrixText = document.getElementById("IncidenceMatrixText").innerHTML; g_save_dialog = document.getElementById("saveDialogTitle").innerHTML; g_close = document.getElementById("closeButton").innerHTML; @@ -196,5 +200,9 @@ function loadTexts() g_curveEdge = document.getElementById("curveEdge").innerHTML; - g_Undo = document.getElementById("undoTranslate").innerHTML; + g_Undo = document.getElementById("undoTranslate").innerHTML; + g_save_graph = document.getElementById("saveGraph").innerHTML; + g_default = document.getElementById("default").innerHTML; + g_vertexDraw = document.getElementById("vertexDrawStyle").innerHTML; + g_edgeDraw = document.getElementById("edgeDrawStyle").innerHTML; } diff --git a/tpl/home.php b/tpl/home.php index bdc35b8..b1c0a23 100755 --- a/tpl/home.php +++ b/tpl/home.php @@ -117,6 +117,20 @@ + + +
+ + +