修改弹出层的展示方式

This commit is contained in:
cebgcontract 2022-06-23 11:21:05 +08:00
parent d340be6875
commit a6fceaa988
15 changed files with 442 additions and 118 deletions

View File

@ -97,7 +97,7 @@
"__id__": 1
},
"_children": [],
"_active": true,
"_active": false,
"_level": 2,
"_components": [
{

View File

@ -39,7 +39,7 @@
}
],
"_active": true,
"_level": 2,
"_level": 1,
"_components": [
{
"__id__": 28
@ -71,8 +71,8 @@
},
"_position": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"x": 512,
"y": 256,
"z": 0
},
"_scale": {
@ -103,7 +103,7 @@
"__id__": 1
},
"_children": [],
"_active": true,
"_active": false,
"_level": 3,
"_components": [
{
@ -234,7 +234,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "e1M0SSz1pCmrMtPVFtJezV",
"sync": false
@ -335,7 +335,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "330F7geNVDMbw3FHfRtmS8",
"sync": false
@ -436,7 +436,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "cawI/5DfBHM5iufLlNLjvb",
"sync": false
@ -537,7 +537,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "f3/WiE/89DCp6WHZ8/xA2o",
"sync": false
@ -638,7 +638,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "4fgNRF1L1HabtsBzV9YPqd",
"sync": false
@ -822,7 +822,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "488IMbAAdAp4LuudhutDWL",
"sync": false
@ -959,7 +959,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "1cfDUvpZpELJNYna4AkKOt",
"sync": false
@ -1033,7 +1033,7 @@
"__id__": 1
},
"asset": {
"__id__": 0
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"fileId": "263ZmWXZBMaKznay4xGbjg",
"sync": false

View File

@ -20,18 +20,18 @@
"__id__": 2
},
{
"__id__": 8
"__id__": 7
}
],
"_active": true,
"_level": 1,
"_components": [
{
"__id__": 11
"__id__": 10
}
],
"_prefab": {
"__id__": 12
"__id__": 11
},
"_opacity": 255,
"_color": {
@ -93,20 +93,17 @@
},
{
"__id__": 4
},
{
"__id__": 5
}
],
"_prefab": {
"__id__": 7
"__id__": 6
},
"_opacity": 97,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 0,
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
@ -145,34 +142,6 @@
"groupIndex": 0,
"_id": ""
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 2
},
"_enabled": true,
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "a23235d1-15db-4b95-8439-a2e005bfff91"
},
"_type": 0,
"_sizeMode": 0,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_state": 0,
"_atlas": null,
"_id": ""
},
{
"__type__": "cc.Widget",
"_name": "",
@ -212,7 +181,7 @@
"zoomScale": 1.2,
"clickEvents": [
{
"__id__": 6
"__id__": 5
}
],
"_N$interactable": true,
@ -303,11 +272,11 @@
"_level": 4,
"_components": [
{
"__id__": 9
"__id__": 8
}
],
"_prefab": {
"__id__": 10
"__id__": 9
},
"_opacity": 255,
"_color": {
@ -358,7 +327,7 @@
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 8
"__id__": 7
},
"_enabled": true,
"lightColor": {
@ -397,7 +366,7 @@
},
"_enabled": true,
"qrComp": {
"__id__": 9
"__id__": 8
},
"_id": ""
},

View File

