Skip to content
This repository has been archived by the owner on Aug 2, 2024. It is now read-only.

Commit

Permalink
change config layout
Browse files Browse the repository at this point in the history
  • Loading branch information
XOTlC committed Dec 14, 2023
1 parent d348fcc commit 0e22949
Show file tree
Hide file tree
Showing 8 changed files with 148 additions and 158 deletions.
10 changes: 5 additions & 5 deletions src/components/Background.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,14 @@ import styles from "@styles";
export default function Background() {
const { config } = useContext(ConfigContext);

document.documentElement.style.setProperty("--background-color", config.theme.backgroundColor || "#2f2f2f");
document.documentElement.style.setProperty("--primary-color", config.theme.primaryColor || "#1f1f1f");
document.documentElement.style.setProperty("--secondary-color", config.theme.secondaryColor || "#3f3f3f");
document.documentElement.style.setProperty("--accent-color", config.theme.accentColor || "#ffffff");
document.documentElement.style.setProperty("--background-color", config.theme_background_color || "#2f2f2f");
document.documentElement.style.setProperty("--primary-color", config.theme_primary_color || "#1f1f1f");
document.documentElement.style.setProperty("--secondary-color", config.theme_secondary_color || "#3f3f3f");
document.documentElement.style.setProperty("--accent-color", config.theme_accent_color || "#ffffff");

return (
<div className={styles.all.background}>
{config.theme.backgroundBlooks && <div className={styles.all.blooksBackground} />}
{config.theme_background_blooks && <div className={styles.all.blooksBackground} />}
</div>
)
}
36 changes: 18 additions & 18 deletions src/pages/Colors/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,26 +28,26 @@ export default function Theme() {

<Input onMouseDown={() => openModal("background")} icon="fas fa-palette" placeholder="Background Color" help={<>
The background color of elements.
</>} value={config.theme.backgroundColor || ""} />
</>} value={config.theme_background_color || ""} />

<Checkbox checked={config.theme.backgroundBlooks} onClick={() => {
config.theme.backgroundBlooks = !config.theme.backgroundBlooks;
<Checkbox checked={config.theme_background_blooks} onClick={() => {
config.theme_background_blooks = !config.theme_background_blooks;
setConfig({ ...config });
}}>
Background Blooks
</Checkbox>

<Input onMouseDown={() => openModal("primary")} icon="fas fa-palette" placeholder="Primary Color" help={<>
The primary color of elements (mainly used for containers)
</>} value={config.theme.primaryColor || ""} />
</>} value={config.theme_primary_color || ""} />

<Input onMouseDown={() => openModal("secondary")} icon="fas fa-palette" placeholder="Secondary Color" help={<>
The secondary color of elements (mainly used for hover effects)
</>} value={config.theme.secondaryColor || ""} />
</>} value={config.theme_secondary_color || ""} />

<Input onMouseDown={() => openModal("accent")} icon="fas fa-palette" placeholder="Accent Color" help={<>
The accent color on all pages (used for text)
</>} value={config.theme.accentColor || ""} />
</>} value={config.theme_accent_color || ""} />

</Container>

Expand All @@ -62,23 +62,23 @@ export default function Theme() {
}, {
text: "Reset",
onClick: () => {
if (modal === "background") config.theme.backgroundColor = null;
else if (modal === "primary") config.theme.primaryColor = null;
else if (modal === "secondary") config.theme.secondaryColor = null;
else if (modal === "accent") config.theme.accentColor = null;
if (modal === "background") config.theme_background_color = null;
else if (modal === "primary") config.theme_primary_color = null;
else if (modal === "secondary") config.theme_secondary_color = null;
else if (modal === "accent") config.theme_accent_color = null;
setConfig({ ...config });
}
}]}>
<HexColorPicker color={
modal === "background" ? config.theme.backgroundColor || "#2f2f2f" :
modal === "primary" ? config.theme.primaryColor || "#1f1f1f" :
modal === "secondary" ? config.theme.secondaryColor || "#3f3f3f" :
modal === "accent" ? config.theme.accentColor || "#ffffff" : null
modal === "background" ? config.theme_background_color || "#2f2f2f" :
modal === "primary" ? config.theme_primary_color || "#1f1f1f" :
modal === "secondary" ? config.theme_secondary_color || "#3f3f3f" :
modal === "accent" ? config.theme_accent_color || "#ffffff" : null
} onChange={color => {
if (modal === "background") config.theme.backgroundColor = color;
else if (modal === "primary") config.theme.primaryColor = color;
else if (modal === "secondary") config.theme.secondaryColor = color;
else if (modal === "accent") config.theme.accentColor = color;
if (modal === "background") config.theme_background_color = color;
else if (modal === "primary") config.theme_primary_color = color;
else if (modal === "secondary") config.theme_secondary_color = color;
else if (modal === "accent") config.theme_accent_color = color;
setConfig({ ...config });
}} />
</Modal>}
Expand Down
38 changes: 19 additions & 19 deletions src/pages/Database/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,9 @@ import Checkbox from "@components/Checkbox";
export default function Information() {
const { config, setConfig } = useContext(ConfigContext);

const values = [config.database.type];
if (!["", "sqlite"].includes(config.database.type)) values.push(config.database.username);
if (config.database.password.enabled) values.push(config.database.password.value);
const values = [config.database_type];
if (!["", "sqlite"].includes(config.database_type)) values.push(config.database_username);
if (config.database_password_enabled) values.push(config.database_password);

config.canGoForward = values.every(value => value !== "");
setConfig(config);
Expand Down Expand Up @@ -45,53 +45,53 @@ export default function Information() {
}, {
value: "oracle",
text: "Oracle Database"
}]} value={config.database.type} onChange={(e) => {
config.database.type = e.target.value;
}]} value={config.database_type} onChange={(e) => {
config.database_type = e.target.value;
setConfig({ ...config });
}} />

