@shijiu/jsview-vue 0.9.246 → 0.9.254

package/samples/DemoHomepage/views/Homepage.vue

@@ -1,186 +1,186 @@
-<script>
-import { jJsvRuntimeBridge } from "jsview/utils/JsViewVueTools/JsvRuntimeBridge";
-import { EdgeDirection } from "jsview/utils/JsViewEngineWidget";
-import TabFrame from "../components/TabFrame.vue";
-import BodyFrame from "../components/BodyFrame.vue";
-import Dialog from "../components/Dialog.vue";
-import { routeList } from "../router.js";
-
-const colorTemplete = ["#89BEB2", "#C9BA83", "#DED38C", "#DE9C53"];
-
-const featureData = [];
-const sceneData = [];
-for (let item of routeList) {
-  let obj = {
-    name: item.name,
-    path: item.path,
-    width: 300,
-    height: 100,
-    focusable: true,
-  };
-  if (item.path.indexOf("feature") >= 0) {
-    obj.backgroundColor = colorTemplete[featureData.length % 4];
-    featureData.push(obj);
-  } else if (item.path.indexOf("scene") >= 0) {
-    obj.backgroundColor = colorTemplete[sceneData.length % 4];
-    sceneData.push(obj);
-  }
-}
-const dataList = [featureData, sceneData];
-
-export default {
-  components: {
-    TabFrame,
-    Dialog,
-    BodyFrame,
-  },
-  data() {
-    return {
-      showExitDialog: false,
-      contentData: dataList[0],
-      tabId: 0,
-      preFocusName: "",
-      curFocusName: "",
-    };
-  },
-  setup() {
-    return {
-      name: "/home",
-    };
-  },
-  computed: {
-    address() {
-      return window.localStorage.href;
-    },
-  },
-  methods: {
-    onFocus() {
-      this.changeFocus(this.name + "/bodyFrame");
-    },
-    onKeyDown(ev) {
-      // 处理返回键
-      if (
-        ev.keyCode == 8 || // Backspace
-        ev.keyCode == 27 || // Escape
-        ev.keyCode == 10000 // 盒子返回键
-      ) {
-        this.showExitDialog = !this.showExitDialog;
-        if (!this.showExitDialog) {
-          this.changeFocus(this.preFocusName);
-        } else {
-          this.preFocusName = this.curFocusName;
-          this.curFocusName = this.name + "/exitDialog";
-        }
-      }
-      return true;
-    },
-    changeFocus(name) {
-      this.preFocusName = this.curFocusName;
-      this.curFocusName = name;
-      this.$refs.rootNode.findBlockByName(name).requestFocus();
-    },
-    onTabEdge(edgeInfo) {
-      if (edgeInfo.direction === EdgeDirection.bottom) {
-        this.changeFocus(this.name + "/bodyFrame");
-      }
-    },
-    onContentEdge(edgeInfo) {
-      if (edgeInfo.direction === EdgeDirection.top) {
-        this.changeFocus(this.name + "/tabFrame");
-      }
-    },
-    tabItemFocus(data) {
-      if (data.id != this.tabId) {
-        this.tabId = data.id;
-        this.contentData = dataList[this.tabId];
-      }
-    },
-    onDialogAction(msg) {
-      console.log("cchtes dialog onaction", msg);
-      this.showExitDialog = false;
-      this.changeFocus(this.preFocusName);
-      switch (msg) {
-        case "ok":
-          jJsvRuntimeBridge.closePage();
-          // if (!window.JsView) {
-          //   // 浏览器调试
-          //   window.location.href = "about:blank";
-          // }
-          break;
-        case "back":
-        case "cancel":
-          break;
-      }
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="rootSize">
-    <div class="address">
-      {{ address }}
-    </div>
-    <div class="logo">JsView-Vue3</div>
-
-    <jsv-focus-block
-      autoFocus
-      ref="rootNode"
-      :onAction="{
-        onKeyDown: onKeyDown,
-        onFocus: onFocus,
-      }"
-    >
-      <div :style="{ left: 10 }">
-        <tab-frame
-          :name="name + '/tabFrame'"
-          :onEdge="onTabEdge"
-          :itemFocus="tabItemFocus"
-        />
-      </div>
-
-      <div
-        :style="{
-          left: 10,
-          top: 100,
-        }"
-      >
-        <body-frame
-          :data="contentData"
-          :name="name + '/bodyFrame'"
-          :onEdge="onContentEdge"
-        />
-      </div>
-
-      <Dialog
-        v-if="showExitDialog"
-        :name="name + '/exitDialog'"
-        :onAction="onDialogAction"
-      />
-    </jsv-focus-block>
-  </div>
-</template>
-
-<style scoped>
-.rootSize {
-  width: 1920;
-  height: 1080;
-  background-color: #334c4c;
-}
-
-.address {
-  width: 1280;
-  height: 30;
-  color: #ffffff;
-  font-size: 20px;
-}
-
-.logo {
-  width: 1280;
-  height: 30;
-  color: #00ff00;
-  font-size: 20px;
-  font-weight: bold;
-  text-align: right;
-}
-</style>
+<script>
+import { jJsvRuntimeBridge } from "jsview/utils/JsViewVueTools/JsvRuntimeBridge";
+import { EdgeDirection } from "jsview/utils/JsViewEngineWidget";
+import TabFrame from "../components/TabFrame.vue";
+import BodyFrame from "../components/BodyFrame.vue";
+import Dialog from "../components/Dialog.vue";
+import { routeList } from "../router.js";
+
+const colorTemplete = ["#89BEB2", "#C9BA83", "#DED38C", "#DE9C53"];
+
+const featureData = [];
+const sceneData = [];
+for (let item of routeList) {
+  let obj = {
+    name: item.name,
+    path: item.path,
+    width: 300,
+    height: 100,
+    focusable: true,
+  };
+  if (item.path.indexOf("feature") >= 0) {
+    obj.backgroundColor = colorTemplete[featureData.length % 4];
+    featureData.push(obj);
+  } else if (item.path.indexOf("scene") >= 0) {
+    obj.backgroundColor = colorTemplete[sceneData.length % 4];
+    sceneData.push(obj);
+  }
+}
+const dataList = [featureData, sceneData];
+
+export default {
+  components: {
+    TabFrame,
+    Dialog,
+    BodyFrame,
+  },
+  data() {
+    return {
+      showExitDialog: false,
+      contentData: dataList[0],
+      tabId: 0,
+      preFocusName: "",
+      curFocusName: "",
+    };
+  },
+  setup() {
+    return {
+      name: "/home",
+    };
+  },
+  computed: {
+    address() {
+      return window.localStorage.href;
+    },
+  },
+  methods: {
+    onFocus() {
+      this.changeFocus(this.name + "/bodyFrame");
+    },
+    onKeyDown(ev) {
+      // 处理返回键
+      if (
+        ev.keyCode == 8 || // Backspace
+        ev.keyCode == 27 || // Escape
+        ev.keyCode == 10000 // 盒子返回键
+      ) {
+        this.showExitDialog = !this.showExitDialog;
+        if (!this.showExitDialog) {
+          this.changeFocus(this.preFocusName);
+        } else {
+          this.preFocusName = this.curFocusName;
+          this.curFocusName = this.name + "/exitDialog";
+        }
+      }
+      return true;
+    },
+    changeFocus(name) {
+      this.preFocusName = this.curFocusName;
+      this.curFocusName = name;
+      this.$refs.rootNode.findBlockByName(name).requestFocus();
+    },
+    onTabEdge(edgeInfo) {
+      if (edgeInfo.direction === EdgeDirection.bottom) {
+        this.changeFocus(this.name + "/bodyFrame");
+      }
+    },
+    onContentEdge(edgeInfo) {
+      if (edgeInfo.direction === EdgeDirection.top) {
+        this.changeFocus(this.name + "/tabFrame");
+      }
+    },
+    tabItemFocus(data) {
+      if (data.id != this.tabId) {
+        this.tabId = data.id;
+        this.contentData = dataList[this.tabId];
+      }
+    },
+    onDialogAction(msg) {
+      console.log("cchtes dialog onaction", msg);
+      this.showExitDialog = false;
+      this.changeFocus(this.preFocusName);
+      switch (msg) {
+        case "ok":
+          jJsvRuntimeBridge.closePage();
+          // if (!window.JsView) {
+          //   // 浏览器调试
+          //   window.location.href = "about:blank";
+          // }
+          break;
+        case "back":
+        case "cancel":
+          break;
+      }
+    },
+  },
+};
+</script>
+
+<template>
+  <div class="rootSize">
+    <div class="address">
+      {{ address }}
+    </div>
+    <div class="logo">JsView-Vue3</div>
+
+    <jsv-focus-block
+      autoFocus
+      ref="rootNode"
+      :onAction="{
+        onKeyDown: onKeyDown,
+        onFocus: onFocus,
+      }"
+    >
+      <div :style="{ left: 10 }">
+        <tab-frame
+          :name="name + '/tabFrame'"
+          :onEdge="onTabEdge"
+          :itemFocus="tabItemFocus"
+        />
+      </div>
+
+      <div
+        :style="{
+          left: 10,
+          top: 100,
+        }"
+      >
+        <body-frame
+          :data="contentData"
+          :name="name + '/bodyFrame'"
+          :onEdge="onContentEdge"
+        />
+      </div>
+
+      <Dialog
+        v-if="showExitDialog"
+        :name="name + '/exitDialog'"
+        :onAction="onDialogAction"
+      />
+    </jsv-focus-block>
+  </div>
+</template>
+
+<style scoped>
+.rootSize {
+  width: 1920;
+  height: 1080;
+  background-color: #334c4c;
+}
+
+.address {
+  width: 1280;
+  height: 30;
+  color: #ffffff;
+  font-size: 20px;
+}
+
+.logo {
+  width: 1280;
+  height: 30;
+  color: #00ff00;
+  font-size: 20px;
+  font-weight: bold;
+  text-align: right;
+}
+</style>

