export default class FLD {
  drawFLD(context, image, status, index, text) {
    //console.log(index)
    
    //当未被选中时
    if (status == false) {
      //根据是第几个一级目录画图标
      image.onload = function () {
        let ratio = image.width / image.height
        context.drawImage(image, (screenWidth - 95), (index * 50) * 2, 50 * 2, (50/ratio)* 2)
      }
      //把目录名字加上
      //drawText(text, index)
      context.fillStyle = '#000'
      context.font = "20px Arial"
      if(text.length == 1){
        context.fillText(text, (screenWidth - 58), ((index + 2) * 50 - 4) * 2)
      }
      if (text.length == 2) {
        context.fillText(text, (screenWidth - 66), ((index + 2) * 50 - 4) * 2)
      }
      if (text.length == 3) {
        context.fillText(text, (screenWidth - 78), ((index + 2) * 50 - 4) * 2)
      }
      if (text.length == 4) {
        context.fillText(text, (screenWidth - 90), ((index + 2) * 50 - 4) * 2)
      }
    }
    else {
      //将选项背景换成白色，左边界变成红色
      context.fillStyle = '#fff'
      context.fillRect((screenWidth - 96), (index * 50 + 50) * 2, 50 * 2, 50 * 2)
      context.fillStyle = '#FFA500'
      context.fillRect((screenWidth - 100), (index * 50 + 50) * 2, 2 * 2, 50 * 2)
      image.onload = function () {
        let ratio = image.width / image.height
        context.drawImage(image, (screenWidth - 96), (index * 50) * 2, 50 * 2, (50 / ratio) * 2)
      }
      context.fillStyle = '#000'
      context.font = "20px Arial"
      if (text.length == 1) {
        context.fillText(text, (screenWidth - 58), ((index + 2) * 50 - 4) * 2)
      }
      if (text.length == 2) {
        context.fillText(text, (screenWidth - 66), ((index + 2) * 50 - 4) * 2)
      }
      if (text.length == 3) {
        context.fillText(text, (screenWidth - 78), ((index + 2) * 50 - 4) * 2)
      }
      if (text.length == 4) {
        context.fillText(text, (screenWidth - 90), ((index + 2) * 50 - 4) * 2)
      }
    }
    index++
  }
}
