From 1ecf231e071e4a8f57c315a0f1be352cd7fefb29 Mon Sep 17 00:00:00 2001 From: Thea Flowers Date: Sat, 29 Jul 2023 18:10:48 -0400 Subject: [PATCH] Add KiCAD default color theme --- src/kicanvas/elements/kicanvas-app.ts | 4 +- src/kicanvas/themes/index.ts | 2 + src/kicanvas/themes/kicad-default.ts | 143 ++++++++++++++++++++++++++ src/viewers/board/viewer.ts | 1 + src/viewers/schematic/viewer.ts | 1 + 5 files changed, 149 insertions(+), 2 deletions(-) create mode 100644 src/kicanvas/themes/kicad-default.ts diff --git a/src/kicanvas/elements/kicanvas-app.ts b/src/kicanvas/elements/kicanvas-app.ts index 14977744..4a24dcb5 100644 --- a/src/kicanvas/elements/kicanvas-app.ts +++ b/src/kicanvas/elements/kicanvas-app.ts @@ -16,7 +16,7 @@ import { Project } from "../project"; import { GitHub } from "../services/github"; import { GitHubFileSystem } from "../services/github-vfs"; import { FetchFileSystem, type VirtualFileSystem } from "../services/vfs"; -import witch_hazel from "../themes/witch-hazel"; +import themes from "../themes"; import { KCBoardViewerElement } from "./kc-board/viewer"; import { KCSchematicViewerElement } from "./kc-schematic/viewer"; import type { KCProjectPanelElement } from "./project-panel"; @@ -41,7 +41,7 @@ class KiCanvasAppElement extends KCUIElement { ]; project: Project = new Project(); - theme: Theme = witch_hazel; + theme: Theme = themes.default; #kc_schematic_viewer: KCSchematicViewerElement; #kc_board_viewer: KCBoardViewerElement; diff --git a/src/kicanvas/themes/index.ts b/src/kicanvas/themes/index.ts index d605a0c8..4c1bf41b 100644 --- a/src/kicanvas/themes/index.ts +++ b/src/kicanvas/themes/index.ts @@ -6,9 +6,11 @@ import type { Theme } from "../../kicad"; import witch_hazel from "./witch-hazel"; +import kicad_default from "./kicad-default"; export default { default: witch_hazel, + kicad_default: kicad_default, witch_hazel: witch_hazel, by_name(name: string): Theme { diff --git a/src/kicanvas/themes/kicad-default.ts b/src/kicanvas/themes/kicad-default.ts new file mode 100644 index 00000000..c9f590e6 --- /dev/null +++ b/src/kicanvas/themes/kicad-default.ts @@ -0,0 +1,143 @@ +/* + Copyright (c) 2023 Alethea Katherine Flowers. + Published under the standard MIT License. + Full text available at: https://opensource.org/licenses/MIT +*/ + +import { Color } from "../../base/color"; +import type { Theme } from "../../kicad/theme"; + +const theme: Theme = { + board: { + anchor: Color.from_css("rgb(255, 38, 226)"), + aux_items: Color.from_css("rgb(255, 255, 255)"), + b_adhes: Color.from_css("rgb(0, 0, 132)"), + b_crtyd: Color.from_css("rgb(38, 233, 255)"), + b_fab: Color.from_css("rgb(88, 93, 132)"), + b_mask: Color.from_css("rgba(2, 255, 238, 0.400)"), + b_paste: Color.from_css("rgba(0, 194, 194, 0.902)"), + b_silks: Color.from_css("rgb(232, 178, 167)"), + background: Color.from_css("rgb(0, 16, 35)"), + cmts_user: Color.from_css("rgb(89, 148, 220)"), + // conflicts_shadow: Color.from_css("rgba(255, 0, 5, 0.502)"), + copper: { + b: Color.from_css("rgb(77, 127, 196)"), + f: Color.from_css("rgb(200, 52, 52)"), + in1: Color.from_css("rgb(127, 200, 127)"), + in10: Color.from_css("rgb(237, 124, 51)"), + in11: Color.from_css("rgb(91, 195, 235)"), + in12: Color.from_css("rgb(247, 111, 142)"), + in13: Color.from_css("rgb(167, 165, 198)"), + in14: Color.from_css("rgb(40, 204, 217)"), + in15: Color.from_css("rgb(232, 178, 167)"), + in16: Color.from_css("rgb(242, 237, 161)"), + in17: Color.from_css("rgb(237, 124, 51)"), + in18: Color.from_css("rgb(91, 195, 235)"), + in19: Color.from_css("rgb(247, 111, 142)"), + in2: Color.from_css("rgb(206, 125, 44)"), + in20: Color.from_css("rgb(167, 165, 198)"), + in21: Color.from_css("rgb(40, 204, 217)"), + in22: Color.from_css("rgb(232, 178, 167)"), + in23: Color.from_css("rgb(242, 237, 161)"), + in24: Color.from_css("rgb(237, 124, 51)"), + in25: Color.from_css("rgb(91, 195, 235)"), + in26: Color.from_css("rgb(247, 111, 142)"), + in27: Color.from_css("rgb(167, 165, 198)"), + in28: Color.from_css("rgb(40, 204, 217)"), + in29: Color.from_css("rgb(232, 178, 167)"), + in3: Color.from_css("rgb(79, 203, 203)"), + in30: Color.from_css("rgb(242, 237, 161)"), + in4: Color.from_css("rgb(219, 98, 139)"), + in5: Color.from_css("rgb(167, 165, 198)"), + in6: Color.from_css("rgb(40, 204, 217)"), + in7: Color.from_css("rgb(232, 178, 167)"), + in8: Color.from_css("rgb(242, 237, 161)"), + in9: Color.from_css("rgb(141, 203, 129)"), + }, + cursor: Color.from_css("rgb(255, 255, 255)"), + drc_error: Color.from_css("rgba(215, 91, 107, 0.800)"), + drc_exclusion: Color.from_css("rgba(255, 255, 255, 0.800)"), + drc_warning: Color.from_css("rgba(255, 208, 66, 0.800)"), + dwgs_user: Color.from_css("rgb(194, 194, 194)"), + eco1_user: Color.from_css("rgb(180, 219, 210)"), + eco2_user: Color.from_css("rgb(216, 200, 82)"), + edge_cuts: Color.from_css("rgb(208, 210, 205)"), + f_adhes: Color.from_css("rgb(132, 0, 132)"), + f_crtyd: Color.from_css("rgb(255, 38, 226)"), + f_fab: Color.from_css("rgb(175, 175, 175)"), + f_mask: Color.from_css("rgba(216, 100, 255, 0.400)"), + f_paste: Color.from_css("rgba(180, 160, 154, 0.902)"), + f_silks: Color.from_css("rgb(242, 237, 161)"), + footprint_text_invisible: Color.from_css("rgb(132, 132, 132)"), + grid: Color.from_css("rgb(132, 132, 132)"), + grid_axes: Color.from_css("rgb(194, 194, 194)"), + // locked_shadow: Color.from_css("rgba(255, 38, 226, 0.502)"), + margin: Color.from_css("rgb(255, 38, 226)"), + no_connect: Color.from_css("rgb(0, 0, 132)"), + pad_plated_hole: Color.from_css("rgb(194, 194, 0)"), + pad_through_hole: Color.from_css("rgb(227, 183, 46)"), + // page_limits: Color.from_css("rgb(132, 132, 132)"), + non_plated_hole: Color.from_css("rgb(26, 196, 210)"), + // plated_hole: Color.from_css("rgb(26, 196, 210)"), + ratsnest: Color.from_css("rgba(245, 255, 213, 0.702)"), + user_1: Color.from_css("rgb(194, 194, 194)"), + user_2: Color.from_css("rgb(89, 148, 220)"), + user_3: Color.from_css("rgb(180, 219, 210)"), + user_4: Color.from_css("rgb(216, 200, 82)"), + user_5: Color.from_css("rgb(194, 194, 194)"), + user_6: Color.from_css("rgb(89, 148, 220)"), + user_7: Color.from_css("rgb(180, 219, 210)"), + user_8: Color.from_css("rgb(216, 200, 82)"), + user_9: Color.from_css("rgb(232, 178, 167)"), + via_blind_buried: Color.from_css("rgb(187, 151, 38)"), + via_hole: Color.from_css("rgb(227, 183, 46)"), + via_micro: Color.from_css("rgb(0, 132, 132)"), + via_through: Color.from_css("rgb(236, 236, 236)"), + worksheet: Color.from_css("rgb(200, 114, 171)"), + }, + schematic: { + anchor: Color.from_css("rgb(0, 0, 255)"), + aux_items: Color.from_css("rgb(0, 0, 0)"), + background: Color.from_css("rgb(245, 244, 239)"), + brightened: Color.from_css("rgb(255, 0, 255)"), + bus: Color.from_css("rgb(0, 0, 132)"), + bus_junction: Color.from_css("rgb(0, 0, 132)"), + component_body: Color.from_css("rgb(255, 255, 194)"), + component_outline: Color.from_css("rgb(132, 0, 0)"), + cursor: Color.from_css("rgb(15, 15, 15)"), + erc_error: Color.from_css("rgba(230, 9, 13, 0.800)"), + // erc_exclusion: Color.from_css("rgba(94, 194, 194, 0.800)"), + erc_warning: Color.from_css("rgba(209, 146, 0, 0.800)"), + fields: Color.from_css("rgb(132, 0, 132)"), + grid: Color.from_css("rgb(181, 181, 181)"), + grid_axes: Color.from_css("rgb(0, 0, 132)"), + hidden: Color.from_css("rgb(94, 194, 194)"), + // hovered: Color.from_css("rgb(0, 0, 255)"), + junction: Color.from_css("rgb(0, 150, 0)"), + label_global: Color.from_css("rgb(132, 0, 0)"), + label_hier: Color.from_css("rgb(114, 86, 0)"), + label_local: Color.from_css("rgb(15, 15, 15)"), + // netclass_flag: Color.from_css("rgb(72, 72, 72)"), + no_connect: Color.from_css("rgb(0, 0, 132)"), + note: Color.from_css("rgb(0, 0, 194)"), + // note_background: Color.from_css("rgba(0, 0, 0, 0.000)"), + // page_limits: Color.from_css("rgb(181, 181, 181)"), + pin: Color.from_css("rgb(132, 0, 0)"), + pin_name: Color.from_css("rgb(0, 100, 100)"), + pin_number: Color.from_css("rgb(169, 0, 0)"), + // private_note: Color.from_css("rgb(72, 72, 255)"), + reference: Color.from_css("rgb(0, 100, 100)"), + shadow: Color.from_css("rgba(199, 235, 255, 0.800)"), + sheet: Color.from_css("rgb(132, 0, 0)"), + sheet_background: Color.from_css("rgba(255, 255, 255, 0.000)"), + sheet_fields: Color.from_css("rgb(132, 0, 132)"), + sheet_filename: Color.from_css("rgb(114, 86, 0)"), + sheet_label: Color.from_css("rgb(0, 100, 100)"), + sheet_name: Color.from_css("rgb(0, 100, 100)"), + value: Color.from_css("rgb(0, 100, 100)"), + wire: Color.from_css("rgb(0, 150, 0)"), + worksheet: Color.from_css("rgb(132, 0, 0)"), + }, +}; + +export default theme; diff --git a/src/viewers/board/viewer.ts b/src/viewers/board/viewer.ts index 6797523f..89044099 100644 --- a/src/viewers/board/viewer.ts +++ b/src/viewers/board/viewer.ts @@ -26,6 +26,7 @@ export class BoardViewer extends DocumentViewer< protected override create_renderer(canvas: HTMLCanvasElement): Renderer { const renderer = new WebGL2Renderer(canvas); + renderer.background_color = this.theme.background; return renderer; } diff --git a/src/viewers/schematic/viewer.ts b/src/viewers/schematic/viewer.ts index e877755e..ec5d50bb 100644 --- a/src/viewers/schematic/viewer.ts +++ b/src/viewers/schematic/viewer.ts @@ -33,6 +33,7 @@ export class SchematicViewer extends DocumentViewer< override create_renderer(canvas: HTMLCanvasElement): Renderer { const renderer = new Canvas2DRenderer(canvas); + renderer.background_color = this.theme.background; renderer.state.fill = this.theme.note; renderer.state.stroke = this.theme.note; renderer.state.stroke_width = 0.1524;