@live-change/image-frontend 0.9.41 → 0.9.43

package/front/src/Image.vue

@@ -61,6 +61,7 @@
         const { width, height } = loaded
         size.value = { width, height }
         imageData.value = loaded
+        updateUrl()
       }
       if(!imageData.value && !upload.value) {
         tryCount ++
@@ -98,7 +99,7 @@
     if(props.noResize) return ''
     const domSize = stableDomSize.value
     if(props.domResize && domSize) {
-      console.log("DOM SIZE", domSize)
+      //console.log("DOM SIZE", domSize)
       let width = (domSize.width * dpr)|0
       let height = (domSize.height * dpr)|0
       if(imageData.value) {
@@ -119,29 +120,32 @@
     return ''
   }
 
-  function updateUrl() {
+  async function updateUrl() {
     //console.log("UPDATE URL!", upload.value)
     if(upload.value && upload.value.url) { // available upload
       size.value = { ...upload.value.size }
       url.value = upload.value.url
       return
     }
-    if(!imageData.value) {
+    if(!imageData.value || (!props.imageData && props.image && imageData.value?.id !== props.image)) {
+      //console.log("IMAGE DATA NEED RELOAD!", imageData.value, props.image)
       tryCount = 0
-      loadImageData()
+      await loadImageData()
       return
     } else {
+      //console.log("IMAGE DATA", imageData.value, 'UPDATE URL')
       const suffix = getSuffix()
       url.value = `/api/image/image/${props.image}${suffix}`
     }
   }
 
-  if(!imageData.value) updateUrl()
   watch(() => props.image, () => updateUrl())
   watch(() => upload.value && upload.value.url, () => updateUrl())
-  watch(() => imageData.value, (v) => updateUrl())
   watch(() => props.imageData, (v) => {
     imageData.value = v
+    updateUrl()
   })
 
+  if(!imageData.value) await updateUrl()
+
 </script>

package/front/src/ImageEditor.vue

@@ -37,6 +37,9 @@
         <Button type="button" label="Upload Image" icon="pi pi-upload" class="p-button-primary" />
       </FileInput>
     </div>
+  </div>
+  <div v-else-if="state === 'uploading'" class="h-[10em] flex items-center justify-center">
+
   </div>
   <div v-else>
     <ProgressSpinner />
@@ -158,7 +161,7 @@
       emit('update:modelValue', upload.value.id)
       if(sourceUpload.value) await sourceUpload.value.upload()
       await upload.value.upload()
-      state.value = 'edit'
+      //state.value = 'edit'
       emit('close')
     })())
   }

package/index.js

@@ -7,7 +7,10 @@ import preProcessImageFile from "./front/src/preprocessImageFile.js";
 
 export { ImageUpload, Image, uploadImage, preProcessImageFile, imageUploads, ImageEditor, ImageInput }
 
-import { inputConfig } from "@live-change/frontend-auto-form"
-inputConfig.types.Image = inputConfig.inputs.image = inputConfig.input(
-  () => import('./front/src/ImageInput.vue'))
+import { inputConfig, provideInputConfig } from "@live-change/frontend-auto-form"
+export function provideImageInputConfig() {
+  const config = inputConfig(() => import('./front/src/ImageInput.vue'))
+  provideInputConfig({ name: 'image' }, config)
+  provideInputConfig({ type: 'Image' }, config)
+}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-change/image-frontend",
-  "version": "0.9.41",
+  "version": "0.9.43",
   "scripts": {
     "memDev": "node server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
     "localDevInit": "rm tmp.db; lcli localDev --enableSessions --initScript ./init.js",
@@ -22,15 +22,15 @@
   "type": "module",
   "dependencies": {
     "@fortawesome/fontawesome-free": "^6.7.2",
-    "@live-change/cli": "^0.9.41",
-    "@live-change/dao": "^0.9.41",
-    "@live-change/dao-vue3": "^0.9.41",
-    "@live-change/dao-websocket": "^0.9.41",
-    "@live-change/framework": "^0.9.41",
-    "@live-change/image-service": "^0.9.41",
-    "@live-change/session-service": "^0.9.41",
-    "@live-change/vue3-components": "^0.9.41",
-    "@live-change/vue3-ssr": "^0.9.41",
+    "@live-change/cli": "^0.9.43",
+    "@live-change/dao": "^0.9.43",
+    "@live-change/dao-vue3": "^0.9.43",
+    "@live-change/dao-websocket": "^0.9.43",
+    "@live-change/framework": "^0.9.43",
+    "@live-change/image-service": "^0.9.43",
+    "@live-change/session-service": "^0.9.43",
+    "@live-change/vue3-components": "^0.9.43",
+    "@live-change/vue3-ssr": "^0.9.43",
     "@vueuse/core": "^12.3.0",
     "codeceptjs-assert": "^0.0.5",
     "compression": "^1.7.5",
@@ -50,7 +50,7 @@
     "vue3-scroll-border": "0.1.6"
   },
   "devDependencies": {
-    "@live-change/codeceptjs-helper": "^0.9.41",
+    "@live-change/codeceptjs-helper": "^0.9.43",
     "codeceptjs": "^3.6.10",
     "generate-password": "1.7.1",
     "playwright": "1.49.1",
@@ -61,5 +61,5 @@
   "author": "Michał Łaszczewski <michal@laszczewski.pl>",
   "license": "BSD-3-Clause",
   "description": "",
-  "gitHead": "88ccfef9ea84e2de85935f771d2b03dabfa8d845"
+  "gitHead": "608a5e07398216f7f52f58ec338e7b10df457bc3"
 }