{!["", "sqlite"].includes(config.database.type) && <>
{!["", "sqlite"].includes(config.database_type) && <>
<Input icon="fas fa-cloud" placeholder="Database Host" help={<>
The host of the database. If you don't specify a host, <code>localhost</code> will be used.
</>} onChange={(e) => {
config.database.host = e.target.value;
config.database_host = e.target.value;
setConfig({ ...config });
}} value={config.database.host || ""} />
}} value={config.database_host || ""} />

<Input icon="fas fa-colon" placeholder="Database Port" help={<>
The port of the database. If you don't specify a port, the default port for the database will be used.
</>} onChange={(e) => {
config.database.port = e.target.value;
config.database_port = e.target.value;
setConfig({ ...config });
}} value={config.database.port || ""} />
}} value={config.database_port || ""} />

<Input icon="fas fa-signature" placeholder="Database Name" help={<>
The name of the database. If you don't specify a name, <code>blacket</code> will be used.
</>} onChange={(e) => {
config.database.name = e.target.value;
config.database_name = e.target.value;
setConfig({ ...config });
}} value={config.database.name || ""} />
}} value={config.database_name || ""} />

<Input icon="fas fa-user" placeholder="Database Username (*)" help={<>
The username of the user to use for the database. This user must have access to the database.
</>} onChange={(e) => {
config.database.username = e.target.value;
config.database_username = e.target.value;
setConfig({ ...config });
}} value={config.database.username || ""} />
}} value={config.database_username || ""} />

<Checkbox checked={config.database.password.enabled} onClick={() => {
config.database.password.enabled = !config.database.password.enabled;
<Checkbox checked={config.database_password_enabled} onClick={() => {
config.database_password_enabled = !config.database_password_enabled;
setConfig({ ...config });
}}>
Use Database Password
</Checkbox>

{config.database.password.enabled && <Input icon="fas fa-key" placeholder="Database Password (*)" help={<>
{config.database_password_enabled && <Input icon="fas fa-key" placeholder="Database Password (*)" help={<>
The password of the user.
</>} onChange={(e) => {
config.database.password.value = e.target.value;
config.database_password = e.target.value;
setConfig({ ...config });
}} type="password" value={config.database.password.value || ""} />}
}} type="password" value={config.database_password || ""} />}
</>}

