84 lines
3.3 KiB
HTML
84 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Andela Notifier - Settings</title>
|
|
<style>
|
|
body { width: 400px; padding: 20px; font-family: Arial, sans-serif; }
|
|
h2 { color: #333; margin-bottom: 20px; border-bottom: 2px solid #0066cc; padding-bottom: 10px; }
|
|
.form-group { margin-bottom: 15px; }
|
|
label { display: block; margin-bottom: 5px; font-weight: bold; color: #555; }
|
|
input[type="text"], input[type="email"], input[type="password"] {
|
|
width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px;
|
|
box-sizing: border-box; font-size: 14px;
|
|
}
|
|
input:focus { outline: none; border-color: #0066cc; }
|
|
.hint { font-size: 12px; color: #888; margin-top: 3px; }
|
|
button {
|
|
width: 100%; padding: 12px; background: #0066cc; color: white;
|
|
border: none; border-radius: 4px; cursor: pointer; font-size: 16px; margin-top: 10px;
|
|
}
|
|
button:hover { background: #0055aa; }
|
|
.status { margin-top: 15px; padding: 10px; border-radius: 4px; text-align: center; }
|
|
.status.success { background: #d4edda; color: #155724; }
|
|
.status.error { background: #f8d7da; color: #721c24; }
|
|
.back-link { display: block; text-align: center; margin-top: 15px; color: #0066cc; text-decoration: none; }
|
|
.back-link:hover { text-decoration: underline; }
|
|
.warning {
|
|
background: #fff3cd; border: 1px solid #ffc107; padding: 10px; border-radius: 4px;
|
|
margin-bottom: 15px; font-size: 13px; color: #856404;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h2>Settings</h2>
|
|
|
|
<div class="warning">
|
|
Your credentials are stored locally in your browser and never sent anywhere except to your own Apps Script.
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="appsScriptUrl">Apps Script URL</label>
|
|
<input type="text" id="appsScriptUrl" placeholder="https://script.google.com/macros/s/.../exec">
|
|
<div class="hint">Your deployed Apps Script web app URL</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="appsScriptKey">Secret Key</label>
|
|
<input type="password" id="appsScriptKey" placeholder="Your secret key">
|
|
<div class="hint">Must match SECRET_KEY in your Apps Script</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="loginEmail">Login Email</label>
|
|
<input type="email" id="loginEmail" placeholder="you@outlook.com">
|
|
<div class="hint">The email Andela actually has on file — this is typed into the Andela login form (not your Gmail forwarding address)</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="ntfyServer">ntfy Server URL</label>
|
|
<input type="text" id="ntfyServer" placeholder="https://notify.tstitagency.com">
|
|
<div class="hint">Your self-hosted ntfy server (leave default if unsure)</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="ntfyTopic">ntfy Topic</label>
|
|
<input type="text" id="ntfyTopic" placeholder="andela-jobs">
|
|
<div class="hint">Topic to publish job alerts to. Leave empty to disable phone push.</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="ntfyToken">ntfy Access Token (optional)</label>
|
|
<input type="password" id="ntfyToken" placeholder="tk_...">
|
|
<div class="hint">Only needed if your ntfy server requires authentication</div>
|
|
</div>
|
|
|
|
<button id="saveBtn">Save Settings</button>
|
|
|
|
<div id="status" class="status" style="display: none;"></div>
|
|
|
|
<a href="popup.html" class="back-link">← Back to Jobs</a>
|
|
|
|
<script src="settings.js"></script>
|
|
</body>
|
|
</html>
|