diff --git a/css/style.css b/css/style.css index 742d483..14f9a4f 100644 --- a/css/style.css +++ b/css/style.css @@ -3,34 +3,26 @@ --primary: #006b58; --primary-container: #1abc9c; --on-primary: #ffffff; - /* --on-primary-container: #004538; */ --on-primary-container: #e5fff7; --secondary: #4e6073; --on-secondary: #ffffff; - --on-secondary-container: #526478; --background: #f7f9fb; - --surface: #f7f9fb; --surface-container-lowest: #ffffff; --surface-container-low: #f2f4f6; --surface-container: #eceef0; --surface-container-high: #e6e8ea; - --surface-container-highest: #e0e3e5; --on-surface: #191c1e; --on-surface-variant: #3c4a45; --on-background: #191c1e; --text-muted: #64748b; --border-subtle: #e2e8f0; - --outline: #6c7a75; --outline-variant: #bbcac3; - /* --editor-bg: #1e1e1e; */ --editor-bg: #ffffff; --error: #ba1a1a; /* Radii */ - --radius: 0.125rem; --radius-lg: 0.25rem; --radius-xl: 0.5rem; - --radius-full: 0.75rem; /* Fonts */ --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; @@ -353,12 +345,6 @@ code { float: left; } -.column-center { - min-width: 120px; - text-align: center; - color: var(--text-muted); -} - .column-right { float: right; margin-left: auto; @@ -801,20 +787,16 @@ input[type="file"]::file-selector-button { --on-primary-container: #e5fff7; --secondary: #b5c8df; --on-secondary: #17293b; - --on-secondary-container: #cfe2f9; --background: #0f1416; - --surface: #0f1416; --surface-container-lowest: #171d1f; --surface-container-low: #1a2124; --surface-container: #22282b; --surface-container-high: #2a3033; - --surface-container-highest: #343a3d; --on-surface: #e0e3e5; --on-surface-variant: #c3d0c9; --on-background: #e0e3e5; --text-muted: #8a9a94; --border-subtle: #2d3133; - --outline: #8a938f; --outline-variant: #414a47; --editor-bg: #0b0e0f; } diff --git a/js/script.js b/js/script.js index dba19f1..dc1e87d 100644 --- a/js/script.js +++ b/js/script.js @@ -860,7 +860,6 @@ function handleImageSelection(evt) { fn.className = 'file-info file-name'; fn.innerHTML = `${file.name} (file resolution: ${img.width} x ${img.height})`; - fn.appendChild(rb); fileInputColumnEntryRemoveButton.onclick = removeButtonOnClick; diff --git a/tests/golden/kitchen_sink.txt b/tests/golden/kitchen_sink.txt index 7695d1d..58a86a7 100644 --- a/tests/golden/kitchen_sink.txt +++ b/tests/golden/kitchen_sink.txt @@ -1,7 +1,7 @@ // 'test_pattern', 32x24px -80000000804020100804020100000000 -00000000ff7fffff904fb04bb5ffaaff -0001000208010e010e030d0e8b4f2f1f -0c0c0303fcfcf3f31cac5323dc7cd3f3 -000000aa009a611ee15eabfdb7ffffff -cccc3333cccc3333cccc3333cccc3333 +0x80, 0x00, 0x00, 0x00, 0x80, 0x40, 0x20, 0x10, 0x08, 0x04, 0x02, 0x01, 0x00, 0x00, 0x00, 0x00, +0x00, 0x00, 0x00, 0x00, 0xff, 0x7f, 0xff, 0xff, 0x90, 0x4f, 0xb0, 0x4b, 0xb5, 0xff, 0xaa, 0xff, +0x00, 0x01, 0x00, 0x02, 0x08, 0x01, 0x0e, 0x01, 0x0e, 0x03, 0x0d, 0x0e, 0x8b, 0x4f, 0x2f, 0x1f, +0x0c, 0x0c, 0x03, 0x03, 0xfc, 0xfc, 0xf3, 0xf3, 0x1c, 0xac, 0x53, 0x23, 0xdc, 0x7c, 0xd3, 0xf3, +0x00, 0x00, 0x00, 0xaa, 0x00, 0x9a, 0x61, 0x1e, 0xe1, 0x5e, 0xab, 0xfd, 0xb7, 0xff, 0xff, 0xff, +0xcc, 0xcc, 0x33, 0x33, 0xcc, 0xcc, 0x33, 0x33, 0xcc, 0xcc, 0x33, 0x33, 0xcc, 0xcc, 0x33, 0x33 \ No newline at end of file diff --git a/tests/golden/remove_zeroes_commas.txt b/tests/golden/remove_zeroes_commas.txt index 3da87fe..53423dd 100644 --- a/tests/golden/remove_zeroes_commas.txt +++ b/tests/golden/remove_zeroes_commas.txt @@ -1,2 +1,7 @@ // 'test_pattern', 32x24px -333300ff333300ffcccc00ffcccc00ff333300ff333300ffcccc00ffcccc00ff333300ff333300ffcccc00ffcccc00ff0f0f7fff0f0fbfff0f0fdfff0f0fefff0f0ff7ff0f0ffbff0f0ffdff0f0ffeff0f0fff7f0f0fffbf0f0fffdf0f0fffee \ No newline at end of file +333300ff333300ffcccc00ffcccc00ff +333300ff333300ffcccc00ffcccc00ff +333300ff333300ffcccc00ffcccc00ff +0f0f7fff0f0fbfff0f0fdfff0f0fefff +0f0ff7ff0f0ffbff0f0ffdff0f0ffeff +0f0fff7f0f0fffbf0f0fffdf0f0fffee diff --git a/tests/test_conversions.py b/tests/test_conversions.py index b050203..bf9321b 100644 --- a/tests/test_conversions.py +++ b/tests/test_conversions.py @@ -43,7 +43,15 @@ BASE_SETTINGS = { "flipHorizontally": False, "flipVertically": False, "bitswap": False, - "removeZeroesCommas": False, + "prefix": "0x", + "separator": ", ", +} + +OUTPUT_FORMAT_IDS = { + "plain": "outputFormatPlain", + "arduino": "outputFormatArduino", + "arduino_single": "outputFormatArduinoSingle", + "adafruit_gfx": "outputFormatAdafruitGfx", } # (scenario name, overrides on top of BASE_SETTINGS, optional canvas resize) @@ -69,7 +77,7 @@ SCENARIOS = [ ("dithering_threshold_low", {"ditheringThreshold": 64}, None), ("dithering_threshold_high", {"ditheringThreshold": 200}, None), ("bitswap", {"bitswap": True}, None), - ("remove_zeroes_commas", {"removeZeroesCommas": True}, None), + ("remove_zeroes_commas", {"prefix": "", "separator": ""}, None), # scale=1 (original) on a canvas larger than the image so the # background actually shows through in the margins. ("background_white_larger_canvas", {"backgroundColor": "white"}, (48, 40)), @@ -116,7 +124,10 @@ def reset_canvas_size(page, width, height): def apply_settings(page, settings): page.select_option("#drawMode", settings["drawMode"]) - page.select_option("#outputFormat", settings["outputFormat"]) + # Selecting an output format resets prefix/separator to their defaults + # (updateOutputFormat() in script.js), so this must run before those two + # fields are filled in below. + page.check(f"#{OUTPUT_FORMAT_IDS[settings['outputFormat']]}") page.check(f"#backgroundColor{settings['backgroundColor'].capitalize()}") set_checkbox(page, "#invertColors", settings["invertColors"]) page.select_option("#ditheringMode", str(settings["ditheringMode"])) @@ -128,8 +139,8 @@ def apply_settings(page, settings): set_checkbox(page, "#flipHorizontally", settings["flipHorizontally"]) set_checkbox(page, "#flipVertically", settings["flipVertically"]) set_checkbox(page, "#bitswap", settings["bitswap"]) - if settings["outputFormat"] == "plain": - set_checkbox(page, "#removeZeroesCommas", settings["removeZeroesCommas"]) + page.fill("#prefix", settings["prefix"]) + page.fill("#separator", settings["separator"]) def set_checkbox(page, selector, checked): @@ -154,14 +165,14 @@ def run_scenario(page, name, overrides, resize): def roundtrip_eligible(settings): """Only plain-format, non-bitswapped 1-bit output is re-importable via the "Paste byte array" box: other draw modes aren't supported by the parser, - and bitswap/removeZeroesCommas mangle the byte stream so it can't be read - back (bitswap reorders bits with no importer to undo it; removeZeroesCommas - drops the separators the parser splits on).""" + bitswap mangles the byte stream with no importer to undo it, and the + parser splits bytes on commas, so a separator without one (e.g. the + empty string used to strip formatting) can't be read back.""" return ( settings["drawMode"] in ("horizontal1bit", "vertical1bit") and settings["outputFormat"] == "plain" and not settings["bitswap"] - and not settings["removeZeroesCommas"] + and "," in settings["separator"] ) @@ -173,7 +184,7 @@ def run_roundtrip(page, output, draw_mode, width, height): page.goto(INDEX_HTML.as_uri()) # window.onload defaults outputFormat to "arduino"; force it back to plain # to match the format the scenario was exported in. - page.select_option("#outputFormat", "plain") + page.check(f"#{OUTPUT_FORMAT_IDS['plain']}") page.fill("#byte-input", output) page.fill("#text-input-width", str(width)) page.fill("#text-input-height", str(height))