fix: show pages

.npmrc

@@ -0,0 +1,2 @@
+electron_mirror=https://npmmirror.com/mirrors/electron/
+electron_builder_binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/

package.json

@@ -171,7 +171,7 @@
     "css-loader": "^5.0.1",
     "del": "^6.0.0",
     "dmg-builder": "23.6.0",
-    "electron": "^31.3.1",
+    "electron": "^26.6.10",
     "electron-builder": "^24.13.3",
     "electron-devtools-vendor": "^1.1.0",
     "electron-playwright-helpers": "^1.2.0",

src/renderer/components/effect-preview/index.vue

@@ -134,18 +134,18 @@
           <el-slider :min="0" :max="15" v-model="blur" show-input></el-slider>
         </el-col>
       </el-row>
-      <!-- <el-row :gutter="10" flex="cross:center">
+      <el-row v-show="isCanvas" :gutter="10" flex="cross:center">
         <el-col :span="6">
           <span class="text-style">{{ $t('imagePreview.gamma') }}</span>
         </el-col>
         <el-col :span="18">
           <el-slider :min="0.01" :max="10" :step="0.01" v-model="gammaData" show-input @input="updateGama"></el-slider>
         </el-col>
       </el-row>
-      <el-divider>
+      <el-divider v-show="isCanvas">
         <span class="title-style">{{ $t('imagePreview.colorLevel.title') }}</span>
       </el-divider>
-      <el-row :gutter="2" flex="cross:center">
+      <el-row v-show="isCanvas" :gutter="2" flex="cross:center">
         <el-col :span="4">
           <span class="text-style">{{ $t('imagePreview.channel') }}</span>
         </el-col>
@@ -162,7 +162,7 @@
           </el-radio-group>
         </el-col>
       </el-row>
-      <el-row :gutter="2" flex="cross:center">
+      <el-row v-show="isCanvas" :gutter="2" flex="cross:center">
         <el-col :span="6">
           <span class="text-style">{{ $t('imagePreview.colorLevel.input') }}</span>
         </el-col>
@@ -188,7 +188,7 @@
           </div>
         </el-col>
       </el-row>
-      <el-row :gutter="10" flex="cross:center">
+      <el-row v-show="isCanvas" :gutter="10" flex="cross:center">
         <el-col :span="6">
           <span class="text-style">{{ $t('imagePreview.colorLevel.inputMidtones') }}</span>
         </el-col>
@@ -203,7 +203,7 @@
           ></el-slider>
         </el-col>
       </el-row>
-      <el-row :gutter="2" flex="cross:center">
+      <el-row v-show="isCanvas" :gutter="2" flex="cross:center">
         <el-col :span="6">
           <span class="text-style">{{ $t('imagePreview.colorLevel.input') }}</span>
         </el-col>
@@ -228,7 +228,7 @@
             />
           </div>
         </el-col>
-      </el-row> -->
+      </el-row>
       <div flex="main:justify">
         <el-switch v-model="enableXray" active-text="Xray"></el-switch>
         <el-button @click="resetImageStyle">{{ $t('imagePreview.resetAll') }}</el-button>
@@ -298,6 +298,9 @@ export default {
       })
       return filter
     },
+    isCanvas() {
+      return this.mode === 'canvas'
+    },
     inputShadow: {
       get() {
         return this.inputLevels[0]

src/renderer/views/image/ImageCompare.vue

@@ -47,7 +47,7 @@ export default {
   },
   methods: {
     async initFiltersMap() {
-      // await useWorker('all', 'initFiltersMap')
+      await useWorker('all', 'initFiltersMap')
     },
   }
 }

src/renderer/views/image/components/ImageCanvas.vue

@@ -541,27 +541,27 @@ export default {
             })
           : this.getImageData()
         this.bitMap = await createImageBitmap(imageData)
-        // useWorker(this.getName(false), 'all', imageData, this.$refs['effect-settings'].generateFilterParams({})).then(
-        //   (res) => {
-        //     this.bitMap && this.bitMap?.close()
-        //     this.bitMap = null
-        //     this.bitMap = res
-        //     this.drawImage()
-        //   }
-        // )
+        useWorker(this.getName(false), 'all', imageData, this.$refs['effect-settings'].generateFilterParams({})).then(
+          (res) => {
+            this.bitMap && this.bitMap?.close()
+            this.bitMap = null
+            this.bitMap = res
+            this.drawImage()
+          }
+        )
         resolve(this.bitMap)
       })
     },
     applyFilters(type, params) {
       if (!this.ready) {
         return
       }
-      // const imageData = this.getImageData()
-      // useWorker(this.getName(false), type, imageData, params).then((res) => {
-      //   this.bitMap && this.bitMap?.close()
-      //   this.bitMap = res
-      //   this.drawImage()
-      // })
+      const imageData = this.getImageData()
+      useWorker(this.getName(false), type, imageData, params).then((res) => {
+        this.bitMap && this.bitMap?.close()
+        this.bitMap = res
+        this.drawImage()
+      })
     },
     async adjustGamma({ parentId, ...params }) {
       const { gamma } = params
@@ -614,7 +614,7 @@ export default {
       })
     },
     async initFilters() {
-      // await useWorker(this.getName(false), 'initFilters')
+      await useWorker(this.getName(false), 'initFilters')
     },
     getImageData(_img) {
       const img = _img ?? this.image

static/sw.js

@@ -77,7 +77,7 @@ onmessage = async (e) => {
 
     initFilters(resetFilters, resetFiltersExcluedResetIndex)
 
-    console.log(`【${id.length > 13 ? "..." + id.slice(-10) : id}】 process filters: ${filters.map(i => i.name).concat(resetFilters.map(i => i.name)).join("->")},`, `params: ${JSON.stringify(params)}`)
+    // console.log(`【${id.length > 13 ? "..." + id.slice(-10) : id}】 process filters: ${filters.map(i => i.name).concat(resetFilters.map(i => i.name)).join("->")},`, `params: ${JSON.stringify(params)}`)
 
     for (let i = 0; i < len; i++) {
       const filter = resetFilters[i];
@@ -95,7 +95,7 @@ onmessage = async (e) => {
     } 
     filters = filters.concat(resetFilters)
   }  else {
-    console.log(`${id} skip filter`)
+    // console.log(`${id} skip filter`)
   }
 
   filtersMap.set(id, {filters, params})