Add new default style.

script/features/draw_graph/api/index.js

@@ -3,10 +3,17 @@ let modulDir = "features/draw_graph/";
 
 doInclude ([
     include ("model/BaseBackgroundDrawer.js", modulDir),
+    include ("model/BackgroundStyle.js", modulDir),
     include ("model/EdgeStyle.js", modulDir),
     include ("model/BaseEdgeDrawer.js", modulDir),
     include ("model/VertexShape.js", modulDir),
     include ("model/VertexStyle.js", modulDir),
+    include ("model/VertexOldStyle.js", modulDir),
+    include ("model/VertexPrintStyle.js", modulDir),
+    include ("model/OldEdgeStyle.js", modulDir),
+    include ("model/PrintEdgeStyle.js", modulDir),
+    include ("model/VertexNewWhiteStyle.js", modulDir),
+    include ("model/EdgeNewWhiteStyle.js", modulDir),
     include ("model/BaseVertexDrawer.js", modulDir),
     include ("model/GraphFullStyle.js", modulDir)
 ])

script/features/draw_graph/model/BackgroundStyle.js

@@ -0,0 +1,41 @@
+/**
+ * Graph drawer.
+ */
+ 
+ 
+function CommonBackgroundStyle()
+{
+  BaseBackgroundStyle.apply(this, arguments);
+
+	this.commonColor   = '#ffffff';
+	this.commonOpacity = 1.0;
+  this.image = null;
+}
+
+CommonBackgroundStyle.prototype = Object.create(BaseBackgroundStyle.prototype);
+
+function PrintBackgroundStyle()
+{
+  CommonBackgroundStyle.apply(this, arguments);
+
+	this.commonColor   = '#ffffff';
+	this.commonOpacity = 1.0;
+  this.image = null;
+}
+
+PrintBackgroundStyle.prototype = Object.create(CommonBackgroundStyle.prototype);
+
+function GetWhiteBackgroundStyle()
+{
+  return new CommonBackgroundStyle();
+}
+
+function DefaultCommonBackgroundStyle()
+{
+  return GetWhiteBackgroundStyle();
+}
+
+function DefaultPrintBackgroundStyle()
+{
+  return new PrintBackgroundStyle();
+}

script/features/draw_graph/model/BaseBackgroundDrawer.js

@@ -3,31 +3,31 @@
  */
  
  
-function CommonBackgroundStyle()
+function BaseBackgroundStyle()
 {
 	this.commonColor   = '#ffffff';
 	this.commonOpacity = 1.0;
-    this.image = null;
+  this.image = null;
 }
 
-CommonBackgroundStyle.prototype.Clear = function ()
+BaseBackgroundStyle.prototype.Clear = function ()
 {
   delete this.commonColor;
   delete this.commonOpacity;
   delete this.image;
 }
 
-CommonBackgroundStyle.prototype.ShouldLoad = function (field)
+BaseBackgroundStyle.prototype.ShouldLoad = function (field)
 {
   return true;
 }
 
-CommonBackgroundStyle.prototype.saveToJson = function (field)
+BaseBackgroundStyle.prototype.saveToJson = function (field)
 {
   return JSON.stringify({commonColor: this.commonColor, commonOpacity: this.commonOpacity, image: this.image != null ? this.image.src : null});
 }
 
-CommonBackgroundStyle.prototype.loadFromJson = function (json, callbackOnLoaded)
+BaseBackgroundStyle.prototype.loadFromJson = function (json, callbackOnLoaded)
 {
   this.commonColor   = json["commonColor"];
   this.commonOpacity = json["commonOpacity"];
@@ -41,17 +41,6 @@ CommonBackgroundStyle.prototype.loadFromJson = function (json, callbackOnLoaded)
   }
 }
 
