const recorderManager = wx.getRecorderManager()
const app = getApp()
var Time = require('../../utils/time.js')
Page({
/**
* 页面的初始数据
*/
data: {
src: '', //拍照后的缓存路径
tmpThumbPath: '',
tmpVideoPath: '',
tmpRecordPath: '',
position: 'back',
mode: 'normal',
flash: 'auto',
type: 1, //类型： 1-拍照 2-录像 3-录音
doing: false, //正在录制
autoTime: '00:00', //录像倒计时
maxHeight: 600, //预览的高度
latitude: 0, // 纬度
longitude: 0, // 经度
canvasWidth: 300, // 画布宽度
canvasHeight: 150, // 画布高度
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
// 加载摄像头
this.ctx = wx.createCameraContext();
this.setData({
type: options.type,
maxHeight: app.globalData.wxWindowHeight,
})
var that = this
// 获取位置信息
wx.getLocation({
success: function(res) {
console.log(res)
that.setData({
latitude: res.latitude,
longitude: res.longitude
})
},
})
this.timeSchudle = null
},
/**
* 用户不允许使用摄像头时
*/
error(e) {
console.log(e.detail)
},
/**
* 拍照
*/
takePhoto() {
wx.showLoading({
title: 'loading...',
})
this.ctx.takePhoto({
quality: 'high',
success: (res) => {
this.setData({
src: res.tempImagePath
}),
this.writeWater()
}
})
},
/**
* 开始录像
*/
takeVideo() {
this.ctx.startRecord({
success: () => {
this.setData({
doing: true,
tmpThumbPath: '',
tmpVideoPath: '',
})
console.log('startRecord ' + this.data.doing)
//开始倒计时30秒
var endT = (new Date()).getTime()
this.countTime((endT + 30 * 1000), endT)
},
timeoutCallback: (res) => {
this.setData({
doing: false,
tmpThumbPath: res.tempThumbPath,
tmpVideoPath: res.tempVideoPath,
})
this.reback(2)
console.log('startRecord ' + this.data.doing)
console.log('timeout callback ' + res.tempThumbPath)
console.log('timeout callback ' + res.tempVideoPath)
}
})
},
/**
* 结束录像
*/
stopVideo() {
this.ctx.stopRecord({
success: (res) => {
this.setData({
doing: false,
tmpThumbPath: res.tempThumbPath,
tmpVideoPath: res.tempVideoPath,
}),
this.reback(2)
}
})
},
/**
* 开始录音
*/
takeRecord() {
recorderManager.onStart(() => {
console.log('recorder start')
})
recorderManager.onPause(() => {
console.log('recorder pause')
})
recorderManager.onStop((res) => {
console.log('recorder stop', res)
const {
tempFilePath
} = res
this.setData({
doing: false,
tmpRecordPath: res.tempFilePath,
})
this.reback(3)
// this.data.doing = false
// this.data.tmpRecordPath = res.tempFilePath
})
recorderManager.onFrameRecorded((res) => {
const {
frameBuffer
} = res
console.log('frameBuffer.byteLength', frameBuffer.byteLength)
})
const options = {
duration: 10000,
sampleRate: 44100,
numberOfChannels: 1,
encodeBitRate: 192000,
format: 'aac',
frameSize: 50
}
recorderManager.start(options)
this.setData({
doing: true,
})
},
stopRecord() {
this.setData({
doing: false,
})
recorderManager.stop();
// this.rdm.onStop((res) => {
// console.log('record stop ... ' + res.tempFilePath);
// this.doing = false;
// this.tmpRecordPath = res.tempFilePath;
// console.log("path => " + this.tmpRecordPath)
// // this.reback(3);
// });
// this.reback(3)
},
/**
* 拍照成功后返回到上一页
*/
reback(status) {
var pages = getCurrentPages();
var currPage = pages[pages.length - 1]; //当前页
var prevPage = pages[pages.length - 2]; //上一页
if (status == 1) {
prevPage.setData({
tmpPhotoPath: this.data.src,
})
} else if (status == 2) {
prevPage.setData({
tmpThumbPath: this.data.tmpThumbPath,
tmpVideoPath: this.data.tmpVideoPath
})
} else if (status == 3) {
console.log('333333');
prevPage.setData({
tmpRecordPath: this.data.tmpRecordPath
})
}
clearTimeout(this.timeSchudle)
wx.hideLoading()
// 返回
wx.navigateBack({
delta: 1
})
},
/**
* 图片加水印
*/
writeWater: function() {
// 开始加水印
var that = this;
wx.getImageInfo({
src: this.data.src,
success: function(res) {
var waterText = that.data.latitude + ', ' + that.data.longitude
console.log(waterText)
var width = res.width / app.globalData.wxPixelRatio
var height = res.height / app.globalData.wxPixelRatio
console.log('width==> ' + width)
console.log('height==> ' + height)
that.setData({
canvasWidth: width,
canvasHeight: height,
})
// 添加超时设置，防止生成的图片大小还是默认值
setTimeout(() => {
var ctx = wx.createCanvasContext('picCanvas')
ctx.drawImage(that.data.src, 0, 0, width, height)
ctx.setFontSize(15)
ctx.setFillStyle('#666666')
ctx.fillText(waterText, width / 2 + 20.4, height - 23.6)
ctx.setFillStyle('#f2fcfc')
ctx.fillText(waterText, width / 2 + 20, height - 24)
ctx.setFillStyle('#666666')
ctx.fillText(Time.getYMD(), width / 2 + 20.4, height - 9.6)
ctx.setFillStyle('#f2fcfc')
ctx.fillText(Time.getYMD(), width / 2 + 20, height - 10)
console.log('draw start..........')
ctx.draw(false, () => {
console.log('draw finish..........')
wx.canvasToTempFilePath({
canvasId: 'picCanvas',
fileType: "jpg",
success: (r) => {
console.log('ssss')
console.log(r)
that.setData({
src: r.tempFilePath,
})
// 返回
that.reback(1)
},
fail: (r) => {
console.log('fffff')
console.log(r)
// 返回
that.reback(1)
}
})
})
}, 500)
},
})
},
/**
* 倒计时方法
*/
countTime: function(endT, curT) {
console.log(endT)
console.log(curT)
var t = Math.floor((endT - curT) / 1000)
if (t <= 0) {
this.setData({
autoTime: '00:00'
})
return
}
if (t < 10) {
t = '0' + t
}
this.setData({
autoTime: '00:' + t
})
var that = this
this.timeSchudle = setTimeout(function() {
that.countTime(endT, (new Date()).getTime())
}, 1000)
},
})
