last update

This commit is contained in:
huangjinming 2023-12-27 14:14:28 +08:00
parent 8e0e139475
commit d22e76c3f0
48 changed files with 537 additions and 396 deletions

View File

@ -1,2 +1,2 @@
VUE_APP_BASE_API='https://game2006api-test.kingsome.cn' VUE_APP_BASE_API='https://market.cebg.games'
VUE_APP_GPAL_API='http://192.168.100.83:4000/sns' VUE_APP_GPAL_API='http://192.168.100.83:4000/sns'

View File

@ -1 +1 @@
VUE_APP_BASE_API='https://game2006api-test.kingsome.cn' VUE_APP_BASE_API='https://market.cebg.games'

Binary file not shown.

View File

@ -2,9 +2,38 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/logo.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CEBG - Anime PUBG on fire!</title> <title>Counter Fire</title>
<meta property="og:title" content="Counter Fire" />
<meta
property="og:description"
content="CounterFire.games"
/>
<meta
name="description"
content="CounterFire.games"
/>
<meta
name="keywords"
content="CounterFireCFGamefiWeb3web3gaming; Cf game;Cf mobile; CounterFire googleplay; CounterFire Appstore;
battle royale;token;airdrop;p2e; play to earn, free to play, blockchain game;Arbitrum game;Arbitrum. Cryptocurrency; Cryptoanime gameanime web3 gameTwo-dimensional gameshooting gameAnime shooting mobile game"
/>
<meta property="og:type" content="website" />
<meta property="og:url" content="https://m.counterfire.games/" />
<!-- <meta
property="og:image"
content="https://m.counterfire.games/counter.png"
/> -->
<!-- <meta property="og:site_name" content="Counter Fire" /> -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:title" content="Counter Fire" />
<!-- <meta
property="twitter:image"
content="https://m.counterfire.games/counter.png"
/> -->
</head> </head>
<script type="module"> <script type="module">
import {Buffer} from 'buffer'; import {Buffer} from 'buffer';

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

BIN
mobile/public/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.9 KiB

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 510 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 110 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 337 KiB

After

Width:  |  Height:  |  Size: 626 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 MiB

After

Width:  |  Height:  |  Size: 504 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.9 MiB

After

Width:  |  Height:  |  Size: 598 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 8.6 KiB

View File

@ -66,6 +66,7 @@ export default class ChainManager {
await this.bc.connect(true) await this.bc.connect(true)
await this.checkNance() await this.checkNance()
} catch (err) { } catch (err) {
this.bc.walletType = 0
message.error(err.message, 5) message.error(err.message, 5)
await Promise.reject(err) await Promise.reject(err)
} }
@ -93,6 +94,7 @@ export default class ChainManager {
AppModule.updateStep(1) AppModule.updateStep(1)
} catch (err) { } catch (err) {
console.log(err) console.log(err)
this.bc.walletType = 0
await Promise.reject(err) await Promise.reject(err)
} }
} }

View File

