调整一些图片和文字

src/comp/desktopNav.html

@@ -37,11 +37,29 @@
   <a href="javascript:void(0);" class="login fr" id="header_loginbtn">
     <img src="img/home/login@2x.png" />
   </a>
-  <a
-    href="javascript:void(0);"
-    class="login fr logout"
-    id="header_logoutbtn"
+  <div
+    class="fr logout dropdown" id ="header_logoutbtn"
   >
-    Logout
-  </a>
+  <div href="javascript:void(0)" class="dropdown-toggle user-icon">
+    <img src="img/home/user-icon.png" alt="user icon">
+  </div>
+  <ul class="dropdown-menu user-menu">
+    <li id="user_adderss" class="user_address hide">
+      <span id="menu_user_address"></span>
+      <svg data-v-05d4c3ad="" version="1.1" viewBox="0 0 24 24" class="icCopy" id="address_copy">
+        <path pid="0" d="M20 9h-9a2 2 0 00-2 2v9a2 2 0 002 2h9a2 2 0 002-2v-9a2 2 0 00-2-2z" _stroke="#BCADF2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+        <path pid="1" d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1" _stroke="#BCADF2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+      </svg>
+    </li>
+    <li>
+      <a href="https://mall.cebg.games/mynft">MyNFT</a>
+    </li>
+    <li id="menu_cmdr" class="hide">
+      <a href="./commander.html" id="cmdr_href">Commander</a>
+    </li>
+    <li>
+      <a href="javascript:void(0);" id="header_menu_logoutbtn">Logout</a>
+    </li>
+  </ul>
+  </div>
 </div>

src/desktop/ambassadorinfo.html

@@ -47,7 +47,7 @@
 							</div>
 						</div>
 						<div class="amb-i-11">
-							<span>Apply to be his/her commander</span>
+							<span><a href="./join.html?amb=" id="apply_href">Apply to be his/her commander</a></span>
 							<a id="copyBtn"></a>
 						</div>
 					</div>
@@ -139,6 +139,9 @@
 					}
 				}
 				fetchDatas();
+				window.addEventListener('account_ready', function() {
+					$('#apply_href').attr('href', `./join.html?amb=${window.chain.account}`)
+				})
 			})
 		</script>
 	</body>

src/desktop/commander.html

@@ -37,6 +37,10 @@
 								<p class="amb-i-txt" id="info_commander"></p>
 							</div>
 						</div>
+            <div class="amb-i-11 origon hide" id="cp_container">
+							<span>Click right button copy the Commander link</span>
+							<a id="copyBtn"></a>
+						</div>
 						<div class="amb-i-11 gray" id="apply_btn">
 
 						</div>
@@ -73,11 +77,11 @@
 							return '-'
 					}
 				}
-
-				$("#copyBtn").click(function() {
+      
+				$("#copyBtn").on('click', function() {
 					var host = location.origin;
-					var path = location.pathname.replace('ambassadorinfo', 'join');
-					var _text = `${host}${path}?cmdr=${account}`;
+					var path = location.pathname;
+					var _text = `${host}${path}?cmdr=${window.chain.account}`;
 					const input = document.createElement('input');
 					document.body.appendChild(input);
 					input.value = _text;
@@ -137,7 +141,14 @@
                 canJoin = false
               }
               updateStatus()
-              if (!canJoin) {
+              if (cmdr === window.chain.account) {
+                $('#cp_container').show()
+                $('#apply_btn').hide();
+              } else {
+                $('#cp_container').hide()
+                $('#apply_btn').show();
+              }
+              if (!canJoin && cmdr !== window.chain.account) {
                 showTips()
               }
             }
@@ -194,7 +205,7 @@
         }
 
         let account = ''
-        let useLvl = 0
+        let userLvl = 0
         let canJoin = true
         if (window.chain.logined) {
           account = window.chain.account
@@ -208,14 +219,9 @@
         }
         updateStatus();
 				getCmdrInfo();
-        if(window.chain.logined) {
-          let time = setInterval(()=>{
-            if (window.chain.account) {
-              clearInterval(time);
-              checkBind();
-            }
-          }, 1000)
-        }
+        window.addEventListener('account_ready', function() {
+					checkBind();
+				})
 			})
 		</script>
 	</body>

src/desktop/css/main.css

