From 7ec73a3e5edbd0ef0e77c5d2432dc378e41aa430 Mon Sep 17 00:00:00 2001 From: cebgcontract <99630598+cebgcontract@users.noreply.github.com> Date: Wed, 2 Mar 2022 14:45:16 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=90=84=E5=AD=90=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2meta,=20=E6=A0=B9=E6=8D=AE=E6=9C=80=E6=96=B0=E6=96=87?= =?UTF-8?q?=E6=A1=88=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 12 +- public/index.html | 28 +--- src/components/index/DesktopFooter.vue | 2 +- src/components/index/InvestorsSection.vue | 8 +- src/components/index/PartnerSection.vue | 12 +- src/components/mobile/main/MobileFooter.vue | 2 +- src/components/roadmap/InfoPanel.vue | 2 +- src/router/index.ts | 136 +++++++++++++++++++- src/views/desktop/Team.vue | 11 +- src/views/mobile/Team.vue | 11 +- 10 files changed, 169 insertions(+), 55 deletions(-) diff --git a/package-lock.json b/package-lock.json index 53fba13..ff7498a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8651,9 +8651,7 @@ "deepmerge": { "version": "4.2.2", "resolved": "https://registry.npmmirror.com/deepmerge/download/deepmerge-4.2.2.tgz", - "integrity": "sha1-RNLqNnm49NT/ujPwPYZfwee/SVU=", - "dev": true, - "optional": true + "integrity": "sha1-RNLqNnm49NT/ujPwPYZfwee/SVU=" }, "default-gateway": { "version": "5.0.5", @@ -19151,6 +19149,14 @@ } } }, + "vue-meta": { + "version": "2.4.0", + "resolved": "https://registry.npmmirror.com/vue-meta/-/vue-meta-2.4.0.tgz", + "integrity": "sha512-XEeZUmlVeODclAjCNpWDnjgw+t3WA6gdzs6ENoIAgwO1J1d5p1tezDhtteLUFwcaQaTtayRrsx7GL6oXp/m2Jw==", + "requires": { + "deepmerge": "^4.2.2" + } + }, "vue-property-decorator": { "version": "9.1.2", "resolved": "https://registry.npm.taobao.org/vue-property-decorator/download/vue-property-decorator-9.1.2.tgz", diff --git a/public/index.html b/public/index.html index edb84af..0c9ee55 100644 --- a/public/index.html +++ b/public/index.html @@ -2,8 +2,6 @@ - - @@ -13,28 +11,12 @@ - CEBG: CRYPTO ELITE‘S BATTLEGROUNDS diff --git a/src/components/index/DesktopFooter.vue b/src/components/index/DesktopFooter.vue index 9ade7f9..cb8f66a 100644 --- a/src/components/index/DesktopFooter.vue +++ b/src/components/index/DesktopFooter.vue @@ -39,7 +39,7 @@
Contact us
- support@cebg.games + contact@cebg.games
diff --git a/src/components/index/InvestorsSection.vue b/src/components/index/InvestorsSection.vue index 7b91ea9..f76f103 100644 --- a/src/components/index/InvestorsSection.vue +++ b/src/components/index/InvestorsSection.vue @@ -4,19 +4,19 @@ investors
- + kucoin - + kernel - + Initiate catital multiverse play - + coso
diff --git a/src/components/index/PartnerSection.vue b/src/components/index/PartnerSection.vue index 0c39a44..ffca1b2 100644 --- a/src/components/index/PartnerSection.vue +++ b/src/components/index/PartnerSection.vue @@ -10,22 +10,22 @@ multiverse play - + coso - + gamestreet - + San Lazarus Guild - + San Lazarus Guild - + Sfc Guild - + certik diff --git a/src/components/mobile/main/MobileFooter.vue b/src/components/mobile/main/MobileFooter.vue index 2ef8cf9..539f779 100644 --- a/src/components/mobile/main/MobileFooter.vue +++ b/src/components/mobile/main/MobileFooter.vue @@ -54,7 +54,7 @@
Contact us
plus - support@cebg.games + contact@cebg.games
diff --git a/src/components/roadmap/InfoPanel.vue b/src/components/roadmap/InfoPanel.vue index c462fd2..e6c4604 100644 --- a/src/components/roadmap/InfoPanel.vue +++ b/src/components/roadmap/InfoPanel.vue @@ -70,7 +70,7 @@ export default class InfoPanel extends Vue { }, { title: 'May. 2022', - desc: ['New function release:', 'PVE', 'PVP Ranking NFT', 'can be leveled up to Lv.15', 'Mobile version on App Store and Google Play'] + desc: ['New function release:', '- PVE', '- PVP Ranking NFT', '- can be leveled up to Lv.15', '- Mobile version on App Store and Google Play'] } ] }, diff --git a/src/router/index.ts b/src/router/index.ts index a005c30..8e2d2a6 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -31,7 +31,20 @@ const routes: Array = [ path: '/', name: 'Main', component: mobile ? MobileIndex : Index, - alias: '/index.html' + alias: '/index.html', + meta: { + title: 'CEBG: CRYPTO ELITE‘S BATTLEGROUNDS', + metaTags: [ + { + name: 'description', + content: 'CEBG is the 1st Anime + Beauties + Mechas blockchain game that supports FREE TO PLAY and PLAY TO EARN. It\'s an online multiplayer battle royale game where up to 40 players parachute onto an island and scavenge for weapons and equipment to kill others. The last player or team standing wins the round.' + }, + { + name: 'keywords', + content: 'CEBG, CRYPTO ELITE‘S BATTLEGROUNDS, CEBG BATTLEGROUNDS, CE BATTLEGROUNDS, CRYPTO ELITE‘S, cebg Mobile, cebg official, free battle royale, cebg game, cec, ceg, cebg coin, cebg gold, cebg crypto, cebg p2e, play to earn, free to play, blockchain game' + } + ] + } }, { path: '/market', @@ -65,31 +78,96 @@ const routes: Array = [ path: '/nft', name: 'Nft', component: mobile ? MobileNft : NFT, - alias: '/nft/index.html' + alias: '/nft/index.html', + meta: { + title: 'NFT | CEBG: CRYPTO ELITE‘S BATTLEGROUNDS', + metaTags: [ + { + name: 'description', + content: 'CEBG is the 1st Anime + Beauties + Mechas blockchain game that supports FREE TO PLAY and PLAY TO EARN. It\'s an online multiplayer battle royale game where up to 40 players parachute onto an island and scavenge for weapons and equipment to kill others. The last player or team standing wins the round.' + }, + { + name: 'keywords', + content: 'nft, CEBG, CRYPTO ELITE‘S BATTLEGROUNDS, CEBG BATTLEGROUNDS, CE BATTLEGROUNDS, CRYPTO ELITE‘S, cebg Mobile, cebg official, free battle royale, cebg game, cec, ceg, cebg coin, cebg gold, cebg crypto, cebg p2e, play to earn, free to play, blockchain game' + } + ] + } }, { path: '/gameplay', name: 'Gameplay', component: mobile ? MobileGameplay : Gameplay, - alias: '/gameplay/index.html' + alias: '/gameplay/index.html', + meta: { + title: 'Gameplay | CEBG: CRYPTO ELITE‘S BATTLEGROUNDS', + metaTags: [ + { + name: 'description', + content: 'CEBG is the 1st Anime + Beauties + Mechas blockchain game that supports FREE TO PLAY and PLAY TO EARN. It\'s an online multiplayer battle royale game where up to 40 players parachute onto an island and scavenge for weapons and equipment to kill others. The last player or team standing wins the round.' + }, + { + name: 'keywords', + content: 'gameplay, CEBG, CRYPTO ELITE‘S BATTLEGROUNDS, CEBG BATTLEGROUNDS, CE BATTLEGROUNDS, CRYPTO ELITE‘S, cebg Mobile, cebg official, free battle royale, cebg game, cec, ceg, cebg coin, cebg gold, cebg crypto, cebg p2e, play to earn, free to play, blockchain game' + } + ] + } }, { path: '/tokenomic', name: 'Tokenomic', component: mobile ? MobileTokennomic : Tokenomic, - alias: '/tokenomic/index.html' + alias: '/tokenomic/index.html', + meta: { + title: 'Tokenomic | CEBG: CRYPTO ELITE‘S BATTLEGROUNDS', + metaTags: [ + { + name: 'description', + content: 'CEBG is the 1st Anime + Beauties + Mechas blockchain game that supports FREE TO PLAY and PLAY TO EARN. It\'s an online multiplayer battle royale game where up to 40 players parachute onto an island and scavenge for weapons and equipment to kill others. The last player or team standing wins the round.' + }, + { + name: 'keywords', + content: 'tokenomic, CEBG, CRYPTO ELITE‘S BATTLEGROUNDS, CEBG BATTLEGROUNDS, CE BATTLEGROUNDS, CRYPTO ELITE‘S, cebg Mobile, cebg official, free battle royale, cebg game, cec, ceg, cebg coin, cebg gold, cebg crypto, cebg p2e, play to earn, free to play, blockchain game' + } + ] + } }, { path: '/team', name: 'Team', component: mobile ? MobileTeam : Team, - alias: '/team/index.html' + alias: '/team/index.html', + meta: { + title: 'Team | CEBG: CRYPTO ELITE‘S BATTLEGROUNDS', + metaTags: [ + { + name: 'description', + content: 'CEBG is the 1st Anime + Beauties + Mechas blockchain game that supports FREE TO PLAY and PLAY TO EARN. It\'s an online multiplayer battle royale game where up to 40 players parachute onto an island and scavenge for weapons and equipment to kill others. The last player or team standing wins the round.' + }, + { + name: 'keywords', + content: 'team, CEBG, CRYPTO ELITE‘S BATTLEGROUNDS, CEBG BATTLEGROUNDS, CE BATTLEGROUNDS, CRYPTO ELITE‘S, cebg Mobile, cebg official, free battle royale, cebg game, cec, ceg, cebg coin, cebg gold, cebg crypto, cebg p2e, play to earn, free to play, blockchain game' + } + ] + } }, { path: '/roadmap', name: 'Roadmap', component: mobile ? MobileRoadmap : Roadmap, - alias: '/roadmap/index.html' + alias: '/roadmap/index.html', + meta: { + title: 'Roadmap | CEBG: CRYPTO ELITE‘S BATTLEGROUNDS', + metaTags: [ + { + name: 'description', + content: 'CEBG is the 1st Anime + Beauties + Mechas blockchain game that supports FREE TO PLAY and PLAY TO EARN. It\'s an online multiplayer battle royale game where up to 40 players parachute onto an island and scavenge for weapons and equipment to kill others. The last player or team standing wins the round.' + }, + { + name: 'keywords', + content: 'roadmap, CEBG, CRYPTO ELITE‘S BATTLEGROUNDS, CEBG BATTLEGROUNDS, CE BATTLEGROUNDS, CRYPTO ELITE‘S, cebg Mobile, cebg official, free battle royale, cebg game, cec, ceg, cebg coin, cebg gold, cebg crypto, cebg p2e, play to earn, free to play, blockchain game' + } + ] + } } ] @@ -99,4 +177,50 @@ const router = new VueRouter({ routes }) +// ... + +// This callback runs before every route change, including on page load. +router.beforeEach((to, from, next) => { + // This goes through the matched routes from last to first, finding the closest route with a title. + // e.g., if we have `/some/deep/nested/route` and `/some`, `/deep`, and `/nested` have titles, + // `/nested`'s will be chosen. + const nearestWithTitle = to.matched.slice().reverse().find(r => r.meta && r.meta.title) + + // Find the nearest route element with meta tags. + const nearestWithMeta = to.matched.slice().reverse().find(r => r.meta && r.meta.metaTags) + + const previousNearestWithMeta = from.matched.slice().reverse().find(r => r.meta && r.meta.metaTags) + + // If a route with a title was found, set the document (page) title to that value. + if (nearestWithTitle) { + document.title = nearestWithTitle.meta.title + } else if (previousNearestWithMeta) { + document.title = previousNearestWithMeta.meta.title + } + + // Remove any stale meta tags from the document using the key attribute we set below. + Array.from(document.querySelectorAll('[data-vue-router-controlled]')).map((el: any) => el.parentNode.removeChild(el)) + + // Skip rendering meta tags if there are none. + if (!nearestWithMeta) return next() + + // Turn the meta tag definitions into actual elements in the head. + nearestWithMeta.meta.metaTags.map((tagDef: any) => { + const tag = document.createElement('meta') + + Object.keys(tagDef).forEach(key => { + tag.setAttribute(key, tagDef[key]) + }) + + // We use this to track which meta tags we create so we don't interfere with other ones. + tag.setAttribute('data-vue-router-controlled', '') + + return tag + }) + // Add the meta tags to the document head. + .forEach((tag: any) => document.head.appendChild(tag)) + + next() +}) + export default router diff --git a/src/views/desktop/Team.vue b/src/views/desktop/Team.vue index 3df249d..d3a2276 100644 --- a/src/views/desktop/Team.vue +++ b/src/views/desktop/Team.vue @@ -41,7 +41,7 @@ export default class extends Vue { private teamList = [{ avatar: require('@/assets/202202/team/luca_ganzedda.png'), name: 'Luca Ganzedda', - job: 'Tokenomic Manager', + job: 'Head of Tokenomic', intro: [ 'Luca has accumulated a lot of project experience in different field, including DAO,NFT, Gamefi and DeFi, and good at token economic model design,digital asset consulting, IDO/IEO guidance.', 'Luca has the master degree in economics, and double bachelor’s degree in macroeconomics and Economics.' @@ -50,7 +50,7 @@ export default class extends Vue { { avatar: require('@/assets/202202/team/jesse_lynch.png'), name: 'Jesse Lynch', - job: 'Operation Manager', + job: 'Head of Operation', intro: [ 'Jesse has over 5-year experience in gaming, and used to work for NetEast and other famous game companies. ', 'Jesse has enriched network resource in the global game industry. Dedicated into the analysis of global traditional game market and GameFi industry for a long time, Jesse has in-depth understanding and insights regarding GameFi and Web 3.0.' @@ -61,14 +61,15 @@ export default class extends Vue { private advisors = [ { name: 'Michael Yue', - job: 'OG in the game industry', + job: '', intro: [ + 'OG in the game industry', 'Former Co-Founder of Giant Interactive Group' ] }, { name: 'Ben', - job: 'Operation Manager', + job: '', intro: [ 'Head of Operation of Multiverse Play', 'Avid crypto enthusiast, senior investor, and versatile talent', @@ -77,7 +78,7 @@ export default class extends Vue { }, { name: 'Ray', - job: 'Marketing & Content Manger', + job: '', intro: [ 'Head of Marketing & Content of Multiverse Play', '18-year experience in game publishing and R&D', diff --git a/src/views/mobile/Team.vue b/src/views/mobile/Team.vue index 07c5e57..6bcadc3 100644 --- a/src/views/mobile/Team.vue +++ b/src/views/mobile/Team.vue @@ -43,7 +43,7 @@ export default class MobileTeam extends Vue { private teamList = [{ avatar: require('@/assets/202202/team/luca_ganzedda.png'), name: 'Luca Ganzedda', - job: 'Tokenomic Manager', + job: 'Head of Tokenomic', intro: [ 'Luca has accumulated a lot of project experience in different field, including DAO,NFT, Gamefi and DeFi, and good at token economic model design,digital asset consulting, IDO/IEO guidance.', 'Luca has the master degree in economics, and double bachelor’s degree in macroeconomics and Economics.' @@ -52,7 +52,7 @@ export default class MobileTeam extends Vue { { avatar: require('@/assets/202202/team/jesse_lynch.png'), name: 'Jesse Lynch', - job: 'Operation Manager', + job: 'Head of Operation', intro: [ 'Jesse has over 5-year experience in gaming, and used to work for NetEast and other famous game companies. ', 'Jesse has enriched network resource in the global game industry. Dedicated into the analysis of global traditional game market and GameFi industry for a long time, Jesse has in-depth understanding and insights regarding GameFi and Web 3.0.' @@ -63,14 +63,15 @@ export default class MobileTeam extends Vue { private advisors = [ { name: 'Michael Yue', - job: 'OG in the game industry', + job: '', intro: [ + 'OG in the game industry', 'Former Co-Founder of Giant Interactive Group' ] }, { name: 'Ben', - job: 'Operation Manager', + job: '', intro: [ 'Head of Operation of Multiverse Play', 'Avid crypto enthusiast, senior investor, and versatile talent', @@ -79,7 +80,7 @@ export default class MobileTeam extends Vue { }, { name: 'Ray', - job: 'Marketing & Content Manger', + job: '', intro: [ 'Head of Marketing & Content of Multiverse Play', '18-year experience in game publishing and R&D',