From 35c6656d0fd3693567f911404886cb80edcf9af1 Mon Sep 17 00:00:00 2001 From: Oleg Sh Date: Fri, 23 Apr 2021 21:38:16 +0200 Subject: [PATCH] Add more options for vertex. --- i/css/home.css | 5 +++++ lang/de/home.php | 7 ++++++- lang/el/home.php | 7 ++++++- lang/en/home.php | 7 ++++++- lang/es/home.php | 5 +++++ lang/fr/home.php | 5 +++++ lang/nl/home.php | 7 ++++++- lang/pt/home.php | 7 ++++++- lang/ru/home.php | 5 +++++ lang/sv/home.php | 7 ++++++- script/Appilcation.js | 4 ++-- script/BaseVertexDrawer.js | 43 ++++++++++++++++++++++++++++++++------ script/EventHandlers.js | 14 ++++++++++++- tpl/home.php | 19 +++++++++++++++-- 14 files changed, 125 insertions(+), 17 deletions(-) diff --git a/i/css/home.css b/i/css/home.css index e608c7c..83cf4d7 100755 --- a/i/css/home.css +++ b/i/css/home.css @@ -364,4 +364,9 @@ #message { overflow-wrap: break-word; +} + +.small-bottom-marging +{ + margin-bottom: 4px; } \ No newline at end of file diff --git a/lang/de/home.php b/lang/de/home.php index 49cce22..6ca8fca 100644 --- a/lang/de/home.php +++ b/lang/de/home.php @@ -191,5 +191,10 @@ $g_lang['squere'] = "Square"; $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; - $g_lang['vertex_diameter'] = "Vertex size"; + $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> diff --git a/lang/el/home.php b/lang/el/home.php index 3b2d7c6..238743e 100644 --- a/lang/el/home.php +++ b/lang/el/home.php @@ -229,5 +229,10 @@ $g_lang['squere'] = "Square"; $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; - $g_lang['vertex_diameter'] = "Vertex size"; + $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> diff --git a/lang/en/home.php b/lang/en/home.php index 6da7366..ac19deb 100755 --- a/lang/en/home.php +++ b/lang/en/home.php @@ -228,5 +228,10 @@ We have added Dutch translation 🇳🇱. Thank you Willie de Wit"; $g_lang['squere'] = "Square"; $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; - $g_lang['vertex_diameter'] = "Vertex size"; + $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> diff --git a/lang/es/home.php b/lang/es/home.php index 077edf6..fbba962 100755 --- a/lang/es/home.php +++ b/lang/es/home.php @@ -229,4 +229,9 @@ Tenemos traducciones en griego 🇬🇷. diff --git a/lang/fr/home.php b/lang/fr/home.php index 0753c50..30d1751 100644 --- a/lang/fr/home.php +++ b/lang/fr/home.php @@ -197,4 +197,9 @@ $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> \ No newline at end of file diff --git a/lang/nl/home.php b/lang/nl/home.php index 697196c..01a61a3 100644 --- a/lang/nl/home.php +++ b/lang/nl/home.php @@ -193,5 +193,10 @@ $g_lang['squere'] = "Square"; $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; - $g_lang['vertex_diameter'] = "Vertex size"; + $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> diff --git a/lang/pt/home.php b/lang/pt/home.php index 534fa48..83bc762 100644 --- a/lang/pt/home.php +++ b/lang/pt/home.php @@ -194,5 +194,10 @@ $g_lang['squere'] = "Square"; $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; - $g_lang['vertex_diameter'] = "Vertex size"; + $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> diff --git a/lang/ru/home.php b/lang/ru/home.php index 7060bd7..c323055 100755 --- a/lang/ru/home.php +++ b/lang/ru/home.php @@ -230,4 +230,9 @@ $g_lang['triangle'] = "Треугльник"; $g_lang['pentagon'] = "Пятиугольник"; $g_lang['vertex_diameter'] = "Размер вершины"; + + $g_lang['additional_text_color'] = "Цвет другого текста"; + $g_lang['weight_position'] = "Позиция текста"; + $g_lang['center'] = "По центру"; + $g_lang['on_up'] = "Сверху"; ?> diff --git a/lang/sv/home.php b/lang/sv/home.php index 3e7fba5..ff90050 100644 --- a/lang/sv/home.php +++ b/lang/sv/home.php @@ -190,5 +190,10 @@ $g_lang['squere'] = "Square"; $g_lang['triangle'] = "Triangle"; $g_lang['pentagon'] = "Pentagon"; - $g_lang['vertex_diameter'] = "Vertex size"; + $g_lang['vertex_diameter'] = "Vertex size"; + + $g_lang['additional_text_color'] = "Another text color"; + $g_lang['weight_position'] = "Text position"; + $g_lang['center'] = "Center"; + $g_lang['on_up'] = "Above"; ?> diff --git a/script/Appilcation.js b/script/Appilcation.js index d5312ef..9f27ffa 100644 --- a/script/Appilcation.js +++ b/script/Appilcation.js @@ -1787,9 +1787,9 @@ Application.prototype.SetDefaultEdgeWidth = function(width) for (i = 0; i < this.graph.edges.length; i ++) { - if (this.graph.vertices[i].model.width == oldDefaultWidth) + if (this.graph.edges[i].model.width == oldDefaultWidth) { - this.graph.vertices[i].model.width = width; + this.graph.edges[i].model.width = width; } } } diff --git a/script/BaseVertexDrawer.js b/script/BaseVertexDrawer.js index afcc53c..f8cb90e 100644 --- a/script/BaseVertexDrawer.js +++ b/script/BaseVertexDrawer.js @@ -12,6 +12,10 @@ const VertexCircleShape = 0, VertexPentagonShape = 3, VertexHomeShape = 4; +// Common text position +const CommonTextCenter = 0, + CommonTextUp = 1; + function GetSquarePoints(diameter) { var res = []; @@ -68,6 +72,17 @@ function GetPointsForShape(shape, diameter) } return pointsVertex1; } + +function GetSizeForShape(shape, diameter) +{ + switch (parseInt(shape)) + { + case VertexSquareShape: return diameter; break; + case VertexTriangleShape: return diameter * 1.5; break; + case VertexPentagonShape: return diameter * 1.2; break; + } + return diameter; +} function BaseVertexStyle() { @@ -91,6 +106,10 @@ BaseVertexStyle.prototype.GetStyle = function (baseStyle, object) baseStyle.mainTextColor = this.mainTextColor; if (this.hasOwnProperty('shape')) baseStyle.shape = this.shape; + if (this.hasOwnProperty('upTextColor')) + baseStyle.upTextColor = this.upTextColor; + if (this.hasOwnProperty('commonTextPosition')) + baseStyle.commonTextPosition = this.commonTextPosition; baseStyle.lineWidth = parseInt(baseStyle.lineWidth); return baseStyle; @@ -110,7 +129,9 @@ function CommonVertexStyle() this.strokeStyle = '#c7b7c7'; this.fillStyle = '#68aeba'; this.mainTextColor = '#f0d543'; - this.shape = VertexCircleShape;//VertexSquareShape; + this.shape = VertexCircleShape; + this.upTextColor = '#68aeba'; + this.commonTextPosition = CommonTextCenter; this.baseStyles = []; } @@ -293,12 +314,22 @@ BaseVertexDrawer.prototype.Draw = function(baseGraph, graphStyle) this.context.stroke(); this.context.fill(); + + var shapeSize = GetSizeForShape(graphStyle.shape, baseGraph.model.diameter + graphStyle.lineWidth); - this.DrawCenterText(baseGraph.position, baseGraph.mainText, graphStyle.mainTextColor, graphStyle.fillStyle, true, true, 16); - - // Top text - this.DrawCenterText(baseGraph.position.add(new Point(0, - baseGraph.model.diameter / 2.0 - 9.0)), - baseGraph.upText, graphStyle.fillStyle, graphStyle.strokeStyle, false, false, 12.0); + if (graphStyle.commonTextPosition == CommonTextCenter) + { + this.DrawCenterText(baseGraph.position, baseGraph.mainText, graphStyle.mainTextColor, graphStyle.fillStyle, true, true, 16); + // Top text + this.DrawCenterText(baseGraph.position.add(new Point(0, - shapeSize / 2.0 - 9.0)), + baseGraph.upText, graphStyle.upTextColor, graphStyle.strokeStyle, false, false, 12.0); + } + else if (graphStyle.commonTextPosition == CommonTextUp) + { + this.DrawCenterText(baseGraph.position.add(new Point(0, - shapeSize / 2.0 - 7.0)), baseGraph.mainText, graphStyle.mainTextColor, graphStyle.fillStyle, true, false, 16); + // Top text + this.DrawCenterText(baseGraph.position.add(new Point(0, shapeSize / 2.0 + 9.0)), baseGraph.upText, graphStyle.upTextColor, graphStyle.strokeStyle, false, false, 12.0); + } /* // Bottom text this.DrawCenterText(baseGraph.position.add(new Point(0, + baseGraph.model.diameter / 2.0 + 7.0)), diff --git a/script/EventHandlers.js b/script/EventHandlers.js index eba4a98..74ae39d 100644 --- a/script/EventHandlers.js +++ b/script/EventHandlers.js @@ -1407,9 +1407,11 @@ SetupVertexStyle.prototype.show = function(index, selectedVertexes) $( "#vertexFillColor" ).val(fullStyle.fillStyle); $( "#vertexStrokeColor" ).val(fullStyle.strokeStyle); $( "#vertexTextColor" ).val(fullStyle.mainTextColor); + $( "#upVertexTextColor" ).val(fullStyle.upTextColor); $( "#vertexStrokeSize" ).val(fullStyle.lineWidth); $( "#vertexShape" ).val(fullStyle.shape); $( "#vertexSize" ).val(forAll ? app.GetDefaultVertexSize() : selectedVertexes[0].model.diameter); + $( "#commonTextPosition" ).val(fullStyle.commonTextPosition); } var redrawVertex = function() @@ -1431,6 +1433,12 @@ SetupVertexStyle.prototype.show = function(index, selectedVertexes) if (fullStyle.shape != $( "#vertexShape" ).val()) style.shape = parseInt($( "#vertexShape" ).val()); + if (fullStyle.upTextColor != $( "#upVertexTextColor" ).val()) + style.upTextColor = $( "#upVertexTextColor" ).val(); + + if (fullStyle.commonTextPosition != $( "#commonTextPosition" ).val()) + style.commonTextPosition = $( "#commonTextPosition" ).val(); + var diameter = parseInt($( "#vertexSize" ).val()); var canvas = document.getElementById( "VertexPreview" ); @@ -1534,16 +1542,20 @@ SetupVertexStyle.prototype.show = function(index, selectedVertexes) $( "#vertexFillColor" ).unbind(); $( "#vertexStrokeColor" ).unbind(); $( "#vertexTextColor" ).unbind(); + $( "#upVertexTextColor" ).unbind(); $( "#vertexStrokeSize" ).unbind(); $( "#vertexShape" ).unbind(); $( "#vertexSize" ).unbind(); + $( "#commonTextPosition" ).unbind(); $( "#vertexFillColor" ).change(redrawVertex); $( "#vertexStrokeColor" ).change(redrawVertex); $( "#vertexTextColor" ).change(redrawVertex); $( "#vertexStrokeSize" ).change(redrawVertex); $( "#vertexShape" ).change(redrawVertex); - $( "#vertexSize" ).change(redrawVertex); + $( "#vertexSize" ).change(redrawVertex); + $( "#upVertexTextColor" ).change(redrawVertex); + $( "#commonTextPosition" ).change(redrawVertex); } /** diff --git a/tpl/home.php b/tpl/home.php index 5c6ee66..d06cc80 100755 --- a/tpl/home.php +++ b/tpl/home.php @@ -10,7 +10,7 @@ - +