Browse Source

Style serialization

tentone 5 năm trước cách đây
mục cha
commit
7b3f7ed3ca

+ 19 - 0
source/objects/style/GradientStyle.js

@@ -1,4 +1,5 @@
 import {Style} from "./Style";
+import {RadialGradientStyle} from "./RadialGradientStyle";
 
 /**
  * Gradient style is used to represent any type of gradient based style.
@@ -61,4 +62,22 @@ GradientStyle.prototype.addColorStop = function(offset, color)
     this.colors.push(new GradientColorStop(offset, color));
 };
 
+GradientStyle.prototype.serialize = function()
+{
+    return {
+        colors: this.colors
+    };
+};
+
+GradientStyle.prototype.parse = function(data)
+{
+    var colors = [];
+    for(var i = 0; i < data.colors.length; i++)
+    {
+        colors.push(new GradientColorStop(data.colors[i].offset, data.colors[i].color));
+    }
+    this.colors = colors;
+};
+
+
 export {GradientStyle, GradientColorStop};

+ 13 - 0
source/objects/style/LinearGradientStyle.js

@@ -33,8 +33,21 @@ LinearGradientStyle.prototype.serialize = function ()
     };
 };
 
+LinearGradientStyle.prototype.serialize = function ()
+{
+    var data = GradientStyle.prototype.serialize.call(this);
+
+    Object.assign(data, {
+        type: "LinearGradient"
+    });
+
+    return data;
+};
+
 LinearGradientStyle.prototype.parse = function (data)
 {
+    GradientStyle.prototype.parse.call(this, data);
+
     // TODO <ADD CODE HERE>
 };
 

+ 0 - 1
source/objects/style/PatternStyle.js

@@ -1,5 +1,4 @@
 import {Style} from "./Style";
-import {LinearGradientStyle} from "./LinearGradientStyle";
 
 /**
  * Pattern style represents an opaque object describing a pattern, based on an image, a canvas, or a video.

+ 17 - 5
source/objects/style/RadialGradientStyle.js

@@ -54,15 +54,27 @@ RadialGradientStyle.prototype.get = function(context)
 
 RadialGradientStyle.prototype.serialize = function ()
 {
-    return {
-        type: "RadialGradient"
-    };
+    var data = GradientStyle.prototype.serialize.call(this);
+
+    Object.assign(data, {
+        type: "RadialGradient",
+        start: this.start.toArray(),
+        end: this.end.toArray(),
+        startRadius: this.startRadius,
+        endRadius: this.endRadius
+    });
+
+    return data;
 };
 
 RadialGradientStyle.prototype.parse = function (data)
 {
-    // TODO <ADD CODE HERE>
-};
+    GradientStyle.prototype.parse.call(this, data);
 
+    this.start.fromArray(data.start);
+    this.end.fromArray(data.end);
+    this.startRadius = data.startRadius;
+    this.endRadius = data.endRadius;
+};
 
 export {RadialGradientStyle};