@ -9,6 +9,7 @@ import { ERC20Standard } from "./standards/ERC20Standard";
import { ERC721Standard } from "./standards/ERC721Standard";
import { IAccount, initAccount } from "./data/DataModel";
import { DataManage } from "./manage/DataManage";
import { WALLET_STORAGE_KEY_NAME } from "./config/constants";
var global =
(typeof globalThis !== 'undefined' && globalThis) ||
@ -54,11 +55,11 @@ export default class JCWallet {
this.web3 = new Web3('https://rpc-testnet.kcc.network')
this.erc20Standard = new ERC20Standard(this.web3);
this.erc721Standard = new ERC721Standard(this.web3);
this.wallet = this.web3.eth.accounts.wallet.load(this.password)
this.wallet = this.web3.eth.accounts.wallet.load(this.password, WALLET_STORAGE_KEY_NAME)
if (!this.wallet || this.wallet.length === 0) {
let key = '0xa6c4354fb93a55fb67117969a12465209395ec31089fea9e6e061f873b87a473'
this.wallet.add(key);
this.web3.eth.accounts.wallet.save(this.password);
this.web3.eth.accounts.wallet.save(this.password, WALLET_STORAGE_KEY_NAME);
}
window.jc = window.jc || {wallet: this};
this.data = this.dataManage.loadData()
@ -143,7 +144,7 @@ export default class JCWallet {
public createAccount() {
let account = this.web3.eth.accounts.create()
this.wallet.add(account)
this.wallet.save(this.password)
this.wallet.save(this.password, WALLET_STORAGE_KEY_NAME)
this.accountIndex = this.wallet.length - 1
this.mainHandlers.emit(WALLET_ACCOUNT_CHANGE, account.address)
}

View File

@ -23,8 +23,13 @@ export const WALLET_ACCOUNT_CHANGE = 'wallet_account_change'
export const WALLET_TOKEN_TYPE_CHANGE = 'wallet_token_type_change'
// BEGIN of UI
export const WALLET_SHOW_QR = 'wallet_show_qr'
export const WALLET_SHOW_ACCOUNT_LIST = 'wallet_show_account_list'
export const WALLET_HIDE_ACCOUNT_LIST = 'wallet_hide_account_list'
export const WALLET_SHOW_MODAL = 'wallet_show_modal'
export const WALLET_HIDE_MODAL = 'wallet_hide_modal'

View File

@ -0,0 +1 @@
export const WALLET_STORAGE_KEY_NAME = 'jc_wallet_data'

View File

@ -0,0 +1,9 @@
{
"ver": "1.0.5",
"uuid": "e031352f-2a76-4e0f-bc92-98ea80313a6b",
"isPlugin": false,
"loadPluginInWeb": true,
"loadPluginInNative": true,
"loadPluginInEditor": false,
"subMetas": {}
}

View File

@ -1,4 +1,4 @@
import { WALLET_HIDE_ACCOUNT_LIST } from "../common/WalletEvent";
import { WALLET_HIDE_ACCOUNT_LIST, WALLET_HIDE_MODAL } from "../common/WalletEvent";
import { IAccount } from "../data/DataModel";
import WalletBase from "./WallerBase";
@ -40,4 +40,8 @@ export default class AccountList extends WalletBase {
node.getComponent('OneAccount').init(account)
this.contentNode.addChild(node)
}
closeMe() {
this.wallet.uiHandlers.emit(WALLET_HIDE_MODAL)
}
}

View File

@ -1,3 +1,4 @@
import { WALLET_HIDE_MODAL } from "../common/WalletEvent";
import { ZError } from "../common/ZError";
import WalletBase from "./WallerBase";
@ -36,10 +37,13 @@ export default class MenuPanel extends WalletBase {
super.start()
this.layoutBtns()
}
init(data: any) {
}
// update (dt) {}
onCloseClick() {
this.node.active = false
this.wallet.uiHandlers.emit(WALLET_HIDE_MODAL)
}
layoutBtns() {

View File

@ -0,0 +1,84 @@
import { WALLET_HIDE_MODAL, WALLET_SHOW_MODAL } from "../common/WalletEvent";
import { IQRCfg } from "./comp/QRCodeComp";
import WalletBase from "./WallerBase";
const {ccclass, property} = cc._decorator;
@ccclass
export default class ModalLayer extends WalletBase {
@property(cc.Prefab)
menuPreb: cc.Prefab = null
@property(cc.Prefab)
accountPreb: cc.Prefab = null
@property(cc.Prefab)
qrPreb: cc.Prefab = null
@property(cc.Node)
contentNode: cc.Node = null
subNodeMap: Map<string, cc.Node> = new Map()
prebInfo = {
'qr': 'QrNode'
}
onLoad () {
super.onLoad()
this.wallet.uiHandlers.on(WALLET_SHOW_MODAL, this.showModal.bind(this))
this.wallet.uiHandlers.on(WALLET_HIDE_MODAL, this.hideModal.bind(this))
}
private fetchNode(tag: string, preb: cc.Prefab) {
if (!this.subNodeMap.has(tag)) {
const node = cc.instantiate(preb)
node.x = 0
node.y = 0
this.subNodeMap.set(tag, node)
}
this.contentNode.addChild(this.subNodeMap.get(tag))
return this.subNodeMap.get(tag)
}
showModal({tag, data}: {tag: string, data: any}) {
this.node.active = true
let preb = this[`${tag}Preb`]
if (!preb) {
console.log('show modal with error: no modal preb found')
return
}
const node = this.fetchNode(tag, preb);
if (this.prebInfo[tag]) {
node.getComponent(this.prebInfo[tag])['init'](data)
}
node.active = true
}
hideModal() {
this.contentNode.removeAllChildren()
this.node.active = false
}
showMenuPanel() {
const tag = 'menu-node'
const node = this.fetchNode(tag, this.menuPreb)
node.active = true
}
showQrPanel(data: IQRCfg) {
const tag = 'qr-node'
const node = this.fetchNode(tag, this.qrPreb)
node.getComponent('QrNode').showQr(data)
node.active = true
}
showAccountList() {
const tag = 'account-list-node'
const node = this.fetchNode(tag, this.accountPreb)
node.active = true
}
}

View File

@ -0,0 +1,9 @@
{
"ver": "1.0.5",
"uuid": "4b4b4316-882d-44c6-83e1-86f8d26ab5f9",
"isPlugin": false,
"loadPluginInWeb": true,
"loadPluginInNative": true,
"loadPluginInEditor": false,
"subMetas": {}
}

View File

@ -1,17 +1,20 @@
import { WALLET_HIDE_MODAL } from "../common/WalletEvent";
import QRCodeComp, { IQRCfg } from "./comp/QRCodeComp";
import WalletBase from "./WallerBase";
const {ccclass, property} = cc._decorator;
@ccclass
export default class QrNode extends cc.Component {
export default class QrNode extends WalletBase {
@property(QRCodeComp)
qrComp: QRCodeComp = null
showQr(data: IQRCfg) {
init(data: IQRCfg) {
this.qrComp.renderQr(data)
}
hideMe() {
this.node.active = false
this.wallet.uiHandlers.emit(WALLET_HIDE_MODAL)
}
}

View File

@ -1,4 +1,4 @@
import { WALLET_ACCOUNT_CHANGE, WALLET_CHAIN_CHANGE, WALLET_SHOW_ACCOUNT_LIST, WALLET_SHOW_QR } from "../common/WalletEvent";
import { WALLET_ACCOUNT_CHANGE, WALLET_CHAIN_CHANGE, WALLET_SHOW_ACCOUNT_LIST, WALLET_SHOW_MODAL, WALLET_SHOW_QR } from "../common/WalletEvent";
import { IChainData } from "../JCWallet";
import { renderFromTokenMinimalUnit } from "../util/number.util";
import { formatAddress, formatMoney } from "../util/wallet.util";
@ -84,10 +84,10 @@ export default class WalletInfo extends WalletBase {
const chainId = this.wallet.currentChain.id
let qrUrl = `ethereum:${address}@${chainId}`
// this.showQr(qrUrl)
this.wallet.uiHandlers.emit(WALLET_SHOW_QR, {val: qrUrl})
this.wallet.uiHandlers.emit(WALLET_SHOW_MODAL, {tag: 'qr', data: {val: qrUrl}})
}
showAccountList() {
this.wallet.uiHandlers.emit(WALLET_SHOW_ACCOUNT_LIST)
this.wallet.uiHandlers.emit(WALLET_SHOW_MODAL, {tag: 'account'})
}
}

View File

@ -1,4 +1,4 @@
import { WALLET_SHOW_ACCOUNT_LIST, WALLET_SHOW_QR } from "../common/WalletEvent";
import { WALLET_SHOW_ACCOUNT_LIST, WALLET_SHOW_MODAL, WALLET_SHOW_QR } from "../common/WalletEvent";
import ChainTab from "./ChainTab";
import { IQRCfg } from "./comp/QRCodeComp";
import ListNode from "./ListNode";
@ -19,17 +19,8 @@ export default class WalletMainPanel extends WalletBase {
})
listNode: ListNode = null
@property(cc.Prefab)
menuPreb: cc.Prefab = null
@property(cc.Prefab)
accountPreb: cc.Prefab = null
@property(cc.Prefab)
qrPreb: cc.Prefab = null
subNodeMap: Map<string, cc.Node> = new Map()
@property(cc.Node)
modalLayer: cc.Node = null
// LIFE-CYCLE CALLBACKS:
@ -37,8 +28,7 @@ export default class WalletMainPanel extends WalletBase {
start () {
super.start()
this.wallet.uiHandlers.on(WALLET_SHOW_QR, this.showQrNode.bind(this))
this.wallet.uiHandlers.on(WALLET_SHOW_ACCOUNT_LIST, this.showAccountList.bind(this))
this.modalLayer.active = false
}
// update (dt) {}
@ -56,33 +46,9 @@ export default class WalletMainPanel extends WalletBase {
}
}
private fetchNode(tag: string, preb: cc.Prefab) {
if (!this.subNodeMap.has(tag)) {
const node = cc.instantiate(preb)
node.x = 0
node.y = 0
this.node.addChild(node)
this.subNodeMap.set(tag, node)
}
return this.subNodeMap.get(tag)
}
onMenuClick() {
const tag = 'menu-node'
const node = this.fetchNode(tag, this.menuPreb)
node.active = true
}
showQrNode(data: IQRCfg) {
const tag = 'qr-node'
const node = this.fetchNode(tag, this.qrPreb)
node.getComponent('QrNode').showQr(data)
node.active = true
}
showAccountList() {
const tag = 'account-list-node'
const node = this.fetchNode(tag, this.accountPreb)
node.active = true
this.wallet.uiHandlers.emit(WALLET_SHOW_MODAL, {tag: 'menu'})
}
}

View File

@ -17,7 +17,7 @@
"__id__": 2
},
{
"__id__": 190
"__id__": 196
}
],
"_active": false,
@ -87,13 +87,13 @@
"_level": 1,
"_components": [
{
"__id__": 187
"__id__": 193
},
{
"__id__": 188
"__id__": 194
},
{
"__id__": 191
"__id__": 197
}
],
"_prefab": null,
@ -4645,19 +4645,22 @@
},
{
"__id__": 145
},
{
"__id__": 184
}
],
"_active": true,
"_level": 1,
"_components": [
{
"__id__": 184
"__id__": 190
},
{
"__id__": 185
"__id__": 191
},
{
"__id__": 186
"__id__": 192
}
],
"_prefab": null,
@ -7963,6 +7966,269 @@
},
"_id": "8bO0XBvlFDPJ87FOgdOxUH"
},
{
"__type__": "cc.Node",
"_name": "modalLayer",
"_objFlags": 0,
"_parent": {
"__id__": 102
},
"_children": [
{
"__id__": 185
},
{
"__id__": 187
}
],
"_active": true,
"_level": 2,
"_components": [
{
"__id__": 188
},
{
"__id__": 189
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 1024,
"height": 512
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_position": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_scale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_rotationX": 0,
"_rotationY": 0,
"_quat": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_skewX": 0,
"_skewY": 0,
"groupIndex": 0,
"_id": "c1mGkLJ6dHb4pjbr2DchdI"
},
{
"__type__": "cc.Node",
"_name": "New Sprite(Splash)",
"_objFlags": 0,
"_parent": {
"__id__": 184
},
"_children": [],
"_active": true,
"_level": 3,
"_components": [
{
"__id__": 186
}
],
"_prefab": null,
"_opacity": 101,
"_color": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 0,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 1024,
"height": 520
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_position": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_scale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_rotationX": 0,
"_rotationY": 0,
"_quat": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_skewX": 0,
"_skewY": 0,
"groupIndex": 0,
"_id": "415A5z811MhYH7qKql0+gy"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 185
},
"_enabled": true,
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "a23235d1-15db-4b95-8439-a2e005bfff91"
},
"_type": 0,
"_sizeMode": 0,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_state": 0,
"_atlas": null,
"_id": "58h5Xfb51JP7AX6nomzWhI"
},
{
"__type__": "cc.Node",
"_name": "New Node",
"_objFlags": 0,
"_parent": {
"__id__": 184
},
"_children": [],
"_active": true,
"_level": 3,
"_components": [],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 0,
"height": 0
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_position": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_scale": {
"__type__": "cc.Vec3",
"x": 1,
"y": 1,
"z": 1
},
"_rotationX": 0,
"_rotationY": 0,
"_quat": {
"__type__": "cc.Quat",
"x": 0,
"y": 0,
"z": 0,
"w": 1
},
"_skewX": 0,
"_skewY": 0,
"groupIndex": 0,
"_id": "bdFImgV0tI9JnYWxtINnex"
},
{
"__type__": "cc.Widget",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 184
},
"_enabled": true,
"alignMode": 1,
"_target": null,
"_alignFlags": 45,
"_left": 0,
"_right": 0,
"_top": 0,
"_bottom": 0,
"_verticalCenter": 0,
"_horizontalCenter": 0,
"_isAbsLeft": true,
"_isAbsRight": true,
"_isAbsTop": true,
"_isAbsBottom": true,
"_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true,
"_originalWidth": 100,
"_originalHeight": 100,
"_id": "c9ogJIiP1D24fIInau2N06"
},
{
"__type__": "4b4b4MWiC1ExoPhhvjSarX5",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 184
},
"_enabled": true,
"menuPreb": {
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
"accountPreb": {
"__uuid__": "66a824c7-abec-49e8-8df0-d7844859a93e"
},
"qrPreb": {
"__uuid__": "0f14a371-be16-44a1-adcf-319d54c7ba3d"
},
"contentNode": {
"__id__": 187
},
"_id": "98D/pqbhtBAYBuPHol3ueQ"
},
{
"__type__": "cc.Widget",
"_name": "",
@ -8032,6 +8298,9 @@
"listNode": {
"__id__": 143
},
"modalLayer": {
"__id__": 184
},
"menuPreb": {
"__uuid__": "0bfa7bbc-42ab-4204-9fe7-3cd9b56eb045"
},
@ -8069,7 +8338,7 @@
},
"_enabled": true,
"webview": {
"__id__": 189
"__id__": 195
},
"debugText": {
"__id__": 6
@ -8082,7 +8351,7 @@
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 190
"__id__": 196
},
"_enabled": true,
"_useOriginalSize": false,
@ -8102,7 +8371,7 @@
"_level": 1,
"_components": [
{
"__id__": 189
"__id__": 195
}
],
"_prefab": null,