@adminforth/upload 1.4.6 → 1.4.7

package/build.log

@@ -11,5 +11,5 @@ custom/preview.vue
 custom/tsconfig.json
 custom/uploader.vue
 
-sent 42,982 bytes  received 134 bytes  86,232.00 bytes/sec
-total size is 42,493  speedup is 0.99
+sent 43,060 bytes  received 134 bytes  86,388.00 bytes/sec
+total size is 42,578  speedup is 0.99

package/custom/imageGenerator.vue

@@ -50,7 +50,7 @@
                       :minValue="0"
                       :maxValue="historicalAverage"
                       :showValues="false"
-                      :progressFormatter="(value: number, percentage: number) => `${ formatTime(loadingTimer) } ( ${ Math.floor( (
+                      :progressFormatter="(value: number, percentage: number) => `${ formatTime(loadingTimer) } ( ~ ${ Math.floor( (
                         loadingTimer < historicalAverage ? loadingTimer : historicalAverage
                       ) / historicalAverage * 100) }% )`"
                     />
@@ -252,15 +252,10 @@ async function confirmImage() {
 
 const loadingTimer: Ref<number | null> = ref(null);
 
-const historicalRuns: Ref<number[]> = ref([]);
 
 const errorMessage: Ref<string | null> = ref(null);
 
-const historicalAverage: Ref<number | null> = computed(() => {
-  if (historicalRuns.value.length === 0) return null;
-  const sum = historicalRuns.value.reduce((a, b) => a + b, 0);
-  return Math.floor(sum / historicalRuns.value.length);
-});
+const historicalAverage: Ref<number | null> = ref(null);
 
 
 function formatTime(seconds: number): string {
@@ -269,6 +264,14 @@ function formatTime(seconds: number): string {
 }
 
 
+async function getHistoricalAverage() {
+  const resp = await callAdminForthApi({
+    path: `/plugin/${props.meta.pluginInstanceId}/averageDuration`,
+    method: 'GET',
+  });
+  historicalAverage.value = resp?.averageDuration || null;
+}
+
 async function generateImages() {
   errorMessage.value = null;
   loading.value = true;
@@ -279,7 +282,8 @@ async function generateImages() {
     loadingTimer.value = elapsed;
   }, 100);
   const currentIndex = caurosel.value?.getActiveItem()?.position || 0;
-  
+
+  await getHistoricalAverage();
   let resp = null;
   let error = null;
   try {
@@ -294,7 +298,6 @@ async function generateImages() {
   } catch (e) {
     console.error(e);
   } finally {
-    historicalRuns.value.push(loadingTimer.value);
     clearInterval(ticker);
     loadingTimer.value = null;
     loading.value = false;
@@ -330,12 +333,17 @@ async function generateImages() {
   // ];
   await nextTick();
 
+
   caurosel.value = new Carousel(
     document.getElementById('gallery'), 
-    images.value.map((img, index) => ({
-      el: document.getElementById('gallery').querySelector(`[data-carousel-item]:nth-child(${index + 1})`),
-      position: index,
-    })),
+    images.value.map((img, index) => {
+      console.log('mapping image', img, index);
+      return {
+        image: img,
+        el: document.getElementById('gallery').querySelector(`[data-carousel-item]:nth-child(${index + 1})`),
+        position: index,
+      };
+    }),
     {
       internal: 0,
       defaultPosition: currentIndex,
@@ -345,6 +353,7 @@ async function generateImages() {
     }
   );
   await nextTick();
+  
   loading.value = false;
 }
 

package/dist/custom/imageGenerator.vue

@@ -50,7 +50,7 @@
                       :minValue="0"
                       :maxValue="historicalAverage"
                       :showValues="false"
-                      :progressFormatter="(value: number, percentage: number) => `${ formatTime(loadingTimer) } ( ${ Math.floor( (
+                      :progressFormatter="(value: number, percentage: number) => `${ formatTime(loadingTimer) } ( ~ ${ Math.floor( (
                         loadingTimer < historicalAverage ? loadingTimer : historicalAverage
                       ) / historicalAverage * 100) }% )`"
                     />
@@ -252,15 +252,10 @@ async function confirmImage() {
 
 const loadingTimer: Ref<number | null> = ref(null);
 
-const historicalRuns: Ref<number[]> = ref([]);
 
 const errorMessage: Ref<string | null> = ref(null);
 
-const historicalAverage: Ref<number | null> = computed(() => {
-  if (historicalRuns.value.length === 0) return null;
-  const sum = historicalRuns.value.reduce((a, b) => a + b, 0);
-  return Math.floor(sum / historicalRuns.value.length);
-});
+const historicalAverage: Ref<number | null> = ref(null);
 
 
 function formatTime(seconds: number): string {
@@ -269,6 +264,14 @@ function formatTime(seconds: number): string {
 }
 
 
+async function getHistoricalAverage() {
+  const resp = await callAdminForthApi({
+    path: `/plugin/${props.meta.pluginInstanceId}/averageDuration`,
+    method: 'GET',
+  });
+  historicalAverage.value = resp?.averageDuration || null;
+}
+
 async function generateImages() {
   errorMessage.value = null;
   loading.value = true;
@@ -279,7 +282,8 @@ async function generateImages() {
     loadingTimer.value = elapsed;
   }, 100);
   const currentIndex = caurosel.value?.getActiveItem()?.position || 0;
-  
+
+  await getHistoricalAverage();
   let resp = null;
   let error = null;
   try {
@@ -294,7 +298,6 @@ async function generateImages() {
   } catch (e) {
     console.error(e);
   } finally {
-    historicalRuns.value.push(loadingTimer.value);
     clearInterval(ticker);
     loadingTimer.value = null;
     loading.value = false;
@@ -330,12 +333,17 @@ async function generateImages() {
   // ];
   await nextTick();
 
+
   caurosel.value = new Carousel(
     document.getElementById('gallery'), 
-    images.value.map((img, index) => ({
-      el: document.getElementById('gallery').querySelector(`[data-carousel-item]:nth-child(${index + 1})`),
-      position: index,
-    })),
+    images.value.map((img, index) => {
+      console.log('mapping image', img, index);
+      return {
+        image: img,
+        el: document.getElementById('gallery').querySelector(`[data-carousel-item]:nth-child(${index + 1})`),
+        position: index,
+      };
+    }),
     {
       internal: 0,
       defaultPosition: currentIndex,
@@ -345,6 +353,7 @@ async function generateImages() {
     }
   );
   await nextTick();
+  
   loading.value = false;
 }
 

package/dist/index.js

@@ -17,6 +17,9 @@ export default class UploadPlugin extends AdminForthPlugin {
     constructor(options) {
         super(options, import.meta.url);
         this.options = options;
+        // for calcualting average time
+        this.totalCalls = 0;
+        this.totalDuration = 0;
     }
     instanceUniqueRepresentation(pluginOptions) {
         return `${pluginOptions.pathColumnName}`;
@@ -354,6 +357,17 @@ getBucketLifecycleConfiguration on bucket ${this.options.s3Bucket} in region ${t
         this.setupLifecycleRule();
     }
     setupEndpoints(server) {
+        server.endpoint({
+            method: 'GET',
+            path: `/plugin/${this.pluginInstanceId}/averageDuration`,
+            handler: () => __awaiter(this, void 0, void 0, function* () {
+                return {
+                    totalCalls: this.totalCalls,
+                    totalDuration: this.totalDuration,
+                    averageDuration: this.totalCalls ? this.totalDuration / this.totalCalls : null,
+                };
+            })
+        });
         server.endpoint({
             method: 'POST',
             path: `/plugin/${this.pluginInstanceId}/get_s3_upload_url`,
@@ -467,6 +481,7 @@ getBucketLifecycleConfiguration on bucket ${this.options.s3Bucket} in region ${t
                         yield new Promise((resolve) => setTimeout(resolve, 2000));
                         return `https://picsum.photos/200/300?random=${Math.floor(Math.random() * 1000)}`;
                     }
