1
0
Files
auto-git-gui/settings.html
Victor Giers ecd043d94c auto-git:
[change] index.html
 [change] main.js
 [change] preload.js
 [change] renderer.js
 [change] settings.html
2025-05-24 08:46:46 +02:00

158 lines
4.6 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Einstellungen</title>
<style>
html, body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden; /* keine Scrollbars */
display: flex;
align-items: center; /* vertikal zentrieren */
justify-content: center; /* horizontal zentrieren */
background: rgba(0,0,0,0.1);/* halbtransparenter Untergrund */
font-family: sans-serif;
-webkit-user-select: none;
user-select: none;
}
.dialog {
border: 2px solid #fbcfe8;
border-radius: 8px;
padding: 1rem;
width: 100%; /* 90% der Fensterbreite */
height: 100%;
box-sizing: border-box;
background: white;
position: relative;
}
.header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 1rem;
}
.header h1 {
font-size: 1.25rem;
margin: 0;
}
.close-btn {
background: transparent;
border: none;
font-size: 1.25rem;
cursor: pointer;
color: #9f1239;
}
.options {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.option {
display: flex;
align-items: center;
}
.option input[type="checkbox"] {
margin-left: 1.5rem;
margin-right: 0.5rem;
}
.buttons {
margin-top: 1rem;
display: flex;
justify-content: flex-end;
gap: 0.5rem;
}
button {
padding: 0.4rem 0.8rem;
border-radius: 4px;
border: 1px solid #ccc;
background: white;
cursor: pointer;
}
button:hover { background: #f3f4f6; }
</style>
<script>
window.addEventListener('DOMContentLoaded', async () => {
// Elemente holen
const cbSky = document.getElementById('skymode');
const cbSkip = document.getElementById('skipPrompt');
const thresholdInput = document.getElementById('intelligentCommitThresholdInput');
const ok = document.getElementById('okBtn');
const cancel = document.getElementById('cancelBtn');
const close = document.getElementById('closeBtn');
// Initialwerte parallel laden
const [initialSky, initialSkip, initialThreshold] = await Promise.all([
window.settingsAPI.getSkyMode(),
window.settingsAPI.getSkipPrompt(),
window.electronAPI.getIntelligentCommitThreshold()
]);
// Inputs setzen
cbSky.checked = initialSky;
cbSkip.checked = initialSkip;
thresholdInput.value = initialThreshold;
// **Vorschau**: Sky-Mode sofort übernehmen
cbSky.addEventListener('change', async () => {
await window.settingsAPI.setSkyMode(cbSky.checked);
});
// Threshold live speichern + clamp
thresholdInput.addEventListener('blur', async () => {
let v = parseInt(thresholdInput.value, 100);
if (isNaN(v)) v = initialThreshold; // wenn komplett leer gelassen
if (v < 1) v = 1;
if (v > 1000) v = 1000;
thresholdInput.value = v;
await window.settingsAPI.setIntelligentCommitThreshold(v);
});
// OK: alles final speichern
ok.addEventListener('click', async () => {
await window.settingsAPI.setSkipPrompt(cbSkip.checked);
// SkyMode haben wir ja schon beim Change gesetzt
window.close();
});
// Cancel / Close: SkyMode zurücksetzen, dann schließen
const rollback = async () => {
await window.settingsAPI.setSkyMode(initialSky);
window.close();
};
cancel.addEventListener('click', rollback);
close.addEventListener('click', rollback);
});
</script>
</head>
<body>
<div class="dialog">
<div class="header">
<h1>Settings</h1>
<button class="close-btn" id="closeBtn"></button>
</div>
<div class="options">
<label class="option">
<input type="checkbox" id="skymode" />
Sky Mode
</label>
<label class="block mb-2 font-semibold">
Intelligent commit after
<input type="number" id="intelligentCommitThresholdInput" min="1" max="1000" value="10" step="1" class="border rounded px-2 py-1 w-20 mx-1">
lines of code changed
</label>
<label class="option">
<input type="checkbox" id="skipPrompt" />
Skip prompt asking to remove .git folder if it has only one commit and no changes
</label>
<!-- Weitere Optionen in Zukunft hier hinzufügen -->
</div>
<div class="buttons">
<button id="cancelBtn">Cancel</button>
<button id="okBtn">OK</button>
</div>
</div>
</body>
</html>