Improve logic

This commit is contained in:
Lily Rose 2024-04-26 13:51:33 +10:00
parent 38125e5a3e
commit c18078c43f
1 changed files with 21 additions and 20 deletions

View File

@ -345,7 +345,7 @@
lightBlue: "#b8d7e2", lightBlue: "#b8d7e2",
lightBlurple: "#b5c5e2", lightBlurple: "#b5c5e2",
} }
const colorSchemes = { const colorSchemes = new Map(Object.entries({
light: { light: {
textPrimary: colors.faffPink, textPrimary: colors.faffPink,
textShadow: colors.unnamedBlue, textShadow: colors.unnamedBlue,
@ -376,7 +376,7 @@
background: colors.lightBlue, background: colors.lightBlue,
backgroundLucy: colors.lightBlurple, backgroundLucy: colors.lightBlurple,
} }
} }))
const form = document.getElementById("settings") const form = document.getElementById("settings")
const colorSchemeInputs = document.getElementById("colorSchemeInputs") const colorSchemeInputs = document.getElementById("colorSchemeInputs")
@ -399,35 +399,36 @@
const patternLucyRotation = +formData.get("patternLucyRotationInput") const patternLucyRotation = +formData.get("patternLucyRotationInput")
const winkingLucyLEnabled = !!formData.get("winkingLucyLEnabledInput") const winkingLucyLEnabled = !!formData.get("winkingLucyLEnabledInput")
const winkingLucyREnabled = !!formData.get("winkingLucyREnabledInput") const winkingLucyREnabled = !!formData.get("winkingLucyREnabledInput")
const colorSchemeName = formData.get("colorSchemeInput") const colorSchemeName = `${formData.get("colorSchemeInput")}`
const isCustomColorScheme = colorSchemeName === "custom" const isCustomColorScheme = colorSchemeName === "custom"
if (isCustomColorScheme) colorSchemeInputs.classList.remove("hidden")
else colorSchemeInputs.classList.add("hidden")
const colorScheme = isCustomColorScheme ? { const colorScheme = isCustomColorScheme ? {
textPrimary: formData.get("textPrimaryColorInput"), textPrimary: `${formData.get("textPrimaryColorInput")}`,
textShadow: formData.get("textShadowColorInput"), textShadow: `${formData.get("textShadowColorInput")}`,
lucy: formData.get("lucyColorInput"), lucy: `${formData.get("lucyColorInput")}`,
lucyFace: formData.get("lucyFaceColorInput"), lucyFace: `${formData.get("lucyFaceColorInput")}`,
lambda: formData.get("lambdaColorInput"), lambda: `${formData.get("lambdaColorInput")}`,
outline: formData.get("outlineColorInput"), outline: `${formData.get("outlineColorInput")}`,
background: formData.get("backgroundColorInput"), background: `${formData.get("backgroundColorInput")}`,
backgroundLucy: formData.get("backgroundLucyColorInput"), backgroundLucy: `${formData.get("backgroundLucyColorInput")}`,
} : colorSchemes[colorSchemeName] } : colorSchemes.get(colorSchemeName)
const vignetteEnabled = !!formData.get("vignetteEnabledInput") const vignetteEnabled = !!formData.get("vignetteEnabledInput")
if (vignetteEnabled) vignetteInputs.classList.remove("hidden") const vignetteColor = `${formData.get("vignetteColorInput")}`
else vignetteInputs.classList.add("hidden")
const vignetteColor = vignetteEnabled ? formData.get("vignetteColorInput") : undefined
const vignetteStart = +formData.get("vignetteStartInput") const vignetteStart = +formData.get("vignetteStartInput")
const vignetteEnd = +formData.get("vignetteEndInput") const vignetteEnd = +formData.get("vignetteEndInput")
const vignetteBlendMode = formData.get("vignetteBlendModeInput") const vignetteBlendMode = `${formData.get("vignetteBlendModeInput")}`
const svg = createSVG({ width, height, logoScale, logoRotation, patternScale, patternSpacing, patternRotation, patternLucyRotation, winkingLucyLEnabled, winkingLucyREnabled, colorScheme, vignetteEnabled, vignetteColor, vignetteStart, vignetteEnd, vignetteBlendMode }) const props = { width, height, logoScale, logoRotation, patternScale, patternSpacing, patternRotation, patternLucyRotation, winkingLucyLEnabled, winkingLucyREnabled, colorScheme, vignetteEnabled, vignetteColor, vignetteStart, vignetteEnd, vignetteBlendMode }
return { width, height, svg } const svg = createSVG(props)
return { ...props, colorSchemeName, isCustomColorScheme, svg }
} }
let curData = getFormData() let curData = getFormData()
const updatePreview = () => { const updatePreview = () => {
curData = getFormData() curData = getFormData()
if (curData.isCustomColorScheme) colorSchemeInputs.classList.remove("hidden")
else colorSchemeInputs.classList.add("hidden")
if (curData.vignetteEnabled) vignetteInputs.classList.remove("hidden")
else vignetteInputs.classList.add("hidden")
preview.innerHTML = curData.svg preview.innerHTML = curData.svg
} }
updatePreview() updatePreview()