-PrintBackgroundStyle.prototype = Object.create(CommonBackgroundStyle.prototype);
-
-function PrintBackgroundStyle()
-{
-  CommonBackgroundStyle.apply(this, arguments);
-
-	this.commonColor   = '#ffffff';
-	this.commonOpacity = 1.0;
-    this.image = null;
-}
-
 function BaseBackgroundDrawer(context)
 {   
   this.context = context;

script/features/draw_graph/model/EdgeNewWhiteStyle.js

@@ -0,0 +1,101 @@
+/**
+ * New edge styles.
+ */
+
+ 
+function WhiteCommonEdgeStyle()
+{
+  	BaseEdgeStyle.apply(this, arguments);
+
+	this.strokeStyle = '#1e88e5';
+	this.weightText  = '#263238';
+	this.fillStyle   = '#ffffff';
+	this.textPadding = 4;
+	this.textStrokeWidth = 2;
+	this.lineDash = 0;
+	this.additionalTextColor = '#263238';
+	this.weightPosition = WeightTextCenter;
+}
+
+WhiteCommonEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function WhiteSelectedEdgeStyle0()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#fb8c00';
+	this.weightText  = '#e65100';
+	this.fillStyle   = '#fffee0';
+	this.additionalTextColor = '#e65100';
+
+  	this.baseStyles.push("common");
+}
+WhiteSelectedEdgeStyle0.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function WhiteSelectedEdgeStyle1()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#43a047';
+	this.weightText  = '#1b5e20';
+	this.fillStyle   = '#e8f5e9';
+	this.additionalTextColor = '#1b5e20';
+
+ 	this.baseStyles.push("selected");
+}
+WhiteSelectedEdgeStyle1.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function WhiteSelectedEdgeStyle2()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#8e24aa';
+	this.weightText  = '#4a148c';
+	this.fillStyle   = '#f3e5f5';
+	this.additionalTextColor = '#4a148c';
+
+  	this.baseStyles.push("selected");
+}
+WhiteSelectedEdgeStyle2.prototype = Object.create(BaseEdgeStyle.prototype);
+
+
+function WhiteSelectedEdgeStyle3()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#c62828';
+	this.weightText  = '#8e0000';
+	this.fillStyle   = '#fdecea';
+	this.additionalTextColor = '#8e0000';
+
+ 	this.baseStyles.push("selected");
+}
+WhiteSelectedEdgeStyle3.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function WhiteSelectedEdgeStyle4()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#6d4c41';
+	this.weightText  = '#3e2723';
+	this.fillStyle   = '#efebe9';
+	this.additionalTextColor = '#3e2723';
+
+	this.baseStyles.push("selected");
+}
+WhiteSelectedEdgeStyle4.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function GetWhiteCommonEdgeStyle()
+{
+	return new WhiteCommonEdgeStyle();
+}
+
+var WhiteSelectedEdgeStyles      = [new WhiteSelectedEdgeStyle0(), new WhiteSelectedEdgeStyle1(), 
+	new WhiteSelectedEdgeStyle2(), new WhiteSelectedEdgeStyle3(), new WhiteSelectedEdgeStyle4()];
+
+function DefaultCommonEdgeStyle()
+{
+  return GetWhiteCommonEdgeStyle();
+}
+
+var DefaultSelectedEdgeStyles = WhiteSelectedEdgeStyles;

script/features/draw_graph/model/EdgeStyle.js

@@ -16,8 +16,8 @@ const WeightTextCenter = 0,
 
 // Fonts
 const DefaultFontEdge = "px sans-serif",
-	  DefaultMainTextFontSizeEdge = 16,
-	  TopTextFontSizeDeltaEdge    = -4; // 4 less then main.
+	  DefaultMainTextFontSizeEdge = 13,
+	  TopTextFontSizeDeltaEdge    = -2; // 2 less then main.
 
  function BaseEdgeStyle()
  {
@@ -67,129 +67,21 @@ BaseEdgeStyle.prototype.FixNewFields = function (style)
   return style;
 }
 