+                    const start = +new Date();
                     const resp = yield this.options.generation.adapter.generate({
                         prompt,
                         inputFiles: attachmentFiles,
@@ -478,6 +493,8 @@ getBucketLifecycleConfiguration on bucket ${this.options.s3Bucket} in region ${t
                         error = resp.error;
                         return;
                     }
+                    this.totalCalls++;
+                    this.totalDuration += (+new Date() - start) / 1000;
                     return resp.imageURLs[0];
                 })));
                 return { error, images };

package/index.ts

@@ -13,9 +13,16 @@ export default class UploadPlugin extends AdminForthPlugin {
 
   adminforth!: IAdminForth;
 
+  totalCalls: number;
+  totalDuration: number;
+
   constructor(options: PluginOptions) {
     super(options, import.meta.url);
     this.options = options;
+
+    // for calcualting average time
+    this.totalCalls = 0;
+    this.totalDuration = 0;
   }
 
   instanceUniqueRepresentation(pluginOptions: any) : string {
@@ -390,8 +397,21 @@ getBucketLifecycleConfiguration on bucket ${this.options.s3Bucket} in region ${t
     // called here because modifyResourceConfig can be called in build time where there is no environment and AWS secrets
     this.setupLifecycleRule();
   }
+  
 
   setupEndpoints(server: IHttpServer) {
+    server.endpoint({
+      method: 'GET',
+      path: `/plugin/${this.pluginInstanceId}/averageDuration`,
+      handler: async () => {
+        return {
+          totalCalls: this.totalCalls,
+          totalDuration: this.totalDuration,
+          averageDuration: this.totalCalls ? this.totalDuration / this.totalCalls : null,
+        };
+      }
+    });
+
     server.endpoint({
       method: 'POST',
       path: `/plugin/${this.pluginInstanceId}/get_s3_upload_url`,
@@ -527,6 +547,7 @@ getBucketLifecycleConfiguration on bucket ${this.options.s3Bucket} in region ${t
               await new Promise((resolve) => setTimeout(resolve, 2000));
               return `https://picsum.photos/200/300?random=${Math.floor(Math.random() * 1000)}`;
             }
+            const start = +new Date();
             const resp = await this.options.generation.adapter.generate(
               {
                 prompt,
@@ -541,6 +562,9 @@ getBucketLifecycleConfiguration on bucket ${this.options.s3Bucket} in region ${t
               error = resp.error;
               return;
             }
+
+            this.totalCalls++;
+            this.totalDuration += (+new Date() - start) / 1000;
             
             return resp.imageURLs[0]
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adminforth/upload",
-  "version": "1.4.6",
+  "version": "1.4.7",
   "description": "Plugin for uploading files for adminforth",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",