</Container>
Expand Down
62 changes: 31 additions & 31 deletions src/pages/Finalize/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,69 +26,69 @@ export default function Finalize() {
<details style={{ marginTop: "20px" }}>
<summary>Information</summary>
<ul style={{ textAlign: "left" }}>
<li><b>Server Name:</b> {config.information.name}</li>
<li><b>Welcome Message:</b> {config.information.welcome}</li>
<li><b>Welcome Description:</b> {config.information.description}</li>
<li><b>Pronunciation Enabled:</b> {config.information.pronunciation.enabled ? "Yes" : "No"}</li>
<li><b>Server Name:</b> {config.information_name}</li>
<li><b>Welcome Message:</b> {config.information_welcome}</li>
<li><b>Welcome Description:</b> {config.information_description}</li>
<li><b>Pronunciation Enabled:</b> {config.information_pronunciation_enabled ? "Yes" : "No"}</li>
{
config.information.pronunciation.enabled && <li><b>Pronunciation Text:</b> {config.information.pronunciation.text}</li>
config.information_pronunciation_enabled && <li><b>Pronunciation Text:</b> {config.information_pronunciation}</li>
}
</ul>
</details>
<details>
<summary>Theme</summary>
<ul style={{ textAlign: "left" }}>
<li><b>Background Color:</b> {config.theme.backgroundColor || "Default"}</li>
<li><b>Background Blooks Enabled:</b> {config.theme.backgroundBlooks ? "Yes" : "No"}</li>
<li><b>Primary Color:</b> {config.theme.primaryColor || "Default"}</li>
<li><b>Secondary Color:</b> {config.theme.secondaryColor || "Default"}</li>
<li><b>Accent Color:</b> {config.theme.accentColor || "Default"}</li>
<li><b>Background Color:</b> {config.theme_background_color || "Default"}</li>
<li><b>Background Blooks Enabled:</b> {config.theme_background_blooks ? "Yes" : "No"}</li>
<li><b>Primary Color:</b> {config.theme_primary_color || "Default"}</li>
<li><b>Secondary Color:</b> {config.theme_secondary_color || "Default"}</li>
<li><b>Accent Color:</b> {config.theme_accent_color || "Default"}</li>
</ul>
</details>
<details>
<summary>Database</summary>
<ul style={{ textAlign: "left" }}>
<li><b>Database Type:</b> {config.database.type}</li>
{!["", "sqlite"].includes(config.database.type) && <>
<li><b>Database Host:</b> {config.database.host}</li>
<li><b>Database Port:</b> {config.database.port}</li>
<li><b>Database Name:</b> {config.database.name}</li>
<li><b>Database Username:</b> {config.database.username}</li>
<li><b>Database Password Enabled:</b> {config.database.password.enabled ? "Yes" : "No"}</li>
<li><b>Database Type:</b> {config.database_type}</li>
{!["", "sqlite"].includes(config.database_type) && <>
<li><b>Database Host:</b> {config.database_host}</li>
<li><b>Database Port:</b> {config.database_port}</li>
<li><b>Database Name:</b> {config.database_name}</li>
<li><b>Database Username:</b> {config.database_username}</li>
<li><b>Database Password Enabled:</b> {config.database_password_enabled ? "Yes" : "No"}</li>
{
config.database.password.enabled && <li><b>Database Password:</b> {config.database.password.value.split("").map(() => "*").join("")}</li>
config.database_password_enabled && <li><b>Database Password:</b> {config.database_password.split("").map(() => "*").join("")}</li>
}
</>}
</ul>
</details>
<details>
<summary>PayPal</summary>
<ul style={{ textAlign: "left" }}>
<li><b>PayPal Enabled:</b> {config.paypal.enabled ? "Yes" : "No"}</li>
<li><b>PayPal Enabled:</b> {config.paypal_enabled ? "Yes" : "No"}</li>
{
config.paypal.enabled && <>
<li><b>PayPal Mode:</b> {config.paypal.mode}</li>
<li><b>PayPal Client ID:</b> {config.paypal.clientID}</li>
<li><b>PayPal Client Secret:</b> {config.paypal.clientSecret.split("").map(() => "*").join("")}</li>
config.paypal_enabled && <>
<li><b>PayPal Mode:</b> {config.paypal_mode}</li>
<li><b>PayPal Client ID:</b> {config.paypal_client_id}</li>
<li><b>PayPal Client Secret:</b> {config.paypal_client_secret.split("").map(() => "*").join("")}</li>
</>
}
</ul>
</details>
<details>
<summary>Miscellaneous</summary>
<ul style={{ textAlign: "left" }}>
<li><b>Server Port:</b> {config.miscellaneous.server_port}</li>
<li><b>Server Port:</b> {config.miscellaneous_server_port}</li>
{
config.miscellaneous.discord_invite !== "" && <li><b>Discord Invite:</b> {config.miscellaneous.discord_invite}</li>
config.miscellaneous_discord_invite !== "" && <li><b>Discord Invite:</b> {config.miscellaneous_discord_invite}</li>
}
<li><b>Verbose Logging Enabled:</b> {config.miscellaneous.verbose_logging ? "Yes" : "No"}</li>
<li><b>Block Proxies Enabled:</b> {config.miscellaneous.block_proxies ? "Yes" : "No"}</li>
<li><b>Allow Multiple Accounts Enabled:</b> {config.miscellaneous.allow_multiple_accounts ? "Yes" : "No"}</li>
<li><b>Backup Enabled:</b> {config.miscellaneous.backup_enabled ? "Yes" : "No"}</li>
<li><b>Verbose Logging Enabled:</b> {config.miscellaneous_verbose_logging ? "Yes" : "No"}</li>
<li><b>Block Proxies Enabled:</b> {config.miscellaneous_block_proxies ? "Yes" : "No"}</li>
<li><b>Allow Multiple Accounts Enabled:</b> {config.miscellaneous_allow_multiple_accounts ? "Yes" : "No"}</li>
<li><b>Backup Enabled:</b> {config.miscellaneous_backup_enabled ? "Yes" : "No"}</li>
{
config.miscellaneous.backup_enabled && <li><b>Backup Interval:</b> {config.miscellaneous.backup_interval}</li>
config.miscellaneous_backup_enabled && <li><b>Backup Interval:</b> {config.miscellaneous_backup_interval}</li>
}
<li><b>Level Difficulty:</b> {config.miscellaneous.level_difficulty}</li>
<li><b>Level Difficulty:</b> {config.miscellaneous_level_difficulty}</li>
</ul>
</details>

Expand Down
Loading

0 comments on commit 0e22949

Please sign in to comment.