- BaseEdgeStyle.prototype.Clear = function ()
- {
-    delete this.weightText;
-    delete this.strokeStyle;
-    delete this.fillStyle;
-    delete this.textPadding;
-    delete this.textStrokeWidth;
-    delete this.lineDash;
-    delete this.additionalTextColor;
-    delete this.weightPosition;
-    delete this.mainTextFontSize;
- }
-
- BaseEdgeStyle.prototype.ShouldLoad = function (field)
- {
-   return field != "baseStyles";
- }
- 
-function CommonEdgeStyle()
+BaseEdgeStyle.prototype.Clear = function ()
 {
-  BaseEdgeStyle.apply(this, arguments);
-
-	this.strokeStyle = '#c7b7c7';
-	this.weightText  = '#f0d543';
- 	this.fillStyle   = '#68aeba';
- 	this.textPadding = 4;
-	this.textStrokeWidth = 2;
-  this.lineDash = 0;
-  this.additionalTextColor = '#c7b7c7';
-  this.weightPosition = WeightTextCenter;
+  delete this.weightText;
+  delete this.strokeStyle;
+  delete this.fillStyle;
+  delete this.textPadding;
+  delete this.textStrokeWidth;
+  delete this.lineDash;
+  delete this.additionalTextColor;
+  delete this.weightPosition;
+  delete this.mainTextFontSize;
 }
 
-CommonEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
-
-function CommonPrintEdgeStyle()
+BaseEdgeStyle.prototype.ShouldLoad = function (field)
 {
-	BaseEdgeStyle.apply(this, arguments);
-    
-	this.strokeStyle = '#000000';
-	this.weightText  = '#000000';
- 	this.fillStyle   = '#FFFFFF';
- 	this.textPadding = 4;
-	this.textStrokeWidth = 2;
-
-    this.baseStyles.push("common");
+  return field != "baseStyles";
 }
-CommonPrintEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
 
-function SelectedEdgeStyle0()
-{
-	BaseEdgeStyle.apply(this, arguments);  
-
-	this.strokeStyle = '#f0d543';
-	this.weightText  = '#f0d543';
-	this.fillStyle   = '#c7627a';
-
-  this.baseStyles.push("common");
-}
-SelectedEdgeStyle0.prototype = Object.create(BaseEdgeStyle.prototype);
-
-function SelectedEdgeStyle1()
-{
-	BaseEdgeStyle.apply(this, arguments);  
-
-	this.strokeStyle = '#8FBF83';
-	this.weightText  = '#8FBF83';
-	this.fillStyle   = '#F9F9D5';
-
-  this.baseStyles.push("selected");
-}
-SelectedEdgeStyle1.prototype = Object.create(BaseEdgeStyle.prototype);
-
-function SelectedEdgeStyle2()
-{
-	BaseEdgeStyle.apply(this, arguments);  
-
-	this.strokeStyle = '#8C4C86';
-	this.weightText  = '#8C4C86';
-	this.fillStyle   = '#253267';
-
-  this.baseStyles.push("selected");
-}
-SelectedEdgeStyle2.prototype = Object.create(BaseEdgeStyle.prototype);
-
-
-function SelectedEdgeStyle3()
-{
-	BaseEdgeStyle.apply(this, arguments);  
-
-	this.strokeStyle = '#6188FF';
-	this.weightText  = '#6188FF';
-	this.fillStyle   = '#E97CF9';
-
-  this.baseStyles.push("selected");
-}
-SelectedEdgeStyle3.prototype = Object.create(BaseEdgeStyle.prototype);
-
-
-function SelectedEdgeStyle4()
-{
-	BaseEdgeStyle.apply(this, arguments);  
-
-	this.strokeStyle = '#C6B484';
-	this.weightText  = '#C6B484';
-	this.fillStyle   = '#E0DEE1';
-
-  this.baseStyles.push("selected");
-}
-SelectedEdgeStyle4.prototype = Object.create(BaseEdgeStyle.prototype);
-
-function SelectedEdgePrintStyle()
-{
-	BaseEdgeStyle.apply(this, arguments);  
-
-	this.strokeStyle = '#AAAAAA';
-	this.weightText  = '#000000';
-	this.fillStyle   = '#AAAAAA';
-
-  this.baseStyles.push("printed");
-}
-SelectedEdgePrintStyle.prototype = Object.create(BaseEdgeStyle.prototype);
-
-var DefaultSelectedEdgeStyles      = [new SelectedEdgeStyle0(), new SelectedEdgeStyle1(), 
-	new SelectedEdgeStyle2(), new SelectedEdgeStyle3(), new SelectedEdgeStyle4()];
-
-var DefaultPrintSelectedEdgeStyles = [new SelectedEdgePrintStyle()];

