[desktop]: Support dithering on Camera capture

tiagohm · Oct 25, 2023 · 61a8b29 · 61a8b29
1 parent 8a550ef
commit 61a8b29
Show file tree

Hide file tree

Showing 8 changed files with 97 additions and 5 deletions.
diff --git a/desktop/src/app/camera/camera.component.html b/desktop/src/app/camera/camera.component.html
@@ -14,7 +14,7 @@
                       size="small" severity="info" pTooltip="Connect" tooltipPosition="bottom" />
         </div>
         <div class="col-2 flex justify-content-center">
-            <p-button [disabled]="!camera || capturing" [text]="true" [rounded]="true" icon="mdi mdi-lg mdi-dots-vertical"
+            <p-button [disabled]="!camera || !connected || capturing" [text]="true" [rounded]="true" icon="mdi mdi-lg mdi-dots-vertical"
                       (click)="cameraDialogMenu.show()" />
         </div>
         <div class="col-12 pt-0 text-sm text-gray-400 flex align-items-center gap-1">
@@ -25,7 +25,7 @@
                tooltipPosition="bottom"></i>
             <i *ngIf="autoSubFolderMode === 'MIDNIGHT'" class="mdi mdi-weather-night text-blue-600" pTooltip="Auto sub folder: MIDNIGHT"
                tooltipPosition="bottom"></i>
-            <span *ngIf="camera" style="padding-top: 1px; padding-bottom: 1px; min-height: 17px;"
+            <span *ngIf="camera && (savePath || capturesPath)" style="padding-top: 1px; padding-bottom: 1px; min-height: 17px;"
                   class="flex align-items-center gap-2 bg-gray-800 border-round-2xl px-3 text-overflow-scroll">
                 {{ savePath || capturesPath }}
                 <i *ngIf="savePath" class="mdi mdi-close cursor-pointer" pTooltip="Reset" tooltipPosition="bottom" (click)="resetSavePath()"></i>
@@ -240,4 +240,34 @@
     </div>
 </div>
 
-<dialogMenu #cameraDialogMenu [model]="cameraMenuItems" />
+<dialogMenu #cameraDialogMenu [model]="cameraMenuItems" />
+
+<p-dialog header="Dithering" [draggable]="true" [(visible)]="showDitheringDialog" [modal]="true" [style]="{width: '80vw'}">
+    <div class="grid mt-2">
+        <div class="col-3 flex flex-column justify-content-center text-center gap-2">
+            <span class="text-sm text-gray-100">Enabled</span>
+            <p-inputSwitch [disabled]="!connected || capturing" [(ngModel)]="dithering.enabled" (ngModelChange)="savePreference()" />
+        </div>
+        <div class="col-5">
+            <span class="p-float-label">
+                <p-inputNumber [disabled]="!connected || capturing || !dithering.enabled" [showButtons]="true"
+                               styleClass="border-0 p-inputtext-sm w-full" [min]="0.1" [max]="60"
+                               [(ngModel)]="dithering.amount" [step]="0.1" locale="en" (ngModelChange)="savePreference()" />
+                <label>Dither (px)</label>
+            </span>
+        </div>
+        <div class="col-4 flex flex-column justify-content-center text-center gap-2">
+            <span class="text-sm text-gray-100">Dither in RA only</span>
+            <p-inputSwitch [disabled]="!connected || capturing || !dithering.enabled" [(ngModel)]="dithering.raOnly"
+                           (ngModelChange)="savePreference()" />
+        </div>
+        <div class="col-6">
+            <span class="p-float-label">
+                <p-inputNumber [disabled]="!connected || capturing || !dithering.enabled" [showButtons]="true"
+                               styleClass="border-0 p-inputtext-sm w-full" [min]="1" [max]="1000"
+                               [(ngModel)]="dithering.afterExposures" [step]="1" (ngModelChange)="savePreference()" />
+                <label>After exposures</label>
+            </span>
+        </div>
+    </div>
+</p-dialog>
diff --git a/desktop/src/app/camera/camera.component.ts b/desktop/src/app/camera/camera.component.ts
@@ -6,7 +6,7 @@ import { ElectronService } from '../../shared/services/electron.service'
 import { PreferenceService } from '../../shared/services/preference.service'
 import {
     AutoSubFolderMode, Camera, CameraCaptureEvent,
-    CameraStartCapture, ExposureMode, ExposureTimeUnit, FilterWheel, FrameType
+    CameraStartCapture, Dither, ExposureMode, ExposureTimeUnit, FilterWheel, FrameType
 } from '../../shared/types'
 import { AppComponent } from '../app.component'
 
@@ -28,6 +28,14 @@ export class CameraComponent implements AfterContentInit, OnDestroy {
 
     wheel?: FilterWheel
 
+    showDitheringDialog = false
+    readonly dithering: Dither = {
+        enabled: false,
+        afterExposures: 1,
+        amount: 1.5,
+        raOnly: false,
+    }
+
     readonly cameraMenuItems: MenuItem[] = [
         {
             icon: 'mdi mdi-content-save',
@@ -88,6 +96,16 @@ export class CameraComponent implements AfterContentInit, OnDestroy {
                 },
             ],
         },
+        {
+            separator: true,
+        },
+        {
+            icon: 'icomoon random-dither',
+            label: 'Dithering',
+            command: () => {
+                this.showDitheringDialog = true
+            },
+        },
     ]
 
     cooler = false