@ -1,28 +1,26 @@
import WalletConnectProvider from '@walletconnect/web3-provider' import WalletConnectProvider from "@walletconnect/web3-provider";
import { useAppStore } from '@/store/app' import { useAppStore } from "@/store/app";
import Web3 from 'web3' import Web3 from "web3";
import { import { AVAILABLE_CHAINS, CONTRACT_ADDRESS } from "@/configs/configchain";
AVAILABLE_CHAINS, import { useUserStore } from "@/store/user";
CONTRACT_ADDRESS, import { isMobile } from "@/utils/resize";
} from '@/configs/configchain' import { hasMetamask, toHexChainId, hasOKExWallet } from "@/utils/chain.util";
import { useUserStore } from '@/store/user' import { AllChains } from "@/configs/allchain";
import { isMobile } from '@/utils/resize' import { ERC20ABI } from "@/configs/contracts";
import { hasMetamask, toHexChainId } from '@/utils/chain.util' import { TransactionReceipt } from "web3-core";
import { AllChains } from '@/configs/allchain' import { useEventBus } from "@vueuse/core";
import { ERC20ABI } from '@/configs/contracts' import * as bus_event from "@/bus/event";
import { TransactionReceipt } from 'web3-core' import pinia from "@/store";
import { useEventBus } from '@vueuse/core'; import { message } from "ant-design-vue";
import * as bus_event from '@/bus/event';
import pinia from '@/store';
const EIP721_DOMAIN_DATA = [ const EIP721_DOMAIN_DATA = [
{ name: 'name', type: 'string' }, { name: "name", type: "string" },
{ name: 'version', type: 'string' }, { name: "version", type: "string" },
{ name: 'chainId', type: 'uint256' }, { name: "chainId", type: "uint256" },
{ name: 'verifyingContract', type: 'address' } { name: "verifyingContract", type: "address" },
] ];
const CACHE_KEY = 'cebg_chain_cache_key' const CACHE_KEY = "cebg_chain_cache_key";
const busShowChainModal = useEventBus(bus_event.SHOW_CHAIN_MODAL); const busShowChainModal = useEventBus(bus_event.SHOW_CHAIN_MODAL);
const busNeedChangeChain = useEventBus(bus_event.NEED_CHANGE_CHAIN); const busNeedChangeChain = useEventBus(bus_event.NEED_CHANGE_CHAIN);
@ -33,87 +31,99 @@ const AppModule = useAppStore(pinia);
const UserModule = useUserStore(pinia); const UserModule = useUserStore(pinia);
export class Blockchain { export class Blockchain {
provider:any provider: any;
web3: Web3 web3: Web3;
currentChain = 0 currentChain = 0;
// 0: null, 1: metamask, 2: walletconnect // 0: null, 1: metamask, 2: walletconnect
walletType = 0 walletType = 0;
dataCached = false dataCached = false;
instanceCacheMap: Map<string, any> instanceCacheMap: Map<string, any>;
public chainMap: Map<number, any> = new Map() public chainMap: Map<number, any> = new Map();
public rpc: any = {} public rpc: any = {};
constructor() { constructor() {
const allChainMap: Map<number, any> = new Map() const allChainMap: Map<number, any> = new Map();
for (const d of AllChains) { for (const d of AllChains) {
const id = d.id const id = d.id;
this.rpc[id] = d.rpc this.rpc[id] = d.rpc;
allChainMap.set(id, d) allChainMap.set(id, d);
} }
for (const id of AVAILABLE_CHAINS) { for (const id of AVAILABLE_CHAINS) {
this.chainMap.set(id, allChainMap.get(id)!) this.chainMap.set(id, allChainMap.get(id)!);
} }
this.loadCachedProvider() this.loadCachedProvider();
this.instanceCacheMap = new Map() this.instanceCacheMap = new Map();
// AppModule.updateChainID(chainId) // AppModule.updateChainID(chainId)
busNeedLogin.on(this.connect.bind(this)); busNeedLogin.on(this.connect.bind(this));
} }
get isWalletConnect() { get isWalletConnect() {
return !!this.walletType && !!this.currentChain return !!this.walletType && !!this.currentChain;
} }
get mallAddress() { get mallAddress() {
return CONTRACT_ADDRESS[this.currentChain]?.mall return CONTRACT_ADDRESS[this.currentChain]?.mall;
} }
public get hexChainId() { public get hexChainId() {
return toHexChainId(this.currentChain) return toHexChainId(this.currentChain);
} }
public async chainSelected(id: number) { public async chainSelected(id: number) {
if (!this.chainMap.has(id)) { if (!this.chainMap.has(id)) {
return return;
} }
this.currentChain = id this.currentChain = id;
if (this.provider) { if (this.provider) {
await this.switchEthereumChain() await this.switchEthereumChain();
} else { } else {
await this.connectWallet(true) await this.connectWallet(true);
} }
} }
public async connectWallet(isManual: boolean) { public async connectWallet(isManual: boolean) {
console.log('begin connect to wallet: ', this.walletType, this.currentChain) console.log(
"begin connect to wallet: ",
this.walletType,
this.currentChain
);
if (this.walletType === 1) { if (this.walletType === 1) {
this.provider = await this.connectMetaMask() this.provider = await this.connectMetaMask();
} else if (this.walletType === 2) { } else if (this.walletType === 2) {
this.provider = await this.connectWalletConnect() this.provider = await this.connectokxwallet();
} }
if (!this.provider) { if (!this.provider) {
return return;
} }
this.web3 = new Web3(this.provider) this.web3 = new Web3(this.provider);
const chainId = await this.web3.eth.getChainId() const chainId = await this.web3.eth.getChainId();
await this.checkChain(chainId) await this.checkChain(chainId);
this.subscribeToEvents() this.subscribeToEvents();
const accounts = await this.web3.eth.getAccounts() ///const accounts = await this.web3.eth.getAccounts()
if (accounts && accounts.length > 0) { let accounts;
AppModule.updateAccount(accounts[0]) if (this.walletType === 1) {
accounts = await this.web3.eth.getAccounts();
} else {
accounts = await this.provider.request({
method: "eth_requestAccounts",
});
} }
if (!this.currentChain) this.currentChain = chainId if (accounts && accounts.length > 0) {
this.saveProvider() AppModule.updateAccount(accounts[0]);
AppModule.updateChainID(chainId) }
AppModule.updateWalletStatus(true) if (!this.currentChain) this.currentChain = chainId;
console.log('current login chain: ', chainId) this.saveProvider();
console.log('accountsLogin: ', accounts, AppModule.accountId) AppModule.updateChainID(chainId);
AppModule.updateWalletStatus(true);
console.log("current login chain: ", chainId);
console.log("accountsLogin: ", accounts, AppModule.accountId);
if (isManual) { if (isManual) {
busNeedNonce.emit(busNeedNonce); busNeedNonce.emit(busNeedNonce);
} else { } else {
AppModule.updateStep(1) AppModule.updateStep(1);
} }
return { account: accounts[0], chainId } return { account: accounts[0], chainId };
} }
/** /**
@ -128,9 +138,9 @@ export class Blockchain {
if (!this.chainMap.has(chainId)) { if (!this.chainMap.has(chainId)) {
// if (this.walletType === 1) { // if (this.walletType === 1) {
try { try {
await this.selectChain() await this.selectChain();
} catch (err) { } catch (err) {
await this.disconnect() await this.disconnect();
} }
// } else if (this.walletType === 2) { // } else if (this.walletType === 2) {
// await this.disconnect() // await this.disconnect()
@ -147,22 +157,19 @@ export class Blockchain {
} }
public async connect(isManual = false) { public async connect(isManual = false) {
if (isMobile()) { if (hasMetamask() || hasOKExWallet()) {
if (hasMetamask()) {
this.walletType = 1
} else {
this.walletType = 2
}
} else {
if (hasMetamask()) {
if (isManual && !this.walletType) { if (isManual && !this.walletType) {
this.walletType = await this.selectWallet() this.walletType = await this.selectWallet();
} }
} else { } else {
this.walletType = 2 if (isManual) {
this.walletType = await this.selectWallet();
} }
} }
if (isManual || this.isWalletConnect) { await this.connectWallet(isManual) }
if (isManual && this.walletType) {
await this.connectWallet(isManual);
}
} }
/** /**
@ -174,15 +181,36 @@ export class Blockchain {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
busShowChainModal.emit({ busShowChainModal.emit({
confirm: (id: number) => { confirm: (id: number) => {
console.log('select wallet: ', id) console.log("select wallet: ", id);
resolve && resolve(id) if (id == 1) {
if (!hasMetamask()) {
var next = window.location.href;
var url = `https://metamask.app.link/dapp/${next}`;
location.href = url;
} else {
resolve && resolve(id);
}
} else if (id == 2) {
const ua = navigator.userAgent;
const isIOS = /iphone|ipad|ipod|ios/i.test(ua);
const isAndroid = /android|XiaoMi|MiuiBrowser/i.test(ua);
const isMobile = isIOS || isAndroid;
const isOKApp = /OKApp/i.test(ua);
if (isMobile && isOKApp) {
resolve && resolve(id);
} else {
var next = window.location.href;
window.open(`okx://wallet/dapp/details?dappUrl=${next}`);
}
}
}, },
cancel: (reason: any) => { cancel: (reason: any) => {
console.log('cancel select wallet: ', reason) console.log("cancel select wallet: ", reason);
reject && reject(reason) reject && reject(reason);
} },
}) });
}) });
} }
/** /**
@ -193,28 +221,28 @@ export class Blockchain {
private selectChain(): Promise<number> { private selectChain(): Promise<number> {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
busNeedChangeChain.emit({ busNeedChangeChain.emit({
confirm: async(id: number) => { confirm: async (id: number) => {
console.log('select chain: ', id) console.log("select chain: ", id);
this.currentChain = id this.currentChain = id;
if (this.provider) { if (this.provider) {
await this.switchEthereumChain() await this.switchEthereumChain();
} }
resolve && resolve(id) resolve && resolve(id);
}, },
cancel: (reason: any) => { cancel: (reason: any) => {
console.log('cancel select chain: ', reason) console.log("cancel select chain: ", reason);
reject && reject(reason) reject && reject(reason);
} },
}) });
}) });
} }
public async connectMetaMask() { public async connectMetaMask() {
let provider = null let provider = null;
if (typeof window.ethereum !== 'undefined') { if (typeof window.ethereum !== "undefined") {
provider = window.ethereum provider = window.ethereum;
try { try {
await provider.request({ method: 'eth_requestAccounts' }) await provider.request({ method: "eth_requestAccounts" });
} catch (error: any) { } catch (error: any) {
if (error.code === -32002) { if (error.code === -32002) {
// const hexChainId = toHexChainId(this.currentChain) // const hexChainId = toHexChainId(this.currentChain)
@ -222,65 +250,91 @@ export class Blockchain {
// method: 'wallet_switchEthereumChain', // method: 'wallet_switchEthereumChain',
// params: [{ chainId: hexChainId }] // params: [{ chainId: hexChainId }]
// }) // })
throw new Error('MeatMask not login, Open MeatMask and login first') throw new Error("MeatMask not login, Open MeatMask and login first");
} else { } else {
throw new Error('User Rejected') throw new Error("User Rejected");
} }
} }
} else if (window.web3) { } else if (window.web3) {
provider = window.web3.currentProvider provider = window.web3.currentProvider;
} else if (window.celo) { } else if (window.celo) {
provider = window.celo provider = window.celo;
} else { } else {
throw new Error('No Web3 Provider found') this.walletType = 0;
// message.error('No Web3 Provider found');
throw new Error("No Web3 Provider found");
} }
return provider return provider;
}
public async connectokxwallet() {
let provider = null;
if (typeof window.okxwallet !== "undefined") {
provider = window.okxwallet;
try {
await provider.request({ method: "eth_requestAccounts" });
} catch (error: any) {
if (error.code === -32002) {
// const hexChainId = toHexChainId(this.currentChain)
// await provider.request({
// method: 'wallet_switchEthereumChain',
// params: [{ chainId: hexChainId }]
// })
throw new Error("OKX Wallet not login, Open OKX Wallet and login first");
} else {
this.walletType = 0;
throw new Error("User Rejected");
}
}
} else {
this.walletType = 0;
// message.error('No Web3 Provider found');
throw new Error("No Web3 Provider found");
}
return provider;
} }
public async connectWalletConnect() { public async connectWalletConnect() {
const provider = new WalletConnectProvider({ const provider = new WalletConnectProvider({
infuraId: import.meta.env.VUE_APP_WALLET_INFURAID, infuraId: import.meta.env.VUE_APP_WALLET_INFURAID,
rpc: this.rpc rpc: this.rpc,
}) });
try { try {
await provider.enable() await provider.enable();
} catch (err) { } catch (err) {
console.log('connect to wallet connect error: ', err) console.log("connect to wallet connect error: ", err);
await Promise.reject(err) await Promise.reject(err);
} }
return provider return provider;
} }
public async getContractInstance(address: string, abi: any = ERC20ABI) { public async getContractInstance(address: string, abi: any = ERC20ABI) {
if (!this.instanceCacheMap.has(address)) { if (!this.instanceCacheMap.has(address)) {
const instance = new this.web3.eth.Contract( const instance = new this.web3.eth.Contract(abi, address, {
abi, from: AppModule.accountId,
address, });
{ from: AppModule.accountId } this.instanceCacheMap.set(address, instance);
)
this.instanceCacheMap.set(address, instance)
} }
return this.instanceCacheMap.get(address) return this.instanceCacheMap.get(address);
} }
public clearCachedProvider() { public clearCachedProvider() {
console.log('clear cached provider') console.log("clear cached provider");
localStorage.removeItem(CACHE_KEY) localStorage.removeItem(CACHE_KEY);
} }
public loadCachedProvider() { public loadCachedProvider() {
const dataStr = localStorage.getItem(CACHE_KEY) const dataStr = localStorage.getItem(CACHE_KEY);
if (dataStr) { if (dataStr) {
try { try {
const data = JSON.parse(dataStr) const data = JSON.parse(dataStr);
this.walletType = data.walletType this.walletType = data.walletType;
if (this.chainMap.has(data.chainId)) { if (this.chainMap.has(data.chainId)) {
this.currentChain = data.chainId this.currentChain = data.chainId;
} }
} catch (err) { } catch (err) {
console.log('err parse cached json') console.log("err parse cached json");
this.clearCachedProvider() this.clearCachedProvider();
} }
} }
} }
@ -288,55 +342,54 @@ export class Blockchain {
public saveProvider() { public saveProvider() {
const data = { const data = {
walletType: this.walletType, walletType: this.walletType,
chainId: this.currentChain chainId: this.currentChain,
} };
localStorage.setItem(CACHE_KEY, JSON.stringify(data)) localStorage.setItem(CACHE_KEY, JSON.stringify(data));
} }
public async disconnect() { public async disconnect() {
try { try {
await UserModule.Logout() await UserModule.Logout();
await this.provider?.disconnect() await this.provider?.disconnect();
} catch (err) { } catch (err) {}
} this.currentChain = 0;
this.currentChain = 0 this.walletType = 0;
this.walletType = 0 this.instanceCacheMap.clear();
this.instanceCacheMap.clear() this.clearCachedProvider();
this.clearCachedProvider() AppModule.updateStep(0);
AppModule.updateStep(0) AppModule.updateChainID(0);
AppModule.updateChainID(0) AppModule.updateNonce("");
AppModule.updateNonce('') AppModule.updateAccount("");
AppModule.updateAccount('') AppModule.updateWalletStatus(false);
AppModule.updateWalletStatus(false)
} }
public subscribeToEvents = () => { public subscribeToEvents = () => {
// Subscribe to accounts change // Subscribe to accounts change
this.provider.on('accountsChanged', async(accounts: string[]) => { this.provider.on("accountsChanged", async (accounts: string[]) => {
console.log('accountsChanged: ', accounts) console.log("accountsChanged: ", accounts);
if (accounts && accounts.length > 0) { if (accounts && accounts.length > 0) {
if (AppModule.accountId !== accounts[0]) { if (AppModule.accountId !== accounts[0]) {
await UserModule.Logout() await UserModule.Logout();
location.reload() location.reload();
} }
} }
}) });
// Subscribe to chainId change // Subscribe to chainId change
this.provider.on('chainChanged', async(chainId: string) => { this.provider.on("chainChanged", async (chainId: string) => {
const chainIdNum = parseInt(chainId) const chainIdNum = parseInt(chainId);
console.log('chainChanged', chainId, chainIdNum) console.log("chainChanged", chainId, chainIdNum);
await this.checkChain(chainIdNum) await this.checkChain(chainIdNum);
this.currentChain = chainIdNum this.currentChain = chainIdNum;
this.saveProvider() this.saveProvider();
AppModule.updateChainID(this.currentChain) AppModule.updateChainID(this.currentChain);
}) });
// Subscribe to session disconnection // Subscribe to session disconnection
this.provider.on('disconnect', (err: any) => { this.provider.on("disconnect", (err: any) => {
console.log('disconnect', err) console.log("disconnect", err);
}) });
} };
/** /**
* change chain of metamask * change chain of metamask
@ -345,27 +398,27 @@ export class Blockchain {
* @return {Promise<void>} * @return {Promise<void>}
*/ */
async switchEthereumChain(chainId?: number, cb?: () => void) { async switchEthereumChain(chainId?: number, cb?: () => void) {
chainId = chainId || this.currentChain chainId = chainId || this.currentChain;
const hexChainId = toHexChainId(chainId) const hexChainId = toHexChainId(chainId);
const onChainChange = (chainId: string) => { const onChainChange = (chainId: string) => {
console.log('switchEthereumChain: ', chainId) console.log("switchEthereumChain: ", chainId);
this.provider.removeListener('chainChanged', onChainChange) this.provider.removeListener("chainChanged", onChainChange);
cb && cb() cb && cb();
} };
this.provider.on('chainChanged', onChainChange) this.provider.on("chainChanged", onChainChange);
try { try {
await this.provider.request({ await this.provider.request({
method: 'wallet_switchEthereumChain', method: "wallet_switchEthereumChain",
params: [{ chainId: hexChainId }] params: [{ chainId: hexChainId }],
}) });
console.log('switch chain success') console.log("switch chain success");
} catch (e: any) { } catch (e: any) {
console.log('switch chain error: ', e) console.log("switch chain error: ", e);
if (e.code === 4902 || e.message.indexOf('Unrecognized chain ID') >= 0) { if (e.code === 4902 || e.message.indexOf("Unrecognized chain ID") >= 0) {
try { try {
const data = this.chainMap.get(chainId)! const data = this.chainMap.get(chainId)!;
await this.provider.request({ await this.provider.request({
method: 'wallet_addEthereumChain', method: "wallet_addEthereumChain",
params: [ params: [
{ {
chainId: hexChainId, chainId: hexChainId,
@ -373,17 +426,17 @@ export class Blockchain {
nativeCurrency: { nativeCurrency: {
name: data.symbol, name: data.symbol,
symbol: data.symbol, symbol: data.symbol,
decimals: data.decimals || 18 decimals: data.decimals || 18,
}, },
blockExplorerUrls: [data.explorerurl], blockExplorerUrls: [data.explorerurl],
rpcUrls: [data.rpc] rpcUrls: [data.rpc],
} },
] ],
}) });
console.log('add chain success') console.log("add chain success");
} catch (addError) { } catch (addError) {
console.error('add chain error: ', addError) console.error("add chain error: ", addError);
this.provider.removeListener('chainChanged', onChainChange) this.provider.removeListener("chainChanged", onChainChange);
} }
} }
// console.error(e) // console.error(e)
@ -391,59 +444,68 @@ export class Blockchain {
} }
public async getTransactionReceipt(txHash: string) { public async getTransactionReceipt(txHash: string) {
return this.web3.eth.getTransactionReceipt(txHash) return this.web3.eth.getTransactionReceipt(txHash);
} }
public async getTxConfirms(txhash: string) { public async getTxConfirms(txhash: string) {
const receipt: TransactionReceipt = await this.getTransactionReceipt(txhash) const receipt: TransactionReceipt = await this.getTransactionReceipt(
const latest = await this.web3.eth.getBlockNumber() txhash
return latest - receipt.blockNumber + 1 );
const latest = await this.web3.eth.getBlockNumber();
return latest - receipt.blockNumber + 1;
} }
public async signPresale({ type, paymentTokenAddress, price, buyerAddress, netId }: public async signPresale({
{ type,
type: number | string paymentTokenAddress,
paymentTokenAddress: string price,
price: any buyerAddress,
buyerAddress: string netId,
netId?: any }: {
type: number | string;
paymentTokenAddress: string;
price: any;
buyerAddress: string;
netId?: any;
}) { }) {
const nonce = Math.random() * 100000 | 0 const nonce = (Math.random() * 100000) | 0;
const signMsg = { const signMsg = {
item: type, item: type,
token: paymentTokenAddress, token: paymentTokenAddress,
price: price, price: price,
salt: nonce salt: nonce,
} };
netId = netId || await this.web3.eth.getChainId() netId = netId || (await this.web3.eth.getChainId());
const signObj = { const signObj = {
types: { types: {
EIP712Domain: EIP721_DOMAIN_DATA, EIP712Domain: EIP721_DOMAIN_DATA,
set: [ set: [
{ name: 'item', type: 'uint256' }, { name: "item", type: "uint256" },
{ name: 'token', type: 'address' }, { name: "token", type: "address" },
{ name: 'price', type: 'uint256' }, { name: "price", type: "uint256" },
{ name: 'salt', type: 'uint256' } { name: "salt", type: "uint256" },
] ],
}, },
primaryType: 'set', primaryType: "set",
domain: { domain: {
name: 'BEBoxMall', name: "BEBoxMall",
version: '1', version: "1",
chainId: netId, chainId: netId,
verifyingContract: this.mallAddress verifyingContract: this.mallAddress,
}, },
message: signMsg message: signMsg,
} };
const signature = await this.signData(signObj, buyerAddress) const signature = await this.signData(signObj, buyerAddress);
return { nonce, signature } return { nonce, signature };
} }
public async increaseAllowance(address: string, price: string) { public async increaseAllowance(address: string, price: string) {
const coinInstance: any = await this.getContractInstance(address) const coinInstance: any = await this.getContractInstance(address);
const res = await coinInstance.methods.increaseAllowance(this.mallAddress, price).send({ gas: 1000000 }) const res = await coinInstance.methods
console.log('increaseAllowance: ', res) .increaseAllowance(this.mallAddress, price)
.send({ gas: 1000000 });
console.log("increaseAllowance: ", res);
} }
/** /**
@ -452,48 +514,55 @@ export class Blockchain {
* @return {Promise<any>} * @return {Promise<any>}
*/ */
public async getBalance(address: string, account: string | null) { public async getBalance(address: string, account: string | null) {
account = account || AppModule.accountId account = account || AppModule.accountId;
const coinInstance: any = await this.getContractInstance(address) const coinInstance: any = await this.getContractInstance(address);
return await coinInstance.methods.balanceOf(account).call() return await coinInstance.methods.balanceOf(account).call();
} }
public async transferToAccount(account: string, amount: number, address: string) { public async transferToAccount(
const amountBN = this.web3.utils.toBN(this.web3.utils.toWei(amount + '')) account: string,
const coinInstance: any = await this.getContractInstance(address) amount: number,
address: string
) {
const amountBN = this.web3.utils.toBN(this.web3.utils.toWei(amount + ""));
const coinInstance: any = await this.getContractInstance(address);
return coinInstance.methods return coinInstance.methods
.transfer(account, amountBN) .transfer(account, amountBN)
.send({ gas: 1000000 }) .send({ gas: 1000000 });
} }
public async signData(signObj: any, signer: string) { public async signData(signObj: any, signer: string) {
const msgParams = JSON.stringify(signObj) const msgParams = JSON.stringify(signObj);
const from = signer const from = signer;
console.log('clicked, sending personal sign req', 'from', from, msgParams) console.log("clicked, sending personal sign req", "from", from, msgParams);
const params = [from, msgParams] const params = [from, msgParams];
const result: any = await this.sendCmd({ const result: any = await this.sendCmd({
method: 'eth_signTypedData_v4', method: "eth_signTypedData_v4",
params, params,
from from,
}) });
console.log(result) console.log(result);
return result.result return result.result;
} }
public async sendCmd({ method, params, from }: any) { public async sendCmd({ method, params, from }: any) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment // eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore // @ts-ignore
this.web3.currentProvider.sendAsync({ this.web3.currentProvider.sendAsync(
{
method, method,
params, params,
from from,
}, async function(err: any, result: any) { },
async function (err: any, result: any) {
if (err) { if (err) {
reject && reject(err) reject && reject(err);
return return;
} }
resolve && resolve(result) resolve && resolve(result);
}) }
}) );
});
} }
} }

