diff --git a/script/Appilcation.js b/script/Appilcation.js index cd959b7..d5312ef 100644 --- a/script/Appilcation.js +++ b/script/Appilcation.js @@ -52,6 +52,7 @@ function Application(document, window) this.selectionRect = null; this.defaultVertexSize = null; + this.defaultEdgeWidth = null; }; // List of graph. @@ -1407,7 +1408,11 @@ Application.prototype.SaveUserSettings = function() checkValue.push({field: "defaultVertexSize", value: this.defaultVertexSize, - check: this.defaultVertexSize != null}); + check: this.defaultVertexSize != null}); + + checkValue.push({field: "defaultEdgeWidth", + value: this.defaultEdgeWidth, + check: this.defaultEdgeWidth != null}); //checkValue.push({field: "vertexPrintCommonStyle", // value: this.vertexPrintCommonStyle}); @@ -1464,8 +1469,13 @@ Application.prototype.LoadUserSettings = function(json) checkValue.push({field: "defaultVertexSize", value: "defaultVertexSize", check: null, - deep: false}); - + deep: false}); + + checkValue.push({field: "defaultEdgeWidth", + value: "defaultEdgeWidth", + check: null, + deep: false}); + //checkValue.push({field: "vertexPrintCommonStyle", // value: this.vertexPrintCommonStyle}); @@ -1769,3 +1779,35 @@ Application.prototype.ResetVertexSize = function() this.graph.vertices[i].model.diameter = this.GetDefaultVertexSize(); } } + +Application.prototype.SetDefaultEdgeWidth = function(width) +{ + var oldDefaultWidth = this.GetDefaultEdgeWidth(); + this.defaultEdgeWidth = width; + + for (i = 0; i < this.graph.edges.length; i ++) + { + if (this.graph.vertices[i].model.width == oldDefaultWidth) + { + this.graph.vertices[i].model.width = width; + } + } +} + +Application.prototype.GetDefaultEdgeWidth = function(diameter) +{ + if (this.defaultVertexSize != null) + return this.defaultEdgeWidth; + else + return defaultEdgeWidth; +} + +Application.prototype.ResetEdgeWidth = function() +{ + this.defaultVertexSize = null; + + for (i = 0; i < this.graph.edges.length; i ++) + { + this.graph.edges[i].model.width = this.GetDefaultEdgeWidth(); + } +} \ No newline at end of file diff --git a/script/BaseEdgeDrawer.js b/script/BaseEdgeDrawer.js index f2d56b9..80737d1 100644 --- a/script/BaseEdgeDrawer.js +++ b/script/BaseEdgeDrawer.js @@ -34,8 +34,6 @@ baseStyle.textStrockeWidth = this.textStrockeWidth; if (this.hasOwnProperty('lineDash')) baseStyle.lineDash = this.lineDash; - if (this.hasOwnProperty('widthFactor')) - baseStyle.widthFactor = this.widthFactor; return baseStyle; } @@ -54,8 +52,7 @@ function CommonEdgeStyle() this.fillStyle = '#68aeba'; this.textPadding = 4; this.textStrockeWidth = 2; - this.lineDash = lineDashTypes[0]; - this.widthFactor = 1; + this.lineDash = 0; } CommonEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype); @@ -196,8 +193,8 @@ BaseEdgeDrawer.prototype.Draw = function(baseEdge, arcStyle) this.SetupStyle(baseEdge, arcStyle); - var lengthArrow = baseEdge.model.width * 4 * (Math.min(this.style.widthFactor * 1.5, 1)); - var widthArrow = baseEdge.model.width * 2 * (Math.min(this.style.widthFactor * 1.5, 1)); + var lengthArrow = Math.max(baseEdge.model.width * 4, 8); + var widthArrow = Math.max(baseEdge.model.width * 2, 4); var position1 = baseEdge.vertex1.position; var position2 = baseEdge.vertex2.position; var direction = position1.subtract(position2); @@ -252,7 +249,7 @@ BaseEdgeDrawer.prototype.Draw = function(baseEdge, arcStyle) BaseEdgeDrawer.prototype.SetupStyle = function(baseEdge, arcStyle) { - this.context.lineWidth = baseEdge.model.width * arcStyle.widthFactor; + this.context.lineWidth = baseEdge.model.width; this.context.strokeStyle = arcStyle.strokeStyle; this.context.fillStyle = arcStyle.fillStyle; this.model = baseEdge.model; @@ -267,7 +264,7 @@ BaseEdgeDrawer.prototype.DrawArc = function(position1, position2, arcStyle) return; } - this.context.setLineDash(arcStyle.lineDash); + this.context.setLineDash(lineDashTypes[arcStyle.lineDash]); if (position1.equals(position2)) { this.context.beginPath(); @@ -460,7 +457,7 @@ CurvedArcDrawer.prototype = Object.create(BaseEdgeDrawer.prototype); CurvedArcDrawer.prototype.DrawArc = function(position1, position2, arcStyle) { - this.context.setLineDash(arcStyle.lineDash); + this.context.setLineDash(lineDashTypes[arcStyle.lineDash]); if (position1.equals(position2)) { this.context.beginPath(); diff --git a/script/EdgeModel.js b/script/EdgeModel.js index 8126f31..87ff050 100755 --- a/script/EdgeModel.js +++ b/script/EdgeModel.js @@ -4,10 +4,12 @@ */ var EdgeModels = {"line": 0, "cruvled" : 1}; + +const defaultEdgeWidth = 4; function EdgeModel() { - this.width = 4; + this.width = globalApplication.GetDefaultEdgeWidth(); this.type = EdgeModels.line; this.curvedValue = EdgeModel.prototype.defaultCruved; this.default = true; diff --git a/script/EventHandlers.js b/script/EventHandlers.js index 5cc9e46..eba4a98 100644 --- a/script/EventHandlers.js +++ b/script/EventHandlers.js @@ -1409,7 +1409,7 @@ SetupVertexStyle.prototype.show = function(index, selectedVertexes) $( "#vertexTextColor" ).val(fullStyle.mainTextColor); $( "#vertexStrokeSize" ).val(fullStyle.lineWidth); $( "#vertexShape" ).val(fullStyle.shape); - $( "#vertexSize" ).val(forAll ? (new VertexModel()).diameter : selectedVertexes[0].model.diameter); + $( "#vertexSize" ).val(forAll ? app.GetDefaultVertexSize() : selectedVertexes[0].model.diameter); } var redrawVertex = function() @@ -1583,7 +1583,9 @@ SetupEdgeStyle.prototype.show = function(index, selectedEdges) $( "#edgeFillColor" ).val(fullStyle.fillStyle); $( "#edgeStrokeColor" ).val(fullStyle.strokeStyle); - $( "#edgeTextColor" ).val(fullStyle.weightText); + $( "#edgeTextColor" ).val(fullStyle.weightText); + $( "#edgeStyle" ).val(fullStyle.lineDash); + $( "#edgeWidth" ).val(forAll ? app.GetDefaultEdgeWidth() : selectedEdges[0].model.width); } var redrawVertex = function() @@ -1598,6 +1600,11 @@ SetupEdgeStyle.prototype.show = function(index, selectedEdges) if (fullStyle.weightText != $( "#edgeTextColor" ).val()) style.weightText = $( "#edgeTextColor" ).val(); + + if (fullStyle.lineDash != $( "#edgeStyle" ).val()) + style.lineDash = $( "#edgeStyle" ).val(); + + var edgeWidth = parseInt($( "#edgeWidth" ).val()); var canvas = document.getElementById( "EdgePreview" ); var context = canvas.getContext('2d'); @@ -1619,16 +1626,35 @@ SetupEdgeStyle.prototype.show = function(index, selectedEdges) if (!forAll) baseEdge.ownStyles = selectedEdges[0].ownStyles; + baseEdge.model.width = edgeWidth; + graphDrawer.Draw(baseEdge, style.GetStyle({}, baseEdge)); context.restore(); } + var applyWidth = function(width) + { + if (forAll) + { + app.SetDefaultEdgeWidth(width); + } + else + { + selectedEdges.forEach(function(edge) { + edge.model.width = width; + }); + } + }; + dialogButtons[g_default] = { text : g_default, class : "MarginLeft", click : function() { + + applyWidth(forAll ? (new EdgeModel()).width : app.GetDefaultEdgeWidth()); + if (forAll) { app.ResetEdgeStyle(index); @@ -1646,6 +1672,9 @@ SetupEdgeStyle.prototype.show = function(index, selectedEdges) }; dialogButtons[g_save] = function() { + + applyWidth(parseInt($( "#edgeWidth" ).val())); + if (forAll) { app.SetEdgeStyle(index, style); @@ -1680,10 +1709,14 @@ SetupEdgeStyle.prototype.show = function(index, selectedEdges) $( "#edgeFillColor" ).unbind(); $( "#edgeStrokeColor" ).unbind(); $( "#edgeTextColor" ).unbind(); + $( "#edgeStyle" ).unbind(); + $( "#edgeWidth" ).unbind(); $( "#edgeFillColor" ).change(redrawVertex); $( "#edgeStrokeColor" ).change(redrawVertex); $( "#edgeTextColor" ).change(redrawVertex); + $( "#edgeStyle" ).change(redrawVertex); + $( "#edgeWidth" ).change(redrawVertex); } /** diff --git a/tpl/home.php b/tpl/home.php index a8aa10c..3c1c17f 100755 --- a/tpl/home.php +++ b/tpl/home.php @@ -417,7 +417,7 @@
- +
@@ -464,6 +464,23 @@
+
+ +
+ +
+
+
+ +
+ +
+