chore: bump ocp

Signed-off-by: Vitor Mattos <[email protected]>

package.json

@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@fontsource/dancing-script": "^5.1.0",
-    "@libresign/vue-pdf-editor": "^1.3.0",
+    "@libresign/vue-pdf-editor": "^1.3.6",
     "@marionebl/option": "^1.0.8",
     "@nextcloud/auth": "^2.4.0",
     "@nextcloud/axios": "^2.5.1",

src/Components/PdfEditor/PdfEditor.vue

@@ -1,15 +1,110 @@
 <template>
-	<div></div>
+	<VuePdfEditor ref="vuePdfEditor"
+		width="100%"
+		height="100%"
+		class="vue-pdf-editor"
+		:show-choose-file-btn="false"
+		:show-customize-editor="false"
+		:show-line-size-select="false"
+		:show-font-size-select="false"
+		:show-font-select="false"
+		:show-rename="false"
+		:show-save-btn="false"
+		:save-to-upload="false"
+		:init-file-src="fileSrc"
+		:init-image-scale="1"
+		:seal-image-show="false"
+		@pdf-editor:end-init="endInit">
+		<template #custom="{ object, pagesScale }">
+			<Signature :x="object.x"
+				:y="object.y"
+				:fix-size="object.signer.readOnly"
+				:read-only="object.signer.readOnly"
+				:display-name="object.signer.displayName"
+				:width="object.width"
+				:height="object.height"
+				:origin-width="object.originWidth"
+				:origin-height="object.originHeight"
+				:page-scale="pagesScale"
+				@onUpdate="$refs.vuePdfEditor.updateObject(object.id, $event)"
+				@onDelete="onDeleteSigner(object)" />
+		</template>
+	</VuePdfEditor>
 </template>
 
 <script>
-// import workerSrc from '@libresign/vue-pdf-editor/dist/pdf.worker.min.mjs'
-import * as VuePdfEditor from '@libresign/vue-pdf-editor/dist/vue-pdf-editor.umd.min.js'
-console.log('###################', VuePdfEditor);
+import VuePdfEditor from '@libresign/vue-pdf-editor'
+import { GlobalWorkerOptions } from 'pdfjs-dist'
+import pdfWorkerCode from 'pdfjs-dist/legacy/build/pdf.worker.min.mjs'
 
-// import Signature from './Signature.vue'
+import Signature from './Signature.vue'
 
 export default {
 	name: 'PdfEditor',
+	components: {
+		VuePdfEditor,
+		Signature,
+	},
+	props: {
+		fileSrc: {
+			type: String,
+			default: '',
+			require: true,
+		},
+		readOnly: {
+			type: Boolean,
+			default: false,
+		},
+	},
+	async mounted() {
+		GlobalWorkerOptions.workerSrc = pdfWorkerCode
+	},
+	methods: {
+		endInit(event) {
+			this.$emit('pdf-editor:end-init', { ...event })
+		},
+		onDeleteSigner(object) {
+			this.$emit('pdf-editor:on-delete-signer', object)
+			this.$refs.vuePdfEditor.deleteObject(object.id)
+		},
+		addSigner(signer) {
+			const object = {
+				id: this.$refs.vuePdfEditor.genID(),
+				type: 'custom',
+				signer,
+				width: signer.element.coordinates.width,
+				height: signer.element.coordinates.height,
+				originWidth: signer.element.coordinates.width,
+				originHeight: signer.element.coordinates.height,
+				x: signer.element.coordinates.llx,
+				y: signer.element.coordinates.ury,
+			}
+			this.$refs.vuePdfEditor.allObjects = this.$refs.vuePdfEditor.allObjects.map((objects, pIndex) => {
+				if (pIndex === signer.element.coordinates.page - 1) {
+					return [...objects, object]
+				}
+				return objects
+			})
+		},
+	},
 }
 </script>
+<style>
+/** @todo remove this, only necessary because VuePdfEditor use Tailwind and the Tailwind have a global CSS that affect this */
+audio, canvas, embed, iframe, img, object, svg, video {
+	display: unset;
+}
+
+canvas {
+	border-bottom: 2px solid #eee;
+}
+</style>
+
+<style lang="scss" scoped>
+.vue-pdf-editor {
+	overflow: unset !important;
+	min-height: 0;
+	position: unset !important;
+	display: flex;
+}
+</style>

webpack.config.js

@@ -3,7 +3,6 @@ const path = require('path')
 const BabelLoaderExcludeNodeModulesExcept = require('babel-loader-exclude-node-modules-except')
 const { EsbuildPlugin } = require('esbuild-loader')
 const nextcloudWebpackConfig = require('@nextcloud/webpack-vue-config')
-const CopyPlugin = require('copy-webpack-plugin')
 
 module.exports = merge(nextcloudWebpackConfig, {
 	entry: {
@@ -35,10 +34,6 @@ module.exports = merge(nextcloudWebpackConfig, {
 	},
 	module: {
 		rules: [
-			{
-			  test: /pdf\.worker(\.min)?\.mjs$/,
-			  use: { loader: 'file-loader' },
-			},
 			{
 				test: /\.js$/,
 				loader: 'esbuild-loader',
@@ -64,14 +59,11 @@ module.exports = merge(nextcloudWebpackConfig, {
 				resourceQuery: /raw/,
 				type: 'asset/source',
 			},
+			{
+				test: /pdf\.worker(\.min)?\.mjs$/,
+				type: 'asset/resource'
+			},
 		],
 	},
-    plugins: [
-      new CopyPlugin({
-        patterns: [
-          { from: 'node_modules/pdfjs-dist/build/pdf.worker.min.mjs', to: 'pdf.worker.min.mjs' },
-        ],
-      }),
-    ],
 	cache: true,
 })