npm - create-jsview - Versions diffs - 2.1.367-test.0 → 2.1.428 - Mend

create-jsview 2.1.367-test.0 → 2.1.428

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (264) hide show

package/template-vue-vite/dist-test-jsview-chunk/index.html ADDED Viewed

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <link rel="shortcut icon" href="#" />
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>JsView-Vue App</title>
+    <script type="module" crossorigin src="./js/main.jsv.51a0d4f8.mjs"></script>
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>

package/template-vue-vite/dist-test-jsview-chunk/js/App.0020360a.js ADDED Viewed

@@ -0,0 +1,141 @@
+import { u as useFocusHub, a5 as JsvSwiper, E as EdgeDirection } from "./jsview-vue-entry.415721d8.js";
+import { t as onMounted, o as openBlock, e as createElementBlock, k as createVNode, l as withCtx, f as createBaseVNode, G as toDisplayString, u as unref, g as normalizeStyle } from "./vue.889a9b8b.js";
+import "./jsview-forge-define.bfab260e.js";
+import "./jsview-dom-entry.280f04b1.js";
+import "./export-sfc.2749ebea.js";
+const _sfc_main = {
+  __name: "App",
+  setup(__props) {
+    const focusHub = useFocusHub();
+    function randomColor() {
+      let randomColor2 = Math.round(Math.random() * 2 ** 24).toString(16);
+      return "#" + new Array(6 - randomColor2.length).fill("0").join("") + randomColor2;
+    }
+    let data = [];
+    for (let i = 0; i < 10; i++) {
+      data.push({
+        width: 400,
+        height: 300,
+        index: i,
+        backgroundColor: randomColor()
+      });
+    }
+    const swiper1 = {
+      onChange: (currentId) => {
+        console.log("swiper1: onChange", currentId);
+      },
+      onClick: (currentId) => {
+        console.log("swiper1: onClick", currentId);
+      },
+      onEdge: (info) => {
+        if (info.direction == EdgeDirection.bottom) {
+          focusHub.setFocus("mySwiper2");
+        }
+      }
+    };
+    const swiper2 = {
+      onChange: (currentId) => {
+        console.log("swiper2: onChange", currentId);
+      },
+      onClick: (currentId) => {
+        console.log("swiper2: onClick", currentId);
+      },
+      onEdge: (info) => {
+        if (info.direction == EdgeDirection.top) {
+          focusHub.setFocus("mySwiper1");
+        }
+      }
+    };
+    onMounted(() => {
+      focusHub.setFocus("mySwiper1");
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        createVNode(unref(JsvSwiper), {
+          name: "mySwiper1",
+          ref: "mySwiper1",
+          totalFrame: unref(data).length,
+          layoutInfo: {
+            left: 50,
+            top: 50,
+            width: 400,
+            height: 200
+          },
+          animation: {
+            duration: 300,
+            easing: "linear"
+          },
+          autoplayInterval: 1e3,
+          onChange: swiper1.onChange,
+          onClick: swiper1.onClick,
+          onEdge: swiper1.onEdge
+        }, {
+          itemView: withCtx(({ dataIndex, focused }) => [
+            createBaseVNode("div", {
+              style: normalizeStyle({
+                width: unref(data)[dataIndex].width,
+                height: unref(data)[dataIndex].height,
+                backgroundColor: unref(data)[dataIndex].backgroundColor,
+                fontSize: 40,
+                color: focused ? "#FF0000" : "#FFFFFF"
+              })
+            }, toDisplayString(unref(data)[dataIndex].index), 5)
+          ]),
+          _: 1
+        }, 8, ["totalFrame", "onChange", "onClick", "onEdge"]),
+        createVNode(unref(JsvSwiper), {
+          name: "mySwiper2",
+          ref: "mySwiper2",
+          totalFrame: unref(data).length,
+          layoutInfo: {
+            left: 50,
+            top: 300,
+            width: 400,
+            height: 200
+          },
+          animation: {
+            duration: 300,
+            easing: "linear"
+          },
+          autoplayInterval: 1e3,
+          onChange: swiper2.onChange,
+          onClick: swiper2.onClick,
+          onEdge: swiper2.onEdge,
+          reverseSwipe: true,
+          dotSize: 20,
+          disableLoopWhenFocus: true,
+          smoothTranslate: true
+        }, {
+          itemView: withCtx(({ dataIndex, focused }) => [
+            createBaseVNode("div", {
+              style: normalizeStyle({
+                width: unref(data)[dataIndex].width,
+                height: unref(data)[dataIndex].height,
+                backgroundColor: unref(data)[dataIndex].backgroundColor,
+                fontSize: 40,
+                color: focused ? "#FF0000" : "#FFFFFF"
+              })
+            }, toDisplayString(unref(data)[dataIndex].index), 5)
+          ]),
+          indicatorDot: withCtx(({ dataIndex, currentIndex }) => [
+            createBaseVNode("div", {
+              style: normalizeStyle({
+                width: 20,
+                height: 20,
+                backgroundColor: dataIndex == currentIndex ? "rgba(100, 100, 100, 0.7)" : "#ff0000",
+                borderRadius: 10
+              })
+            }, null, 4)
+          ]),
+          _: 1
+        }, 8, ["totalFrame", "onChange", "onClick", "onEdge"])
+      ]);
+    };
+  }
+};
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=http://localhost:57245/map/App.0020360a.js.map
+/*jsvmd5:32d53e2ba6e9d1006257a272aa094b4d*/