@@ -299,6 +317,7 @@ export class CameraComponent implements AfterContentInit, OnDestroy {
             autoSave: this.autoSave,
             savePath: this.savePath,
             autoSubFolderMode: this.autoSubFolderMode,
+            dither: this.dithering,
         }
 
         await this.browserWindow.openCameraImage(this.camera!)
@@ -399,6 +418,11 @@ export class CameraComponent implements AfterContentInit, OnDestroy {
             this.gain = this.preference.get(`camera.${this.camera.name}.gain`, 0)
             this.offset = this.preference.get(`camera.${this.camera.name}.offset`, 0)
             this.frameFormat = this.preference.get(`camera.${this.camera.name}.frameFormat`, this.camera.frameFormats[0] || '')
+
+            this.dithering.enabled = this.preference.get(`camera.${this.camera.name}.dithering.enabled`, false)
+            this.dithering.raOnly = this.preference.get(`camera.${this.camera.name}.dithering.raOnly`, false)
+            this.dithering.amount = this.preference.get(`camera.${this.camera.name}.dithering.amount`, 1.5)
+            this.dithering.afterExposures = this.preference.get(`camera.${this.camera.name}.dithering.afterExposures`, 1)
         }
     }
 
@@ -424,6 +448,11 @@ export class CameraComponent implements AfterContentInit, OnDestroy {
             this.preference.set(`camera.${this.camera.name}.gain`, this.gain)
             this.preference.set(`camera.${this.camera.name}.offset`, this.offset)
             this.preference.set(`camera.${this.camera.name}.frameFormat`, this.frameFormat)
+
+            this.preference.set(`camera.${this.camera.name}.dithering.enabled`, this.dithering.enabled)
+            this.preference.set(`camera.${this.camera.name}.dithering.raOnly`, this.dithering.raOnly)
+            this.preference.set(`camera.${this.camera.name}.dithering.amount`, this.dithering.amount)
+            this.preference.set(`camera.${this.camera.name}.dithering.afterExposures`, this.dithering.afterExposures)
         }
     }
 

diff --git a/desktop/src/assets/fonts/icomoon.ttf b/desktop/src/assets/fonts/icomoon.ttf
diff --git a/desktop/src/assets/icons/CREDITS.md b/desktop/src/assets/icons/CREDITS.md
@@ -17,7 +17,7 @@
 * https://www.flaticon.com/free-icon/rotate_3303063
 * https://www.flaticon.com/free-icon/location_4631354
 * https://www.flaticon.com/free-icon/rgb-print_7664547
-* https://www.flaticon.com/free-icon/setting_839374
+* https://www.flaticon.com/free-icon/cogwheel_3953226
 * https://www.flaticon.com/free-icon/target_10542035
 * https://www.flaticon.com/free-icon/contrast_439842
 * https://www.flaticon.com/free-icon/full-moon_9689786
@@ -28,3 +28,4 @@
 * https://www.flaticon.com/free-icon/satellite_1086093
 * https://www.flaticon.com/free-icon/schedule_3652191
 * https://www.flaticon.com/free-icon/search_10770011
+* https://thenounproject.com/icon/random-dither-4259782/
diff --git a/desktop/src/assets/icons/random-dither.svg b/desktop/src/assets/icons/random-dither.svg
diff --git a/desktop/src/assets/icons/settings.png b/desktop/src/assets/icons/settings.png
diff --git a/desktop/src/shared/types.ts b/desktop/src/shared/types.ts
@@ -182,6 +182,13 @@ export interface FilterWheel extends Device {
     moving: boolean
 }
 
+export interface Dither {
+    enabled: boolean
+    amount: number
+    raOnly: boolean
+    afterExposures: number
+}
+
 export interface CameraStartCapture {
     exposureInMicroseconds: number
     exposureAmount: number
@@ -199,6 +206,7 @@ export interface CameraStartCapture {
     autoSave: boolean
     savePath?: string
     autoSubFolderMode: AutoSubFolderMode
+    dither?: Dither
 }
 
 export interface CameraCaptureEvent {

diff --git a/desktop/src/styles.scss b/desktop/src/styles.scss
@@ -169,4 +169,27 @@ i.mdi {
 ::-webkit-scrollbar-track {
     border-radius: 10px;
     background-color: transparent;
+}
+
+@font-face {
+    font-family: 'icomoon';
+    src: url('assets/fonts/icomoon.ttf');
+    font-weight: normal;
+    font-style: normal;
+    font-display: block;
+}
+
+.icomoon {
+    font-family: 'icomoon' !important;
+    font-style: normal;
+    font-weight: normal;
+    font-variant: normal;
+    text-transform: none;
+    line-height: 1;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+
+    &.random-dither:before {
+        content: "\e900";
+    }
 }