PhonicsGame_master/pages/main/detail.js

import common from '../../utils/util';
import server from '../../utils/main';

const app = getApp();
var times = 1;
var pageIndex = 0;
var QuestionItem = [];
var tempAnswerList = [];
var arrAnswerID = [];
var isAndroid = false;
const waitTime = ["", "10秒钟", "15秒钟", "20秒钟", "25秒钟"];

Page({
  data: {
    version: app.globalData.version,
    IsShowMenu: false,
    filter: 'horizontal',
    //filter: 'vertical',
    PageNumber: 1,
    PageCount: 60,
    IsFinished: false,
    arrPage: [],
    ShowLoading: false,
    IsDistabled: "",
    NameClass: "",
    AddDisabled: "",
    SubDisabled: "btnAddSubDisabled",
    HelpHidden7: true,
    HelpHidden3: true,
    HelpHidden8: true,

    ShowAndroidNotice: false,
  },
  onLoad: function (options) {
    var that = this;
    var id = options.id;

    isAndroid = false;
    if (app.globalData.systemInfo.system && app.globalData.systemInfo.system.indexOf("Android") >= 0)
      isAndroid = true;

    this.setData({
      Containnerheight: server.getWindowHeight(),
      ID: id,
      ShowAndroidNotice: isAndroid,
    });
    var systemInfo = wx.getSystemInfoSync();
    if (systemInfo.system && systemInfo.system.indexOf("Android") >= 0) {
      times = 2;
    }
    this.getDetail(id);


    if (id > 0) {
      common.getStorageValue(this, "HelpHidden3", false, function () {
        that.showHelp();
      });
    } else {
      common.getStorageValue(this, "HelpHidden8", false, function () {
        that.showHelp8();
      });
    }

    common.getStorageValue(this, "IsShare", 0, function () {
      if (that.data.IsShare == 0 &&
        app.globalData.userInfo.IsMember == 0 &&
        app.globalData.userInfo.IsShow == 1 &&
        app.globalData.IsLocked == 1
      ) {
        wx.navigateTo({
          url: '../../package4/main/share',
        })
      }
    });

  },
  onShow: function () {
    if (this.data.ID == -1)
      this.getDetail(this.data.ID);
  },
  onUnload: function () {
    wx.hideLoading();
    this.closeHelp();
  },
  getDetail: function (id) {
    var item = {};
    if (id > 0) {
      var data = wx.getStorageSync('QuestionTypeList');
      for (var i = 0; i < data.length; i++) {
        for (var k = 0; k < data[i].List.length; k++) {
          if (id == data[i].List[k].ID) {
            item = data[i].List[k];
            item.Example[0] = item.Example[0].replace("+", " + ").replace("-", " - ").replace("×", " × ").replace("÷", " ÷ ");
            if (item.Example[1])
              item.Example[1] = item.Example[1].replace("+", " + ").replace("-", " - ").replace("×", " × ").replace("÷", " ÷ ");
            item.IconName = app.globalData.fileUrl + item.IconName;
            if (item.Name.length > 12)
              item.NameClass = "text2";
            break;
          }
        }
      }
    } else {
      item.Name = "我的错题集";
      var list = wx.getStorageSync('ErrorList');
      item.ErrorList = list;
    }

    this.setData({
      QuestionTypeItem: item,
    });

    //有竖式则缺省竖式
    if (item.QuestionNumber3 > 0) {
      this.menuClick({
        currentTarget: {
          dataset: {
            id: "vertical"
          }
        }
      })
    }
  },
  gotoError: function (e) {
    wx.navigateTo({
      url: '../main/errorlist',
    });
  },
  gotoAnswer: function (e) {
    wx.navigateTo({
      url: '../main/answer',
    });
    this.closeHelp2();
  },
  getFinish: function () {
    server.playSound("/sounds/click.mp3");

    this.setData({
      ShowLoading: true,
      BtnText: "全部保存到相册",
    });
    wx.hideLoading();
    arrAnswerID = [];
    tempAnswerList = [];
    this.getAnswerID();
    if (this.data.ID > 0) {
      this.getList(this.data.ID);
    } else {
      this.getErrorList();
    }

    this.closeHelp();
  },
  //重新生成试卷
  ResetFinish: function () {
    var that = this;
    wx.showLoading({
      title: "正在重置",
      complete: function () {
        var list = that.data.arrPage;
        for (var i = 0; i < list.length; i++) {
          wx.removeSavedFile({
            filePath: list[i].TempImagePath
          });
        }
        that.setData({
          arrPage: [],
          PageNumber: 1,
        });
        var tempList = wx.getStorageSync("AnswerList");
        for (var i = 0; i < list.length; i++) {
          tempList.shift();
        }
        wx.setStorageSync("AnswerList", tempList);
        wx.hideLoading();
        that.getFinish();
      }
    });
  },
  //题卡数据列表
  getList: function (id) {
    var that = this;
    var pageNum = that.data.PageNumber;
    var QuestionTypeCategory = 3;
    if (that.data.filter == "horizontal")
      QuestionTypeCategory = 2;
    pageIndex = 0;

    server.getData('GetQuestionTypesPrint?ID=' + id + '&QuestionTypeCategory=' + QuestionTypeCategory + '&PageNum=' + pageNum, function (data) {
      //console.log("UserInfo:" + data);
      if (data) {
        that.setData({
          IsFinished: true,
          arrPage: [],
          IsDistabled: "",
          WaitTime: waitTime[that.data.PageNumber],
        });

        QuestionItem = data;
        QuestionItem.IconName = that.data.QuestionTypeItem.IconName;

        
        // if (isAndroid) {
        //   console.log("android");
        //   const query = wx.createSelectorQuery();
        //   query.select('#Canvas')
        //     .fields({ node: true, size: true })
        //     .exec((res) => {
        //       const canvas = res[0].node;
        //       const ctx = canvas.getContext('2d');

        //       canvas.width = 1050;
        //       canvas.height = 1485;

        //       wx.canvasToTempFilePath({
        //         x: 0,
        //         y: 0,
        //         width: canvas.width,
        //         height: canvas.height,
        //         canvas: canvas,
        //         success: function(res2) {
        //           that.saveImage();
        //         }
        //       });
        //     });
        // } 
        // else {
          that.saveImage();
        // }
        
      }
    });

  },
  //错题列表
  getErrorList: function () {
    var that = this;

    QuestionItem = that.data.QuestionTypeItem;
    if (QuestionItem.ErrorList.length > 0) {
      QuestionItem.Category = -1; //错题集类别
      QuestionItem.QuestionTypeCategory = 2;
      QuestionItem.CategoryName = "";
      QuestionItem.Name = "我的错题集";
      QuestionItem.QuestionTypeLevel = "";
      QuestionItem.PageCount = QuestionItem.ErrorList.length > 60 ? 60 : QuestionItem.ErrorList.length;
      QuestionItem.QuestionList = QuestionItem.ErrorList;
      QuestionItem.CreateTime = common.formatDateCHSLong(new Date());
      QuestionItem.IconName = app.globalData.fileUrl + "questioncard_icon_grade0102_size01.png";

      QuestionItem.QuestionList = common.randomArray(QuestionItem.QuestionList);

      delete QuestionItem.ErrorList;
      pageIndex = 0;

      that.setData({
        IsFinished: true,
        arrPage: [],
        IsDistabled: "",
        WaitTime: waitTime[that.data.PageNumber],
      });
      
      // if (isAndroid) {
      //   console.log("android");
      //   const query = wx.createSelectorQuery();
      //   query.select('#Canvas')
      //     .fields({ node: true, size: true })
      //     .exec((res) => {
      //       const canvas = res[0].node;
      //       const ctx = canvas.getContext('2d');

      //       canvas.width = 1050;
      //       canvas.height = 1485;

      //       wx.canvasToTempFilePath({
      //         x: 0,
      //         y: 0,
      //         width: canvas.width,
      //         height: canvas.height,
      //         canvas: canvas,
      //         success: function(res2) {
      //           that.saveImage();
      //         }
      //       });
      //     });
      // } 
      // else {
        that.saveImage();
      // }
      
    } else {
      this.setData({
        ShowLoading: false,
      });
      wx.showModal({
        title: "没有错题",
        showCancel: false,
        content: "先到“对答案”中给做错的题目打记号（点击题目序号）",
      });
    }
  },
  getAnswerID: function () {
    var list = wx.getStorageSync("AnswerList");
    var id = 1;
    if (list && list.length > 0) {
      list.sort(function (a, b) {
        return b.AnswerID - a.AnswerID;
      });
      id = list[0].AnswerID + 1;
    }
    for (var i = 0; i < this.data.PageNumber; i++)
      arrAnswerID.push(id + i);
  },
  saveImage: function () {
    var that = this;
    var item = QuestionItem;
    item.AnswerID = arrAnswerID.shift();

    const query = wx.createSelectorQuery();
    query.select('#Canvas')
      .fields({
        node: true,
        size: true
      })
      .exec((res) => {
        var canvas = res[0].node;
        var ctx = canvas.getContext('2d');

        canvas.width = 1050;
        canvas.height = 1485;

        ctx.textAlign="left";
        ctx.textBaseline="top";
        ctx.font = "12px";
        ctx.fillStyle="#ffffff";

        ctx.fillRect(0, 0, canvas.width, canvas.height);
        ctx.fillStyle = "#000000";

        var xStart = 60;
        var yStart = 247;

        var height = 150;
        if (item.QuestionTypeCategory == 2)
          height = 59;
        if (item.Category > 0) {
          if (item.PageCount == 18)
            height = 210;
          else if (item.PageCount == 15)
            height = 250;
        }
        //括号
        var index = 0;

        for (var i = 0; i < 3; i++) {
          for (var j = 0; j < item.PageCount / 3; j++) {
            index++;
            if (index <= item.QuestionList.length) {
              ctx.fillText("(", xStart + i * 310, yStart + j * height);
              ctx.fillText(")", xStart + i * 310 + 22, yStart + j * height);
            }
          }
        }

        //编号
        index = 0;
        ctx.textAlign="center";
        var numberLeft = 12;
        if (isAndroid)
          numberLeft = 14;
        for (var i = 0; i < 3; i++) {
          for (var j = 0; j < item.PageCount / 3; j++) {
            index++;
            if (index <= item.QuestionList.length) {
              ctx.fillText(index, xStart + i * 310 + numberLeft, yStart + j * height);
            }
          }
        }

        //算式
        index = that.data.arrPage.length * item.PageCount;
        //ctx.setFontSize(24);
        ctx.font = "24px";

        var urlDiv=[];

        
        for (var i = 0; i < 3; i++) {
          for (var j = 0; j < item.PageCount / 3; j++) {
            index++;

            if (index <= item.QuestionList.length) {
              //横式
              if (item.QuestionTypeCategory == 2) {

                var A = item.QuestionList[index - 1].A.toString();
                if (item.QuestionList[index - 1].HiddenColumn == "A")
                  A = "____";
                var OperateAB = item.QuestionList[index - 1].OperateAB.toString();
                //console.log(OperateAB);
                var B = item.QuestionList[index - 1].B.toString();
                if (item.QuestionList[index - 1].HiddenColumn == "B")
                  B = "____";
                var equation = A + " " + OperateAB + " " + B;
                if (item.QuestionList[index - 1].C) {
                  var OperateBC = item.QuestionList[index - 1].OperateBC.toString();
                  var C = item.QuestionList[index - 1].C.toString();
                  equation += " " + OperateBC + " " + C;
                  if (item.QuestionList[index - 1].D) {
                    var OperateCD = item.QuestionList[index - 1].OperateCD.toString();
                    var D = item.QuestionList[index - 1].D.toString();
                    equation += " " + OperateCD + " " + D;
                  }
                }
                equation += " = ";
                var R = item.QuestionList[index - 1].R.toString();
                if (item.QuestionList[index - 1].HiddenColumn == "R")
                  R = "";
                equation += R;

                var num = xStart + i * 310 + 31;

                for (var n = 0; n < equation.length; n++) {
                  var len = getLength(equation[n]);
                  num += len;
                  if (equation[n] == ".") {
                    ctx.fillText(equation[n], num + 3, yStart + j * 59 - 5);
                  } else {
                    var h = -8;
                    if (equation[n] == "_")
                      h = 0;
                    ctx.fillText(equation[n], num, yStart + j * 59 + h);
                  }
                }
              }
              //竖式
              else if (item.QuestionTypeCategory == 3) {

                var num1 = item.QuestionList[index - 1];
                var isAnswer = false;

                var width = 250;
                if (num1.OperateAB == "÷")
                  width = 240;

                for (var n = 0; n < num1.Vertical.length; n++) {
                  var num = xStart + i * 310 + width;
                  var num2 = 0;
                  for (var m = num1.Vertical[n].Array.length - 1; m >= 0; m--) {
                    var str = "";
                    if (num1.Vertical[n].Type == "line") {
                      if (num1.OperateAB != "÷") {
                        //var lineLength = num1.Vertical[n].Array.length * 30 + 20;
                        var lineLength = 6 * 30 + 20;
                        var lineTop = 4;

                        //console.log(yStart + j * height + n * 30 + lineTop);
                        ctx.moveTo(num, yStart + j * height + n * 30 + lineTop);
                        ctx.lineTo(num - lineLength, yStart + j * height + n * 30 + lineTop);
                        ctx.stroke();

                        isAnswer = true;
                        break;
                      }
                    } else {
                      str = num1.Vertical[n].Array[m];

                      if (num1.OperateAB == "÷" && str == "√") {
                        isAnswer = true;
                        var lineLength = num1.A.toString().length;
                        var lineWidth = Math.floor(57 * (1 + num1.A.toString().length) / 2);

                        var obj={};
                        obj.url="../images/formula_division_size0" + lineLength + ".png";
                        obj.num1=num - (num1.Vertical[n].Array.length - m) * 30 - 8;
                        obj.num2=yStart + j * height + n * 30 - 10;
                        obj.num3=lineWidth;
                        obj.num4=39;

                        urlDiv.push(obj);
                        // var img = canvas.createImage();
                        // img.src = "../images/formula_division_size0" + lineLength + ".png";
                        
                        // console.log(img.src);
                        // img.onload = e => {
                        //   ctx.drawImage(img, num - (num1.Vertical[n].Array.length - m) * 30 - 8, yStart + j * height + n * 30 - 10, lineWidth, 39);
                        // };
                      } 
                      else if (num1.OperateAB == "÷" && n == 0) {} else if (num1.OperateAB == "÷" && n == 1) {
                        ctx.fillText(str, num - (num1.Vertical[n].Array.length - m) * 10, yStart + j * height + n * 30);
                      } 
                      else {
                        if (str == ".") {
                          ctx.fillText(str, num - (num1.Vertical[n].Array.length - m) * 30 + 15, yStart + j * height + n * 30);
                          num2 = 30;
                        } else if (str == "+" || str == "-" || str == "−" || str == "×" || str == "÷") {
                          var lineLength = 6 * 30;
                          ctx.fillText(str, num - lineLength, yStart + j * height + n * 30);
                          num2 = 30;
                        } else
                          ctx.fillText(str, num - (num1.Vertical[n].Array.length - m) * 30 + num2, yStart + j * height + n * 30);
                      }
                    }
                  }
                  if (isAnswer)
                    break;
                }

              }
            }
          }
        }

        ctx.textAlign="left";
        //ctx.setFontSize(32);
        ctx.font = "32px";
        
        ctx.fillText(item.Name, 60, 45);


        //ctx.setFontSize(12);
        ctx.font = "12px";
        
        ctx.fillText(item.CategoryName, 60, 90);
        ctx.fillText("共" + item.PageCount + "道题", 60, 125);
        ctx.fillText("第 "+(pageIndex+1).toString()+" / "+that.data.PageNumber+" 页", 60, 147);
        ctx.fillText("答案检索号", 768, 60);

        ctx.textAlign="right";
        ctx.fillText("出题时间 " + item.CreateTime, 875, 94);
        ctx.fillText("微信扫一扫 计时看答案", 875, 111);
        ctx.fillText("《数学计算题》选题 打印 扫码 批改", 875, 137);
        ctx.font = "32px";
        
        ctx.fillText(item.AnswerID, 872, 50);

        var img=canvas.createImage();
        img.src="../images/answer.png";
        img.onload = e => {
          ctx.drawImage(img, 890, 54, 100, 100);

          if (urlDiv.length>0){
            var img2=canvas.createImage();
            img2.src=urlDiv[0].url;
            img2.onload = e => {
              for(var k=0;k<urlDiv.length;k++)
                ctx.drawImage(img2, urlDiv[k].num1, urlDiv[k].num2, urlDiv[k].num3, urlDiv[k].num4);
              build();
            };
          }
          else
            build();
        };

        function build(){
          var w = 1050,h = 1485;
          wx.canvasToTempFilePath({
            x: 0,
            y: 0,
            width: w * times,
            height: h * times,
            destWidth: w * times,
            destHeight: h * times,
            canvas: canvas,
            success: function (res2) {
              //console.log(res2.tempFilePath);
              that.data.arrPage.push(res2.tempFilePath);
              item.TempImagePath = res2.tempFilePath;
              tempAnswerList.push(JSON.parse(JSON.stringify(item)));

              that.setData({
                arrPage: that.data.arrPage,
              });

              if (that.data.arrPage.length < that.data.PageNumber) {
                pageIndex++;
                that.saveImage();
              } else {
                //生成图片完成
                setTimeout(function () {
                  that.setData({
                    ShowLoading: false,
                  });
                  wx.pageScrollTo({
                    scrollTop: 0,
                    duration: 300
                  });

                  //存列表
                  var tempList = wx.getStorageSync("AnswerList");
                  if (!tempList)
                    tempList = [];
                  for (var x = 0; x < tempList.length; x++) {
                    tempList[x].IsNew = 0;
                  }
                  for (var x = 0; x < tempAnswerList.length; x++) {
                    var tempItem = tempAnswerList[x];
                    var id = x * tempItem.PageCount;
                    var arr = [];
                    for (var y = 0; y < tempItem.QuestionList.length; y++) {
                      if (y >= id && y < id + tempItem.PageCount) {
                        arr.push(tempItem.QuestionList[y]);
                      }
                    }
                    tempItem.QuestionList = arr;
                    tempItem.IsNew = 1;
                    tempList.unshift(tempItem);
                  }
                  wx.setStorageSync("AnswerList", tempList);

                  common.getStorageValue(that, "HelpHidden7", false, function () {
                    that.showHelp2();
                  });

                }, 3000);
              }
            }
          });
        };
      });



    function getLength(str) {
      switch (str) {
        case "0":
        case "1":
        case "2":
        case "3":
        case "4":
        case "5":
        case "6":
        case "7":
        case "8":
        case "9":
          return 15;
        case ".":
          return 8;
        default:
          return 12;
      }
    }

  },
  //保存图片文件
  saveImageFile: function () {
    if (this.data.IsDistabled == "") {
      wx.showLoading({
        title: "保存中..."
      });
      var that = this;
      var count = 0;
      for (var i = 0; i < that.data.arrPage.length; i++) {
        wx.saveImageToPhotosAlbum({
          filePath: that.data.arrPage[i],
          success(res3) {

            console.log("save:" + res3.savedFilePath);
            count++
            if (count == that.data.arrPage.length) {
              wx.hideLoading();
              wx.showModal({
                title: "保存完成",
                showCancel: false,
                content: "请打开手机相册查看图片！",
              });
              that.setData({
                IsDistabled: "Distabled",
                BtnText: "已保存",
              });
              wx.pageScrollTo({
                scrollTop: 400,
                duration: 300
              });
            }
          },
          fail(err3) {
            console.log(err3);
            wx.openSetting();
          },
          complete() {
            wx.hideLoading();
          }
        })
      }
    }
  },
  changePageNumber: function (e) {
    var id = Number(e.currentTarget.dataset.id);
    this.data.PageNumber += id;
    var addDisabled = "",
      subDisabled = "";
    if (this.data.PageNumber <= 1) {
      this.data.PageNumber = 1;
      subDisabled = "btnAddSubDisabled";
    } else if (this.data.PageNumber >= 4) {
      this.data.PageNumber = 4;
      addDisabled = "btnAddSubDisabled";
    }

    this.setData({
      PageNumber: this.data.PageNumber,
      AddDisabled: addDisabled,
      SubDisabled: subDisabled,
    });
  },
  showImage: function (e) {
    var that = this;
    var id = e.currentTarget.dataset.id;
    wx.previewImage({
      current: that.data.arrPage[id], // 当前显示图片的http链接
      urls: that.data.arrPage // 需要预览的图片http链接列表
    });
  },
  closeLoading: function () {
    var that = this;
    that.setData({
      ShowLoading: false,
      IsFinished: false,
    });
  },
  menuClick: function (e) {
    this.data.filter = e.currentTarget.dataset.id;
    if (this.data.filter == "horizontal") {
      this.data.PageCount = this.data.QuestionTypeItem.QuestionNumber2;
    } else if (this.data.filter == "vertical") {
      this.data.PageCount = this.data.QuestionTypeItem.QuestionNumber3;
    }

    this.setData({
      filter: this.data.filter,
      IsShowMenu: false,
      PageCount: this.data.PageCount,
    });
  },
  closeMenu: function () {
    this.setData({
      IsShowMenu: false,
    });
  },
  openMenu: function () {
    this.setData({
      IsShowMenu: true,
    });
  },
  showHelp: function () {
    if (!this.data.HelpHidden3) {
      this.audioCtx = wx.createAudioContext('myAudio');
      var str = "嘿嘿，找到我了吗？我在车间的窗户里制作例题呢。如果这是你要的题型，去点“出题”按钮就对了。还要告诉你，一张卷子就是一张图片，题目数量请看提示。";
      server.playAudio(this.audioCtx, str);
    }
  },
  closeHelp: function () {
    this.setData({
      HelpHidden3: true,
    });
    wx.setStorageSync("HelpHidden3", true);
    this.audioCtx = wx.createAudioContext('myAudio');
    this.audioCtx.pause();
  },
  showHelp2: function () {
    if (!this.data.HelpHidden7) {
      this.audioCtx = wx.createAudioContext('myAudio');
      var str = "卷子出炉咯，棒棒哒！快去手机相册打印吧。我会等在首页上的答案资料室为你继续带路的。";
      server.playAudio(this.audioCtx, str);
    }
  },
  closeHelp2: function () {
    this.setData({
      HelpHidden7: true,
    });
    wx.setStorageSync("HelpHidden7", true);
    this.audioCtx = wx.createAudioContext('myAudio');
    this.audioCtx.pause();
  },

  showHelp8: function () {
    if (!this.data.HelpHidden8) {
      this.audioCtx = wx.createAudioContext('myAudio');
      var str = "发现错误是提高成绩的第一步。点一下题目数量右侧的图标，当有错题后，能查看和整理错题清单。";
      server.playAudio(this.audioCtx, str);
    }
  },
  closeHelp8: function () {
    this.setData({
      HelpHidden8: true,
    });
    wx.setStorageSync("HelpHidden8", true);
    this.audioCtx = wx.createAudioContext('myAudio');
    this.audioCtx.pause();
  },

  onShareAppMessage: function () {
    return {
      title: app.globalData.ShareTitle,
      path: 'pages/index/index?UserID=' + app.globalData.userInfo.UserID,
      imageUrl: app.globalData.ShareImage,
    }
  },
})