script/features/draw_graph/model/GraphFullStyle.js

@@ -4,17 +4,18 @@
 
 function GraphFullStyle(redrawCallback)
 {
-    this.edgeCommonStyle         = new CommonEdgeStyle();
+    this.version = 1;
+    this.edgeCommonStyle         = DefaultCommonEdgeStyle();
     this.isEdgeCommonStyleCustom = false;
     this.edgeSelectedStyles      = FullArrayCopy(DefaultSelectedEdgeStyles);
     this.isEdgeSelectedStylesCustom = false;
 
-    this.vertexCommonStyle          = new CommonVertexStyle();
+    this.vertexCommonStyle          = DefaultCommonVertexStyle();
     this.isVertexCommonStyleCustom  = false;
     this.vertexSelectedVertexStyles = FullArrayCopy(DefaultSelectedGraphStyles);
     this.isVertexSelectedVertexStylesCustom  = false;
 
-    this.backgroundCommonStyle = new CommonBackgroundStyle();
+    this.backgroundCommonStyle = DefaultCommonBackgroundStyle();
     this.isBackgroundCommonStyleCustom  = false;
 
     this.defaultVertexSize = null;
@@ -78,7 +79,7 @@ GraphFullStyle.prototype.Save = function()
     
     res = res + "";
     
-    return gEncodeToHTML(res);
+    return res;
 }
 
 GraphFullStyle.prototype.Load = function(json)
@@ -120,7 +121,7 @@ GraphFullStyle.prototype.Load = function(json)
                      check: "isBackgroundCommonStyleCustom",
                      deep: false});
     
-    var decoderStr = gDecodeFromHTML(json);
+    var decoderStr = json;
     var parsedSave = JSON.parse(decoderStr);
     
     var app = this;
@@ -192,3 +193,51 @@ GraphFullStyle.prototype.Load = function(json)
             }
         });
 }
+
+GraphFullStyle.prototype.GetVersion = function()
+{
+    return this.version;
+}
+
+GraphFullStyle.prototype.Print = function()
+{
+    let print_all_fields = function (style)
+    {
+        for (const [key, value] of Object.entries(style)) {
+            console.log(` ${key}:`, value);
+        }
+    }
+    console.log("Graph Full Style:");
+    console.log("Edge Common Style: ");
+    print_all_fields(this.edgeCommonStyle);
+    console.log("Edge Selected Styles:");
+    this.edgeSelectedStyles.forEach(function(edge_style, index) {
+        console.log(`[${index}]`);
+        print_all_fields(edge_style);
+    });
+    console.log("Vertex Common Style: ");
+    print_all_fields(this.vertexCommonStyle);
+    console.log("Vertex Selected Styles: ");
+    this.vertexSelectedVertexStyles.forEach(function(vertex_style, index) {
+        console.log(`[${index}]`);
+        print_all_fields(vertex_style);
+    });
+    console.log("Background Common Style: ");
+    print_all_fields(this.backgroundCommonStyle);
+}
+
+function OldGraphFullStyle()
+{
+    GraphFullStyle.apply(this, arguments);
+
+    this.version = 0;
+    this.edgeCommonStyle         = GetOldCommonEdgeStyle();
+    this.edgeSelectedStyles      = FullArrayCopy(OldSelectedEdgeStyles);
+
+    this.vertexCommonStyle          = GetOldCommonVertexStyle();
+    this.vertexSelectedVertexStyles = FullArrayCopy(OldSelectedGraphStyles);
+
+    this.backgroundCommonStyle = GetWhiteBackgroundStyle();
+}
+
+OldGraphFullStyle.prototype = Object.create(GraphFullStyle.prototype);

