// #ifdef APP-NVUE import { sleep, getImageInfo, isBase64, useNvue, networkReg } from './utils'; const dom = weex.requireModule('dom') import {version } from '../../package.json' export default { data() { return { tempFilePath: [], isInitFile: false, osName: uni.getSystemInfoSync().osName } }, created() { // if (this.hybrid) return // useNvue('_doc/uni_modules/lime-painter/', version, this.timeout).then(res => { // this.isInitFile = true // }) }, methods: { getParentWeith() { return new Promise(resolve => { dom.getComponentRect(this.$refs.limepainter, (res) => { this.parentWidth = Math.ceil(res.size.width) this.canvasWidth = this.canvasWidth || this.parentWidth ||300 this.canvasHeight = res.size.height || this.canvasHeight||150 resolve(res.size) }) }) }, onPageFinish() { this.webview = this.$refs.webview this.webview.evalJS(`init(${this.dpr})`) }, onMessage(e) { const res = e.detail.data[0] || null; if (res.event) { if (res.event == 'inited') { this.inited = true } if(res.event == 'fail'){ this.$emit('fail', res) } if (res.event == 'layoutChange') { const data = typeof res.data == 'string' ? JSON.parse(res.data) : res.data this.canvasWidth = Math.ceil(data.width); this.canvasHeight = Math.ceil(data.height); } if (res.event == 'progressChange') { this.progress = res.data * 1 } if (res.event == 'file') { this.tempFilePath.push(res.data) if (this.tempFilePath.length > 7) { this.tempFilePath.shift() } return } if (res.event == 'success') { if (res.data) { this.tempFilePath.push(res.data) if (this.tempFilePath.length > 8) { this.tempFilePath.shift() } if (this.isCanvasToTempFilePath) { this.setFilePath(this.tempFilePath.join(''), {isEmit:true}) } } else { this.$emit('fail', 'canvas no data') } return } this.$emit(res.event, JSON.parse(res.data)); } else if (res.file) { this.file = res.data; } else{ console.info(res[0]) } }, getWebViewInited() { if (this.inited) return Promise.resolve(this.inited); return new Promise((resolve) => { this.$watch( 'inited', async val => { if (val) { resolve(val) } }, { immediate: true } ); }) }, getTempFilePath() { if (this.tempFilePath.length == 8) return Promise.resolve(this.tempFilePath) return new Promise((resolve) => { this.$watch( 'tempFilePath', async val => { if (val.length == 8) { resolve(val.join('')) } } ); }) }, getWebViewDone() { if (this.progress == 1) return Promise.resolve(this.progress); return new Promise((resolve) => { this.$watch( 'progress', async val => { if (val == 1) { this.$emit('done') this.done = true resolve(val) } }, { immediate: true } ); }) }, async render(args) { try { await this.getSize(args) const {width} = args.css || args if(!width && this.parentWidth) { Object.assign(args, {width: this.parentWidth}) } const newNode = await this.calcImage(args); await this.getWebViewInited() this.webview.evalJS(`source(${JSON.stringify(newNode)})`) await this.getWebViewDone() await sleep(this.afterDelay) if (this.isCanvasToTempFilePath) { const params = { fileType: this.fileType, quality: this.quality } this.webview.evalJS(`save(${JSON.stringify(params)})`) } return Promise.resolve() } catch (e) { this.$emit('fail', e) } }, getfile(e){ let url = plus.io.convertLocalFileSystemURL( e ) return new Promise((resolve,reject)=>{ plus.io.resolveLocalFileSystemURL(url, entry => { var reader = null; entry.file( file => { reader = new plus.io.FileReader(); reader.onloadend = ( read )=> { resolve(read.target.result) }; reader.readAsDataURL( file ); }, function ( error ) { alert( error.message ); } ); },err=>{ resolve(e) }) }) }, async calcImage(args) { let node = JSON.parse(JSON.stringify(args)) const urlReg = /url\((.+)\)/ const {backgroundImage} = node.css||{} const isBG = backgroundImage && urlReg.exec(backgroundImage)[1] const url = node.url || node.src || isBG if(['text', 'qrcode'].includes(node.type)) { return node } if ((node.type === "image" || isBG) && url && !isBase64(url) && (this.osName == 'ios' ? true : !networkReg.test(url))) { let {path} = await getImageInfo(url) if(this.osName == 'ios') { path = await this.getfile(path) } if (isBG) { node.css.backgroundImage = `url(${path})` } else { node.src = path } } else if (node.views && node.views.length) { for (let i = 0; i < node.views.length; i++) { node.views[i] = await this.calcImage(node.views[i]) } } return node }, async canvasToTempFilePath(args = {}) { if (!this.inited) { return this.$emit('fail', 'no init') } this.tempFilePath = [] if (args.fileType == 'jpg') { args.fileType = 'jpeg' } this.webview.evalJS(`save(${JSON.stringify(args)})`) try { let tempFilePath = await this.getTempFilePath() tempFilePath = await this.setFilePath(tempFilePath) args.success({ errMsg: "canvasToTempFilePath:ok", tempFilePath }) } catch (e) { args.fail({ error: e }) } } } } // #endif