@shijiu/jsview-vue 0.9.254 → 0.9.267
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.
- package/dom/bin/package.json +11 -11
- package/dom/browser-root-style.css +21 -21
- package/loader/jsview-main.js +41 -41
- package/loader/jsview.config.default.js +37 -37
- package/loader/jsview.default.config.js +37 -37
- package/package.json +1 -5
- package/samples/AdvanceMetroWidget/App.vue +122 -122
- package/samples/AdvanceMetroWidget/Frame.vue +100 -100
- package/samples/AdvanceMetroWidget/Item.vue +57 -57
- package/samples/AdvanceMetroWidget/data.js +136 -136
- package/samples/AnimPicture/App.vue +223 -223
- package/samples/Basic/App.vue +128 -128
- package/samples/Basic/components/TitleBar.vue +28 -28
- package/samples/Basic/components/anim/AnimGroup.vue +67 -67
- package/samples/Basic/components/anim/AnimKeyframeBasic.vue +101 -101
- package/samples/Basic/components/anim/AnimKeyframeComposite.vue +52 -52
- package/samples/Basic/components/anim/AnimTransition.vue +116 -116
- package/samples/Basic/components/div/DivBackground.vue +14 -14
- package/samples/Basic/components/div/DivClip.vue +80 -80
- package/samples/Basic/components/div/DivCssScoped.vue +26 -26
- package/samples/Basic/components/div/DivCssVar.vue +49 -49
- package/samples/Basic/components/div/DivGroup1.vue +32 -32
- package/samples/Basic/components/div/DivGroup2.vue +40 -40
- package/samples/Basic/components/div/DivLayout.vue +11 -11
- package/samples/Basic/components/div/DivRadius.vue +46 -46
- package/samples/Basic/components/text/TextAlign.vue +47 -47
- package/samples/Basic/components/text/TextFontStyle.vue +57 -57
- package/samples/Basic/components/text/TextGroup.vue +31 -31
- package/samples/Basic/components/text/TextOverflow.vue +77 -77
- package/samples/BasicFocusControl/App.vue +124 -124
- package/samples/BasicFocusControl/components/BaseBlock.vue +50 -50
- package/samples/BasicFocusControl/components/MainArea.vue +97 -97
- package/samples/BasicFocusControl/components/MainAreaLeftBlock.vue +20 -20
- package/samples/BasicFocusControl/components/MainAreaRightBlock.vue +29 -29
- package/samples/BasicFocusControl/components/SideBar.vue +72 -72
- package/samples/BasicFocusControl/components/SideBarBlock.vue +29 -29
- package/samples/ClassNameDemo/App.vue +119 -119
- package/samples/ClassNameDemo/components/ContentItem.vue +252 -252
- package/samples/ClassNameDemo/components/LoadingView.vue +43 -43
- package/samples/ClassNameDemo/components/TitleView.vue +24 -24
- package/samples/ClassNameDemo/data.js +24 -24
- package/samples/ColorSpace/App.vue +134 -134
- package/samples/DemoHomepage/App.vue +31 -31
- package/samples/DemoHomepage/components/BodyFrame.vue +81 -81
- package/samples/DemoHomepage/components/Dialog.vue +93 -93
- package/samples/DemoHomepage/components/Item.vue +76 -76
- package/samples/DemoHomepage/components/TabFrame.vue +86 -86
- package/samples/DemoHomepage/router.js +132 -132
- package/samples/DemoHomepage/views/Homepage.vue +186 -186
- package/samples/FlipCard/App.vue +80 -80
- package/samples/FlipCard/FlipCard.vue +123 -123
- package/samples/FlipCard/data.js +12 -12
- package/samples/FlowMultiWidget/App.vue +90 -90
- package/samples/FlowMultiWidget/components/Block.vue +106 -106
- package/samples/FlowMultiWidget/components/FlowPage.vue +59 -59
- package/samples/FlowMultiWidget/components/Item.vue +102 -102
- package/samples/FlowMultiWidget/components/MenuItem.vue +71 -71
- package/samples/FlowMultiWidget/components/MyMenu.vue +89 -89
- package/samples/FlowMultiWidget/data.js +446 -446
- package/samples/HashHistory/App.vue +124 -124
- package/samples/HashHistory/components/HorizontalButtonList.vue +113 -113
- package/samples/HashHistory/components/Item.vue +73 -73
- package/samples/HashHistory/router.js +29 -29
- package/samples/HashHistory/views/BasePage.vue +18 -18
- package/samples/HashHistory/views/MainPage.vue +67 -67
- package/samples/HashHistory/views/SubPage.vue +78 -78
- package/samples/HashHistory/views/SubPageFirst.vue +9 -9
- package/samples/HashHistory/views/SubPageSecond.vue +9 -9
- package/samples/LongImage/App.vue +96 -96
- package/samples/LongImage/Button.vue +153 -153
- package/samples/LongImage/LongImageScroll.vue +126 -126
- package/samples/LongImage/Scroll.vue +15 -15
- package/samples/LongText/App.vue +111 -111
- package/samples/LongText/Button.vue +153 -153
- package/samples/LongText/LongTextScroll.vue +224 -224
- package/samples/LongText/Scroll.vue +15 -15
- package/samples/Preload/App.vue +145 -145
- package/samples/Preload/data.js +22 -22
- package/samples/Preload/preloadItem.vue +21 -21
- package/samples/QrcodeDemo/App.vue +72 -72
- package/samples/SimpleWidgetDemo/App.vue +203 -203
- package/samples/SimpleWidgetDemo/Item.vue +82 -82
- package/samples/SimpleWidgetDemo/components/ContentItem.vue +411 -411
- package/samples/SimpleWidgetDemo/components/MyTab.vue +116 -116
- package/samples/SimpleWidgetDemo/data.js +110 -110
- package/samples/SprayView/App.vue +269 -269
- package/samples/SpriteImage/App.vue +174 -174
- package/samples/SpriteImage/images/egg_break.json +116 -116
- package/samples/TextBox/App.vue +178 -178
- package/samples/TextBox/RenderCenter.vue +108 -108
- package/samples/TextBox/RenderLeft.vue +108 -108
- package/samples/TextBox/RenderOneLine.vue +119 -119
- package/samples/TextBox/RenderRight.vue +106 -106
- package/samples/TextShadowDemo/App.vue +97 -97
- package/samples/TextureSize/App.vue +141 -141
- package/samples/ThrowMoveDemo/AccelerateDemo.vue +117 -117
- package/samples/ThrowMoveDemo/App.vue +113 -113
- package/samples/ThrowMoveDemo/LRParabolicDemo.vue +115 -115
- package/samples/ThrowMoveDemo/TargetDemo.vue +116 -116
- package/samples/ThrowMoveDemo/UDParabolicDemo.vue +121 -121
- package/samples/TransitPage/App.vue +40 -40
- package/samples/VideoDemo/App.vue +137 -137
- package/samples/VideoDemo/components/Button.vue +68 -68
- package/samples/VideoDemo/components/Controllor.vue +195 -195
- package/samples/VideoDemo/components/VideoFrame.vue +152 -152
- package/scripts/common.js +57 -115
- package/scripts/jsview-install-local-packages.js +73 -73
- package/scripts/jsview-post-build.js +127 -127
- package/scripts/jsview-post-install.js +78 -78
- package/scripts/jsview-run-android.js +64 -64
- package/utils/JsViewEngineWidget/bin/index.js +1 -1
- package/utils/JsViewEngineWidget/bin/package.json +11 -11
- package/utils/JsViewVueTools/JsvHashHistory.js +111 -111
- package/utils/JsViewVueTools/JsvRuntimeBridge.js +417 -417
- package/utils/JsViewVueWidget/BrowserDebugWidget/BrowserPreload.vue +80 -80
- package/utils/JsViewVueWidget/BrowserDebugWidget/BrowserQrcode.vue +147 -147
- package/utils/JsViewVueWidget/BrowserDebugWidget/BrowserSpray.vue +54 -54
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/ApicDataBase.js +28 -28
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/BrowserApic.vue +123 -123
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/GifData.js +83 -83
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/LoopToolBase.js +25 -25
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/NormalLoopTool.js +61 -61
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/PartLoopTool.js +119 -119
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/Viewer.js +106 -106
- package/utils/JsViewVueWidget/BrowserDebugWidget/JsvApic/WebpData.js +141 -141
- package/utils/JsViewVueWidget/BrowserDebugWidget/WidgetLoader.js +20 -20
- package/utils/JsViewVueWidget/JsvActorMove/ActorControlBase.js +204 -204
- package/utils/JsViewVueWidget/JsvActorMove/JsvActorMove.vue +63 -63
- package/utils/JsViewVueWidget/JsvActorMove/JsvActorMoveControl.js +426 -426
- package/utils/JsViewVueWidget/JsvActorMove/index.js +12 -12
- package/utils/JsViewVueWidget/JsvApic/JsvApic.vue +178 -178
- package/utils/JsViewVueWidget/JsvApic/index.js +17 -17
- package/utils/JsViewVueWidget/JsvMarquee.vue +196 -196
- package/utils/JsViewVueWidget/JsvNinePatch.vue +76 -76
- package/utils/JsViewVueWidget/JsvPreload/JsvPreload.vue +350 -350
- package/utils/JsViewVueWidget/JsvPreload/index.js +21 -21
- package/utils/JsViewVueWidget/JsvQrcode/JsvQrcode.vue +140 -140
- package/utils/JsViewVueWidget/JsvQrcode/index.js +18 -18
- package/utils/JsViewVueWidget/JsvSpray/JsvSpray.vue +139 -139
- package/utils/JsViewVueWidget/JsvSpray/index.js +14 -14
- package/utils/JsViewVueWidget/JsvSpriteAnim/JsvSpriteAnim.vue +447 -447
- package/utils/JsViewVueWidget/JsvSpriteAnim/SpriteController.js +56 -56
- package/utils/JsViewVueWidget/JsvSpriteAnim/index.js +6 -6
- package/utils/JsViewVueWidget/JsvSwiper/Indicator.vue +34 -34
- package/utils/JsViewVueWidget/JsvSwiper/JsvSwiper.vue +494 -494
- package/utils/JsViewVueWidget/JsvSwiper/index.js +9 -9
- package/utils/JsViewVueWidget/JsvSwiper3D/Indicator.vue +34 -34
- package/utils/JsViewVueWidget/JsvSwiper3D/JsvSwiper.vue +403 -403
- package/utils/JsViewVueWidget/JsvSwiper3D/index.js +9 -9
- package/utils/JsViewVueWidget/JsvTextBox.vue +110 -110
- package/utils/JsViewVueWidget/JsvVideo.vue +35 -35
- package/patches/node_modules/@babel/preset-env/lib/available-plugins.js +0 -219
- package/patches/node_modules/@vue/cli-plugin-typescript/index.js +0 -100
- package/patches/node_modules/@vue/cli-service/lib/commands/serve.js +0 -395
- package/patches/node_modules/@vue/cli-service/lib/config/app.js +0 -272
- package/patches/node_modules/@vue/cli-service/lib/config/assets.js +0 -70
- package/patches/node_modules/@vue/cli-service/lib/config/base.js +0 -212
- package/patches/node_modules/@vue/compiler-sfc/dist/compiler-sfc.cjs.js +0 -2566
- package/patches/node_modules/@vue/compiler-sfc/dist/jsview-css-to-js.js +0 -274
- package/patches/node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.js +0 -1596
- package/patches/node_modules/postcss-js/objectifier.js +0 -90
- package/patches/node_modules/vue-loader/dist/resolveScript.js +0 -70
- package/scripts/deploy-fast-pack.js +0 -17
- package/scripts/deploy-fast-publish.js +0 -44
- package/scripts/deploy-git-commit-empty.js +0 -21
- package/scripts/deploy-prepare.js +0 -56
- package/scripts/make-js.sh +0 -181
- package/vetur.config.js +0 -5
|
@@ -1,186 +1,186 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
import { jJsvRuntimeBridge } from "jsview/utils/JsViewVueTools/JsvRuntimeBridge";
|
|
3
|
-
import { EdgeDirection } from "jsview/utils/JsViewEngineWidget";
|
|
4
|
-
import TabFrame from "../components/TabFrame.vue";
|
|
5
|
-
import BodyFrame from "../components/BodyFrame.vue";
|
|
6
|
-
import Dialog from "../components/Dialog.vue";
|
|
7
|
-
import { routeList } from "../router.js";
|
|
8
|
-
|
|
9
|
-
const colorTemplete = ["#89BEB2", "#C9BA83", "#DED38C", "#DE9C53"];
|
|
10
|
-
|
|
11
|
-
const featureData = [];
|
|
12
|
-
const sceneData = [];
|
|
13
|
-
for (let item of routeList) {
|
|
14
|
-
let obj = {
|
|
15
|
-
name: item.name,
|
|
16
|
-
path: item.path,
|
|
17
|
-
width: 300,
|
|
18
|
-
height: 100,
|
|
19
|
-
focusable: true,
|
|
20
|
-
};
|
|
21
|
-
if (item.path.indexOf("feature") >= 0) {
|
|
22
|
-
obj.backgroundColor = colorTemplete[featureData.length % 4];
|
|
23
|
-
featureData.push(obj);
|
|
24
|
-
} else if (item.path.indexOf("scene") >= 0) {
|
|
25
|
-
obj.backgroundColor = colorTemplete[sceneData.length % 4];
|
|
26
|
-
sceneData.push(obj);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
const dataList = [featureData, sceneData];
|
|
30
|
-
|
|
31
|
-
export default {
|
|
32
|
-
components: {
|
|
33
|
-
TabFrame,
|
|
34
|
-
Dialog,
|
|
35
|
-
BodyFrame,
|
|
36
|
-
},
|
|
37
|
-
data() {
|
|
38
|
-
return {
|
|
39
|
-
showExitDialog: false,
|
|
40
|
-
contentData: dataList[0],
|
|
41
|
-
tabId: 0,
|
|
42
|
-
preFocusName: "",
|
|
43
|
-
curFocusName: "",
|
|
44
|
-
};
|
|
45
|
-
},
|
|
46
|
-
setup() {
|
|
47
|
-
return {
|
|
48
|
-
name: "/home",
|
|
49
|
-
};
|
|
50
|
-
},
|
|
51
|
-
computed: {
|
|
52
|
-
address() {
|
|
53
|
-
return window.localStorage.href;
|
|
54
|
-
},
|
|
55
|
-
},
|
|
56
|
-
methods: {
|
|
57
|
-
onFocus() {
|
|
58
|
-
this.changeFocus(this.name + "/bodyFrame");
|
|
59
|
-
},
|
|
60
|
-
onKeyDown(ev) {
|
|
61
|
-
// 处理返回键
|
|
62
|
-
if (
|
|
63
|
-
ev.keyCode == 8 || // Backspace
|
|
64
|
-
ev.keyCode == 27 || // Escape
|
|
65
|
-
ev.keyCode == 10000 // 盒子返回键
|
|
66
|
-
) {
|
|
67
|
-
this.showExitDialog = !this.showExitDialog;
|
|
68
|
-
if (!this.showExitDialog) {
|
|
69
|
-
this.changeFocus(this.preFocusName);
|
|
70
|
-
} else {
|
|
71
|
-
this.preFocusName = this.curFocusName;
|
|
72
|
-
this.curFocusName = this.name + "/exitDialog";
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
return true;
|
|
76
|
-
},
|
|
77
|
-
changeFocus(name) {
|
|
78
|
-
this.preFocusName = this.curFocusName;
|
|
79
|
-
this.curFocusName = name;
|
|
80
|
-
this.$refs.rootNode.findBlockByName(name).requestFocus();
|
|
81
|
-
},
|
|
82
|
-
onTabEdge(edgeInfo) {
|
|
83
|
-
if (edgeInfo.direction === EdgeDirection.bottom) {
|
|
84
|
-
this.changeFocus(this.name + "/bodyFrame");
|
|
85
|
-
}
|
|
86
|
-
},
|
|
87
|
-
onContentEdge(edgeInfo) {
|
|
88
|
-
if (edgeInfo.direction === EdgeDirection.top) {
|
|
89
|
-
this.changeFocus(this.name + "/tabFrame");
|
|
90
|
-
}
|
|
91
|
-
},
|
|
92
|
-
tabItemFocus(data) {
|
|
93
|
-
if (data.id != this.tabId) {
|
|
94
|
-
this.tabId = data.id;
|
|
95
|
-
this.contentData = dataList[this.tabId];
|
|
96
|
-
}
|
|
97
|
-
},
|
|
98
|
-
onDialogAction(msg) {
|
|
99
|
-
console.log("cchtes dialog onaction", msg);
|
|
100
|
-
this.showExitDialog = false;
|
|
101
|
-
this.changeFocus(this.preFocusName);
|
|
102
|
-
switch (msg) {
|
|
103
|
-
case "ok":
|
|
104
|
-
jJsvRuntimeBridge.closePage();
|
|
105
|
-
// if (!window.JsView) {
|
|
106
|
-
// // 浏览器调试
|
|
107
|
-
// window.location.href = "about:blank";
|
|
108
|
-
// }
|
|
109
|
-
break;
|
|
110
|
-
case "back":
|
|
111
|
-
case "cancel":
|
|
112
|
-
break;
|
|
113
|
-
}
|
|
114
|
-
},
|
|
115
|
-
},
|
|
116
|
-
};
|
|
117
|
-
</script>
|
|
118
|
-
|
|
119
|
-
<template>
|
|
120
|
-
<div class="rootSize">
|
|
121
|
-
<div class="address">
|
|
122
|
-
{{ address }}
|
|
123
|
-
</div>
|
|
124
|
-
<div class="logo">JsView-Vue3</div>
|
|
125
|
-
|
|
126
|
-
<jsv-focus-block
|
|
127
|
-
autoFocus
|
|
128
|
-
ref="rootNode"
|
|
129
|
-
:onAction="{
|
|
130
|
-
onKeyDown: onKeyDown,
|
|
131
|
-
onFocus: onFocus,
|
|
132
|
-
}"
|
|
133
|
-
>
|
|
134
|
-
<div :style="{ left: 10 }">
|
|
135
|
-
<tab-frame
|
|
136
|
-
:name="name + '/tabFrame'"
|
|
137
|
-
:onEdge="onTabEdge"
|
|
138
|
-
:itemFocus="tabItemFocus"
|
|
139
|
-
/>
|
|
140
|
-
</div>
|
|
141
|
-
|
|
142
|
-
<div
|
|
143
|
-
:style="{
|
|
144
|
-
left: 10,
|
|
145
|
-
top: 100,
|
|
146
|
-
}"
|
|
147
|
-
>
|
|
148
|
-
<body-frame
|
|
149
|
-
:data="contentData"
|
|
150
|
-
:name="name + '/bodyFrame'"
|
|
151
|
-
:onEdge="onContentEdge"
|
|
152
|
-
/>
|
|
153
|
-
</div>
|
|
154
|
-
|
|
155
|
-
<Dialog
|
|
156
|
-
v-if="showExitDialog"
|
|
157
|
-
:name="name + '/exitDialog'"
|
|
158
|
-
:onAction="onDialogAction"
|
|
159
|
-
/>
|
|
160
|
-
</jsv-focus-block>
|
|
161
|
-
</div>
|
|
162
|
-
</template>
|
|
163
|
-
|
|
164
|
-
<style scoped>
|
|
165
|
-
.rootSize {
|
|
166
|
-
width: 1920;
|
|
167
|
-
height: 1080;
|
|
168
|
-
background-color: #334c4c;
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
.address {
|
|
172
|
-
width: 1280;
|
|
173
|
-
height: 30;
|
|
174
|
-
color: #ffffff;
|
|
175
|
-
font-size: 20px;
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
.logo {
|
|
179
|
-
width: 1280;
|
|
180
|
-
height: 30;
|
|
181
|
-
color: #00ff00;
|
|
182
|
-
font-size: 20px;
|
|
183
|
-
font-weight: bold;
|
|
184
|
-
text-align: right;
|
|
185
|
-
}
|
|
186
|
-
</style>
|
|
1
|
+
<script>
|
|
2
|
+
import { jJsvRuntimeBridge } from "jsview/utils/JsViewVueTools/JsvRuntimeBridge";
|
|
3
|
+
import { EdgeDirection } from "jsview/utils/JsViewEngineWidget";
|
|
4
|
+
import TabFrame from "../components/TabFrame.vue";
|
|
5
|
+
import BodyFrame from "../components/BodyFrame.vue";
|
|
6
|
+
import Dialog from "../components/Dialog.vue";
|
|
7
|
+
import { routeList } from "../router.js";
|
|
8
|
+
|
|
9
|
+
const colorTemplete = ["#89BEB2", "#C9BA83", "#DED38C", "#DE9C53"];
|
|
10
|
+
|
|
11
|
+
const featureData = [];
|
|
12
|
+
const sceneData = [];
|
|
13
|
+
for (let item of routeList) {
|
|
14
|
+
let obj = {
|
|
15
|
+
name: item.name,
|
|
16
|
+
path: item.path,
|
|
17
|
+
width: 300,
|
|
18
|
+
height: 100,
|
|
19
|
+
focusable: true,
|
|
20
|
+
};
|
|
21
|
+
if (item.path.indexOf("feature") >= 0) {
|
|
22
|
+
obj.backgroundColor = colorTemplete[featureData.length % 4];
|
|
23
|
+
featureData.push(obj);
|
|
24
|
+
} else if (item.path.indexOf("scene") >= 0) {
|
|
25
|
+
obj.backgroundColor = colorTemplete[sceneData.length % 4];
|
|
26
|
+
sceneData.push(obj);
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
const dataList = [featureData, sceneData];
|
|
30
|
+
|
|
31
|
+
export default {
|
|
32
|
+
components: {
|
|
33
|
+
TabFrame,
|
|
34
|
+
Dialog,
|
|
35
|
+
BodyFrame,
|
|
36
|
+
},
|
|
37
|
+
data() {
|
|
38
|
+
return {
|
|
39
|
+
showExitDialog: false,
|
|
40
|
+
contentData: dataList[0],
|
|
41
|
+
tabId: 0,
|
|
42
|
+
preFocusName: "",
|
|
43
|
+
curFocusName: "",
|
|
44
|
+
};
|
|
45
|
+
},
|
|
46
|
+
setup() {
|
|
47
|
+
return {
|
|
48
|
+
name: "/home",
|
|
49
|
+
};
|
|
50
|
+
},
|
|
51
|
+
computed: {
|
|
52
|
+
address() {
|
|
53
|
+
return window.localStorage.href;
|
|
54
|
+
},
|
|
55
|
+
},
|
|
56
|
+
methods: {
|
|
57
|
+
onFocus() {
|
|
58
|
+
this.changeFocus(this.name + "/bodyFrame");
|
|
59
|
+
},
|
|
60
|
+
onKeyDown(ev) {
|
|
61
|
+
// 处理返回键
|
|
62
|
+
if (
|
|
63
|
+
ev.keyCode == 8 || // Backspace
|
|
64
|
+
ev.keyCode == 27 || // Escape
|
|
65
|
+
ev.keyCode == 10000 // 盒子返回键
|
|
66
|
+
) {
|
|
67
|
+
this.showExitDialog = !this.showExitDialog;
|
|
68
|
+
if (!this.showExitDialog) {
|
|
69
|
+
this.changeFocus(this.preFocusName);
|
|
70
|
+
} else {
|
|
71
|
+
this.preFocusName = this.curFocusName;
|
|
72
|
+
this.curFocusName = this.name + "/exitDialog";
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
return true;
|
|
76
|
+
},
|
|
77
|
+
changeFocus(name) {
|
|
78
|
+
this.preFocusName = this.curFocusName;
|
|
79
|
+
this.curFocusName = name;
|
|
80
|
+
this.$refs.rootNode.findBlockByName(name).requestFocus();
|
|
81
|
+
},
|
|
82
|
+
onTabEdge(edgeInfo) {
|
|
83
|
+
if (edgeInfo.direction === EdgeDirection.bottom) {
|
|
84
|
+
this.changeFocus(this.name + "/bodyFrame");
|
|
85
|
+
}
|
|
86
|
+
},
|
|
87
|
+
onContentEdge(edgeInfo) {
|
|
88
|
+
if (edgeInfo.direction === EdgeDirection.top) {
|
|
89
|
+
this.changeFocus(this.name + "/tabFrame");
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
tabItemFocus(data) {
|
|
93
|
+
if (data.id != this.tabId) {
|
|
94
|
+
this.tabId = data.id;
|
|
95
|
+
this.contentData = dataList[this.tabId];
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
onDialogAction(msg) {
|
|
99
|
+
console.log("cchtes dialog onaction", msg);
|
|
100
|
+
this.showExitDialog = false;
|
|
101
|
+
this.changeFocus(this.preFocusName);
|
|
102
|
+
switch (msg) {
|
|
103
|
+
case "ok":
|
|
104
|
+
jJsvRuntimeBridge.closePage();
|
|
105
|
+
// if (!window.JsView) {
|
|
106
|
+
// // 浏览器调试
|
|
107
|
+
// window.location.href = "about:blank";
|
|
108
|
+
// }
|
|
109
|
+
break;
|
|
110
|
+
case "back":
|
|
111
|
+
case "cancel":
|
|
112
|
+
break;
|
|
113
|
+
}
|
|
114
|
+
},
|
|
115
|
+
},
|
|
116
|
+
};
|
|
117
|
+
</script>
|
|
118
|
+
|
|
119
|
+
<template>
|
|
120
|
+
<div class="rootSize">
|
|
121
|
+
<div class="address">
|
|
122
|
+
{{ address }}
|
|
123
|
+
</div>
|
|
124
|
+
<div class="logo">JsView-Vue3</div>
|
|
125
|
+
|
|
126
|
+
<jsv-focus-block
|
|
127
|
+
autoFocus
|
|
128
|
+
ref="rootNode"
|
|
129
|
+
:onAction="{
|
|
130
|
+
onKeyDown: onKeyDown,
|
|
131
|
+
onFocus: onFocus,
|
|
132
|
+
}"
|
|
133
|
+
>
|
|
134
|
+
<div :style="{ left: 10 }">
|
|
135
|
+
<tab-frame
|
|
136
|
+
:name="name + '/tabFrame'"
|
|
137
|
+
:onEdge="onTabEdge"
|
|
138
|
+
:itemFocus="tabItemFocus"
|
|
139
|
+
/>
|
|
140
|
+
</div>
|
|
141
|
+
|
|
142
|
+
<div
|
|
143
|
+
:style="{
|
|
144
|
+
left: 10,
|
|
145
|
+
top: 100,
|
|
146
|
+
}"
|
|
147
|
+
>
|
|
148
|
+
<body-frame
|
|
149
|
+
:data="contentData"
|
|
150
|
+
:name="name + '/bodyFrame'"
|
|
151
|
+
:onEdge="onContentEdge"
|
|
152
|
+
/>
|
|
153
|
+
</div>
|
|
154
|
+
|
|
155
|
+
<Dialog
|
|
156
|
+
v-if="showExitDialog"
|
|
157
|
+
:name="name + '/exitDialog'"
|
|
158
|
+
:onAction="onDialogAction"
|
|
159
|
+
/>
|
|
160
|
+
</jsv-focus-block>
|
|
161
|
+
</div>
|
|
162
|
+
</template>
|
|
163
|
+
|
|
164
|
+
<style scoped>
|
|
165
|
+
.rootSize {
|
|
166
|
+
width: 1920;
|
|
167
|
+
height: 1080;
|
|
168
|
+
background-color: #334c4c;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.address {
|
|
172
|
+
width: 1280;
|
|
173
|
+
height: 30;
|
|
174
|
+
color: #ffffff;
|
|
175
|
+
font-size: 20px;
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
.logo {
|
|
179
|
+
width: 1280;
|
|
180
|
+
height: 30;
|
|
181
|
+
color: #00ff00;
|
|
182
|
+
font-size: 20px;
|
|
183
|
+
font-weight: bold;
|
|
184
|
+
text-align: right;
|
|
185
|
+
}
|
|
186
|
+
</style>
|
package/samples/FlipCard/App.vue
CHANGED
|
@@ -1,80 +1,80 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
import {
|
|
3
|
-
HORIZONTAL,
|
|
4
|
-
SimpleWidget,
|
|
5
|
-
} from "jsview/utils/JsViewEngineWidget";
|
|
6
|
-
import FlipCard from "./FlipCard.vue";
|
|
7
|
-
import { data } from "./data.js";
|
|
8
|
-
import redEgg from "./assets/red_egg.png";
|
|
9
|
-
import blueEgg from "./assets/blue_egg.png";
|
|
10
|
-
export default {
|
|
11
|
-
components: { SimpleWidget, FlipCard },
|
|
12
|
-
setup() {
|
|
13
|
-
return {
|
|
14
|
-
name: "/flipCard",
|
|
15
|
-
flipCardData: data,
|
|
16
|
-
direction: HORIZONTAL,
|
|
17
|
-
redEgg,
|
|
18
|
-
blueEgg,
|
|
19
|
-
};
|
|
20
|
-
},
|
|
21
|
-
methods: {
|
|
22
|
-
onKeyDown(ev) {
|
|
23
|
-
// 8:Backspace, 27:Escape, 10000:盒子返回键
|
|
24
|
-
if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
|
|
25
|
-
this.$router?.go(-1); // 有router时,是从DemoHomepage进入,回退
|
|
26
|
-
return true;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
return false;
|
|
30
|
-
},
|
|
31
|
-
measures(item) {
|
|
32
|
-
return {
|
|
33
|
-
width: item.blocks.w,
|
|
34
|
-
height: item.blocks.h,
|
|
35
|
-
focusable: item.focusable,
|
|
36
|
-
hasSub: item.hasSub,
|
|
37
|
-
};
|
|
38
|
-
},
|
|
39
|
-
onFocus() {
|
|
40
|
-
this.$refs.focusNode.findBlockByName(this.name).requestFocus();
|
|
41
|
-
},
|
|
42
|
-
},
|
|
43
|
-
};
|
|
44
|
-
</script>
|
|
45
|
-
<template>
|
|
46
|
-
<jsv-focus-block
|
|
47
|
-
ref="focusNode"
|
|
48
|
-
autoFocus
|
|
49
|
-
:onAction="{
|
|
50
|
-
onKeyDown: onKeyDown,
|
|
51
|
-
onFocus: onFocus,
|
|
52
|
-
}"
|
|
53
|
-
>
|
|
54
|
-
<simple-widget
|
|
55
|
-
:name="name"
|
|
56
|
-
:width="1280"
|
|
57
|
-
:height="720"
|
|
58
|
-
:padding="{ left: 50, top: 100, right: 20, bottom: 20 }"
|
|
59
|
-
:data="flipCardData"
|
|
60
|
-
:direction="direction"
|
|
61
|
-
:measures="measures"
|
|
62
|
-
>
|
|
63
|
-
<template #renderItem="{ data, query, onEdge, onAction }">
|
|
64
|
-
<FlipCard
|
|
65
|
-
:data="data"
|
|
66
|
-
:query="query"
|
|
67
|
-
:onEdge="onEdge"
|
|
68
|
-
:onAction="onAction"
|
|
69
|
-
:width="191"
|
|
70
|
-
:height="252"
|
|
71
|
-
:backImg="redEgg"
|
|
72
|
-
:foreImg="blueEgg"
|
|
73
|
-
:perspective="300"
|
|
74
|
-
:initFlipped="false"
|
|
75
|
-
:name="name + '/' + data.id"
|
|
76
|
-
/>
|
|
77
|
-
</template>
|
|
78
|
-
</simple-widget>
|
|
79
|
-
</jsv-focus-block>
|
|
80
|
-
</template>
|
|
1
|
+
<script>
|
|
2
|
+
import {
|
|
3
|
+
HORIZONTAL,
|
|
4
|
+
SimpleWidget,
|
|
5
|
+
} from "jsview/utils/JsViewEngineWidget";
|
|
6
|
+
import FlipCard from "./FlipCard.vue";
|
|
7
|
+
import { data } from "./data.js";
|
|
8
|
+
import redEgg from "./assets/red_egg.png";
|
|
9
|
+
import blueEgg from "./assets/blue_egg.png";
|
|
10
|
+
export default {
|
|
11
|
+
components: { SimpleWidget, FlipCard },
|
|
12
|
+
setup() {
|
|
13
|
+
return {
|
|
14
|
+
name: "/flipCard",
|
|
15
|
+
flipCardData: data,
|
|
16
|
+
direction: HORIZONTAL,
|
|
17
|
+
redEgg,
|
|
18
|
+
blueEgg,
|
|
19
|
+
};
|
|
20
|
+
},
|
|
21
|
+
methods: {
|
|
22
|
+
onKeyDown(ev) {
|
|
23
|
+
// 8:Backspace, 27:Escape, 10000:盒子返回键
|
|
24
|
+
if (ev.keyCode == 8 || ev.keyCode == 27 || ev.keyCode == 10000) {
|
|
25
|
+
this.$router?.go(-1); // 有router时,是从DemoHomepage进入,回退
|
|
26
|
+
return true;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
return false;
|
|
30
|
+
},
|
|
31
|
+
measures(item) {
|
|
32
|
+
return {
|
|
33
|
+
width: item.blocks.w,
|
|
34
|
+
height: item.blocks.h,
|
|
35
|
+
focusable: item.focusable,
|
|
36
|
+
hasSub: item.hasSub,
|
|
37
|
+
};
|
|
38
|
+
},
|
|
39
|
+
onFocus() {
|
|
40
|
+
this.$refs.focusNode.findBlockByName(this.name).requestFocus();
|
|
41
|
+
},
|
|
42
|
+
},
|
|
43
|
+
};
|
|
44
|
+
</script>
|
|
45
|
+
<template>
|
|
46
|
+
<jsv-focus-block
|
|
47
|
+
ref="focusNode"
|
|
48
|
+
autoFocus
|
|
49
|
+
:onAction="{
|
|
50
|
+
onKeyDown: onKeyDown,
|
|
51
|
+
onFocus: onFocus,
|
|
52
|
+
}"
|
|
53
|
+
>
|
|
54
|
+
<simple-widget
|
|
55
|
+
:name="name"
|
|
56
|
+
:width="1280"
|
|
57
|
+
:height="720"
|
|
58
|
+
:padding="{ left: 50, top: 100, right: 20, bottom: 20 }"
|
|
59
|
+
:data="flipCardData"
|
|
60
|
+
:direction="direction"
|
|
61
|
+
:measures="measures"
|
|
62
|
+
>
|
|
63
|
+
<template #renderItem="{ data, query, onEdge, onAction }">
|
|
64
|
+
<FlipCard
|
|
65
|
+
:data="data"
|
|
66
|
+
:query="query"
|
|
67
|
+
:onEdge="onEdge"
|
|
68
|
+
:onAction="onAction"
|
|
69
|
+
:width="191"
|
|
70
|
+
:height="252"
|
|
71
|
+
:backImg="redEgg"
|
|
72
|
+
:foreImg="blueEgg"
|
|
73
|
+
:perspective="300"
|
|
74
|
+
:initFlipped="false"
|
|
75
|
+
:name="name + '/' + data.id"
|
|
76
|
+
/>
|
|
77
|
+
</template>
|
|
78
|
+
</simple-widget>
|
|
79
|
+
</jsv-focus-block>
|
|
80
|
+
</template>
|