let app = getApp();
const windowWidth = app.globalData.systemInfo.windowWidth;
const windowHeight = app.globalData.systemInfo.windowHeight;
const screenHeight = app.globalData.systemInfo.screenHeight;

const scale = windowWidth / 375;

var Point = function(x, y) {
  return {
    x: x,
    y: y
  };
};

Page({
  /**
   * 组件的初始数据
   */
  data: {
    screenHeight,
    windowWidth,
    windowHeight,
    scale,
    product_name: '',
    default_image: '',
    product_qrCode: ''
  },

  onLoad(options) {

    let product_name = decodeURIComponent(options.product_name ? options.product_name : '');
    let default_image = decodeURIComponent(options.default_image ? options.default_image : '');
    let product_qrCode = decodeURIComponent(options.product_qrCode ? options.product_qrCode : '');

    this.setData({
      product_name,
      default_image,
      product_qrCode
    });

    this.creatSnapshoot();
  },

  creatSnapshoot() {
    this.creatProductDetailSnapShoot();
  },

  saveToAlbum() {
    let that = this;

    if (wx.getSetting) {
      wx.getSetting({
        success(res) {
          if (!res.authSetting['scope.writePhotosAlbum']) {
            wx.authorize({
              scope: 'scope.writePhotosAlbum',
              success: function() {
                that.saveSnapShoot();
              },
              fail: function(error) {
                if (res.authSetting['scope.writePhotosAlbum'] === false) {
                  wx.showModal({
                    title: '',
                    content: '需要打开小程序的设置，重新授权访问您的系统相册',
                    confirmText: '去开启',
                    confirmColor: '#000000',
                    success: function(r) {
                      if (r.confirm) {
                        wx.openSetting({
                          success: function() {}
                        });
                      }
                    }
                  });
                }
              },
            });
          } else {
            that.saveSnapShoot();
          }
        }
      });
    } else {
      wx.showModal({
        title: '提示',
        content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
      });
    }
  },

  saveSnapShoot() {
    var that = this;
    var canvasId = 'productDetailCanvas';

    wx.canvasToTempFilePath({
      x: 0,
      y: 0,
      width: windowWidth,
      height: screenHeight,
      destWidth: windowWidth * 2,
      destHeight: screenHeight * 2,
      quality: 1.0,
      canvasId: canvasId,
      success: function(result) {
        wx.saveImageToPhotosAlbum({
          filePath: result.tempFilePath,
          success(res) {
            wx.showToast({
              title: '保存成功',
              icon: 'success',
              duration: 2000
            });
          },
        });
      }
    }, this);
  },

  creatProductDetailSnapShoot() {
    let that = this;
    let pCtx = wx.createCanvasContext('productDetailCanvas', this);

    pCtx.setFillStyle('white');
    pCtx.fillRect(0, 0, windowWidth, screenHeight);

    let defaultImage = this.data.default_image;

    if (defaultImage && defaultImage.indexOf('https://') === -1) {
      defaultImage = defaultImage.replace('http://', 'https://');
    }

    that.drawLongText('你的好友邀你为ta助力，购买限定商品', pCtx, 187.5 * scale, 50 * scale, 'black', 17, 20);

    wx.getImageInfo({
      src: defaultImage,
      success: function(res) {
        pCtx.drawImage(res.path, 27 * scale, 70 * scale, 320 * scale, 279 * scale);
        pCtx.setFillStyle('white');
        that.drawLongText(that.data.product_name, pCtx, 187.5 * scale, 382 * scale, 'black', 14, 20);
        pCtx.setTextAlign('center');
        pCtx.setFontSize(18 * scale);
        pCtx.draw(true);
      }
    });

    pCtx.drawImage('./images/share-logo@2x.png', 132 * scale, 415 * scale, 111 * scale, 20 * scale);

    wx.getImageInfo({
      src: this.data.product_qrCode,
      success: function(res) {
        pCtx.drawImage(res.path, 109.5 * scale, 450.5 * scale, 156 * scale, 156 * scale);
        pCtx.draw(true);
      }
    });

    pCtx.setFillStyle('black');
    pCtx.setTextAlign('center');
    pCtx.setFontSize(11);
    pCtx.fillText('长按扫码查看详情', 187.5 * scale, 632.5 * scale);
    pCtx.drawImage('./images/snapshoot_tip_ic@2x.png', 87 * scale, 645.5 * scale, 9 * scale, 9 * scale);
    pCtx.setFillStyle('#b0b0b0');
    pCtx.setFontSize(9);
    pCtx.fillText('或者在各大应用市场搜索 Yoho!Buy有货 下载App', 187.5 * scale, 652.5 * scale);
    pCtx.draw();
  },

  drawRoundedRect: function(rect, r, ctx) {
    var ptA = Point(rect.x + r, rect.y);
    var ptB = Point(rect.x + rect.width, rect.y);
    var ptC = Point(rect.x + rect.width, rect.y + rect.height);
    var ptD = Point(rect.x, rect.y + rect.height);
    var ptE = Point(rect.x, rect.y);

    ctx.setStrokeStyle('rgba(0,0,0,0)');

    ctx.beginPath();

    ctx.moveTo(ptA.x, ptA.y);
    ctx.arcTo(ptB.x, ptB.y, ptC.x, ptC.y, r);
    ctx.arcTo(ptC.x, ptC.y, ptD.x, ptD.y, r);
    ctx.arcTo(ptD.x, ptD.y, ptE.x, ptE.y, r);
    ctx.arcTo(ptE.x, ptE.y, ptA.x, ptA.y, r);

    ctx.stroke();
  },

  Rect: function(x, y, w, h) {
    return {
      x: x,
      y: y,
      width: w,
      height: h
    };
  },

  drawLongText(longtext, cxt, begin_width, begin_height, color, fontSize, numsForLine) {
    var linelenght = 20 * scale; // 行间距
    var numberOfLine = 2;
    var text = '';
    var count = 0;
    var lineNumber = 1;
    var stringLenght = longtext.length;
    var newtext = longtext.split('');

    cxt.setFillStyle(color);
    cxt.setFontSize(fontSize * scale);
    cxt.setTextAlign('center');

    for (let i = 0; i <= stringLenght; i++) {
      if (count === numsForLine) {
        if (lineNumber === numberOfLine) {
          let t = text + '...';

          cxt.fillText(t, begin_width, begin_height);
        } else {
          cxt.fillText(text, begin_width, begin_height);
        }
        begin_height = begin_height + linelenght;
        text = '';
        count = 0;
        lineNumber++;
      }

      if (i === stringLenght) {
        cxt.fillText(text, begin_width, begin_height);
      }
      text = text + newtext[0];
      count++;
      newtext.shift();
      if (lineNumber > numberOfLine) {
        break;
      }
    }
  },
  hidden() {
    wx.navigateBack();
  }
});