feat(vector): primitives with toCSSVars method

basics · Apr 7, 2020 · 9e9ec6c · 9e9ec6c
1 parent 7b87f8a
commit 9e9ec6c
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 3 deletions.
diff --git a/src/degree.js b/src/degree.js
@@ -34,7 +34,17 @@ class ADegree {
    * @returns {string}
    */
   toString() {
-    return `${this[ANGLE] * RAD_TO_DEG}deg`;
+    return `{ "angle": ${this[ANGLE]} }`;
+  }
+
+  toCSSVars(name, target) {
+    let prefix = '';
+    if (name) {
+      prefix = `-${name}`;
+    }
+    target = target || {};
+    target[`-${prefix}-angle`] = `${this[ANGLE] * RAD_TO_DEG}deg`;
+    return target;
   }
 }
 

diff --git a/src/point.js b/src/point.js
@@ -175,6 +175,17 @@ class APoint {
     return `{ "x": ${this.x}, "y": ${this.y} }`;
   }
 
+  toCSSVars(name, target) {
+    let prefix = '';
+    if (name) {
+      prefix = `-${name}`;
+    }
+    target = target || {};
+    target[`-${prefix}-x`] = this.x;
+    target[`-${prefix}-y`] = this.y;
+    return target;
+  }
+
   /**
    *
    * @returns {number}

diff --git a/src/quaternion.js b/src/quaternion.js
@@ -4,7 +4,6 @@ import {
   FORWARD, LEFT, RIGHT, UP, Vector, Victor
 } from './vector';
 import { isArray, multQuatVec } from './util';
-import { formatNumber } from './formatter';
 import { cachedFunction } from './operator';
 import { degree, isAngle } from './degree';
 
@@ -264,7 +263,20 @@ class AQuaternion {
    * @returns {string}
    */
   toString() {
-    return `{ x: ${formatNumber(this.x)}, y: ${formatNumber(this.y)}, z: ${formatNumber(this.z)}, w: ${formatNumber(this.w)} }`;
+    return `{ "x": ${this.x}, "y": ${this.y}, "z": ${this.z}, "w": ${this.w} }`;
+  }
+
+  toCSSVars(name, target) {
+    let prefix = '';
+    if (name) {
+      prefix = `-${name}`;
+    }
+    target = target || {};
+    target[`-${prefix}-x`] = this.x;
+    target[`-${prefix}-y`] = this.y;
+    target[`-${prefix}-z`] = this.z;
+    target[`-${prefix}-w`] = this.w;
+    return target;
   }
 }
 

diff --git a/src/vector.js b/src/vector.js
@@ -218,6 +218,18 @@ class AVector {
     return `{ "x": ${this.x}, "y": ${this.y}, "z": ${this.z} }`;
   }
 
+  toCSSVars(name, target) {
+    let prefix = '';
+    if (name) {
+      prefix = `-${name}`;
+    }
+    target = target || {};
+    target[`-${prefix}-x`] = this.x;
+    target[`-${prefix}-y`] = this.y;
+    target[`-${prefix}-z`] = this.z;
+    return target;
+  }
+
   /**
    *
    * @returns {number}