@vnejs/plugins.canvas.clip 0.1.1

package/const/const.js

@@ -0,0 +1 @@
+export const EXEC_ACTIONS = { SET: "set", UNSET: "unset" };

package/const/events.js

@@ -0,0 +1,4 @@
+export const SUBSCRIBE_EVENTS = {
+  SET: "vne:layer_clip:set",
+  UNSET: "vne:layer_clip:unset",
+};

package/const/params.js

@@ -0,0 +1,4 @@
+export const CLIPS = {
+  ellipse: (width = 50, height = 50, x = 50, y = 50) => `ellipse(${width}vw ${height}vw at ${x}% ${y}%)`,
+  circle: (radius = 50, x = 50, y = 50) => `circle(${radius}vw at ${x}% ${y}%)`,
+};

package/index.js

@@ -0,0 +1,9 @@
+import { regPlugin } from "@vnejs/shared";
+
+import * as constants from "./const/const";
+import { SUBSCRIBE_EVENTS } from "./const/events";
+import * as params from "./const/params";
+
+import { LayerClip } from "./modules/clip";
+
+regPlugin("LAYER_CLIP", { constants, events: SUBSCRIBE_EVENTS, params }, [LayerClip]);

package/modules/clip.js

@@ -0,0 +1,32 @@
+import { Module } from "@vnejs/module";
+
+export class LayerClip extends Module {
+  name = "layer.clip";
+
+  subscribe = () => {
+    this.on(this.EVENTS.LAYER_CLIP.SET, this.onClipSet);
+    this.on(this.EVENTS.LAYER_CLIP.UNSET, this.onClipUnset);
+
+    this.on(this.EVENTS.STATE.SET, this.onStateSet);
+    this.on(this.EVENTS.STATE.CLEAR, this.onStateClear);
+  };
+
+  onClipSet = async ({ layer = "", value = "", name = "", duration = 0, args = [] } = {}) => {
+    this.state[layer] = value || this.PARAMS.LAYER_CLIP.CLIPS[name](...args);
+
+    return this.emitLayerPropsUpdate(layer, this.state[layer], duration);
+  };
+  onClipUnset = async ({ layer = "", duration = 0 } = {}) => {
+    delete this.state[layer];
+
+    return this.emitLayerPropsUpdate(layer, "", duration);
+  };
+
+  onStateSet = async ({ [this.name]: state = {} } = {}) => {
+    await Promise.all(Object.keys(this.state).map((layer) => this.emit(this.EVENTS.LAYER_CLIP.UNSET, { layer, duration: 0 })));
+    await Promise.all(Object.keys(state).map((layer) => this.emit(this.EVENTS.LAYER_CLIP.SET, { layer, value: state[layer], duration: 0 })));
+  };
+  onStateClear = () => Promise.all(Object.keys(this.state).map((layer) => this.emit(this.EVENTS.LAYER_CLIP.UNSET, { layer, duration: 0 })));
+
+  emitLayerPropsUpdate = (layer, clip, duration) => this.emit(this.EVENTS.LAYER.PROPS_UPDATE, { layer, props: { clip }, duration });
+}

package/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@vnejs/plugins.canvas.clip",
+  "version": "0.1.1",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "publish:major:plugin": "npm run publish:major",
+    "publish:minor:plugin": "npm run publish:minor",
+    "publish:patch:plugin": "npm run publish:patch",
+    "publish:major": "npm version major && npm publish --access public",
+    "publish:minor": "npm version minor && npm publish --access public",
+    "publish:patch": "npm version patch && npm publish --access public"
+  },
+  "author": "",
+  "license": "ISC",
+  "description": ""
+}