cebg-activities/public/mobile.html
2022-11-17 13:59:39 +08:00

528 lines
18 KiB
HTML
Executable File
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="format-detection" content="telephone=no" />
<title>CEBG</title>
<link rel="stylesheet" href="css/normalize.css" type="text/css" />
<link rel="stylesheet" href="css/mobile.css" type="text/css" />
<script src="js/jquery-1.12.4.js"></script>
<style>
.headerbtn {
position: relative;
}
.dropdown-content {
display: none;
position: absolute;
top: 0.78rem;
/* right: 0.001rem; */
left: -0.6rem;
background-color: rgb(18, 18, 18);
min-width: 90%;
border-radius: 4px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
padding: 0.19rem 0.16rem;
padding-right: 5rem;
z-index: 1;
}
.dropdown-content a {
padding: 0.2rem 0.3rem;
font-size: 0.46rem;
border-radius: 13px;
text-align: center;
font-family: OPPOSans;
font-weight: normal;
background: linear-gradient(90deg, #714f34, #f5c384);
margin-top: 0.2rem;
color: #fff;
}
</style>
<link rel="icon" type="image/png" sizes="32x32" href="/favicon.ico" />
<script>
(function (win, doc) {
if (!win.addEventListener) return;
var html = document.documentElement;
function setFont() {
var html = document.documentElement;
var k = 1080;
html.style.fontSize = (html.clientWidth / k) * 100 + "px";
}
setFont();
setTimeout(function () {
setFont();
}, 300);
doc.addEventListener("DOMContentLoaded", setFont, false);
win.addEventListener("resize", setFont, false);
win.addEventListener("load", setFont, false);
})(window, document);
</script>
</head>
<body>
<div class="loading">
<div class="loaderpic"><img src="images/logo.png" /></div>
<div class="loadnumber"></div>
</div>
<div class="header">
<div class="header_cont">
<div class="header_logo">
<img class="preload" data-src="images/logo.png" />
</div>
<div class="headerbtn">
<a href="javascript:void(0)" id="wallet_login_btn"
><img class="preload" data-src="images/headerbtn.png"
/></a>
<a
href="javascript:void(0)"
id="logined_btn"
style="display: none"
></a>
<div class="dropdown-content">
<a href="/recommend" id="sign_href" style="display: none"
>Sign up</a
>
<a href="/rankinglist" id="quest_info">Quest Info</a>
<a href="javascript:void(0)" id="logout_btn">Log out</a>
</div>
</div>
</div>
</div>
<div class="container">
<div class="section section1">
<div class="bannerlogo">
<img
class="preload anmode fadeUp"
data-src="images/title_lg.png"
data-dura="0.6s"
data-delay="0.4s"
/>
</div>
<div class="bline">
<div class="percotmodel model1"></div>
</div>
</div>
<div class="section section2">
<div class="ctimebg">
<div class="percotmodel model3"></div>
</div>
<div class="timeblock">
<div class="cit1 anmode fadeUp" data-dura="0.6s" data-delay="0.5s">
<img class="preload" data-src="images/ctit1m.png" />
</div>
<div class="timeattack">
<div
class="timecoup anmode fadeUp"
data-dura="0.6s"
data-delay="0.6s"
>
<div class="time_around conternum day"></div>
<div class="time_desc">day(s)</div>
</div>
<div
class="timecoup anmode fadeUp"
data-dura="0.6s"
data-delay="0.7s"
>
<div class="time_around conternum hour"></div>
<div class="time_desc">hour</div>
</div>
<div
class="timecoup anmode fadeUp"
data-dura="0.6s"
data-delay="0.8s"
>
<div class="time_around conternum minute"></div>
<div class="time_desc">minute</div>
</div>
<div
class="timecoup anmode fadeUp"
data-dura="0.6s"
data-delay="0.9s"
>
<div class="time_around conternum second"></div>
<div class="time_desc">second</div>
</div>
<div class="timeout">
<span>TIME OUT</span>
</div>
</div>
<div class="btncont anmode fadeUp" data-dura="0.6s" data-delay="1s">
<a href="/login" class="login_btn" id="page_login_btn"
><img class="preload" data-src="images/signup_btn.png"
/></a>
<a href="/rankinglist" class="quest_btn" id="page_quest_btn"
><img class="preload" data-src="images/quest_btn.png"
/></a>
</div>
</div>
</div>
<div class="section section3">
<div class="descper">
<div class="ecent anmode fadeUp" data-dura="0.6s" data-delay="0s">
<img class="preload" data-src="images/ecent.png" />
</div>
<div
class="ecent_desc anmode fadeUp"
data-dura="0.6s"
data-delay="0.2s"
>
As first Anmie MOBA game on blockchain,<br />
CEBG is call-up Commanders to build the troop! 11.17 Commander Rally
Program - 11.24 Beta Version Test <br />
Form your exclusive code and link!
</div>
</div>
<div class="timelines">
<img
class="preload"
data-src="images/timeline.png"
class="anmode fadeLeft"
data-dura="0.6s"
data-delay="0.4s"
/>
<div
class="timelince tlincp1 anmode fadeLeft"
data-dura="0.6s"
data-delay="0.6s"
>
<div class="time_dp1">2022.11.17 SGT 8:00pm</div>
<div class="time_dp2">Commander Rally Launched</div>
</div>
<div
class="timelince tlincp2 anmode fadeLeft"
data-dura="0.6s"
data-delay="0.8s"
>
<div class="time_dp1">2022.11.21 SGT 8:00pm</div>
<div class="time_dp2">Legion Community Found - Discord Channel</div>
</div>
<div
class="timelince tlincp3 anmode fadeLeft"
data-dura="0.6s"
data-delay="1s"
>
<div class="time_dp1">2022.11.24 SGT 8:00pm</div>
<div class="time_dp2">1,000 Commanders Announced</div>
</div>
<div
class="timelince tlincp4 anmode fadeLeft"
data-dura="0.6s"
data-delay="1.2s"
>
<div class="time_dp1">2022.11.25 SGT 12:00am</div>
<div class="time_dp2">
CEBG Beta Test Version Launched<br />
In-Game Weekly Leaderboard Firing
</div>
</div>
</div>
<div class="lines">
<div class="percotmodel model2"></div>
</div>
</div>
<div class="section section4">
<div class="cbg"><img class="preload" data-src="images/cbg.png" /></div>
<div class="rule_desc anmode fadeUp" data-dura="0.6s" data-delay="0s">
<img class="preload" data-src="images/rule_desc.png" />
</div>
<div class="rule_cont">
<div
class="rule_sliders anmode fadeUp"
data-dura="0.6s"
data-delay="0.2s"
>
<div class="rule_tit">What is the reward for Rally Program?</div>
<div class="rule_descprition" style="display: none">
The Rally program set up more than $10,000 equivalant reward pool
for our commenders and contributors.<br />
$2,000 USDT , $CEG 50,000 and 700 Free-mint Chips NFT are waiting
for YOU!<br />
All registering wallet address can earn a in-game mystery reward
when log in the Beta Version Test<br />
<br />
More information check mediumxxxx
</div>
<a href="javascript:void(0)" class="sliderbtn"
><img class="preload" data-src="images/sliderbtn.png"
/></a>
</div>
<div
class="rule_sliders anmode fadeUp"
data-dura="0.6s"
data-delay="0.4s"
>
<div class="rule_tit">What is the rule of Rally Program?</div>
<div class="rule_descprition" style="display: none">
Commander Rally program is an incentive program to CEBG's
commander who call-up players to enroll in the troop for battle<br />
Points is calculating in the rule: <br />
- Registration Success: 200 points<br />
- Direct Invitation: 200 points<br />
- Second Level Invitation: 40 points
</div>
<a href="javascript:void(0)" class="sliderbtn"
><img class="preload" data-src="images/sliderbtn.png"
/></a>
</div>
<div
class="rule_sliders anmode fadeUp"
data-dura="0.6s"
data-delay="0.6s"
>
<div class="rule_tit">How to claim your reward?</div>
<div class="rule_descprition" style="display: none">
The giveaways contain 3 parts: CEG, USDT, Mystery Box<br />
1. Top 166 Commanders will be rewarded USDT:<br />
a) Top 20, each earns a lucky draw from 40 - 100U<br />
b) 21166, each earns a lucky draw from 10 - 40U<br />
c) Top 5, each earns extra 50U<br />
2. Top 300 Commanders will be rewarded CEG:<br />
Each earns a lucky draw from 100 - 500CEG, the value equals 10 -
50U<br />
3. All the Commanders have an extra chance to draw 1 of 700
Mystery Boxes that each contains NFTs with values from 1 - 60U
</div>
<a href="javascript:void(0)" class="sliderbtn"
><img class="preload" data-src="images/sliderbtn.png"
/></a>
</div>
<div
class="rule_sliders anmode fadeUp"
data-dura="0.6s"
data-delay="0.8s"
>
<div class="rule_tit">What is our NFT WL?</div>
<div class="rule_descprition" style="display: none">
WL of CEBG Hero is limited of 2000 in total. 50% of WL can get
ultimate freemint.<br />
Hero is the criteria of Play-to-Earn in CEBG and the second round
of NFT is planning to be launched in 2023.<br />
More detail about NFT will be announced in Discord and Twitter
</div>
<a href="javascript:void(0)" class="sliderbtn"
><img class="preload" data-src="images/sliderbtn.png"
/></a>
</div>
<div
class="rule_sliders anmode fadeUp"
data-dura="0.6s"
data-delay="1s"
>
<div class="rule_tit">Is there any reward for Beta Test?</div>
<div class="rule_descprition" style="display: none">
Please check Medium:xxxx
</div>
<a href="javascript:void(0)" class="sliderbtn"
><img class="preload" data-src="images/sliderbtn.png"
/></a>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="footer_con">
<!-- <a href="https://discord.gg/8dWX6jpcME" class="f_icon1"
><img data-src="images/f_icon1.png" class="preload"
/></a> -->
<a href="https://twitter.com/CEBG_GAME" class="f_icon2"
><img data-src="images/f_icon2.png" class="preload"
/></a>
<a href="https://discord.gg/8dWX6jpcME" class="f_icon3"
><img data-src="images/f_icon3.png" class="preload"
/></a>
</div>
</div>
<script src="js/preload.js"></script>
<script src="js/model.js"></script>
<script src="js/time.js"></script>
<script>
function getUrlParam(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]);
return null;
}
var invitecode = getUrlParam("code");
if (invitecode) {
localStorage.setItem("invite_code", invitecode);
}
var loadPic = [];
for (var i = 1; i < 101; i++) {
loadPic.push("images/xl1/c (" + i + ").jpg");
}
for (var i = 1; i < 151; i++) {
loadPic.push("images/xl2/c (" + i + ").jpg");
}
for (var i = 1; i < 151; i++) {
loadPic.push("images/xl3/c (" + i + ").jpg");
}
var tempArr = ["images/header.jpg"];
tempArr = tempArr.concat(loadPic);
$(".preload").each(function () {
tempArr.push($(this).data("src"));
});
$.preload({
arr: tempArr,
onLoading: function (loadper) {
var perc = Math.ceil(loadper * 100);
$(".loadnumber").html(perc + "%");
},
onLoaded: function () {
$(".preload").each(function (index, element) {
var imgpath = $(this).data("src");
$(this).attr("src", imgpath);
});
setTimeout(function () {
$(window).scrollTop(0);
$(".loading").fadeOut();
$(".section1").addClass("animated");
$(".section2").addClass("animated");
}, 500);
},
});
function formatAddress(address) {
if (address.length >= 10) {
return (
address.substring(0, 6) +
"......" +
address.substring(address.length - 4)
);
} else if (address.length > 0 && address.length < 10) {
return address;
} else {
return "-";
}
}
$(function () {
$(".rule_sliders").click(function () {
if (!$(this).hasClass("sliderOn")) {
$(".rule_sliders").removeClass("sliderOn");
$(this).addClass("sliderOn");
$(".rule_descprition").slideUp();
$(this).find(".rule_descprition").slideDown();
} else {
$(this).removeClass("sliderOn");
$(this).find(".rule_descprition").slideUp();
}
});
var address = "";
var token = "";
var checkActivity = function (address, cb) {
var settings = {
url: "https://invitation.cebggame.com/aa1/user_status",
method: "POST",
headers: {
"Content-Type": "application/json",
},
data: JSON.stringify({
account: address,
}),
};
$.ajax(settings).done(function (res) {
if (!res.errcode) {
if (res.status == 4) {
$("#page_login_btn").hide();
$("#page_quest_btn").show();
$("#quest_info").show();
$("#sign_href").hide();
} else if (res.status == 1) {
$("#page_login_btn").show();
$("#page_quest_btn").hide();
$("#quest_info").hide();
$("#sign_href").show();
$("#page_login_btn").attr("href", "/recommend");
} else {
$("#page_login_btn").show();
$("#page_quest_btn").hide();
$("#quest_info").hide();
$("#sign_href").show();
$("#page_login_btn").attr("href", "/signup");
}
}
});
};
var checkLogin = function () {
let userinfo = window.localStorage.getItem("userinfo");
if (!userinfo) {
return false;
}
try {
let udata = JSON.parse(userinfo);
console.log(udata);
address = udata.account;
token = udata.token;
if (address) {
$("#logined_btn").html(formatAddress(address));
$("#wallet_login_btn").hide();
$("#logined_btn").show();
$("#page_login_btn").attr("href", "/signup");
checkActivity(address, function () {});
}
return true;
} catch (err) {
return false;
}
};
checkLogin();
$("#wallet_login_btn").click(function () {
location.href = "/login";
});
$('#logout_btn').click(function(){
localStorage.removeItem('userinfo')
localStorage.removeItem('invite_code');
location.reload()
})
});
$(".anmode").each(function () {
var th = $(this);
var dura = th.data("dura");
var delay = th.data("delay");
th.css("animation-duration", dura);
th.css("animation-delay", delay);
});
$(window).scroll(function () {
var windowtop = $(window).scrollTop();
$(".section").each(function (index, element) {
var th = $(this);
var thtops = th.offset().top;
if (windowtop >= thtops - $(window).height() * 0.8) {
if (!th.hasClass("animated")) {
th.addClass("animated");
}
}
})
})
$(window).scroll(function () {
var windowtop = $(window).scrollTop();
$(".section").each(function (index, element) {
var th = $(this);
var thtops = th.offset().top;
if (windowtop >= thtops - $(window).height() * 0.8) {
if (!th.hasClass("animated")) {
th.addClass("animated");
}
}
});
});
$("#logined_btn").click(function () {
$(".dropdown-content").show();
});
</script>
</body>
</html>