script/features/draw_graph/model/OldEdgeStyle.js

@@ -0,0 +1,99 @@
+/**
+ * Old edge styles.
+ */
+ 
+function CommonEdgeStyle()
+{
+  BaseEdgeStyle.apply(this, arguments);
+
+	this.strokeStyle = '#c7b7c7';
+	this.weightText  = '#f0d543';
+ 	this.fillStyle   = '#68aeba';
+ 	this.textPadding = 4;
+	this.textStrokeWidth = 2;
+  this.lineDash = 0;
+  this.additionalTextColor = '#c7b7c7';
+  this.weightPosition = WeightTextCenter;
+}
+
+CommonEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function SelectedEdgeStyle0()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#f0d543';
+	this.weightText  = '#f0d543';
+	this.fillStyle   = '#c7627a';
+
+  this.baseStyles.push("common");
+}
+SelectedEdgeStyle0.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function SelectedEdgeStyle1()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#8FBF83';
+	this.weightText  = '#8FBF83';
+	this.fillStyle   = '#F9F9D5';
+
+  this.baseStyles.push("selected");
+}
+SelectedEdgeStyle1.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function SelectedEdgeStyle2()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#8C4C86';
+	this.weightText  = '#8C4C86';
+	this.fillStyle   = '#253267';
+
+  this.baseStyles.push("selected");
+}
+SelectedEdgeStyle2.prototype = Object.create(BaseEdgeStyle.prototype);
+
+
+function SelectedEdgeStyle3()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#6188FF';
+	this.weightText  = '#6188FF';
+	this.fillStyle   = '#E97CF9';
+
+  this.baseStyles.push("selected");
+}
+SelectedEdgeStyle3.prototype = Object.create(BaseEdgeStyle.prototype);
+
+
+function SelectedEdgeStyle4()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#C6B484';
+	this.weightText  = '#C6B484';
+	this.fillStyle   = '#E0DEE1';
+
+  this.baseStyles.push("selected");
+}
+SelectedEdgeStyle4.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function GetOldCommonEdgeStyle()
+{
+  return new CommonEdgeStyle();
+}
+
+var OldSelectedEdgeStyles      = [new SelectedEdgeStyle0(), new SelectedEdgeStyle1(), 
+	new SelectedEdgeStyle2(), new SelectedEdgeStyle3(), new SelectedEdgeStyle4()];
+
+/*
+function DefaultCommonEdgeStyle()
+{
+  return new CommonEdgeStyle();
+}
+
+var DefaultSelectedEdgeStyles      = [new SelectedEdgeStyle0(), new SelectedEdgeStyle1(), 
+	new SelectedEdgeStyle2(), new SelectedEdgeStyle3(), new SelectedEdgeStyle4()];
+*/

script/features/draw_graph/model/PrintEdgeStyle.js

@@ -0,0 +1,37 @@
+/**
+ * Print Edge style.
+ */
+
+function CommonPrintEdgeStyle()
+{
+	BaseEdgeStyle.apply(this, arguments);
+    
+	this.strokeStyle = '#000000';
+	this.weightText  = '#000000';
+ 	this.fillStyle   = '#FFFFFF';
+ 	this.textPadding = 4;
+	this.textStrokeWidth = 2;
+
+    this.baseStyles.push("common");
+}
+CommonPrintEdgeStyle.prototype = Object.create(BaseEdgeStyle.prototype);
+
+function SelectedEdgePrintStyle()
+{
+	BaseEdgeStyle.apply(this, arguments);  
+
+	this.strokeStyle = '#AAAAAA';
+	this.weightText  = '#000000';
+	this.fillStyle   = '#AAAAAA';
+
+  this.baseStyles.push("printed");
+}
+SelectedEdgePrintStyle.prototype = Object.create(BaseEdgeStyle.prototype);
+
+
+function DefaultCommonPrintEdgeStyle()
+{
+  return new CommonPrintEdgeStyle();
+}
+
+var DefaultPrintSelectedEdgeStyles = [new SelectedEdgePrintStyle()];