View File

@ -8,7 +8,7 @@
</div> </div>
<div class="slogan"> <div class="slogan">
<div class="cebg-stands"> <div class="cebg-stands">
CEBG stands for Crypto Elite's: BATTLEGROUNDS, the first Counter Fire stands for Crypto Elite's: BATTLEGROUNDS, the first
blockchain-based game consisting of Moba, and Battle royal. It's blockchain-based game consisting of Moba, and Battle royal. It's
funded by more than 7 institutional investors. funded by more than 7 institutional investors.
</div> </div>

View File

@ -93,7 +93,7 @@ const HistoryList = reactive([
time: "2022.11", time: "2022.11",
content: [ content: [
"3D TPS-Hero Version upgrade", "3D TPS-Hero Version upgrade",
"CEBG in-app wallet", "Counter Fire in-app wallet",
"Social System", "Social System",
"Free-to-Play NFT mode", "Free-to-Play NFT mode",
], ],

View File

@ -25,7 +25,6 @@
:modules="modules" :modules="modules"
:loop="true" :loop="true"
:slides-per-view="1" :slides-per-view="1"
:autoplay="{ delay: 4000, disableOnInteraction: false }"
:pagination="{ clickable: true }" :pagination="{ clickable: true }"
> >
<!-- loop可循环轮播autoplay可自动播放 --> <!-- loop可循环轮播autoplay可自动播放 -->
@ -39,7 +38,35 @@
<img src="../../assets/img/about/roadmap-time-top.png" alt="" /> <img src="../../assets/img/about/roadmap-time-top.png" alt="" />
</div> </div>
<div class="time-content-content"> <div class="time-content-content">
<div class="text" v-html="item.content"></div> <div class="text" v-show="index == 0">
<div class="text-item">Ops Manager in Shanda Group</div>
<div class="text-item">
Co-Founder of Giant Interactive(NYSE:GA)
</div>
<div class="text-item">
Founder of FH Capital, investing in ThinkingData, 91ACT,
Inke(HK:03700), etc
</div>
<div class="text-item">
Founder of Bubble Candy Studio to build Counter Fire
</div>
</div>
<!-- <div class="text" v-show="index == 1">
<div class="text-item">Gaming data expert in Giant Interactive</div>
<div class="text-item">Core data officer of Foxconn Group (TPE:2354)</div>
<div class="text-item">Gaming Economist in Bubble Candy Studio</div>
</div> -->
<div class="text" v-show="index == 1">
<div class="text-item">4 million-player games in Shanda Group</div>
<div class="text-item"> Producer in RobTop Games to build "Geometry Battle Royale" with 20m gamers</div>
<div class="text-item"> Porducer of Counter Fire</div>
</div>
<div class="text" v-show="index == 2">
<div class="text-item"> Tech Director in Shanda Group</div>
<div class="text-item"> In charge of Legends of the world, The Romance of Legends, etc</div>
<div class="text-item">Expert in Crypto Tech, developing all decentralized products in Counter Fire</div>
</div>
</div> </div>
</div> </div>
</swiper-slide> </swiper-slide>
@ -67,27 +94,22 @@ const positionY1 = ref(0); //背景Y轴偏移量
const HistoryList = reactive([ const HistoryList = reactive([
{ {
title: "FOUNDER", title: "Michael",
time: "MICHEAL YUE", time: "Founder/CEO",
content: content:
"Co-Founder of Giant Interactive(NYSE:GA)<br />Ops Manager in ShandaGroup", "- Ops Manager in Shanda &nbsp;&nbsp; Group <br /> - Co-Founder of Giant<br /> &nbsp;&nbsp;Interactive(NYSE:GA) <br /> - Founder of FH Capital,<br /> investing in ThinkingData,<br /> 91ACT,Inke(HK:03700), etc <br />- Founder of Bubble &nbsp;&nbsp;Candy Studio to build &nbsp;&nbsp;CEBG",
}, },
{ {
title: "GAMING ECONOMIST", title: "Super G",
time: "YODA", time: "Producer",
content: content:
"Core data officer of Foxconn GroupGaming data expert in Giant Interactive", '- 4 million-player games &nbsp;&nbsp;in Shanda Group<br /> - Producer in RobTop &nbsp;&nbsp;Games to build<br /> "Geometry Battle Royale"<br/>&nbsp;&nbsp; with 20m gamers<br /> - Porducer of CEBG',
}, },
{ {
title: "PRODUCER", title: "Xin",
time: "SUPER G", time: "CTO",
content: "Worked in Shanda Group with 4 million-player games",
},
{
title: "CTO",
time: "XIN",
content: content:
"In charge of Legend, Legends of the world, The Romance of Legends, etc", " - Tech Director in Shanda &nbsp;&nbsp;&nbsp;Group<br /> - In charge of Legends of &nbsp;&nbsp;the world, The<br />&nbsp;&nbsp; Romance of Legends, &nbsp;&nbsp;&nbsp;etc<br /> - Expert in Crypto Tech,<br />&nbsp;&nbsp; developing all &nbsp;&nbsp;&nbsp;decentralized products &nbsp;&nbsp; in CEBG",
}, },
]); ]);
onMounted(() => { onMounted(() => {
@ -109,7 +131,7 @@ function handleScroll() {
.roadmap { .roadmap {
position: relative; position: relative;
// background: #1e393d; // background: #1e393d;
// padding-bottom: 256px; // padding-bottom: 256px;
.roadmap-bg { .roadmap-bg {
position: absolute; position: absolute;
left: 0; left: 0;
@ -198,7 +220,7 @@ function handleScroll() {
.time-content-title { .time-content-title {
text-align: center; text-align: center;
font-size: 40px; font-size: 40px;
font-family: 'Big John'; font-family: "Big John";
font-weight: 400; font-weight: 400;
color: #000000; color: #000000;
line-height: 60px; line-height: 60px;
@ -206,33 +228,44 @@ function handleScroll() {
.time-content-time { .time-content-time {
text-align: center; text-align: center;
font-size: 40px; font-size: 40px;
font-family: 'Big John'; font-family: "Big John";
font-weight: 400; font-weight: 400;
color: #000000; color: #000000;
line-height: 60px; line-height: 60px;
} }
.time-content-content { .time-content-content {
width: 336px; width: 376px;
margin: 0 auto; margin: 0 auto;
height: 436px; height: 486px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
background: url("@/assets/img/about/roadmap-time-bg.png") no-repeat; background: url("@/assets/img/about/roadmap-time-bg.png") no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
font-size: 24px; font-size: 14px;
font-family: "Poppins"; font-family: "Poppins";
font-weight: 500; font-weight: 500;
color: #ffffff; color: #ffffff;
line-height: 62px; line-height: 41px;
.text { .text {
width: 90%; width: 90%;
text-align: center; text-align: left;
// margin-left: 45px; // margin-left: 45px;
position: relative; position: relative;
margin-bottom: 17px; margin-bottom: 17px;
} }
.text-item {
width: 100%;
padding-left: 15px;
overflow-wrap: normal;
position: relative;
}
.text-item::before {
position: absolute;
content: "-";
left: 0px;
}
// .text::after { // .text::after {
// content: " "; // content: " ";
// position: absolute; // position: absolute;

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="chain-modal" v-if="modalShow" :class="{ mobile: 'mobile' }"> <div class="chain-modal mobile" v-if="modalShow">
<div class="modal-bg" @click="cancelSelect"></div> <div class="modal-bg" @click="cancelSelect"></div>
<div class="modal-content" :class="{ mobile: 'mobile' }"> <div class="modal-content mobile">
<div class="modal-title">You need to connect to supported network</div> <div class="modal-title">You need to connect to supported network</div>
<div <div
class="chain-modal-card" class="chain-modal-card"
@ -22,6 +22,7 @@
import { ref, computed, onMounted, onUnmounted } from "vue"; import { ref, computed, onMounted, onUnmounted } from "vue";
import { ALL_PROVIDERS } from "@/configs/configchain"; import { ALL_PROVIDERS } from "@/configs/configchain";
import { useChainStore } from "@/store/chain"; import { useChainStore } from "@/store/chain";
import { isMobile } from "@/utils/resize";
import { useEventBus } from "@vueuse/core"; import { useEventBus } from "@vueuse/core";
import * as bus_event from "@/bus/event"; import * as bus_event from "@/bus/event";
@ -30,8 +31,8 @@ const busNeedChangeChain = useEventBus(bus_event.NEED_CHANGE_CHAIN);
const chain = useChainStore(); const chain = useChainStore();
const modalShow = ref(false); const modalShow = ref(false);
const isMobile = ref(false);
const dataType = ref(1); const dataType = ref(1);
const isMobileScreen = ref(isMobile());
const chainDatas = computed(() => { const chainDatas = computed(() => {
// console.log([...chain.chainManager.availableChains.values()]); // console.log([...chain.chainManager.availableChains.values()]);
return [...chain.chainManager.availableChains.values()]; return [...chain.chainManager.availableChains.values()];
@ -48,7 +49,6 @@ const chainDatas = computed(() => {
// return []; // return [];
// } // }
// }); // });
const currentDatas = computed(() => { const currentDatas = computed(() => {
return ( return (
{ {
@ -64,13 +64,12 @@ let cancelFun = (reason) => {};
onMounted(() => { onMounted(() => {
busShowChainModal.on(showSelectWallet); busShowChainModal.on(showSelectWallet);
busNeedChangeChain.on(showChangeChain); busNeedChangeChain.on(showChangeChain);
if (/Mobi/.test(navigator.userAgent)) { // window.addEventListener("resize", handleResize);
isMobile.value = true;
}
}); });
onUnmounted(() => { onUnmounted(() => {
busShowChainModal.off(showSelectWallet); busShowChainModal.off(showSelectWallet);
busNeedChangeChain.off(showChangeChain); busNeedChangeChain.off(showChangeChain);
// window.removeEventListener("resize", handleResize);
}); });
function showSelectWallet({ confirm, cancel }) { function showSelectWallet({ confirm, cancel }) {
@ -79,11 +78,15 @@ function showSelectWallet({ confirm, cancel }) {
showModal(0); showModal(0);
} }
function handleResize() {
isMobileScreen.value = isMobile();
}
function showChangeChain({ confirm, cancel }) { function showChangeChain({ confirm, cancel }) {
confirmFun = confirm; confirmFun = confirm;
cancelFun = cancel; cancelFun = cancel;
// showModal(0); // showModal(0);
cancelSelect(); showModal(1);
} }
function cardClicked(id) { function cardClicked(id) {
@ -93,7 +96,7 @@ function cardClicked(id) {
} }
function cancelSelect() { function cancelSelect() {
cancelFun && cancelFun("User cancel"); cancelFun();
hideModal(); hideModal();
} }
@ -121,7 +124,7 @@ function hideModal() {
left: 0; left: 0;
overflow: auto; overflow: auto;
margin: 0; margin: 0;
z-index: 10; z-index: 999;
.modal-bg { .modal-bg {
position: absolute; position: absolute;
top: 0; top: 0;

View File

@ -119,8 +119,8 @@
.logo-img { .logo-img {
position: relative; position: relative;
width: 174px; width: 132px;
height: 170px; height: 44px;
filter: grayscale(100%); filter: grayscale(100%);
} }

View File

@ -4,22 +4,27 @@
<div class="title"> <div class="title">
<img src="@/assets/img/mobile-home/banner-slogan.gif" alt="" /> <img src="@/assets/img/mobile-home/banner-slogan.gif" alt="" />
</div> </div>
<div class="download-btns"> <!-- <div class="download-btns">
<div class="download-btns-top">
<div class="andriod"> <div class="andriod">
<a href="https://www.cebg.games/release/cebg.apk"> <a href="https://m.counterfire.games/release/counterfire.apk">
<img src="@/assets/img/mobile-home/andriod.png" alt="" <img src="@/assets/img/mobile-home/andriod.png" alt=""
/></a> /></a>
</div> </div>
<!-- <div class="apple"> <div class="apple">
<img src="@/assets/img/mobile-home/apple.png" alt="" /> <a href="https://apps.apple.com/app/counter%20fire/id6444462915">
</div> --> <img src="@/assets/img/mobile-home/app.png" alt=""
/></a>
</div>
<div class="google"> <div class="google">
<a href="https://play.google.com/store/apps/details?id=com.cege.games.release" <a
href="https://play.google.com/store/apps/details?id=com.cege.games.release"
><img src="@/assets/img/mobile-home/google.png" alt="" ><img src="@/assets/img/mobile-home/google.png" alt=""
/></a> /></a>
</div> </div>
</div> </div>
</div> -->
</div> </div>
<div class="posters"> <div class="posters">
<div class="poster poster-one"></div> <div class="poster poster-one"></div>
@ -83,19 +88,26 @@
} }
.download-btns { .download-btns {
position: absolute; position: absolute;
bottom: 190px; bottom: 160px;
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
display: flex; display: flex;
flex-direction: column;
width: 82%; width: 82%;
justify-content: space-between; justify-content: space-between;
.download-btns-top {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
}
.andriod { .andriod {
width: 265px; width: 265px;
height: 79px; height: 79px;
} }
.apple { .apple {
width: 216px; width: 265px;
height: 66px; height: 79px;
// margin: 0 auto;
} }
.google { .google {
width: 265px; width: 265px;

View File

@ -58,7 +58,7 @@ const box = ref(null);
const myRef = ref(null); const myRef = ref(null);
const { tilt, roll, source } = useParallax(box); const { tilt, roll, source } = useParallax(box);
const imageList = reactive([ const imageList = reactive([
{ imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/01.png", import.meta.url).href }, { imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/01.jpg", import.meta.url).href },
{ imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/02.png", import.meta.url).href }, { imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/02.png", import.meta.url).href },
{ imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/03.png", import.meta.url).href }, { imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/03.png", import.meta.url).href },
{ imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/04.png", import.meta.url).href }, { imgSrc: new URL("@/assets/img/mobile-home/game-swiper-card/04.png", import.meta.url).href },

View File

@ -26,7 +26,7 @@
<div class="slogan"> <div class="slogan">
<div class="slogan-title"> <div class="slogan-title">
Embark on an epic journey as a commander in the captivating 3D world Embark on an epic journey as a commander in the captivating 3D world
of CEBG and engage in thrilling battles against other skilled of Counter Fire and engage in thrilling battles against other skilled
players. Are you ready to rise up and claim victory? players. Are you ready to rise up and claim victory?
</div> </div>
<!-- <div class="slogan-text">fight against other players!</div> --> <!-- <div class="slogan-text">fight against other players!</div> -->
@ -46,8 +46,8 @@
<swiper-slide > <swiper-slide >
<div class="gallery-banner-img"> <div class="gallery-banner-img">
<YoutubeVideo <YoutubeVideo
id="ecC6FAg5N7k" id="ptJPhouPUlE"
src="https://www.youtube.com/watch?v=ecC6FAg5N7k" src="https://www.youtube.com/watch?v=ptJPhouPUlE"
:width="720" :width="720"
:height="435" :height="435"
> >
@ -57,8 +57,8 @@
<swiper-slide > <swiper-slide >
<div class="gallery-banner-img"> <div class="gallery-banner-img">
<YoutubeVideo <YoutubeVideo
id="QRXWmEXfU7E" id="kxix94VzQKA"
src="https://www.youtube.com/watch?v=QRXWmEXfU7E" src="https://www.youtube.com/watch?v=kxix94VzQKA"
:width="720" :width="720"
:height="435" :height="435"
> >
@ -68,25 +68,15 @@
<swiper-slide > <swiper-slide >
<div class="gallery-banner-img"> <div class="gallery-banner-img">
<YoutubeVideo <YoutubeVideo
id="sUQbFj8h4Wo" id="LyaYGm3FtiU"
src="https://www.youtube.com/watch?v=sUQbFj8h4Wo" src="https://www.youtube.com/watch?v=LyaYGm3FtiU"
:width="720"
:height="435"
>
</YoutubeVideo>
</div>
</swiper-slide>
<swiper-slide >
<div class="gallery-banner-img">
<YoutubeVideo
id="yOoJXogfQs0"
src="https://www.youtube.com/watch?v=yOoJXogfQs0"
:width="720" :width="720"
:height="435" :height="435"
> >
</YoutubeVideo> </YoutubeVideo>
</div> </div>
</swiper-slide> </swiper-slide>
</swiper> </swiper>
</div> </div>

View File

@ -20,7 +20,7 @@
</div> </div>
<div class="slogan"> <div class="slogan">
<div> <div>
CEBG is the highly-anticipated first blockchain-based game to offer a Counter Fire is the highly-anticipated first blockchain-based game to offer a
unique combination of MOBA and Battle Royale gameplay. unique combination of MOBA and Battle Royale gameplay.
</div> </div>
<div> <div>

View File

@ -44,11 +44,10 @@
<!-- <img src="@/assets/svg/discord.svg" alt="" <!-- <img src="@/assets/svg/discord.svg" alt=""
/> --> /> -->
</a> </a>
<a href="https://t.me/CEBG_official" class="telegram"> <!-- <a href="https://t.me/CEBG_official" class="telegram">
<!-- <img src="@/assets/svg/telegram.svg" alt=""
/> --> </a> -->
</a> <a href="https://twitter.com/_CounterFire" class="twiter">
<a href="https://twitter.com/CEBG_GAME" class="twiter">
<!-- <img src="@/assets/svg/twitter.svg" alt="" <!-- <img src="@/assets/svg/twitter.svg" alt=""
/> --> /> -->
</a> </a>
@ -140,7 +139,7 @@ onUnmounted(() => {
.follow { .follow {
display: flex; display: flex;
padding-top: 49px; padding-top: 49px;
width: 296px; width: 206px;
margin: 0 auto; margin: 0 auto;
justify-content: space-between; justify-content: space-between;
padding-bottom: 76px; padding-bottom: 76px;
@ -312,8 +311,8 @@ onUnmounted(() => {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
img { img {
width: 128px; width: 188px;
height: 127px; height: 84px;
} }
padding-bottom: 51px; padding-bottom: 51px;
} }

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="nav"> <div class="nav">
<div class="nav-logo"> <div class="nav-logo">
<a href="/home"> <img src="../../assets/img/home/nav-logo.png" alt="" /></a> <a href="/"> <img src="../../assets/img/home/nav-logo.png" alt="" /></a>
</div> </div>
<div class="nav-right"> <div class="nav-right">
<div class="avatar-icon" v-if="!chain.logined" @click="login"> <div class="avatar-icon" v-if="!chain.logined" @click="login">
@ -43,7 +43,7 @@
</div> </div>
</a-drawer> </a-drawer>
</div> </div>
<ChainModel></ChainModel> <ChainModel />
</template> </template>
<script setup> <script setup>
@ -53,10 +53,12 @@ import { useRouter, useRoute } from "vue-router";
import ChainModel from "../../components/global/ChainModel.vue"; import ChainModel from "../../components/global/ChainModel.vue";
import { useChainStore } from "@/store/chain"; import { useChainStore } from "@/store/chain";
import { useAppStore } from "@/store/app"; import { useAppStore } from "@/store/app";
import { hasMetamask } from "@/utils/chain.util";
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const navShow = ref(false); const navShow = ref(false);
const activeIndex = ref(0); const activeIndex = ref(0);
const isModalVisible = ref(false);
const chain = useChainStore(); const chain = useChainStore();
onMounted(async () => { onMounted(async () => {
navShow.value = true; navShow.value = true;
@ -74,35 +76,19 @@ function switchNav(event) {
navShow.value = !navShow.value; navShow.value = !navShow.value;
} }
const navList = reactive([ const navList = reactive([
{ id: 0, name: "BETA TEST II", path: "/" }, { id: 0, name: "HOME", path: "/" },
{ id: 1, name: "HOME", path: "/home" }, { id: 1, name: "ABOUT", path: "/about" },
{ id: 2, name: "ABOUT", path: "/about" }, { id: 2, name: "GACHA", path: "https://m.gacha.counterfire.games/" },
{ id: 3, name: "BADGE", path: "https://m.badge.counterfire.games/" },
// {
// id: 2,
// name: "MARKETPLACE",
// path: "/marketpalce",
// submenu: [{ label: "Coming soon", link: "/products/1" }],
// },
// {
// id: 3,
// name: "COMMUNITY",
// path: "/contact",
// submenu: [
// { label: "Twitter", link: "/products/1" },
// { label: "Youtube", link: "/products/2" },
// { label: "Facebook", link: "/products/3" },
// { label: "Medium", link: "/products/3" },
// { label: "Telegram", link: "/products/3" },
// ],
// },
]); ]);
async function login(event) { async function login(event) {
var next = window.location.href;
if (!chain.logined) { if (!chain.logined) {
// //
await chain.chainManager.login(); await chain.chainManager.login();
console.log("logined:", chain.chainManager.isLogined); // console.log("logined:", chain.chainManager.isLogined);
chain.logined = chain.chainManager.isLogined; chain.logined = chain.chainManager.isLogined;
} }
} }
@ -110,11 +96,16 @@ const logout = async () => {
await chain.chainManager.logout(); await chain.chainManager.logout();
console.log("logined:", chain.chainManager.isLogined); console.log("logined:", chain.chainManager.isLogined);
chain.logined = chain.chainManager.isLogined; chain.logined = chain.chainManager.isLogined;
window.location.reload();
}; };
function onLinkTo(item, index) { function onLinkTo(item, index) {
activeIndex.value = index; activeIndex.value = index;
if (index < 2) {
router.push(item.path); router.push(item.path);
navShow.value = false; navShow.value = false;
} else {
window.location.href = item.path;
}
} }
watchEffect(() => { watchEffect(() => {
@ -132,16 +123,16 @@ watchEffect(() => {
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
z-index: 2000; z-index: 200;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.nav-logo { .nav-logo {
width: 91px; width: 162px;
height: 89px; height: 64px;
margin-left: 25px; margin-left: 25px;
img { img {
width: 91px; width: 162px;
height: 89px; height: 64px;
} }
} }
.nav-right { .nav-right {
@ -167,7 +158,7 @@ watchEffect(() => {
width: 36px; width: 36px;
height: 36px; height: 36px;
} }
background: url('../../assets/img/mobile-home/nav-btn-bg.png') no-repeat; background: url("../../assets/img/mobile-home/nav-btn-bg.png") no-repeat;
background-size: contain; background-size: contain;
} }
.nav-btn-active { .nav-btn-active {
@ -183,7 +174,8 @@ watchEffect(() => {
width: 36px; width: 36px;
height: 36px; height: 36px;
} }
background: url('../../assets/img/mobile-home/nav-btn-bg-active.png') no-repeat; background: url("../../assets/img/mobile-home/nav-btn-bg-active.png")
no-repeat;
background-size: contain; background-size: contain;
} }
} }
@ -199,7 +191,7 @@ watchEffect(() => {
font-family: "Big John"; font-family: "Big John";
font-weight: 400; font-weight: 400;
position: relative; position: relative;
color: #FFBA00; color: #ffba00;
} }
// .nav-item-active a::after { // .nav-item-active a::after {
@ -230,6 +222,6 @@ watchEffect(() => {
font-family: "Big John"; font-family: "Big John";
font-weight: 400; font-weight: 400;
// position: relative; // position: relative;
color: #FFBA00; color: #ffba00;
} }
</style> </style>

View File

@ -1,7 +1,7 @@
<template> <template>
<LogoAnimation v-if="!appLoaded"></LogoAnimation> <LogoAnimation v-if="!appLoaded"></LogoAnimation>
<div v-else class="layout"> <div v-else class="layout">
<NavBarVue v-if="currentRoute.path !== '/'"></NavBarVue> <NavBarVue ></NavBarVue>
<main class="content"> <main class="content">
<slot></slot> <slot></slot>
</main> </main>

View File

@ -215,6 +215,7 @@ export const AllChains = [
name: 'Arbitrum Mainnet RPC', name: 'Arbitrum Mainnet RPC',
type: 'Mainnet', type: 'Mainnet',
rpc: 'https://rpc.ankr.com/arbitrum', rpc: 'https://rpc.ankr.com/arbitrum',
logo: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDI0LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMiAzMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzIgMzI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojMDA5M0REO30KCS5zdDF7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDojRkZGRkZGO30KPC9zdHlsZT4KPGc+Cgk8Y2lyY2xlIGNsYXNzPSJzdDAiIGN4PSIxNiIgY3k9IjE2IiByPSIxNiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTEzLjUsMTZsNS4yLDUuM0wyMiwxOGMwLjYtMC42LDEuNS0wLjYsMiwwYzAsMCwwLDAsMCwwYzAuNiwwLjYsMC42LDEuNiwwLDIuMmwtNC4zLDQuNAoJCWMtMC42LDAuNi0xLjUsMC42LTIuMSwwYzAsMCwwLDAsMCwwbC02LjItNi40VjIyYzAsMC44LTAuNywxLjUtMS41LDEuNWMtMC44LDAtMS41LTAuNy0xLjUtMS41VjEwYzAtMC44LDAuNy0xLjUsMS41LTEuNQoJCWMwLjgsMCwxLjUsMC43LDEuNSwxLjV2My44bDYuMi02LjRjMC42LTAuNiwxLjUtMC42LDIuMSwwYzAsMCwwLDAsMCwwbDQuMyw0LjRjMC42LDAuNiwwLjYsMS42LDAsMi4yYy0wLjYsMC42LTEuNSwwLjYtMiwwCgkJYzAsMCwwLDAsMCwwbC0zLjMtMy40TDEzLjUsMTZ6IE0xOC43LDE0LjVjMC44LDAsMS41LDAuNywxLjUsMS41cy0wLjcsMS41LTEuNSwxLjVzLTEuNS0wLjctMS41LTEuNQoJCUMxNy4yLDE1LjIsMTcuOSwxNC41LDE4LjcsMTQuNXoiLz4KPC9nPgo8L3N2Zz4K',
id: 42161, id: 42161,
symbol: 'ETH', symbol: 'ETH',
explorerurl: 'https://arbiscan.io/' explorerurl: 'https://arbiscan.io/'

View File

@ -9,13 +9,13 @@ export const ALL_PROVIDERS = [
}, },
{ {
id: 2, id: 2,
name: "WalletConnect", name: "OKX Wallet",
logo: "data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjUxMiIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHdpZHRoPSI1MTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxyYWRpYWxHcmFkaWVudCBpZD0iYSIgY3g9IjAlIiBjeT0iNTAlIiByPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiM1ZDlkZjYiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMwMDZmZmYiLz48L3JhZGlhbEdyYWRpZW50PjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PHBhdGggZD0ibTI1NiAwYzE0MS4zODQ4OTYgMCAyNTYgMTE0LjYxNTEwNCAyNTYgMjU2cy0xMTQuNjE1MTA0IDI1Ni0yNTYgMjU2LTI1Ni0xMTQuNjE1MTA0LTI1Ni0yNTYgMTE0LjYxNTEwNC0yNTYgMjU2LTI1NnoiIGZpbGw9InVybCgjYSkiLz48cGF0aCBkPSJtNjQuNjkxNzU1OCAzNy43MDg4Mjk4YzUxLjUzMjgwNzItNTAuMjc4NDM5NyAxMzUuMDgzOTk0Mi01MC4yNzg0Mzk3IDE4Ni42MTY3OTkyIDBsNi4yMDIwNTcgNi4wNTEwOTA2YzIuNTc2NjQgMi41MTM5MjE4IDIuNTc2NjQgNi41ODk3OTQ4IDAgOS4xMDM3MTc3bC0yMS4yMTU5OTggMjAuNjk5NTc1OWMtMS4yODgzMjEgMS4yNTY5NjE5LTMuMzc3MSAxLjI1Njk2MTktNC42NjU0MjEgMGwtOC41MzQ3NjYtOC4zMjcwMjA1Yy0zNS45NTA1NzMtMzUuMDc1NDk2Mi05NC4yMzc5NjktMzUuMDc1NDk2Mi0xMzAuMTg4NTQ0IDBsLTkuMTQwMDI4MiA4LjkxNzU1MTljLTEuMjg4MzIxNyAxLjI1Njk2MDktMy4zNzcxMDE2IDEuMjU2OTYwOS00LjY2NTQyMDggMGwtMjEuMjE1OTk3My0yMC42OTk1NzU5Yy0yLjU3NjY0MDMtMi41MTM5MjI5LTIuNTc2NjQwMy02LjU4OTc5NTggMC05LjEwMzcxNzd6bTIzMC40OTM0ODUyIDQyLjgwODkxMTcgMTguODgyMjc5IDE4LjQyMjcyNjJjMi41NzY2MjcgMi41MTM5MTAzIDIuNTc2NjQyIDYuNTg5NzU5My4wMDAwMzIgOS4xMDM2ODYzbC04NS4xNDE0OTggODMuMDcwMzU4Yy0yLjU3NjYyMyAyLjUxMzk0MS02Ljc1NDE4MiAyLjUxMzk2OS05LjMzMDg0LjAwMDA2Ni0uMDAwMDEtLjAwMDAxLS4wMDAwMjMtLjAwMDAyMy0uMDAwMDMzLS4wMDAwMzRsLTYwLjQyODI1Ni01OC45NTc0NTFjLS42NDQxNi0uNjI4NDgxLTEuNjg4NTUtLjYyODQ4MS0yLjMzMjcxIDAtLjAwMDAwNC4wMDAwMDQtLjAwMDAwOC4wMDAwMDctLjAwMDAxMi4wMDAwMTFsLTYwLjQyNjk2ODMgNTguOTU3NDA4Yy0yLjU3NjYxNDEgMi41MTM5NDctNi43NTQxNzQ2IDIuNTEzOTktOS4zMzA4NDA4LjAwMDA5Mi0uMDAwMDE1MS0uMDAwMDE0LS4wMDAwMzA5LS4wMDAwMjktLjAwMDA0NjctLjAwMDA0NmwtODUuMTQzODY3NzQtODMuMDcxNDYzYy0yLjU3NjYzOTI4LTIuNTEzOTIxLTIuNTc2NjM5MjgtNi41ODk3OTUgMC05LjEwMzcxNjNsMTguODgyMzEyNjQtMTguNDIyNjk1NWMyLjU3NjYzOTMtMi41MTM5MjIyIDYuNzU0MTk5My0yLjUxMzkyMjIgOS4zMzA4Mzk3IDBsNjAuNDI5MTM0NyA1OC45NTgyNzU4Yy42NDQxNjA4LjYyODQ4IDEuNjg4NTQ5NS42Mjg0OCAyLjMzMjcxMDMgMCAuMDAwMDA5NS0uMDAwMDA5LjAwMDAxODItLjAwMDAxOC4wMDAwMjc3LS4wMDAwMjVsNjAuNDI2MTA2NS01OC45NTgyNTA4YzIuNTc2NTgxLTIuNTEzOTggNi43NTQxNDItMi41MTQwNzQzIDkuMzMwODQtLjAwMDIxMDMuMDAwMDM3LjAwMDAzNTQuMDAwMDcyLjAwMDA3MDkuMDAwMTA3LjAwMDEwNjNsNjAuNDI5MDU2IDU4Ljk1ODM1NDhjLjY0NDE1OS42Mjg0NzkgMS42ODg1NDkuNjI4NDc5IDIuMzMyNzA5IDBsNjAuNDI4MDc5LTU4Ljk1NzE5MjVjMi41NzY2NC0yLjUxMzkyMzEgNi43NTQxOTktMi41MTM5MjMxIDkuMzMwODM5IDB6IiBmaWxsPSIjZmZmIiBmaWxsLXJ1bGU9Im5vbnplcm8iIHRyYW5zZm9ybT0idHJhbnNsYXRlKDk4IDE2MCkiLz48L2c+PC9zdmc+", logo: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkBAMAAACCzIhnAAAAKlBMVEX///8AAACAgIAgICBAQECfn59gYGAQEBBwcHDf398wMDDv7+9QUFCQkJCj6kukAAAApElEQVRYw2MQJBkwjGoZ1TKqZcRrKTaGAoQQTMQcuxbxCQxQ0AgTEoOJcBZi1SIMk2cIhAkJwYUcR7WMahnVQqEWwdZQKDBJg4LDV6EiQYSKCweY2TxElzAJMC1Mo1pGtYxqITqLsRHSkqQEBWYwRjuMoYajRsZXXCwcLS1HtYxqoVCL+AbcjV5uQ+wZ2cQFArwQQlARF/fRzsiollEto1pI1wIAi3RABJinaAMAAAAASUVORK5CYII=",
desc: "Scan with WalletConnect to connect", desc: "Connect to your OKX Wallet",
}, },
]; ];
export const AVAILABLE_CHAINS = env === "production" ? [321] : [322]; export const AVAILABLE_CHAINS = env === "production" ? [42161] : [42161];
export const OFFICE_ACCOUNT = export const OFFICE_ACCOUNT =
env === "production" env === "production"

View File

@ -1,18 +1,11 @@
import { createRouter, createWebHistory } from "vue-router"; import { createRouter, createWebHistory } from "vue-router";
const Beta = () => import('../views/GamePromotionEvent.vue') const Beta = () => import("../views/GamePromotionEvent.vue");
const Home = () => import('../views/HomeView.vue') ///const Home = () => import("../views/HomeView.vue");
const About = () => import('../views/AboutView.vue') import Home from '../views/HomeView.vue'
const About = () => import("../views/AboutView.vue");
const routes = [ const routes = [
{ {
path: "/", path: "/",
name: "beta",
component: Beta,
meta: {
showInMenu: true,
},
},
{
path: "/home",
name: "home", name: "home",
component: Home, component: Home,
meta: { meta: {
@ -60,7 +53,7 @@ const routes = [
const router = createRouter({ const router = createRouter({
history: createWebHistory(), history: createWebHistory(),
routes routes,
}); });
router.afterEach((to, from) => { router.afterEach((to, from) => {
let bodySrcollTop = document.body.scrollTop; let bodySrcollTop = document.body.scrollTop;
@ -74,18 +67,20 @@ router.afterEach((to, from) => {
} }
}); });
function isMobileDevice(userAgent) { function isMobileDevice(userAgent) {
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent); return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
userAgent
);
} }
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
const isMobile = isMobileDevice(window.navigator.userAgent); const isMobile = isMobileDevice(window.navigator.userAgent);
if (to.query.code) {
// 对于移动端官网项目: window.location.href = `https://m.gacha.counterfire.games/?code=${to.query.code}`;
if (isMobile) { } else if (isMobile) {
next(); // 如果是移动设备,继续导航 next(); // 如果是移动设备,继续导航
} else { } else {
window.location.href = 'https://desktop.cebg.games'; window.location.href = "https://www.counterfire.games";
} }
}); });

View File

@ -6,7 +6,7 @@ export const useChainStore = defineStore('chain', ()=> {
const logined = ref(false); const logined = ref(false);
const chainManager = ref(new ChainManager()); const chainManager = ref(new ChainManager());
chainManager.value.init().then(()=> { chainManager.value.init().then(()=> {
console.log("chain init:", {chainManager}) // console.log("chain init:", {chainManager})
logined.value = chainManager.value.isLogined; logined.value = chainManager.value.isLogined;
}); });

View File

@ -7,6 +7,14 @@ export function verifyInjectedProvider(check: string): boolean {
window.web3.currentProvider[check] window.web3.currentProvider[check]
} }
export function verifyInjectedProviderok(check: string): boolean {
return window.okxwallet
? window.okxwallet[check]
: window.web3 &&
window.web3.currentProvider &&
window.web3.currentProvider[check]
}
/** /**
* check if there have metamask * check if there have metamask
* @return {boolean} * @return {boolean}
@ -19,6 +27,14 @@ export function hasMetamask(): boolean {
} }
} }
export function hasOKExWallet(): boolean {
if (!!window.okxwallet || !!window.web3) {
return verifyInjectedProviderok('isokxwallet')
} else {
return false
}
}
/** /**
* change price with customer decimals to bigNum with 18 decimals * change price with customer decimals to bigNum with 18 decimals
* @param {number} price * @param {number} price

View File

@ -3,9 +3,9 @@ import { message } from 'ant-design-vue'
import glodata from '@/store/user_global'; import glodata from '@/store/user_global';
const VUE_APP_BASE_API='https://market.cebg.games'
const service = axios.create({ const service = axios.create({
baseURL: import.meta.env.VUE_APP_BASE_API, baseURL: VUE_APP_BASE_API,
timeout: 5000 timeout: 5000
}) })

View File

@ -31,6 +31,7 @@ export default defineConfig({
outDir: 'dist', outDir: 'dist',
// 打包文件名 // 打包文件名
assetsDir: 'static', assetsDir: 'static',
sourcemap: false, // 禁用源映射
// 静态资源引用路径 // 静态资源引用路径
assetsPublicPath: '/', assetsPublicPath: '/',
// 是否开启压缩 // 是否开启压缩
@ -41,7 +42,6 @@ export default defineConfig({
env: { env: {
BASE_URL: process.env.VITE_API_BASE_URL BASE_URL: process.env.VITE_API_BASE_URL
}, },
sourcemap: true,
rollupOptions: { rollupOptions: {
plugins: [nodePolyfills()], plugins: [nodePolyfills()],
}, },