!103 增加对粘贴内容中包含图片的适配

Merge pull request !103 from tangyiqiang/master
This commit is contained in:
openharmony_ci
2022-09-21 01:38:13 +00:00
committed by Gitee
7 changed files with 154 additions and 4 deletions
@@ -17,6 +17,7 @@ import DateUtil from '@ohos/utils/src/main/ets/default/baseUtil/DateUtil'
import RdbStoreUtil from '@ohos/utils/src/main/ets/default/baseUtil/RdbStoreUtil'
import FolderData from '@ohos/utils/src/main/ets/default/model/databaseModel/FolderData'
import NoteData from '@ohos/utils/src/main/ets/default/model/databaseModel/NoteData'
import { atob, btoa } from 'js-base64'
import { TableName, NoteTableColumn, SysDefFolderUuid, Favorite, Delete
} from '@ohos/utils/src/main/ets/default/model/databaseModel/EnumData'
import StyleConstants from '@ohos/utils/src/main/ets/default/constants/StyleConstants'
@@ -78,6 +79,32 @@ export struct NoteContent {
LogUtil.info(TAG, 'continueNote content', continueNote)
AppStorage.SetOrCreate<string>('ContinueNote', continueNote)
LogUtil.info(TAG, 'callbackScheduledSave, set continue note success')
},
callbackPasteImage: (html) => {
if (html) {
LogUtil.info(TAG, 'paste info' + html)
let realHtml = ""
let base64regex = /^([0-9a-zA-Z+/]{4})*(([0-9a-zA-Z+/]{2}==)|([0-9a-zA-Z+/]{3}=))?$/
if (html && html.indexOf("base64") > 0) {
LogUtil.info(TAG, " getSrcFromHtml, src[1] : " + html)
let imgData = html.split(',')[1];
let imgType = 'png'
if (html.indexOf("jpeg") > 0){
imgType = 'jpg'
} else if (html.indexOf("gif") > 0) {
imgType = 'gif'
}
if (base64regex.test(imgData)) {
imgData = atob(imgData)
}
let filePath = OperationUtils.saveImage(imgData, imgType)
realHtml = "file://" + filePath
}
LogUtil.info(TAG, 'paste info11' + realHtml)
this.controllerShow.runJavaScript({ script: "javascript:RICH_EDITOR.insertImageHtml('" + realHtml + "')" })
} else {
LogUtil.info(TAG, 'paste info22223')
}
}
}
@@ -97,7 +124,7 @@ export struct NoteContent {
.javaScriptProxy({
object: this.noteContent,
name: "callBackToApp", // html--> name.method
methodList: ["callbackhtml", "callbackScheduledSave"],
methodList: ["callbackhtml", "callbackScheduledSave", "callbackPasteImage"],
controller:this.controllerShow
})
.onPageEnd((e) => {
@@ -109,6 +136,10 @@ export struct NoteContent {
}
})
.zoomAccess(false)
.imageAccess(true)
.onlineImageAccess(true)
.fileAccess(true)
.domStorageAccess(true)
.height('70%')
.width('100%')
}
@@ -24,7 +24,7 @@ import { EditContentDialog, DeleteDialog, EditTitleDialog } from './CusDialogCom
import FolderUtil from '@ohos/utils/src/main/ets/default/baseUtil/FolderUtil'
import NoteUtil from '@ohos/utils/src/main/ets/default/baseUtil/NoteUtil'
import prompt from '@system.prompt'
import featureAbility from '@ohos.ability.featureAbility'
import { atob, btoa } from 'js-base64'
import { LogUtil } from '@ohos/utils/src/main/ets/default/baseUtil/LogUtil'
import OperationUtils from '@ohos/utils/src/main/ets/default/baseUtil/OperationUtils'
import mediaquery from '@ohos.mediaquery'
@@ -107,6 +107,34 @@ export struct NoteContentComp {
LogUtil.info(TAG, 'callbackScheduledSave, set continue note success')
},
callbackPasteImage: (html) => {
if (html) {
LogUtil.info(TAG, 'paste info' + html)
let realHtml = ""
let base64regex = /^([0-9a-zA-Z+/]{4})*(([0-9a-zA-Z+/]{2}==)|([0-9a-zA-Z+/]{3}=))?$/
if (html && html.indexOf("base64") > 0) {
LogUtil.info(TAG, " getSrcFromHtml, src[1] : " + html)
let imgData = html.split(',')[1];
let imgType = 'png'
if (html.indexOf("jpeg") > 0){
imgType = 'jpg'
} else if (html.indexOf("gif") > 0) {
imgType = 'gif'
}
if (base64regex.test(imgData)) {
imgData = atob(imgData)
}
let filePath = OperationUtils.saveImage(imgData, imgType)
realHtml = "file://" + filePath
}
LogUtil.info(TAG, 'paste info11-' + realHtml)
this.controllerShow.runJavaScript({ script: "javascript:RICH_EDITOR.insertImageHtml('" + realHtml + "')" })
LogUtil.info(TAG, 'paste info11--' + realHtml)
} else {
LogUtil.info(TAG, 'paste info22225')
}
},
callbackGetSize: (size) => {
if (size) {
AppStorage.Set<number>('inSetValue', parseInt(size.slice(0, -2)) - 12)
@@ -133,7 +161,7 @@ export struct NoteContentComp {
.javaScriptProxy({
object: this.noteContent,
name: "callBackToApp", // html--> name.method
methodList: ["callbackhtml", "callbackhtmlSave", "callbackScheduledSave", "callbackGetSize"],
methodList: ["callbackhtml", "callbackhtmlSave", "callbackScheduledSave", "callbackGetSize", "callbackPasteImage"],
controller:this.controllerShow
})
.onPageEnd((e) => {
@@ -148,6 +176,10 @@ export struct NoteContentComp {
this.controllerShow.runJavaScript({ script: "RICH_EDITOR.setInputEnabled(false)" })
}
})
.imageAccess(true)
.onlineImageAccess(true)
.fileAccess(true)
.domStorageAccess(true)
.zoomAccess(false)
.height('88%')
.width('100%')
@@ -17,6 +17,7 @@ import DateUtil from '@ohos/utils/src/main/ets/default/baseUtil/DateUtil'
import RdbStoreUtil from '@ohos/utils/src/main/ets/default/baseUtil/RdbStoreUtil'
import FolderData from '@ohos/utils/src/main/ets/default/model/databaseModel/FolderData'
import NoteData from '@ohos/utils/src/main/ets/default/model/databaseModel/NoteData'
import { atob, btoa } from 'js-base64'
import { TableName, NoteTableColumn, SysDefFolderUuid, Favorite, Delete
} from '@ohos/utils/src/main/ets/default/model/databaseModel/EnumData'
import StyleConstants from '@ohos/utils/src/main/ets/default/constants/StyleConstants'
@@ -84,6 +85,32 @@ export struct NoteContentCompPortrait {
let continueNote: string = JSON.stringify(this.selectedNoteData.toNoteObject())
AppStorage.SetOrCreate<string>('ContinueNote', continueNote)
LogUtil.info(TAG, 'callbackScheduledSave, set continue note success')
},
callbackPasteImage: (html) => {
if (html) {
LogUtil.info(TAG, 'paste info' + html)
let realHtml = ""
let base64regex = /^([0-9a-zA-Z+/]{4})*(([0-9a-zA-Z+/]{2}==)|([0-9a-zA-Z+/]{3}=))?$/
if (html && html.indexOf("base64") > 0) {
LogUtil.info(TAG, " getSrcFromHtml, src[1] : " + html)
let imgData = html.split(',')[1];
let imgType = 'png'
if (html.indexOf("jpeg") > 0){
imgType = 'jpg'
} else if (html.indexOf("gif") > 0) {
imgType = 'gif'
}
if (base64regex.test(imgData)) {
imgData = atob(imgData)
}
let filePath = OperationUtils.saveImage(imgData, imgType)
realHtml = "file://" + filePath
}
LogUtil.info(TAG, 'paste info11' + realHtml)
this.controllerShow.runJavaScript({ script: "javascript:RICH_EDITOR.insertImageHtml('" + realHtml + "')" })
} else {
LogUtil.info(TAG, 'paste info22224')
}
}
}
@@ -102,7 +129,7 @@ export struct NoteContentCompPortrait {
.javaScriptProxy({
object: this.noteContent,
name: "callBackToApp", // html--> name.method
methodList: ["callbackhtml", "callbackScheduledSave"],
methodList: ["callbackhtml", "callbackScheduledSave", "callbackPasteImage"],
controller:this.controllerShow
})
.onPageEnd((e) => {
@@ -111,6 +138,10 @@ export struct NoteContentCompPortrait {
script: "RICH_EDITOR.setHtml('" + this.selectedNoteData.content_text + "')"
})
})
.imageAccess(true)
.onlineImageAccess(true)
.fileAccess(true)
.domStorageAccess(true)
.zoomAccess(false)
.height('100%')
.width('100%')
@@ -373,9 +373,32 @@ function scheduledSaveContent() {
console.info('scheduledSaveContent end');
}
document.body.addEventListener('paste', (event) => {
let length = event.clipboardData.items.length;
if (length > 0) {
let file = event.clipboardData.items[0].getAsFile();
const reader = new FileReader();
reader.onloadend = () => {
callBackToApp.callbackPasteImage(reader.result);
}
reader.readAsDataURL(file);
event.preventDefault();
}
});
RICH_EDITOR.getFontSizes = function () {
document.execCommand('fontSize', false, null);
var fontElements = window.getSelection().anchorNode.parentNode;
var getSize = fontElements.style.fontSize;
var str = callBackToApp.callbackGetSize(getSize);
};
RICH_EDITOR.insertImageHtml = function (contents) {
let selection = window.getSelection();
if (!selection.rangeCount)
return false;
selection.deleteFromDocument();
let img = document.createElement('img');
img.src = contents;
selection.getRangeAt(0).insertNode(img);
};
@@ -57,6 +57,33 @@ export class OperationUtils {
return imagePath.toString()
}
saveImage(imageData: string, imageType: string): string {
try {
var context = globalThis.noteContext
// 1、获取本地路径
var dir = context.filesDir
// 2、生成本地文件名
var time = new Date().getTime()
var imagePath = dir + "/" + time.toString() + "_note" + "." + imageType
let fd = fileio.openSync(imagePath, 0o100 | 0o2, 0o666)
let arrayBuffer = new ArrayBuffer(imageData.length)
let ia = new Uint8Array(arrayBuffer)
for(let i = 0; i < imageData.length; i++) {
ia[i] = imageData.charCodeAt(i)
}
// 3、把image数据写入本地图片文件中
fileio.writeSync(fd, ia.buffer)
} catch (error) {
LogUtil.info(TAG, "create error: " + error);
return;
}
LogUtil.debug(TAG, 'save image end');
return imagePath.toString()
}
getIdByUri(uri:string): number {
let srcIndex = uri.lastIndexOf('/');
let srcEnd = uri.length;
+3
View File
@@ -24,6 +24,9 @@
"phone",
],
"requestPermissions": [
{
"name": "ohos.permission.INTERNET"
},
{
"name": "ohos.permission.READ_MEDIA",
"reason": "$string:read_media_permission"
+3
View File
@@ -24,6 +24,9 @@
"tablet"
],
"requestPermissions": [
{
"name": "ohos.permission.INTERNET"
},
{
"name": "ohos.permission.READ_MEDIA",
"reason": "$string:read_media_permission"