package/samples/FlipCard/App.vue

@@ -1,80 +1,80 @@
-<script>
-import {
-  HORIZONTAL,
-  SimpleWidget,
-} from "jsview/utils/JsViewEngineWidget";
-import FlipCard from "./FlipCard.vue";
-import { data } from "./data.js";
-import redEgg from "./assets/red_egg.png";
-import blueEgg from "./assets/blue_egg.png";
-export default {
-  components: { SimpleWidget, FlipCard },
-  setup() {
-    return {
-      name: "/flipCard",
-      flipCardData: data,
-      direction: HORIZONTAL,
-      redEgg,
-      blueEgg,
-    };
-  },
-  methods: {
-    onKeyDown(ev) {
-      // 8:Backspace, 27:Escape, 10000:盒子返回键
-      if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
-        this.$router?.go(-1); // 有router时，是从DemoHomepage进入，回退
-        return true;
-      }
-
-      return false;
-    },
-    measures(item) {
-      return {
-        width: item.blocks.w,
-        height: item.blocks.h,
-        focusable: item.focusable,
-        hasSub: item.hasSub,
-      };
-    },
-    onFocus() {
-      this.$refs.focusNode.findBlockByName(this.name).requestFocus();
-    },
-  },
-};
-</script>
-<template>
-  <jsv-focus-block
-    ref="focusNode"
-    autoFocus
-    :onAction="{
-      onKeyDown: onKeyDown,
-      onFocus: onFocus,
-    }"
-  >
-    <simple-widget
-      :name="name"
-      :width="1280"
-      :height="720"
-      :padding="{ left: 50, top: 100, right: 20, bottom: 20 }"
-      :data="flipCardData"
-      :direction="direction"
-      :measures="measures"
-    >
-      <template #renderItem="{ data, query, onEdge, onAction }">
-        <FlipCard
-          :data="data"
-          :query="query"
-          :onEdge="onEdge"
-          :onAction="onAction"
-          :width="191"
-          :height="252"
-          :backImg="redEgg"
-          :foreImg="blueEgg"
-          :perspective="300"
-          :initFlipped="false"
-          :name="name + '/' + data.id"
-        />
-      </template>
-    </simple-widget>
-  </jsv-focus-block>
-</template>
+<script>
+import {
+  HORIZONTAL,
+  SimpleWidget,
+} from "jsview/utils/JsViewEngineWidget";
+import FlipCard from "./FlipCard.vue";
+import { data } from "./data.js";
+import redEgg from "./assets/red_egg.png";
+import blueEgg from "./assets/blue_egg.png";
+export default {
+  components: { SimpleWidget, FlipCard },
+  setup() {
+    return {
+      name: "/flipCard",
+      flipCardData: data,
+      direction: HORIZONTAL,
+      redEgg,
+      blueEgg,
+    };
+  },
+  methods: {
+    onKeyDown(ev) {
+      // 8:Backspace, 27:Escape, 10000:盒子返回键
+      if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
+        this.$router?.go(-1); // 有router时，是从DemoHomepage进入，回退
+        return true;
+      }
+
+      return false;
+    },
+    measures(item) {
+      return {
+        width: item.blocks.w,
+        height: item.blocks.h,
+        focusable: item.focusable,
+        hasSub: item.hasSub,
+      };
+    },
+    onFocus() {
+      this.$refs.focusNode.findBlockByName(this.name).requestFocus();
+    },
+  },
+};
+</script>
+<template>
+  <jsv-focus-block
+    ref="focusNode"
+    autoFocus
+    :onAction="{
+      onKeyDown: onKeyDown,
+      onFocus: onFocus,
+    }"
+  >
+    <simple-widget
+      :name="name"
+      :width="1280"
+      :height="720"
+      :padding="{ left: 50, top: 100, right: 20, bottom: 20 }"
+      :data="flipCardData"
+      :direction="direction"
+      :measures="measures"
+    >
+      <template #renderItem="{ data, query, onEdge, onAction }">
+        <FlipCard
+          :data="data"
+          :query="query"
+          :onEdge="onEdge"
+          :onAction="onAction"
+          :width="191"
+          :height="252"
+          :backImg="redEgg"
+          :foreImg="blueEgg"
+          :perspective="300"
+          :initFlipped="false"
+          :name="name + '/' + data.id"
+        />
+      </template>
+    </simple-widget>
+  </jsv-focus-block>
+</template>