@vnejs/plugins.canvas.layer 0.1.1

package/const/const.js

@@ -0,0 +1,11 @@
+export const QUALITIES = { UHD: "2160p", QHD: "1440p", FHD: "1080p", HDp: "900p", HD: "720p", qHD: "540p", nHD: "360p" };
+
+export const SCREEN_SIZES = {
+  [QUALITIES.UHD]: { width: 3840, height: 2160 },
+  [QUALITIES.QHD]: { width: 2560, height: 1440 },
+  [QUALITIES.FHD]: { width: 1920, height: 1080 },
+  [QUALITIES.HDp]: { width: 1600, height: 900 },
+  [QUALITIES.HD]: { width: 1280, height: 720 },
+  [QUALITIES.qHD]: { width: 960, height: 540 },
+  [QUALITIES.nHD]: { width: 640, height: 360 },
+};

package/const/events.js

@@ -0,0 +1,18 @@
+export const SUBSCRIBE_EVENTS = {
+  SHOW: "vne:layer:show",
+  HIDE: "vne:layer:hide",
+  UPDATE: "vne:layer:update",
+  FORCE_UPDATE: "vne:layer:force_update",
+
+  CHILD_RM: "vne:layer:child_rm",
+  CHILDS_RM: "vne:layer:childs_rm",
+
+  CHILD_ADD: "vne:layer:child_add",
+
+  CHILD_CHANGE: "vne:layer:child_change",
+  CHILDS_CHANGE: "vne:layer:childs_change",
+
+  CHILD_GET: "vne:layer:child_get",
+
+  STATE_GET: "vne:layer:state_get",
+};

package/const/params.js

@@ -0,0 +1 @@
+export const DEFAULT_QUALITY = "1080p";

package/const/settings.js

@@ -0,0 +1,5 @@
+export const SETTINGS_KEYS = {
+  WIDTH: "vne:canvas:width",
+  HEIGHT: "vne:canvas:height",
+  QUALITY: "vne:canvas:quality",
+};

package/index.js

@@ -0,0 +1,10 @@
+import { regPlugin } from "@vnejs/shared";
+
+import * as constants from "./const/const";
+import { SUBSCRIBE_EVENTS } from "./const/events";
+import * as params from "./const/params";
+import { SETTINGS_KEYS } from "./const/settings";
+
+import { LayerQuality } from "./modules/quality";
+
+regPlugin("LAYER", { constants, events: SUBSCRIBE_EVENTS, params, settings: SETTINGS_KEYS }, [LayerQuality]);

package/modules/quality.js

@@ -0,0 +1,31 @@
+import { Module } from "@vnejs/module";
+
+export class LayerQuality extends Module {
+  name = "layer.quality";
+
+  subscribe = () => {
+    this.on(this.EVENTS.SETTINGS.CHANGED, this.onSettingChange);
+  };
+
+  init = async () => {
+    const options = Object.values(this.CONST.LAYER.QUALITIES);
+
+    await this.emit(this.EVENTS.SETTINGS.INIT, { name: this.SETTINGS.LAYER.QUALITY, value: this.PARAMS.LAYER.DEFAULT_QUALITY, options });
+
+    return this.setNewSizes(this.CONST.LAYER.SCREEN_SIZES[this.shared.settings[this.SETTINGS.LAYER.QUALITY]]);
+  };
+
+  onSettingChange = ({ name, value } = {}) => name === this.SETTINGS.LAYER.QUALITY && this.setNewSizes(this.CONST.LAYER.SCREEN_SIZES[value]);
+
+  setNewSizes = ({ width, height } = {}) => {
+    document.documentElement.style.setProperty("--vne-canvas-width", `${width}px`);
+    document.documentElement.style.setProperty("--vne-canvas-height", `${height}px`);
+
+    return Promise.all([
+      this.emit(this.EVENTS.SETTINGS.SET, { name: this.SETTINGS.LAYER.WIDTH, value: width }),
+      this.emit(this.EVENTS.SETTINGS.SET, { name: this.SETTINGS.LAYER.HEIGHT, value: height }),
+    ]).then(this.emitMemoryClear);
+  };
+
+  emitMemoryClear = () => this.emit(this.EVENTS.MEMORY.CLEAR, { isForceClear: true });
+}

package/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@vnejs/plugins.canvas.layer",
+  "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": ""
+}