import { getMomentDetail, getCommentList, likeMoment, likeComment, commentMoment } from "../../../api/moment"
const util = require('../../../utils/util')
const app = getApp()
// pages/moment/detail/index.js
Page({
  /**
   * 页面的初始数据
   */
  data: {
    id: null,
    safeBottom: app.globalData.safeBottom,
    height: app.globalData.safeFragmentHeight,
    type: 0,
    tabList: [{
        id: 0,
        name: '评论',
        badge: 12
      },
      {
        id: 1,
        name: '系统',
        badge: 0
      }
    ],
    tabIndex: 0,
    inputBottom: 0,
    keyboardHeight: 0,
    focus: false,
    comment: '',
    momentDetail: null,
    commentList: [],
    requesting: false,
    finished: false,
    form: {
      pageNum: 1,
      pageSize: 15
    },
    maskHidden: false,
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.data.keyboardHeight = wx.getStorageSync('keyboardHeight')
    if (options.type) {
      this.data.type = Number(options.type)
    }
    this.setData({
      type: this.data.type,
      safeBottom: app.globalData.safeBottom,
      height: app.globalData.safeFragmentHeight - 100
    })
    if (options.id) {
      this.data.id = options.id
      this.data.form.articleId = options.id
      wx.showLoading({
        title: '加载中',
        mask: true
      })
      getMomentDetail(options.id).then(result => {
        this.setData({
          momentDetail: result.data
        })
        this.fetchCommentList()
        wx.hideLoading()
      }).catch(err => {
        wx.hideLoading()
        util.showToast(err)
      })
    }
  },
  onRefreshList: function () {
    if (this.data.requesting) {
      return
    }
    this.setData({
      commentList: [],
      ['form.pageNum']: 1,
      finished: false
    })
    this.fetchCommentList()
  },
  fetchCommentList: function () {
    if (this.data.requesting || this.data.finished) {
      return
    }
    this.setData({
      requesting: true
    })
    getCommentList(this.data.id, this.data.form).then(result => {
      if (result.data.records.length) {
        var respList = result.data.records
        let nowList = `commentList[${this.data.commentList.length}]`
        var num = this.data.form.pageNum
        var finished = this.data.form.pageNum >= result.data.pages
        if (num == 1) {
          this.setData({
            commentList: [],
            [nowList]: respList,
            requesting: false,
            ['form.pageNum']: (num + 1),
            ['momentDetail.replyQuantity']: result.data.total,
            finished
          })
        } else {
          this.setData({
            [nowList]: respList,
            requesting: false,
            ['form.pageNum']: (num + 1),
            ['momentDetail.replyQuantity']: result.data.total,
            finished
          })
        }
      } else {
        this.setData({
          requesting: false,
          finished: true
        })
      }
    }).catch(err => {
      this.setData({
        requesting: false
      })
    })
  },
  onTabChange: function (e) {
    if (this.data.tabIndex == Number(e.detail.key)) {
      return
    }
    this.data.tabIndex = Number(e.detail.key)
  },
  bindInput: function (e) {
    this.data.comment = e.detail.value
  },
  inputFocus: function (e) {
    if (this.data.keyboardHeight) {
      return
    }
    this.data.keyboardHeight = Number(e.detail.height)
    wx.setStorageSync('keyboardHeight', this.data.keyboardHeight)
    this.setData({
      inputBottom: e.detail.height
    })
  },
  inputBlur: function (e) {
    this.setData({
      inputBottom: 0,
      focus: false
    })
  },
  showComment: function (e) {
    if (!app.globalData.userInfo) {
      wx.navigateTo({
        url: '/pages/login/index'
      })
      return
    }
    if (this.data.keyboardHeight) {
      this.setData({
        focus: true,
        inputBottom: this.data.keyboardHeight
      })
    } else {
      this.setData({
        focus: true
      })
    }
  },
  submitComment: function () {
    if (util.isEmpty(this.data.comment)) {
      util.showToast('请输入评论内容')
      return
    }
    wx.showLoading({
      title: '处理中',
      mask: true
    })
    var form = {
      content: this.data.comment,
      articleId: this.data.id
    }
    commentMoment(form).then(result => {
      this.setData({
        inputBottom: 0,
        focus: false,
        comment: ''
      })
      wx.hideLoading()
      util.showToast('评论成功')
      this.onRefreshList()
    }).catch(error => {
      wx.hideLoading()
      util.showToast(error)
    })
  },
  postLikeComment: function (e) {
    if (!app.globalData.userInfo) {
      wx.navigateTo({
        url: '/pages/login/index'
      })
      return
    }
    var item = this.data.commentList[e.currentTarget.dataset.page][e.currentTarget.dataset.index]
    if (item.isLiked) {
      util.showToast('请勿重复点赞')
      return
    }
    likeComment({
      replyId: item.id
    }).then(result => {
      if (item.isLiked) {
        this.setData({
          ['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].likeQuantity']: result.data.likeQuantity,
          ['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].isLiked']: 0
        })
      } else {
        this.setData({
          ['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].likeQuantity']: result.data.likeQuantity,
          ['commentList[' + e.currentTarget.dataset.page + '][' + e.currentTarget.dataset.index + '].isLiked']: 1
        })
      }
    }).catch(error => {
      util.showToast(error)
    })
  },
  likePost: function () {
    if (!app.globalData.userInfo) {
      wx.navigateTo({
        url: '/pages/login/index'
      })
      return
    }
    if (this.data.momentDetail.isLiked) {
      util.showToast('请勿重复点赞')
      return
    }
    likeMoment({
      articleId: this.data.id
    }).then(result => {
      this.setData({
        ['momentDetail.likeQuantity']: result.data.likeQuantity,
        ['momentDetail.isLiked']: 1
      })
    }).catch(error => {
      util.showToast(error)
    })
  },
  toMill: function () {
    util.navigateTo('/pages/agent/factory/index?id=' + this.data.momentDetail.millPaperId)
  },
  onShareAppMessage: function () {

      var imageUrl = '/assets/image/icon_logo.png'
      if (this.data.momentDetail.imgUrlList && this.data.momentDetail.imgUrlList.length > 0) {
        imageUrl = this.data.momentDetail.imgUrlList[0]
      }
      return {
        title: this.data.momentDetail.title,
        path: 'pages/index/index?url=/pages/article/detail/index&key=id&value=' + this.data.momentDetail.id,
        imageUrl: this.data.imagePathHb||imageUrl
      }
  },
  //分享至朋友圈
  onShareTimeline(res) {

      var imageUrl = '/assets/image/icon_logo.png'
      if (this.data.momentDetail.imgUrlList && this.data.momentDetail.imgUrlList.length > 0) {
        imageUrl = this.data.momentDetail.imgUrlList[0]
      }
      return {
        title: this.data.momentDetail.title,
        path: 'pages/index/index?url=/pages/article/detail/index&key=id&value=' + this.data.momentDetail.id,
        imageUrl: this.data.imagePathHb||imageUrl
      }

      return {
        imageUrl: this.data.imagePathHb||imageUrl
      }
    

  },
  createPoster() {

  },
  createNewImg() {
    var that = this;
    var context = wx.createCanvasContext('mycanvas');
    context.font="normal 400 15px Arial, sans-serif"
    var parth0='/assets/article/img_poster_bg.png'
    if (this.data.momentDetail.millPaperName) {
      var path1 = '/assets/article/img_poster_header_has_title.png'
    } else {
      var path1 = '/assets/article/im_poster_header_no_title.png'
    }
    context.fillStyle = "white"
    context.fillRect(0, 0, 350, 667);
    context.stroke()
    context.drawImage(parth0, 0, 0, 350, 667);
    context.stroke()
    context.drawImage(path1, 0, 0, 350, 120);
    context.stroke()

    //绘制底部图片区域
    var parth2='/assets/article/img_poster_footer.png'
    context.drawImage(parth2, 0, 510, 350, 120);
    context.stroke()

    //绘制内容标题
    var textTitle=''
    if(this.data.momentDetail.title.length>14){
       textTitle=this.data.momentDetail.title.slice(0, 14)+'...'
    }else{
      textTitle=this.data.momentDetail.title
    }
    context.setFontSize(18);
    context.setFillStyle('#000000');
    context.setTextAlign('center');
    context.fillText(textTitle, 160, 152);
    context.stroke()

    //绘制内容
    var text = this.data.momentDetail.content
    text=text.replace(/[\r\n]/g, '')
    text = text.replace('\\s','')
    var chr = text.split(""); //这个方法是将一个字符串分割成字符串数组
    var temp = "";
    var row = [];
    context.setFontSize(15)
    context.setTextAlign('left');
    context.setFillStyle("#000")
    //内容自动换行
    for (var a = 0; a < chr.length; a++) {
      if (context.measureText(temp).width < 310) {
        temp += chr[a];
      } else {
        a--; //这里添加了a-- 是为了防止字符丢失，效果图中有对比
        row.push(temp);
        temp = "";
      }
    }
    row.push(temp);
    if (row.length > 10) {
      var rowCut = row.slice(0, 10);
      var rowPart = rowCut[9];
      var test = "";
      var empty = [];
      for (var a = 0; a < rowPart.length; a++) {
       if (context.measureText(test).width < 310) {
        test += rowPart[a];
       }
       else {
        break;
       }
      }
      empty.push(test);
      var group = empty[0] + "..."//这里只显示两行，超出的用...表示
      rowCut.splice(11, 1, group);
      row = rowCut;
     }
    for (var b = 0; b < row.length; b++) {
      context.fillText(row[b], 15, 185+ b * 30, 500);
    }

    //如果纸厂名字存在则在顶部图片区域中心绘制纸厂名称
    //这里先把细体文字绘制完再绘制加粗的顶部纸厂名称，如果不在最后绘制则需要使用ctx.font = 'normal 400 15px Arial, sans-serif';重置一下大小
    if(this.data.momentDetail.millPaperName){
      // context.setFontSize(24);
      context.font="normal bold 24px sans-serif"
      context.setFillStyle('#3539F8');
      context.setTextAlign('center');
      context.fillText(this.data.momentDetail.millPaperName, 170, 55);
      context.stroke()
      }
  

    context.save(); // 保存当前context的状态
    context.draw();
    //将生成好的图片保存到本地，需要延迟一会，绘制期间耗时
    setTimeout(function () {
      wx.canvasToTempFilePath({
        canvasId: 'mycanvas',
        success: function (res) {
          var tempFilePath = res.tempFilePath;
          that.setData({
            imagePathHb: tempFilePath,
            canvasHidden: true,
            maskHidden: true,
          });
        },
        fail: function (res) {
          console.log(res);
        }
      });
    }, 200);

  },
  //点击保存到相册
  baocun: function () {
    var that = this
    wx.saveImageToPhotosAlbum({
      filePath: that.data.imagePathHb,
      success(res) {
        wx.showModal({
          content: '图片已保存到相册，赶紧晒一下吧~',
          showCancel: false,
          confirmText: '好的',
          confirmColor: '#333',
          success: function (res) {
            if (res.confirm) {
              console.log('用户点击确定');
              /* 该隐藏的隐藏 */
              that.setData({
                maskHidden: false
              })
            }
          },fail:function(res){
            console.log(11111)
          }
        })
      }
    })
  },
  coloseHb() {
    console.log(this.data)
    this.setData({
      maskHidden: false
    })
  }
})