var Sprite = require('./libs/sprite.js').Sprite
var Label = require('./libs/label.js').Label

function BottomScoreItem(x, y, width, height) {
  this.x = x;
  this.y = y;
  this.width = width;
  this.height = height;
}
var circlebg = "openDataContext/asset/circle.png";
BottomScoreItem.prototype.create = function() {

  // this.rankbg = new Sprite("openDataContext/asset/paiwei_xin_1_6_6.png", this.x - 50, this.y + this.height * 0.5 * 0.1, 720, 300);
  // this.rankbg.parent = this;

  let labelOffset = 65;
  let labelStyle = "#ffffff";
  let fontSize = "35px";

  this.rankLabel = new Label(this.x+90 , this.y-315 );
  this.rankLabel.fontSize = "65px";
  this.rankLabel.fillStyle = labelStyle;
  this.rankLabel.textAlign = 'center';

  let rankWidth = 67;
  let rankHeight = 63;
  //this.rankimg = new Sprite('', this.x + 20, this.y + this.height * 0.5 - rankHeight * 0.5, rankWidth, rankHeight);

  let offsetX = 90;
  // let circleWidth = 96;
  // let circleHeight = 96;
  // this.circleicon = new Sprite(circlebg, this.x + offsetX, this.y + this.height * 0.5 - circleHeight * 0.5, circleWidth, circleHeight);
  // this.circleicon.visible = false;
  let iconWidth = 60;
  let iconHeight = 60;
  this.icon = new Sprite('', this.x + 120, this.y -365/**+ this.height * 0.5 - iconHeight * 0.5 + 20*/, iconWidth, iconHeight);

  this.nameLabel = new Label(this.x + 220, this.y - 320);
  this.nameLabel.fontSize = fontSize;
  this.nameLabel.fillStyle = labelStyle;

  this.scoreNum = new Label(this.x + this.width - 170, this.y - 320);
  this.scoreNum.fontSize = fontSize;
  this.scoreNum.fillStyle = labelStyle;
  this.scoreNum.textAlign = "center";

  this.scoreLabel = new Label(this.x + this.width - 100, this.y - 320);
  this.scoreLabel.fontSize = fontSize;
  this.scoreLabel.fillStyle = labelStyle;
  this.scoreLabel.textAlign = "right";
}

BottomScoreItem.prototype.setData = function(rankNum,name, iconUrl, score) {
  this.icon.src = iconUrl;
  this.nameLabel.text = name;
  this.scoreNum.text = score;
  this.scoreLabel.text ="第        关";
  this.rankLabel.text = rankNum;
  if (rankNum <= 3) {
    //this.rankLabel.visible = false;
    //this.rankimg.visible = true;
    //this.rankimg.src = this.getRankUrl(rankNum);
  } else {
    //this.rankLabel.visible = true;
    //this.rankimg.visible = false;
    //this.rankLabel.text = rankNum;
  }
}
// var rank1url = "openDataContext/asset/paihang-1-3.png";
// var rank2url = "openDataContext/asset/paihang-1-3-2.png";
// var rank3url = "openDataContext/asset/paihang-1-3-1.png";
// BottomScoreItem.prototype.getRankUrl = function(num) {
//   let rankNum = num;
//   let url = "";
//   switch (rankNum) {

//     case 1:
//       url = rank1url;
//       break;
//     case 2:
//       url = rank2url;
//       break;
//     case 3:
//       url = rank3url;
//       break;
//     default:
//       url = "";
//       break;
//   }
//   return url;
// }
BottomScoreItem.prototype.drawToCanvas = function(ctx) {
  //this.rankbg.drawToCanvas(ctx);
  this.scoreNum.drawToCanvas(ctx);
  this.rankLabel.drawToCanvas(ctx);
  this.icon.drawToCanvas(ctx);
  this.nameLabel.drawToCanvas(ctx);
  this.scoreLabel.drawToCanvas(ctx);
}

module.exports.BottomScoreItem = BottomScoreItem;