package/template-vue-vite/dist-test-jsview-chunk/js/App.073cedd6.js ADDED Viewed

@@ -0,0 +1,399 @@
+import { u as useFocusHub, p as LineType, a as useRouter, c as bridge, q as JsvGrid, E as EdgeDirection } from "./jsview-vue-entry.415721d8.js";
+import { a as ref, o as openBlock, e as createElementBlock, F as Fragment, m as renderList, g as normalizeStyle, u as unref, f as createBaseVNode, G as toDisplayString, s as shallowRef, b as resolveComponent, A as createBlock, l as withCtx, t as onMounted, k as createVNode } from "./vue.889a9b8b.js";
+import "./jsview-forge-define.bfab260e.js";
+import "./jsview-dom-entry.280f04b1.js";
+import "./export-sfc.2749ebea.js";
+const _sfc_main$3 = {
+  __name: "Item",
+  props: {
+    userData: Object,
+    widgetData: Object,
+    onAction: Object
+  },
+  setup(__props) {
+    const props = __props;
+    const focused = ref(false);
+    const divNumber = new Array(50);
+    const onFocus = () => {
+      focused.value = true;
+    };
+    const onBlur = () => {
+      focused.value = false;
+    };
+    const onClick = () => {
+      console.log("item onclick ", props.userData);
+    };
+    props.onAction.register("onFocus", onFocus);
+    props.onAction.register("onBlur", onBlur);
+    props.onAction.register("onClick", onClick);
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(divNumber), (item, index) => {
+          return openBlock(), createElementBlock("div", {
+            key: index,
+            style: normalizeStyle({
+              left: 2 * index,
+              width: 2,
+              height: 50,
+              backgroundColor: "#007788"
+            })
+          }, null, 4);
+        }), 128)),
+        createBaseVNode("div", { style: {
+          width: 100,
+          height: 50,
+          fontSize: 30,
+          color: "#FFFFFF",
+          whiteSpace: "nowrap"
+        } }, toDisplayString(__props.userData.content), 1),
+        createBaseVNode("div", {
+          style: normalizeStyle({
+            visibility: focused.value ? "visible" : "hidden",
+            width: 20,
+            height: 20,
+            backgroundColor: "#FF0000"
+          })
+        }, null, 4),
+        createBaseVNode("div", {
+          style: normalizeStyle({
+            visibility: !focused.value && __props.widgetData.selected ? "visible" : "hidden",
+            left: 50,
+            width: 20,
+            height: 20,
+            backgroundColor: "#00FF00"
+          })
+        }, null, 4)
+      ], 64);
+    };
+  }
+};
+const _sfc_main$2 = {
+  __name: "ButtonBlock",
+  props: {
+    userData: Object,
+    name: String
+  },
+  setup(__props, { expose }) {
+    const props = __props;
+    let focusIndex = ref(0);
+    let focused = ref(false);
+    let divNumber = new Array(25);
+    let focusBlock = shallowRef(null);
+    const _onFocus = () => {
+      console.log("button onfocus", props.userData);
+      focused.value = true;
+    };
+    const _onBlur = () => {
+      focused.value = false;
+      focusIndex.value = 0;
+    };
+    const _onKeyDown = (ev) => {
+      console.log("button onkeydown");
+      if (ev.keyCode == 37 && focusIndex.value == 1) {
+        focusIndex.value = 0;
+        return true;
+      } else if (ev.keyCode == 39 && focusIndex.value == 0) {
+        focusIndex.value = 1;
+        return true;
+      } else if (ev.keyCode == 13) {
+        console.log("button click", props.userData);
+        return true;
+      }
+      return false;
+    };
+    const getFocusBlock = () => {
+      return focusBlock.value;
+    };
+    const _MapColor = (color_num) => {
+      return color_num < 10 || color_num >= 100 ? "0" + color_num % 10 : "" + color_num % 100;
+    };
+    expose({
+      getFocusBlock
+    });
+    return (_ctx, _cache) => {
+      const _component_jsv_focus_block = resolveComponent("jsv-focus-block");
+      return openBlock(), createBlock(_component_jsv_focus_block, {
+        ref_key: "focusBlock",
+        ref: focusBlock,
+        name: __props.name,
+        onAction: {
+          onFocus: _onFocus,
+          onBlur: _onBlur,
+          onKeyDown: _onKeyDown
+        }
+      }, {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(divNumber), (item, index) => {
+            return openBlock(), createElementBlock("div", {
+              key: index + "_l",
+              style: normalizeStyle({
+                left: 2 * index,
+                width: 2,
+                height: 50,
+                backgroundColor: "#77" + _MapColor(index) + _MapColor(index)
+              })
+            }, null, 4);
+          }), 128)),
+          createBaseVNode("div", { style: {
+            width: 50,
+            height: 50,
+            fontSize: 20,
+            color: "#FFFFFF"
+          } }, toDisplayString(__props.userData.name), 1),
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(divNumber), (item, index) => {
+            return openBlock(), createElementBlock("div", {
+              key: index + "_r",
+              style: normalizeStyle({
+                left: 2 * index + 50,
+                width: 2,
+                height: 50,
+                backgroundColor: "#" + _MapColor(__props.userData.baseColor) + _MapColor(index) + _MapColor(index)
+              })
+            }, null, 4);
+          }), 128)),
+          createBaseVNode("div", {
+            style: normalizeStyle({
+              visibility: unref(focused) ? "visible" : "hidden",
+              left: 50 * unref(focusIndex),
+              width: 10,
+              height: 10,
+              backgroundColor: "#FF0000"
+            })
+          }, null, 4)
+        ]),
+        _: 1
+      }, 8, ["name", "onAction"]);
+    };
+  }
+};
+const _sfc_main$1 = {
+  __name: "FocusItem",
+  props: {
+    userData: Object,
+    widgetData: Object,
+    onAction: Object
+  },
+  setup(__props) {
+    const props = __props;
+    const focusHub = useFocusHub();
+    const button = shallowRef(null);
+    const onFocus = () => {
+      focusHub.setFocus(props.widgetData.gridIndex + "_item");
+    };
+    const onBlur = () => {
+    };
+    props.onAction.register("onFocus", onFocus);
+    props.onAction.register("onBlur", onBlur);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$2, {
+        ref_key: "button",
+        ref: button,
+        name: __props.widgetData.gridIndex + "_item",
+        userData: __props.userData
+      }, null, 8, ["name", "userData"]);
+    };
+  }
+};
+const _sfc_main = {
+  __name: "App",
+  setup(__props) {
+    const lineType = new LineType(1, 3);
+    const name1 = "updatePage1";
+    const name2 = "updatePage2";
+    const widget1 = shallowRef(null);
+    const widget2 = shallowRef(null);
+    const router = useRouter();
+    const focusHub = useFocusHub();
+    const _provideData1 = () => {
+      let data = [];
+      for (let i = 0; i < 113; i++) {
+        data.push({
+          content: i + "_CCCCCCCCCCCCCCCCCCCCCCC"
+        });
+      }
+      return data;
+    };
+    const _provideData2 = () => {
+      let data2 = [];
+      for (let i = 0; i < 113; i++) {
+        data2.push({
+          name: i + "_D",
+          baseColor: i
+        });
+      }
+      return data2;
+    };
+    const _provideData3 = () => {
+      return [];
+    };
+    const _onEdge1 = (info) => {
+      if (info.direction == EdgeDirection.right) {
+        focusHub.setFocus(name2);
+      }
+    };
+    const _onEdge2 = (info) => {
+      if (info.direction == EdgeDirection.left) {
+        focusHub.setFocus(name1);
+      }
+    };
+    const _onKeyDown = (ev) => {
+      console.log("app onkeydown");
+      if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 1e4) {
+        router.go(-1);
+      }
+      return true;
+    };
+    onMounted(() => {
+      bridge.notifyPageLoaded();
+      focusHub.setFocus(name2);
+    });
+    return (_ctx, _cache) => {
+      const _component_jsv_focus_block = resolveComponent("jsv-focus-block");
+      return openBlock(), createBlock(_component_jsv_focus_block, {
+        autoFocus: "",
+        onAction: {
+          onKeyDown: _onKeyDown
+        },
+        style: {
+          width: 1280,
+          height: 720,
+          backgroundColor: "#004444"
+        }
+      }, {
+        default: withCtx(() => [
+          createVNode(unref(JsvGrid), {
+            ref_key: "widget1",
+            ref: widget1,
+            name: name1,
+            left: 50,
+            top: 50,
+            provideData: _provideData1,
+            row: 4,
+            column: 5,
+            itemSize: {
+              width: 100,
+              height: 50
+            },
+            gapInfo: {
+              row: 10,
+              column: 10
+            },
+            verticalUpdate: true,
+            columnFirst: true,
+            onEdge: _onEdge1,
+            initFocusId: 21,
+            loopUpdate: true
+          }, {
+            renderItem: withCtx(({ userData, widgetData, onAction }) => [
+              createVNode(_sfc_main$3, {
+                userData,
+                widgetData,
+                onAction
+              }, null, 8, ["userData", "widgetData", "onAction"])
+            ]),
+            _: 1
+          }, 512),
+          createBaseVNode("div", { style: {
+            left: 100,
+            top: 300,
+            width: 300,
+            height: 50,
+            fontSize: 30
+          } }, " 纵向排布, 翻页模式 "),
+          createBaseVNode("div", { style: {
+            left: 600
+          } }, [
+            createVNode(unref(JsvGrid), {
+              ref_key: "widget2",
+              ref: widget2,
+              name: name2,
+              left: 50,
+              top: 50,
+              provideData: _provideData2,
+              row: 4,
+              column: 5,
+              itemSize: {
+                width: 100,
+                height: 50
+              },
+              gapInfo: {
+                row: 10,
+                column: 10
+              },
+              verticalUpdate: false,
+              columnFirst: true,
+              onEdge: _onEdge2,
+              updateType: unref(lineType),
+              initFocusId: 0
+            }, {
+              renderItem: withCtx(({ userData, widgetData, onAction }) => [
+                createVNode(_sfc_main$1, {
+                  userData,
+                  widgetData,
+                  onAction
+                }, null, 8, ["userData", "widgetData", "onAction"])
+              ]),
+              _: 1
+            }, 8, ["updateType"]),
+            createBaseVNode("div", { style: {
+              left: 100,
+              top: 300,
+              width: 300,
+              height: 50,
+              fontSize: 30
+            } }, " 横向排布, 逐行刷新 ")
+          ]),
+          createBaseVNode("div", { style: {
+            top: 500
+          } }, [
+            createVNode(unref(JsvGrid), {
+              ref: "widget3",
+              name: "empty",
+              left: 50,
+              top: 50,
+              provideData: _provideData3,
+              row: 4,
+              column: 5,
+              itemSize: {
+                width: 100,
+                height: 50
+              },
+              gapInfo: {
+                row: 10,
+                column: 10
+              },
+              verticalUpdate: false,
+              columnFirst: true,
+              onEdge: _onEdge2,
+              updateType: unref(lineType),
+              initFocusId: 0
+            }, {
+              renderItem: withCtx(({ userData, widgetData, onAction }) => [
+                createVNode(_sfc_main$3, {
+                  userData,
+                  widgetData,
+                  onAction
+                }, null, 8, ["userData", "widgetData", "onAction"])
+              ]),
+              _: 1
+            }, 8, ["updateType"]),
+            createBaseVNode("div", { style: {
+              left: 100,
+              top: 0,
+              width: 300,
+              height: 50,
+              fontSize: 30
+            } }, " 空数据展示 ")
+          ])
+        ]),
+        _: 1
+      }, 8, ["onAction"]);
+    };
+  }
+};
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=http://localhost:57245/map/App.073cedd6.js.map
+/*jsvmd5:0403997982aa52a1c975f78369afa132*/