script/features/draw_graph/model/VertexNewWhiteStyle.js

@@ -0,0 +1,109 @@
+/**
+ * White vertex style.
+ */
+
+
+// Common style of Graphs.
+function WhiteCommonVertexStyle()
+{
+  BaseVertexStyle.apply(this, arguments);
+
+  this.lineWidth   = 2;
+  this.strokeStyle = '#1e88e5';
+  this.fillStyle   = '#e3f2fd';
+  this.mainTextColor = '#0d47a1';
+  this.shape       = VertexCircleShape;
+  this.upTextColor = '#455a64';
+  this.commonTextPosition = CommonTextCenter;
+
+  this.baseStyles = [];
+}
+
+WhiteCommonVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
+
+// Selected style of Graphs.
+function WhiteSelectedVertexStyle0()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#fb8c00';
+	this.mainTextColor  = '#e65100';
+	this.fillStyle   = '#fff3e0';
+	this.upTextColor = '#e65100';
+
+	this.baseStyles.push("common");
+}
+
+WhiteSelectedVertexStyle0.prototype = Object.create(BaseVertexStyle.prototype);
+
+function WhiteSelectedVertexStyle1()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#43a047';
+	this.mainTextColor  = '#1b5e20';
+	this.fillStyle   = '#e8f5e9';
+	this.upTextColor = '#1b5e20';
+
+	this.baseStyles.push("selected");
+}
+
+WhiteSelectedVertexStyle1.prototype = Object.create(BaseVertexStyle.prototype);
+
+function WhiteSelectedVertexStyle2()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#8e24aa';
+	this.mainTextColor = '#4a148c';
+	this.fillStyle   = '#f3e5f5';
+	this.upTextColor = '#4a148c';
+
+	this.baseStyles.push("selected");
+}
+
+WhiteSelectedVertexStyle2.prototype = Object.create(BaseVertexStyle.prototype);
+
+function WhiteSelectedVertexStyle3()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#c62828';
+	this.mainTextColor  = '#8e0000';
+	this.fillStyle   = '#fdecea';
+	this.upTextColor = '#8e0000';
+
+	this.baseStyles.push("selected");
+}
+
+WhiteSelectedVertexStyle3.prototype = Object.create(BaseVertexStyle.prototype);
+
+function WhiteSelectedVertexStyle4()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#6d4c41';
+	this.mainTextColor  = '#3e2723';
+	this.fillStyle   = '#efebe9';
+	this.upTextColor = '#3e2723';
+
+	this.baseStyles.push("selected");
+}
+
+WhiteSelectedVertexStyle4.prototype = Object.create(BaseVertexStyle.prototype);
+
+function GetWhiteCommonVertexStyle()
+{
+	return new WhiteCommonVertexStyle();
+}
+
+var WhiteSelectedGraphStyles = [new WhiteSelectedVertexStyle0(), new WhiteSelectedVertexStyle1(),
+	new WhiteSelectedVertexStyle2(), new WhiteSelectedVertexStyle3(), new WhiteSelectedVertexStyle4()];
+
+
+function DefaultCommonVertexStyle()
+{
+	return GetWhiteCommonVertexStyle();
+}
+
+var DefaultSelectedGraphStyles = WhiteSelectedGraphStyles;

script/features/draw_graph/model/VertexOldStyle.js

