|
@@ -0,0 +1,402 @@
|
|
|
+var RankItem = require('./rankitem.js').RankItem;
|
|
|
+var Label = require('./libs/label.js').Label;
|
|
|
+var Sprite = require('./libs/sprite.js').Sprite;
|
|
|
+
|
|
|
+var BottomScoreItem = require('./bottomscoreitem.js').BottomScoreItem;
|
|
|
+
|
|
|
+const PAGE_SIZE = 5;
|
|
|
+const ITEM_WIDTH =600;// 608;
|
|
|
+//100
|
|
|
+const ITEM_HEIGHT = 65;//126;
|
|
|
+//270
|
|
|
+const offsetY = 220;
|
|
|
+//间距
|
|
|
+const itemGap = 15;
|
|
|
+//1150
|
|
|
+const ownerY= 1150;
|
|
|
+
|
|
|
+
|
|
|
+const pageTextY=1250;
|
|
|
+var offsetX = 0;
|
|
|
+
|
|
|
+var canvawidth = 0;
|
|
|
+var canvaheight = 0;
|
|
|
+var normal_scale = 1;
|
|
|
+
|
|
|
+var swidth = 630;
|
|
|
+var sheight = 800;
|
|
|
+
|
|
|
+var friends_scores = [];
|
|
|
+//总排行数据 可为群或者好友
|
|
|
+var group_scores = [];
|
|
|
+//周排行数据 可为群或者好友
|
|
|
+var group_week_scores = [];
|
|
|
+var current_scores = [];
|
|
|
+
|
|
|
+var moveoffset = 0; //滑动偏移
|
|
|
+var allHeight = 0; //整个排行榜高
|
|
|
+var worldData;
|
|
|
+var isworldRank = false;
|
|
|
+
|
|
|
+const dataSorter = (gameDatas, filed = "Level") => {
|
|
|
+ console.log("玩家信息----",gameDatas);
|
|
|
+ return gameDatas.sort((a, b) => {
|
|
|
+ const kvDataA = a.KVDataList.find(kvData => kvData.key == filed);
|
|
|
+ const kvDataB = b.KVDataList.find(kvData => kvData.key == filed);
|
|
|
+ console.log("玩家分数为------------");
|
|
|
+ var stageA = JSON.parse(kvDataA.value).wxgame.Level;
|
|
|
+
|
|
|
+ var stageB = JSON.parse(kvDataB.value).wxgame.Level;
|
|
|
+ const gradeA = kvDataA ? parseInt(stageA || 0) : 0;
|
|
|
+ const gradeB = kvDataB ? parseInt(stageB || 0) : 0;
|
|
|
+ return gradeA > gradeB ? -1 : gradeA < gradeB ? 1 : 0;
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+let myInfo;
|
|
|
+let avatarUrl;
|
|
|
+//获取个人信息
|
|
|
+wx.getUserInfo({
|
|
|
+ openIdList: ["selfOpenId"],
|
|
|
+ success: function (res) {
|
|
|
+ myInfo = res.data[0];
|
|
|
+ avatarUrl = myInfo.avatarUrl;
|
|
|
+ console.log(myInfo);
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+var adpater = 0;
|
|
|
+
|
|
|
+var h;//宽
|
|
|
+var v;//高
|
|
|
+class RankListRenderer {
|
|
|
+
|
|
|
+ constructor() {
|
|
|
+ this.totalPage = 0;
|
|
|
+ this.currPage = 0;
|
|
|
+ this.keyName = "";
|
|
|
+ this.rankitemArr = [];
|
|
|
+ this.init();
|
|
|
+ this.sys_info = wx.getSystemInfoSync();
|
|
|
+ }
|
|
|
+
|
|
|
+ init() {
|
|
|
+ this.canvas = wx.getSharedCanvas();
|
|
|
+ this.ctx = this.canvas.getContext('2d');
|
|
|
+ this.ctx.imageSmoothingEnabled = true;
|
|
|
+ this.ctx.imageSmoothingQuality = "high";
|
|
|
+ this.rankcanvas = wx.createCanvas();
|
|
|
+ this.rankctx = this.rankcanvas.getContext('2d');
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ listen() {
|
|
|
+ wx.onMessage(msg => {
|
|
|
+ console.log(msg);
|
|
|
+ switch (msg.action) {
|
|
|
+ case "canvase_width_height":
|
|
|
+ console.log(msg.data.width, msg.data.height);
|
|
|
+ canvawidth = msg.data.width;
|
|
|
+ canvaheight = msg.data.height;
|
|
|
+
|
|
|
+ v = canvaheight / this.screenHeight;
|
|
|
+ h = canvawidth / this.sys_info.screenWidth;
|
|
|
+
|
|
|
+ offsetX = (canvawidth - ITEM_WIDTH) * 0.5 * normal_scale;
|
|
|
+ this.rankcanvas.width = canvawidth;
|
|
|
+ this.rankcanvas.height = canvaheight;
|
|
|
+ break;
|
|
|
+ case "clearctx":
|
|
|
+ this.rankctx.clearRect(0, 0, canvawidth, canvaheight);
|
|
|
+ break;
|
|
|
+ case "get_friend_storage":
|
|
|
+ this.getFriendStorage(msg.keyName);
|
|
|
+ break;
|
|
|
+ case "show_friend_rank":
|
|
|
+ console.log("keyname111111", msg.keyName);
|
|
|
+ this.keyName = msg.keyName;
|
|
|
+ this.fetchFriendData(msg.keyName);
|
|
|
+ isworldRank = false;
|
|
|
+ this.currPage = 0;
|
|
|
+ break;
|
|
|
+ case "show_group_rank":
|
|
|
+ console.log("show_group_rank", msg.data);
|
|
|
+ if (!msg.data) return;
|
|
|
+ this.keyName = msg.keyName;
|
|
|
+ this.fetchGroupData(msg.keyName, msg.data);
|
|
|
+ break;
|
|
|
+ case "show_world_rank":
|
|
|
+ console.log("show_group_rank", msg.data);
|
|
|
+ if (!msg.data) return;
|
|
|
+ this.keyName = msg.keyName;
|
|
|
+ worldData = msg.data;
|
|
|
+ this.totalPage = Math.ceil(worldData["list"].length / PAGE_SIZE);
|
|
|
+ isworldRank = true;
|
|
|
+ this.showWorldRanks(0);
|
|
|
+ break;
|
|
|
+ case "show_min_rank":
|
|
|
+ this.keyName = msg.keyName;
|
|
|
+ this.drawMinRank(msg.keyName, msg.data);
|
|
|
+ break;
|
|
|
+ case "show_up_page":
|
|
|
+ if (!isworldRank && !current_scores.length) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (isworldRank && !worldData["list"].length) {
|
|
|
+ return;
|
|
|
+ } {
|
|
|
+ let page = this.currPage;
|
|
|
+ page -= 1;
|
|
|
+ if (page < 0) page = 0;
|
|
|
+ if (this.currPage > page) {
|
|
|
+ this.currPage = page;
|
|
|
+ if (isworldRank == false)
|
|
|
+ this.showRanks(this.currPage);
|
|
|
+ else this.showWorldRanks(this.currPage);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case "show_next_page":
|
|
|
+ if (!isworldRank) {
|
|
|
+ if (!current_scores.length) return;
|
|
|
+
|
|
|
+ } else {
|
|
|
+ if (!worldData["list"].length) return;
|
|
|
+ } {
|
|
|
+
|
|
|
+ let page = this.currPage;
|
|
|
+ page += 1;
|
|
|
+ if (this.totalPage <= page) page = this.totalPage - 1;
|
|
|
+ if (this.currPage < page) {
|
|
|
+ this.currPage = page;
|
|
|
+ if (isworldRank == false)
|
|
|
+ this.showRanks(this.currPage);
|
|
|
+ else this.showWorldRanks(this.currPage);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ console.log(`未知消息类型:msg.action=${msg.action}`);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ fetchFriendData(keyName) {
|
|
|
+ wx.getFriendCloudStorage({
|
|
|
+ keyList: [
|
|
|
+ keyName,
|
|
|
+ ],
|
|
|
+ success: res => {
|
|
|
+ console.log("wx.getFriendCloudStorage success", res);
|
|
|
+ const dataLen = res.data.length;
|
|
|
+ friends_scores = dataSorter(res.data, keyName);
|
|
|
+ console.log("Sort success", friends_scores);
|
|
|
+ current_scores = friends_scores;
|
|
|
+ this.totalPage = Math.ceil(current_scores.length / PAGE_SIZE);
|
|
|
+ console.log(" this.totalPage", this.totalPage);
|
|
|
+ if (dataLen) {
|
|
|
+ this.showRanks(0);
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ fail: res => {
|
|
|
+ console.log("wx.getFriendCloudStorage fail", res);
|
|
|
+ },
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ showRanks(page) {
|
|
|
+
|
|
|
+ const startIndex = page * PAGE_SIZE;
|
|
|
+ const stopIndex = startIndex + PAGE_SIZE;
|
|
|
+ const datas = current_scores.slice(startIndex, stopIndex);
|
|
|
+ let x = 0;
|
|
|
+ if (this.sys_info.model.match("iPhone X")) {
|
|
|
+ x = 110
|
|
|
+ }
|
|
|
+ this.ctx.clearRect(0, 0, canvawidth, canvaheight);
|
|
|
+ for (let i = 0, len = datas.length; i < len; i++) {
|
|
|
+ let data = datas[i];
|
|
|
+ const nick = data.nickname.length <= 5 ? data.nickname : data.nickname.substr(0, 5) + "...";
|
|
|
+ const kvData = data.KVDataList.find(kvData => kvData.key == this.keyName);
|
|
|
+ const itemGapY = (ITEM_HEIGHT + itemGap) * i + offsetY;
|
|
|
+ const avatarUrl = data.avatarUrl;
|
|
|
+
|
|
|
+ const grade = kvData ? this.max_crossed_stage(kvData.value) : 0;
|
|
|
+ let rankItem = this.rankitemArr[i];
|
|
|
+ if (rankItem == null) {
|
|
|
+ rankItem = new RankItem(offsetX, itemGapY, ITEM_WIDTH, ITEM_HEIGHT);
|
|
|
+ this.rankitemArr.push(rankItem);
|
|
|
+ rankItem.create();
|
|
|
+ }
|
|
|
+
|
|
|
+ rankItem.setData(i + startIndex + 1, avatarUrl, nick, grade, this.keyName);
|
|
|
+ rankItem.drawToCanvas(this.ctx);
|
|
|
+ console.log("offsetY", offsetY);
|
|
|
+ }
|
|
|
+
|
|
|
+ // let page_y = canvaheight - 360;
|
|
|
+ // let pageLabel = new Label(canvawidth * 0.5-40 , pageTextY);
|
|
|
+ // pageLabel.fontSize = "45px"
|
|
|
+ // pageLabel.fillStyle = "#ffffff";
|
|
|
+ // pageLabel.text = `${this.currPage + 1} / ${this.totalPage}`;
|
|
|
+ // pageLabel.drawToCanvas(this.ctx);
|
|
|
+ this.showBottomOwner();
|
|
|
+ }
|
|
|
+
|
|
|
+ max_crossed_stage(value)
|
|
|
+ {
|
|
|
+ return parseInt(JSON.parse(value).wxgame.Level);
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ showBottomOwner() {
|
|
|
+ let grade = 0;
|
|
|
+ let mydata;
|
|
|
+ let ranking=0;
|
|
|
+ for (let i = current_scores.length - 1; i >= 0; i--) {
|
|
|
+
|
|
|
+ let data = current_scores[i];
|
|
|
+ if (data.avatarUrl == avatarUrl) {
|
|
|
+ mydata = data;
|
|
|
+ ranking=i+1;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ let kvData = mydata.KVDataList.find(kvData => kvData.key == this.keyName);
|
|
|
+ grade = kvData ? this.max_crossed_stage(kvData.value) : 0;
|
|
|
+ if (this.ownerItem == null) {
|
|
|
+ //this.ownerItem = new BottomScoreItem(offsetX, 1040 + adpater, ITEM_WIDTH, ITEM_HEIGHT);
|
|
|
+ this.ownerItem = new BottomScoreItem(offsetX, ownerY, ITEM_WIDTH, ITEM_HEIGHT);
|
|
|
+ this.ownerItem.create();
|
|
|
+ }
|
|
|
+ console.log(mydata.nickname);
|
|
|
+ console.log(grade);
|
|
|
+ //this.ownerItem.setData( mydata.nickname, avatarUrl, grade);
|
|
|
+ this.ownerItem.setData(ranking, mydata.nickname, avatarUrl, grade);
|
|
|
+ this.ownerItem.drawToCanvas(this.ctx);
|
|
|
+ }
|
|
|
+
|
|
|
+ showWorldRanks(page) {
|
|
|
+ const startIndex = page * PAGE_SIZE;
|
|
|
+ const stopIndex = startIndex + PAGE_SIZE;
|
|
|
+ const datas = worldData["list"].slice(startIndex, stopIndex);
|
|
|
+ console.log("datas", datas);
|
|
|
+ let x = 0;
|
|
|
+ if (this.sys_info.model.match("iPhone X")) {
|
|
|
+ x = 110
|
|
|
+ }
|
|
|
+ this.ctx.clearRect(0, 0, canvawidth, canvaheight);
|
|
|
+ for (let i = 0, len = datas.length; i < len; i++) {
|
|
|
+ let data = datas[i];
|
|
|
+ let nick = data.nickname.length <= 10 ? data.nickname : data.nickname.substr(0, 10) + "...";
|
|
|
+ nick = nick == "" ? "游客" : nick
|
|
|
+ const itemGapY = (ITEM_HEIGHT + 6) * i + offsetY;
|
|
|
+ const avatarUrl = data.avatar;
|
|
|
+ const grade = data.score;
|
|
|
+ let rankItem = this.rankitemArr[i];
|
|
|
+ if (rankItem == null) {
|
|
|
+ rankItem = new RankItem(offsetX, itemGapY, ITEM_WIDTH, ITEM_HEIGHT);
|
|
|
+ this.rankitemArr.push(rankItem);
|
|
|
+ rankItem.create();
|
|
|
+ }
|
|
|
+ rankItem.position(offsetX, itemGapY);
|
|
|
+ rankItem.setData(i + startIndex + 1, avatarUrl, nick, grade, this.keyName);
|
|
|
+ rankItem.drawToCanvas(this.ctx);
|
|
|
+ console.log("offsetY", offsetY);
|
|
|
+ }
|
|
|
+
|
|
|
+ let page_y = canvaheight - 360;
|
|
|
+ let pageLabel = new Label(canvawidth * 0.5 - 60, page_y);
|
|
|
+ pageLabel.fontSize = "35px"
|
|
|
+ pageLabel.fillStyle = "#ffffff";
|
|
|
+ pageLabel.text = `${this.currPage + 1} / ${this.totalPage}`;
|
|
|
+ pageLabel.drawToCanvas(this.ctx);
|
|
|
+ this.showBottomOwner();
|
|
|
+ }
|
|
|
+
|
|
|
+ fetchGroupData(keyName, shareTicket) {
|
|
|
+ //取出群同玩成员数据
|
|
|
+ wx.getGroupCloudStorage({
|
|
|
+ shareTicket,
|
|
|
+ keyList: [
|
|
|
+ keyName,
|
|
|
+ ],
|
|
|
+ success: res => {
|
|
|
+ console.log("wx.getGroupCloudStorage success", res);
|
|
|
+ const dataLen = res.data.length;
|
|
|
+ group_scores = dataSorter(res.data, keyName);
|
|
|
+ current_scores = group_scores;
|
|
|
+ this.totalPage = Math.ceil(current_scores.length / PAGE_SIZE);
|
|
|
+ console.log(" this.totalPage", this.totalPage);
|
|
|
+ if (dataLen) {
|
|
|
+ this.showRanks(0);
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ fail: res => {
|
|
|
+ console.log("wx.getGroupCloudStorage fail", res);
|
|
|
+ },
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ drawMinRank(keyName, shareTicket) {
|
|
|
+ wx.getFriendCloudStorage({
|
|
|
+ keyList: [
|
|
|
+ keyName,
|
|
|
+ ],
|
|
|
+ success: res => {
|
|
|
+ console.log("wx.getFriendCloudStorage success", res);
|
|
|
+ const dataLen = res.data.length;
|
|
|
+ friends_scores = dataSorter(res.data, keyName);
|
|
|
+ current_scores = friends_scores;
|
|
|
+ this.totalPage = Math.ceil(current_scores.length / PAGE_SIZE);
|
|
|
+ console.log(" this.totalPage", this.totalPage);
|
|
|
+ if (dataLen) this.showMinRanks();
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ fail: res => {
|
|
|
+ console.log("wx.getFriendCloudStorage fail", res);
|
|
|
+ },
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ getFriendStorage(keyName) {
|
|
|
+ wx.getFriendCloudStorage({
|
|
|
+ keyList: [
|
|
|
+ keyName,
|
|
|
+ ],
|
|
|
+ success: res => {
|
|
|
+ console.log("wx.getFriendCloudStorage success", res);
|
|
|
+ const dataLen = res.data.length;
|
|
|
+ friends_scores = dataSorter(res.data, keyName);
|
|
|
+ current_scores = friends_scores;
|
|
|
+ console.log(" this.totalPage", this.totalPage);
|
|
|
+ },
|
|
|
+
|
|
|
+ fail: res => {
|
|
|
+ console.log("wx.getFriendCloudStorage fail", res);
|
|
|
+ },
|
|
|
+
|
|
|
+ });
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+let ranklist = new RankListRenderer();
|
|
|
+ranklist.listen();
|