package/template-vue-vite/dist-test-jsview-chunk/js/App.0f963d38.js ADDED Viewed

@@ -0,0 +1,95 @@
+import { a as useRouter } from "./jsview-vue-entry.415721d8.js";
+import { b as resolveComponent, o as openBlock, A as createBlock, a as ref, e as createElementBlock, k as createVNode, f as createBaseVNode, G as toDisplayString, F as Fragment } from "./vue.889a9b8b.js";
+import { r as resImage } from "./pngNoAlphaDemo.fbc58313.js";
+import { a as _export_sfc } from "./export-sfc.2749ebea.js";
+import "./jsview-forge-define.bfab260e.js";
+import "./jsview-dom-entry.280f04b1.js";
+const _sfc_main$1 = {
+  __name: "KeyEventCatcher",
+  setup(__props) {
+    const router = useRouter();
+    const onKeyDown = (ev) => {
+      if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 1e4) {
+        router.go(-1);
+        return true;
+      }
+      return false;
+    };
+    return (_ctx, _cache) => {
+      const _component_jsv_focus_block = resolveComponent("jsv-focus-block");
+      return openBlock(), createBlock(_component_jsv_focus_block, {
+        autoFocus: "",
+        onKeyDown
+      });
+    };
+  }
+};
+await import("./index.f76869d4.js");
+const _sfc_main = {
+  components: {
+    KeyEventCatcher: _sfc_main$1
+  },
+  data() {
+    const defName = "这是Mock前的本地数据";
+    return {
+      index: 0,
+      defName,
+      name: ref(defName),
+      resImage
+    };
+  },
+  mounted() {
+    setInterval(async () => {
+      this.index = (this.index + 1) % 3;
+      let url = null;
+      switch (this.index) {
+        case 0:
+          this.name = this.defName;
+          break;
+        case 1:
+          url = "/api/testData";
+          break;
+        case 2:
+          url = "http://test.com/api/testData";
+          break;
+      }
+      if (url) {
+        const xhr = new XMLHttpRequest();
+        xhr.open("GET", url);
+        xhr.onload = () => {
+          try {
+            const jsonData = JSON.parse(xhr.responseText);
+            this.name = jsonData.data.name;
+          } catch (ex) {
+            console.error("Failed to get data from mockjs", ex);
+          }
+        };
+        xhr.send();
+      }
+    }, 3e3);
+  }
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_KeyEventCatcher = resolveComponent("KeyEventCatcher");
+  return openBlock(), createElementBlock(Fragment, null, [
+    createVNode(_component_KeyEventCatcher),
+    createBaseVNode("div", { style: {
+      left: 450,
+      top: 200,
+      width: 800,
+      fontSize: 50,
+      color: "#6688FF"
+    } }, toDisplayString($data.name), 1),
+    createBaseVNode("img", {
+      src: $data.resImage,
+      style: { left: 100, top: 100, width: 300 }
+    }, null, 8, ["src"])
+  ], 64);
+}
+const App = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  App as default
+};
+//# sourceMappingURL=http://localhost:57245/map/App.0f963d38.js.map
+/*jsvmd5:a27d783760660654392ace5aa9fa393f*/