@@ -0,0 +1,106 @@
+/**
+ * Old style.
+ */
+
+// Common style of Graphs.
+function CommonVertexStyle()
+{
+  BaseVertexStyle.apply(this, arguments);
+
+  this.lineWidth   = 2;
+  this.strokeStyle = '#c7b7c7';
+  this.fillStyle   = '#68aeba';
+  this.mainTextColor = '#f0d543';
+  this.shape       = VertexCircleShape;
+  this.upTextColor = '#68aeba';
+  this.commonTextPosition = CommonTextCenter;
+
+  this.baseStyles = [];
+}
+
+CommonVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
+
+// Selected style of Graphs.
+function SelectedVertexStyle0()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#f0d543';
+	this.mainTextColor  = '#f0d543';
+	this.fillStyle   = '#c7627a';
+
+	this.baseStyles.push("common");
+}
+
+SelectedVertexStyle0.prototype = Object.create(BaseVertexStyle.prototype);
+
+function SelectedVertexStyle1()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#7a9ba0';
+	this.mainTextColor  = '#c3d2d5';
+	this.fillStyle   = '#534641';
+
+	this.baseStyles.push("selected");
+}
+
+SelectedVertexStyle1.prototype = Object.create(BaseVertexStyle.prototype);
+
+function SelectedVertexStyle2()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#8C4C86';
+	this.mainTextColor  = '#dbbdd8';
+	this.fillStyle   = '#253267';
+
+	this.baseStyles.push("selected");
+}
+
+SelectedVertexStyle2.prototype = Object.create(BaseVertexStyle.prototype);
+
+function SelectedVertexStyle3()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#6188FF';
+	this.mainTextColor  = '#6188FF';
+	this.fillStyle   = '#E97CF9';
+
+	this.baseStyles.push("selected");
+}
+
+SelectedVertexStyle3.prototype = Object.create(BaseVertexStyle.prototype);
+
+function SelectedVertexStyle4()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle = '#C6B484';
+	this.mainTextColor  = '#C6B484';
+	this.fillStyle   = '#E0DEE1';
+
+	this.baseStyles.push("selected");
+}
+
+SelectedVertexStyle4.prototype = Object.create(BaseVertexStyle.prototype);
+
+
+function GetOldCommonVertexStyle()
+{
+	return new CommonVertexStyle();
+}
+
+var OldSelectedGraphStyles = [new SelectedVertexStyle0(), new SelectedVertexStyle1(),
+	new SelectedVertexStyle2(), new SelectedVertexStyle3(), new SelectedVertexStyle4()];
+
+/*
+function DefaultCommonVertexStyle()
+{
+	return new CommonVertexStyle();
+}
+
+var DefaultSelectedGraphStyles = [new SelectedVertexStyle0(), new SelectedVertexStyle1(),
+	new SelectedVertexStyle2(), new SelectedVertexStyle3(), new SelectedVertexStyle4()];
+*/

script/features/draw_graph/model/VertexPrintStyle.js

@@ -0,0 +1,36 @@
+/**
+ * Print style.
+ */
+
+function CommonPrintVertexStyle()
+{
+  BaseVertexStyle.apply(this, arguments);
+  
+  this.strokeStyle = '#000000';
+  this.fillStyle   = '#FFFFFF';
+  this.mainTextColor = '#000000';
+
+  this.baseStyles.push("common");
+}
+
+CommonPrintVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
+
+function SelectedPrintVertexStyle()
+{
+	BaseVertexStyle.apply(this, arguments);
+
+	this.strokeStyle   = '#000000';
+	this.mainTextColor = '#000000';
+	this.fillStyle     = '#AAAAAA';
+
+	this.baseStyles.push("printed");
+}
+
+SelectedPrintVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
+
+function DefaultCommonPrintVertexStyle()
+{
+	return new CommonPrintVertexStyle();
+}
+
+var DefaultPrintSelectedGraphStyles = [new SelectedPrintVertexStyle()];

script/features/draw_graph/model/VertexStyle.js

