tentone 5 年之前
父節點
當前提交
9476dd7e91

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

@@ -1,67 +0,0 @@
-import {Style} from "./Style";
-
-/**
- * Gradient style describes a gradient by its colors, directions origin, type (linear or radial, etc.
- *
- * The get method returns a CanvasGradient https://developer.mozilla.org/en-US/docs/Web/API/CanvasGradient when generated.
- *
- * @class
- * @extends {Style}
- */
-function GradientStyle()
-{
-    /**
-     * Type of gradient can be LINEAR or RADIAL.
-     *
-     * @type {number}
-     */
-    this.type = GradientStyle.LINEAR;
-}
-
-GradientStyle.prototype = Object.create(Style);
-
-/**
- * Linear gradient style, represents a gradient of colors from a point to another interpolating in between.
- *
- * Behind the of the two points used the color is solid.
- *
- * @type {number}
- */
-GradientStyle.LINEAR = 100;
-
-/**
- * Radial gradient interpolates colors from a point all around up to a radius value.
- *
- * Outside of the radius the color is solid.
- *
- * @type {number}
- */
-GradientStyle.RADIAL = 101;
-
-/**
- * Add a new color stop defined by an offset and a color to the gradient.
- *
- * If the offset is not between 0 and 1 inclusive, or if color can't be parsed as a CSS color, an error is raised.
- *
- * @param {number} offset Offset of the color stop between 0 and 1 inclusive.
- * @param {string} color CSS color value.
- */
-GradientStyle.prototype.addColorStop = function(offset, color)
-{
-
-};
-
-GradientStyle.prototype.get = function(context)
-{
-    // context.createLinearGradient()
-    // context.createRadialGradient()
-};
-
-GradientStyle.prototype.serialize = function ()
-{
-    return {
-        type: "Gradient"
-    };
-};
-
-export {GradientStyle};

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

@@ -0,0 +1,46 @@
+import {Style} from "./Style";
+
+/**
+ * Linear gradient style, represents a gradient of colors from a point to another interpolating in between.
+ *
+ * Behind the of the two points used the color is solid.
+ *
+ * The get method returns a CanvasGradient https://developer.mozilla.org/en-US/docs/Web/API/CanvasGradient when generated.
+ *
+ * @class
+ * @extends {Style}
+ */
+function LinearGradientStyle()
+{
+    // TODO <ADD CODE HERE>
+}
+
+LinearGradientStyle.prototype = Object.create(Style);
+
+/**
+ * Add a new color stop defined by an offset and a color to the gradient.
+ *
+ * If the offset is not between 0 and 1 inclusive, or if color can't be parsed as a CSS color, an error is raised.
+ *
+ * @param {number} offset Offset of the color stop between 0 and 1 inclusive.
+ * @param {string} color CSS color value.
+ */
+LinearGradientStyle.prototype.addColorStop = function(offset, color)
+{
+    // TODO <ADD CODE HERE>
+};
+
+LinearGradientStyle.prototype.get = function(context)
+{
+    // TODO <ADD CODE HERE>
+    // return context.createLinearGradient();
+};
+
+LinearGradientStyle.prototype.serialize = function ()
+{
+    return {
+        type: "LinearGradient"
+    };
+};
+
+export {LinearGradientStyle};

+ 54 - 0
source/objects/style/RadialGradientStyle.js

@@ -0,0 +1,54 @@
+import {Style} from "./Style";
+
+/**
+ * Radial gradient interpolates colors from a point all around up to a radius value.
+ *
+ * Outside of the radius the color is solid.
+ *
+ * The get method returns a CanvasGradient https://developer.mozilla.org/en-US/docs/Web/API/CanvasGradient when generated.
+ *
+ * @class
+ * @extends {Style}
+ */
+function RadialGradientStyle()
+{
+    this.start = new Vector2(0, 0);
+
+    this.end = new Vector2(20, 20);
+
+    this.radiusStart = 0;
+
+    this.radiusEnd = 10;
+
+    // TODO <ADD CODE HERE>
+}
+
+RadialGradientStyle.prototype = Object.create(Style);
+
+/**
+ * Add a new color stop defined by an offset and a color to the gradient.
+ *
+ * If the offset is not between 0 and 1 inclusive, or if color can't be parsed as a CSS color, an error is raised.
+ *
+ * @param {number} offset Offset of the color stop between 0 and 1 inclusive.
+ * @param {string} color CSS color value.
+ */
+RadialGradientStyle.prototype.addColorStop = function(offset, color)
+{
+    // TODO <ADD CODE HERE>
+};
+
+RadialGradientStyle.prototype.get = function(context)
+{
+    // TODO <ADD CODE HERE>
+    // return context.createRadialGradient();
+};
+
+RadialGradientStyle.prototype.serialize = function ()
+{
+    return {
+        type: "RadialGradient"
+    };
+};
+
+export {RadialGradientStyle};