updated themeeditor to work with teh background color

added suiColor as a get/set property on colorcodable trying to fix the wierd jumpiness when shaking the color in the green bit trying to fix the wierd drift when increasing the "brightness" savethemes will clear themes before starting to append updated updatetheme to savethemes aswell modified: ShhShell/Host/HostsManager.swift modified: ShhShell/Themes/ColorCodable.swift modified: ShhShell/Themes/ThemeCodable.swift modified: ShhShell/Views/Themes/ThemeEditorView.swift
2026-03-11 13:26:16 +00:00 · 2025-07-08 14:27:13 +01:00
parent bcdece3bee
commit e5e0a47f4f
4 changed files with 128 additions and 57 deletions
--- a/ShhShell/Host/HostsManager.swift
+++ b/ShhShell/Host/HostsManager.swift
@@ -61,6 +61,7 @@ class HostsManager: ObservableObject, @unchecked Sendable {
 		
 		guard let decodedThemes = try? JSONDecoder().decode([ThemeCodable].self, from: dataTheme) else { return }
 		
+		self.themes = []
 		for index in 0..<decodedThemes.count {
 			guard let encoded = try? JSONEncoder().encode(decodedThemes[index]) else { return }
 			guard let synthedTheme = Theme.decodeTheme(data: encoded) else { return }
@@ -117,6 +118,7 @@ class HostsManager: ObservableObject, @unchecked Sendable {
 	func updateTheme(_ theme: Theme) {
 		guard let index = themes.firstIndex(where: { $0.id == theme.id }) else { return }
 		themes[index] = theme
+		saveThemes()
 	}
 	
 	func renameTheme(_ theme: Theme?, to newName: String) {
--- a/ShhShell/Themes/ColorCodable.swift
+++ b/ShhShell/Themes/ColorCodable.swift
@@ -38,17 +38,27 @@ struct ColorCodable: Codable, Hashable, Equatable {
 	}
 }

+extension ColorCodable {
+	var suiColor: SwiftUI.Color {
+		get {
+			let red = CGFloat(self.red)
+			let green = CGFloat(self.green)
+			let blue = CGFloat(self.blue)
+			return Color(UIColor(red: red, green: green, blue: blue, alpha: 1))
+		}
+		set {
+			let cc = ColorCodable(color: newValue)
+			self.red = cc.red
+			self.green = cc.green
+			self.blue = cc.blue
+		}
+	}
+}
+
 extension ColorCodable {
 	var stColor: SwiftTerm.Color {
 		return SwiftTerm.Color(self)
 	}
-	
-	var suiColor: SwiftUI.Color {
-		let red = CGFloat(self.red)/65535
-		let green = CGFloat(self.green)/65535
-		let blue = CGFloat(self.blue)/65535
-		return Color(UIColor(red: red, green: green, blue: blue, alpha: 1))
-	}
 }

 extension SwiftTerm.Color {
--- a/ShhShell/Themes/ThemeCodable.swift
+++ b/ShhShell/Themes/ThemeCodable.swift
@@ -113,23 +113,72 @@ extension ThemeCodable {
 			}
 		}
 		set {
+			let cc = ColorCodable(color: newValue)
 			switch index {
-			case 0: ansi0 = ColorCodable(color: newValue)
-			case 1: ansi1 = ColorCodable(color: newValue)
-			case 2: ansi2 = ColorCodable(color: newValue)
-			case 3: ansi3 = ColorCodable(color: newValue)
-			case 4: ansi4 = ColorCodable(color: newValue)
-			case 5: ansi5 = ColorCodable(color: newValue)
-			case 6: ansi6 = ColorCodable(color: newValue)
-			case 7: ansi7 = ColorCodable(color: newValue)
-			case 8: ansi8 = ColorCodable(color: newValue)
-			case 9: ansi9 = ColorCodable(color: newValue)
-			case 10: ansi10 = ColorCodable(color: newValue)
-			case 11: ansi11 = ColorCodable(color: newValue)
-			case 12: ansi12 = ColorCodable(color: newValue)
-			case 13: ansi13 = ColorCodable(color: newValue)
-			case 14: ansi14 = ColorCodable(color: newValue)
-			case 15: ansi15 = ColorCodable(color: newValue)
+			case 0:
+				ansi0.red = cc.red
+				ansi0.green = cc.green
+				ansi0.blue = cc.blue
+			case 1:
+				ansi1.red = cc.red
+				ansi1.green = cc.green
+				ansi1.blue = cc.blue
+			case 2:
+				ansi2.red = cc.red
+				ansi2.green = cc.green
+				ansi2.blue = cc.blue
+			case 3:
+				ansi3.red = cc.red
+				ansi3.green = cc.green
+				ansi3.blue = cc.blue
+			case 4:
+				ansi4.red = cc.red
+				ansi4.green = cc.green
+				ansi4.blue = cc.blue
+			case 5:
+				ansi5.red = cc.red
+				ansi5.green = cc.green
+				ansi5.blue = cc.blue
+			case 6:
+				ansi6.red = cc.red
+				ansi6.green = cc.green
+				ansi6.blue = cc.blue
+			case 7:
+				ansi7.red = cc.red
+				ansi7.green = cc.green
+				ansi7.blue = cc.blue
+			case 8:
+				ansi8.red = cc.red
+				ansi8.green = cc.green
+				ansi8.blue = cc.blue
+			case 9:
+				ansi9.red = cc.red
+				ansi9.green = cc.green
+				ansi9.blue = cc.blue
+			case 10:
+				ansi10.red = cc.red
+				ansi10.green = cc.green
+				ansi10.blue = cc.blue
+			case 11:
+				ansi11.red = cc.red
+				ansi11.green = cc.green
+				ansi11.blue = cc.blue
+			case 12:
+				ansi12.red = cc.red
+				ansi12.green = cc.green
+				ansi12.blue = cc.blue
+			case 13:
+				ansi13.red = cc.red
+				ansi13.green = cc.green
+				ansi13.blue = cc.blue
+			case 14:
+				ansi14.red = cc.red
+				ansi14.green = cc.green
+				ansi14.blue = cc.blue
+			case 15:
+				ansi15.red = cc.red
+				ansi15.green = cc.green
+				ansi15.blue = cc.blue
 			default: fatalError()
 			}
 		}
--- a/ShhShell/Views/Themes/ThemeEditorView.swift
+++ b/ShhShell/Views/Themes/ThemeEditorView.swift
@@ -11,57 +11,67 @@ import SwiftTerm
 struct ThemeEditorView: View {
 	@ObservedObject var hostsManager: HostsManager
 	
-//	@State var theme: Theme
+	//	@State var theme: Theme
 	@State var themeCodable: ThemeCodable
 	
 	init(hostsManager: HostsManager, theme: Theme) {
 		self.hostsManager = hostsManager
-//		self.theme = theme
+		//		self.theme = theme
 		self.themeCodable = theme.themeCodable
 	}
 	
 	var body: some View {
 		NavigationStack {
-//			List {
-//			TextField("Name", text: $themeCodable.name)
-			
-			ThemePreview(hostsManager: HostsManager(), theme: themeCodable.toTheme(), canModify: false)
-				.id(themeCodable)
-			
-			Group {
-				Rectangle()
-					.fill(themeCodable.foreground.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.background.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.bold.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.cursor.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.cursorText.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.selection.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.selectedText.stColor.suiColor)
-			}
-			.frame(width: 100)
-			.toolbar {
-				Button() {
-					
-				} label: {
-					Label("Donw", systemImage: "checkmark")
+			List {
+				TextField(
+					"Name",
+					text: Binding(get: { themeCodable.name ?? "Theme" }, set: { themeCodable.name = $0 })
+				)
+				.textFieldStyle(.roundedBorder)
+				
+				ThemePreview(hostsManager: HostsManager(), theme: themeCodable.toTheme(), canModify: false)
+					.id(themeCodable)
+				
+				Group {
+					HStack {
+						Rectangle()
+							.fill(themeCodable.foreground.suiColor)
+						Text("Foreground")
+						Spacer()
+						ColorPicker("", selection: $themeCodable.foreground.suiColor, supportsOpacity: false)
+							.labelsHidden()
+					}
+					Rectangle()
+						.fill(themeCodable.background.suiColor)
+					Rectangle()
+						.fill(themeCodable.bold.suiColor)
+					Rectangle()
+						.fill(themeCodable.cursor.suiColor)
+					Rectangle()
+						.fill(themeCodable.cursorText.suiColor)
+					Rectangle()
+						.fill(themeCodable.selection.suiColor)
+					Rectangle()
+						.fill(themeCodable.selectedText.suiColor)
 				}
-			}
-			
+				
 				ForEach(0...1, id: \.self) { row in
 					HStack {
 						ForEach(1...8, id: \.self) { col in
 							let index = (col + (row * 8)) - 1
-							ColorPicker("Ansi \(index+1)", selection: $themeCodable[ansiIndex: index])
+							ColorPicker("Ansi \(index+1)", selection: $themeCodable[ansiIndex: index], supportsOpacity: false)
 						}
 					}
 				}
-//			}
+			}
+			.navigationTitle("Edit Theme")
+			.toolbar {
+				Button() {
+					hostsManager.updateTheme(themeCodable.toTheme())
+				} label: {
+					Label("Done", systemImage: "checkmark")
+				}
+			}
 		}
 	}
 }