@@ -8,8 +8,8 @@ const CommonTextCenter = 0,
 
 // Fonts
 const DefaultFont = "px sans-serif",
-	  DefaultMainTextFontSize = 16,
-	  TopTextFontSizeDelta    = -4; // 4 less then main.
+	  DefaultMainTextFontSize = 13,
+	  TopTextFontSizeDelta    = -2; // 2 less then main.
 
 
 function BaseVertexStyle()
@@ -78,24 +78,6 @@ BaseVertexStyle.prototype.ShouldLoad = function (field)
 	return field != "baseStyles";
 }
 
-// Common style of Graphs.
-function CommonVertexStyle()
-{
-  BaseVertexStyle.apply(this, arguments);
-
-  this.lineWidth   = 2;
-  this.strokeStyle = '#c7b7c7';
-  this.fillStyle   = '#68aeba';
-  this.mainTextColor = '#f0d543';
-  this.shape       = VertexCircleShape;
-  this.upTextColor = '#68aeba';
-  this.commonTextPosition = CommonTextCenter;
-
-  this.baseStyles = [];
-}
-
-CommonVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
-
 function CommonPrintVertexStyle()
 {
   BaseVertexStyle.apply(this, arguments);
@@ -109,71 +91,6 @@ function CommonPrintVertexStyle()
 
 CommonPrintVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
 
-// Selected style of Graphs.
-function SelectedVertexStyle0()
-{
-	BaseVertexStyle.apply(this, arguments);
-
-	this.strokeStyle = '#f0d543';
-	this.mainTextColor  = '#f0d543';
-	this.fillStyle   = '#c7627a';
-
-	this.baseStyles.push("common");
-}
-
-SelectedVertexStyle0.prototype = Object.create(BaseVertexStyle.prototype);
-
-function SelectedVertexStyle1()
-{
-	BaseVertexStyle.apply(this, arguments);
-
-	this.strokeStyle = '#7a9ba0';
-	this.mainTextColor  = '#c3d2d5';
-	this.fillStyle   = '#534641';
-
-	this.baseStyles.push("selected");
-}
-
-SelectedVertexStyle1.prototype = Object.create(BaseVertexStyle.prototype);
-
-function SelectedVertexStyle2()
-{
-	BaseVertexStyle.apply(this, arguments);
-
-	this.strokeStyle = '#8C4C86';
-	this.mainTextColor  = '#dbbdd8';
-	this.fillStyle   = '#253267';
-
-	this.baseStyles.push("selected");
-}
-
-SelectedVertexStyle2.prototype = Object.create(BaseVertexStyle.prototype);
-
-function SelectedVertexStyle3()
-{
-	BaseVertexStyle.apply(this, arguments);
-
-	this.strokeStyle = '#6188FF';
-	this.mainTextColor  = '#6188FF';
-	this.fillStyle   = '#E97CF9';
-
-	this.baseStyles.push("selected");
-}
-
-SelectedVertexStyle3.prototype = Object.create(BaseVertexStyle.prototype);
-
-function SelectedVertexStyle4()
-{
-	BaseVertexStyle.apply(this, arguments);
-
-	this.strokeStyle = '#C6B484';
-	this.mainTextColor  = '#C6B484';
-	this.fillStyle   = '#E0DEE1';
-
-	this.baseStyles.push("selected");
-}
-
-SelectedVertexStyle4.prototype = Object.create(BaseVertexStyle.prototype);
 
 function SelectedPrintVertexStyle()
 {
@@ -188,8 +105,3 @@ function SelectedPrintVertexStyle()
 
 SelectedPrintVertexStyle.prototype = Object.create(BaseVertexStyle.prototype);
 
-var DefaultSelectedGraphStyles = [new SelectedVertexStyle0(), new SelectedVertexStyle1(),
-	new SelectedVertexStyle2(), new SelectedVertexStyle3(), new SelectedVertexStyle4()];
-
-var DefaultPrintSelectedGraphStyles = [new SelectedPrintVertexStyle()];
-