@@ -46,6 +46,7 @@ body {
 	color: white;
 	line-height: 30px;
 	display: none;
+	margin-right: 20px;
 }
 
 .nav a {
@@ -59,7 +60,7 @@ body {
 	position: relative;
 	overflow: hidden;
 	float: left;
-	padding: 0 35px;
+	padding: 0 28px;
 }
 
 .nav a::after {
@@ -1301,7 +1302,7 @@ span.swiper-pagination-bullet {
 	margin-right: 17px;
 }
 .amb-i-7{
-	background: url('../img/applyother/am7.png') no-repeat center top;
+	background: url('../img/applyother/am7.jpg') no-repeat center top;
 	width: 280px;
 	height: 132px;
 	margin-right: 17px;
@@ -1355,6 +1356,7 @@ span.swiper-pagination-bullet {
 	text-overflow: ellipsis;
 	vertical-align: middle;
 }
+
 .amb-i-11 a{
 	display: inline-block;
 	width: 100px;
@@ -1362,6 +1364,9 @@ span.swiper-pagination-bullet {
 	cursor: pointer;
 	vertical-align: middle;
 }
+.amb-i-11 span a {
+	color: #008df9;
+}
 .amb-i-txt{
 	width: 270px;
 	height: 50px;
@@ -1393,8 +1398,13 @@ span.swiper-pagination-bullet {
 	background: url('../img/applyother/btn_become.png') no-repeat top;
 	height: 88px;
 }
+.commander .amb-i-11.origon{
+	background: url('../img/applyother/com-input.png') no-repeat top;
+}
+
 .commander .amb-i-11 span {
-	line-height: 84px;
+	line-height: 88px;
+	margin-top: -10px;
 }
 .commander .amb-i-4 {
 	width: 312px;
@@ -1443,6 +1453,48 @@ span.swiper-pagination-bullet {
 	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
 	filter: grayscale(100%);
 }
+.logout a{
+	font-size: 14px;
+  height: 57px;
+	line-height: 58px;
+	color: white;
+}
+.user-icon{
+	height: 57px;
+	cursor: pointer;
+}
+.user-icon img{
+	width: 32px;
+  margin-top: 12px;
+}
+.user-menu {
+	flex-direction: column;
+	padding: 10px 20px;
+}
+.user-menu .user_address{
+	border-bottom: 1px solid #ffffff;
+	display: flex;
+	padding-bottom: 14px;
+  padding-top: 10px;
+}
+.user-menu .icCopy{
+	display: inline-block;
+	width: 16px;
+	height: 16px;
+	color: #ffffff;
+	fill: none;
+	stroke: currentColor;
+	vertical-align: -0.15em;
+	margin-top: 7px;
+	margin-left: 8px;
+}
+.user-menu a {
+	color: white;
+	font-size: 20px;
+	height: 57px;
+	line-height: 58px;
+	font-family: na-he;
+}
 
 
 

src/desktop/join.html

@@ -36,15 +36,15 @@
 								</div>
 								<p class="checkbox-wrap">
 									<input type="checkbox" class="checkbox" id="ever" name="ever">
-									<label for="ever">Ever had blockchain experience yet?</label>									
+									<label for="ever">Blockchain experience?</label>									
 								</p>
 								<p class="checkbox-wrap">
 									<input type="checkbox" class="checkbox" id="alr" name="alr">
-									<label for="alr">Already follow CEBG's Twitter feed?</label>									
+									<label for="alr">Followed CEBG Twitter?</label>									
 								</p>
 								<p class="checkbox-wrap">
 									<input type="checkbox" class="checkbox" id="dis" name="dis">
-									<label for="dis">Already joined CEBG Discord?</label>									
+									<label for="dis">Joined CEBG Discrod?</label>									
 								</p>
 
 								<p class="tac submit-btn">
@@ -66,7 +66,7 @@
 		<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/jquery.validate.min.js" integrity="sha256-JwUksNJ6/R07ZiLRoXbGeNrtlFZMFDKX4hemPiHOmCA=" crossorigin="anonymous"></script>
 		<script>
 			const FORM_URL = 'https://invitation.cebggame.com/invitation/add_commander';
-			const CHECK_URL = 'https://invitation.cebggame.com/invitation/check_is_commander';
+			const CHECK_URL = 'https://invitation.cebggame.com/invitation/check_bind_commander';
 			$().ready(function() {
 				function getUrlParam(name) {
             var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
@@ -154,7 +154,7 @@
             data.token = window.chain.token;
           }
 					try {
-						let data = await fetch(
+						let resData = await fetch(
 							CHECK_URL,
 							{ 
 								method: 'POST', 
@@ -167,8 +167,8 @@
 						.then(res => {
 							return res.json()
 						})
-						if (!data.errcode) {
-							return data.result === 1
+						if (!resData.errcode && resData.result) {
+							return resData.result.chk === 1
 						} else {
 							return false
 						}
@@ -187,9 +187,10 @@
 							showSuccess();
 						}
 					}
-					
 				}
-				
+				window.addEventListener('account_ready', function() {
+					checkStatus()
+				})
 			});
 		</script>	
 	</body>

src/desktop/js/main.js

@@ -10,7 +10,16 @@ var jcchain = require("./jcchain.js");
 })(jQuery);
 
 var chain = new jcchain.JCChain();
-chain.chainManager.init();
+chain.chainManager.init().then(() => {
+  if (window.chain.logined) {
+    checkWalletBind();
+    let event = new Event("account_ready", {
+      bubbles: true,
+      cancelable: false,
+    });
+    window.dispatchEvent(event);
+  }
+});
 window.chain = chain;
 var toggleLoginBtn = function () {
   if (chain.logined) {
@@ -29,6 +38,9 @@ var logSuccess = function () {
   window.logincb = undefined;
   toggleLoginBtn();
   window.onChainLogined && window.onChainLogined();
+  checkWalletBind();
+  let event = new Event("account_ready", { bubbles: true, cancelable: false });
+  window.dispatchEvent(event);
 };
 window.chainLogin = function (cb) {
   window.logincb = cb;
@@ -38,12 +50,27 @@ $("#header_loginbtn").click(function () {
   window.chainLogin();
 });
 
-$("#header_logoutbtn").click(function () {
+$("#header_menu_logoutbtn").click(function () {
   chain.logout().then(() => {
     toggleLoginBtn();
     window.onChainLoginOut && window.onChainLoginOut();
   });
 });
+$("#address_copy").click(function () {
+  if (!window.chain.account) {
+    return;
+  }
+  var _text = window.chain.account;
+  const input = document.createElement("input");
+  document.body.appendChild(input);
+  input.value = _text;
+  input.select();
+  if (document.execCommand("copy")) {
+    document.execCommand("copy");
+    alert("copy success");
+  }
+  document.body.removeChild(input);
+});
 jcchain.EventBus.$on(jcchain.SHOW_CHAIN_MODAL, function () {
   console.log("show chain modal");
   $("#wallet_modal").show();
@@ -64,6 +91,9 @@ $(window).click(function () {
 $(".dropdown-toggle").click(function (event) {
   event.stopPropagation();
   if (!$(this).parent().hasClass("open")) {
+    if (window.chain.logined) {
+      checkWalletBind();
+    }
     $(this).parent().addClass("open");
   } else {
     $(this).parent().removeClass("open");
@@ -79,3 +109,53 @@ if (window.cur) {
 if (window.sub) {
   $(`#sub_${sub}`).addClass("cur");
 }
+
+var fetchDatas = async (url, data) => {
+  var headers = new Headers();
+  headers.append("Content-Type", "application/json");
+  if (window.chain.logined) {
+    headers.append("Authorization", `Bearer ${window.chain.token}`);
+  }
+  return fetch(url, {
+    method: "POST",
+    headers,
+    mode: "cors",
+    cache: "no-cache",
+    body: JSON.stringify(data),
+  }).then((res) => {
+    return res.json();
+  });
+};
+const HOST = "https://invitation.cebggame.com";
+const CHECK_URL = `${HOST}/invitation/check_bind_commander`;
+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 "-";
+  }
+}
+var checkWalletBind = async () => {
+  if (window.chain.logined && window.chain.account) {
+    $("#user_address").show();
+  }
+
+  $("#menu_user_address").html(formatAddress(window.chain.account));
+  try {
+    let data = await fetchDatas(CHECK_URL, { account: window.chain.account });
+    if (!data.errcode && data.result) {
+      let userLvl = data.result.rank_level;
+      if (userLvl === 1) {
+        let url = `./commander.html?cmdr=${window.chain.account}`;
+        $("#cmdr_href").attr("href", url);
+        $("#menu_cmdr").show();
+      }
+    }
+  } catch (err) {
+    console.log(err);
+  }
+};