Joseph B. McQueen
e604c7e9c9
Extends the single-Novi codebase into a multi-bot mass-messenger where each bot has its own token, avatar, label, and per-user authorization. - Secrets moved out of config.json: per-bot tokens in gitignored config/botTokens.json (with enabled flag), service-account OAuth in gitignored config/token.json (rewritten by refresh cron), integration and Google keys in .env. - Single Webex integration handles OAuth for all bots via a per-app redirect URI derived from OAUTH_CALLBACK_URL_TEMPLATE. - New requireBot middleware and getBotConfig helper reject requests for unknown or disabled bots at the /CollabCentral/:app boundary. - New /info endpoint plus dynamic frontend loading (sendMessage, monitorJobs) so pages self-describe per bot, including bot avatar fetched from Webex /people/me at startup. - Job draft state keyed by cookieId + appName so each bot has its own building queue; job list/detail endpoints filter by appName so users only see jobs from bots they are authorized on. - New jobDetail page for a readable per-job view; completed jobs are retained for 30 days by the cleanup cron. - Completion adaptive cards use per-bot avatar and label. - Miscellaneous fixes: off-by-two in the send loop, removed three dead send/process variants, added defensive init for jobs.* on load, dropped the deprecated crypto npm shim, and cleaned up stray logger labels and typos. Co-authored-by: Cursor <cursoragent@cursor.com>
308 lines
No EOL
8 KiB
HTML
308 lines
No EOL
8 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<title>CollabCentral</title>
|
|
<link id="appName" rel="icon" type="image/x-icon" style="border-radius: 50%;" href="favicon.ico">
|
|
<script>
|
|
let cookie = document.cookie;
|
|
if (cookie) {
|
|
} else {
|
|
window.location.href = "index.html";
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
input {
|
|
width: 60%;
|
|
padding: 12px 20px;
|
|
margin: 8px 0;
|
|
margin-bottom: 10px;
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.form-field input {
|
|
border: 1px solid #87929D;
|
|
border-radius: 4px;
|
|
padding: 10px;
|
|
width: 75%;
|
|
}
|
|
|
|
.form-field label {
|
|
display: block;
|
|
font-size: 13px;
|
|
}
|
|
|
|
label {
|
|
margin-top: 10px;
|
|
display: inline-block;
|
|
}
|
|
|
|
body {
|
|
background-color: #FFFFFF;
|
|
color: #2F3941;
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
|
|
font-size: 15px;
|
|
line-height: 1.5;
|
|
-webkit-font-smoothing: antialiased;
|
|
padding: 10px;
|
|
|
|
}
|
|
|
|
.header {
|
|
display: block;
|
|
background-color: tan;
|
|
width: 75%;
|
|
height: auto;
|
|
}
|
|
|
|
form {
|
|
display: block;
|
|
margin-top: 0em;
|
|
}
|
|
|
|
|
|
#file-ip-1-preview {
|
|
width: auto;
|
|
height: auto;
|
|
padding: 10px;
|
|
}
|
|
|
|
|
|
|
|
|
|
.groups {
|
|
width: 1000px;
|
|
height: auto;
|
|
}
|
|
|
|
#my-text-area {
|
|
height: 250px;
|
|
width: 75%;
|
|
}
|
|
|
|
.EasyMDEContainer {
|
|
display: block;
|
|
width: 75%;
|
|
border: 1px solid #87929D;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.submit {
|
|
width: 75%;
|
|
height: auto;
|
|
margin: 10px;
|
|
|
|
}
|
|
|
|
.modal {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
gap: 0.4rem;
|
|
width: 450px;
|
|
padding: 1.3rem;
|
|
min-height: 250px;
|
|
position: absolute;
|
|
top: 20%;
|
|
background-color: white;
|
|
border: 1px solid #ddd;
|
|
border-radius: 15px;
|
|
z-index: 2;
|
|
|
|
}
|
|
|
|
.modal .flex {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.modal input {
|
|
padding: 0.7rem 1rem;
|
|
border: 1px solid #ddd;
|
|
border-radius: 5px;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.modal p {
|
|
font-size: 0.9rem;
|
|
color: #777;
|
|
margin: 0.4rem 0 0.2rem;
|
|
}
|
|
|
|
.submit button {
|
|
display: inline-block;
|
|
padding: 0.8rem 1.4rem;
|
|
font-weight: 700;
|
|
background-color: black;
|
|
color: white;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
font-size: 1em;
|
|
}
|
|
|
|
.btn {
|
|
display: inline-block;
|
|
padding: 0.8rem 1.4rem;
|
|
font-weight: 700;
|
|
background-color: black;
|
|
color: white;
|
|
border-radius: 5px;
|
|
text-align: center;
|
|
font-size: 1em;
|
|
}
|
|
|
|
.btn-open {
|
|
position: absolute;
|
|
bottom: 150px;
|
|
}
|
|
|
|
.btn-close {
|
|
transform: translate(10px, -20px);
|
|
padding: 0.5rem 0.7rem;
|
|
background: #eee;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.overlay {
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.5);
|
|
backdrop-filter: blur(3px);
|
|
z-index: 1;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
.name {
|
|
display: block;
|
|
text-align: right;
|
|
align-content: right;
|
|
}
|
|
|
|
#appInfo {
|
|
display: flex;
|
|
text-align: center;
|
|
align-content: center;
|
|
|
|
}
|
|
|
|
#multi_option {
|
|
max-width: 100%;
|
|
width: 350px;
|
|
}
|
|
|
|
vscomp-toggle-button {
|
|
padding: 10px 30px 10px 10px;
|
|
border-radius: 5px;
|
|
}
|
|
</style>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.css">
|
|
<link rel="stylesheet" href="js/virtual-select.min.css" />
|
|
|
|
<script src="js/virtual-select.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/easymde/dist/easymde.min.js"></script>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
|
|
|
|
<div class="header">
|
|
<div id="appInfo">
|
|
<img id="appIcon" style="border-radius: 50%; padding: 10pt;">
|
|
<div id="appLabel" style="font-size: 40pt;margin: auto;"></div>
|
|
</div>
|
|
<div style="text-align: center;"><a id="jobLink" href=''>Monitor Jobs</a></div>
|
|
<div id="name" style="text-align: right;"></div>
|
|
</div>
|
|
|
|
|
|
<div id="unauthorizedPanel" class="hidden" style="padding: 2em; max-width: 600px; margin: 2em auto; text-align: center; border: 1px solid #ddd; border-radius: 8px;">
|
|
<h2>You don't have access to this bot</h2>
|
|
<p>Your account isn't on the authorized list for this bot. If you believe this is a mistake, contact the bot's administrator.</p>
|
|
</div>
|
|
|
|
<div id="formPanel" class="form-input hidden">
|
|
<form action="" id="sendMessage" enctype="multipart/form-data">
|
|
<div class="form-field">
|
|
|
|
<img id="file-ip-1-preview">
|
|
<label for="uploadImage">Upload Image</label>
|
|
<input type="file" id="uploadImage" accept="image/*" name="uploadImage"
|
|
onchange="showImagePreview(event);">
|
|
</div>
|
|
<label for="my-text-area">Message</label>
|
|
<textarea id="my-text-area"></textarea>
|
|
|
|
<div class="form-field">
|
|
<div class="groups">
|
|
<label for="favGroups">Favorite Groups:</label>
|
|
<select id="favGroups" multiple name="favGroups" placeholder="Favorite Groups"
|
|
data-silent-initial-value-set="false">
|
|
</select>
|
|
</div>
|
|
<div class="groups">
|
|
<label>New Groups:</label>
|
|
<select id="newGroups" multiple name="newGroups" placeholder="New Groups"
|
|
data-silent-initial-value-set="false">
|
|
</select>
|
|
</div>
|
|
|
|
<div class="people">
|
|
<label for="uploadCSV">Upload CSV:</label>
|
|
<input type="file" id="uploadCSV" name="uploadCSV" accept="text/csv">
|
|
</div>
|
|
</div>
|
|
<div class="form-field">
|
|
<div class="when">
|
|
<label for="meeting-time">Schedule for:</label>
|
|
<input type="datetime-local" id="scheduledFor" name="scheduledFor" />
|
|
</div>
|
|
</div>
|
|
<div class="submit">
|
|
<button id="submit" type="submit">Submit</button>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
|
|
<section class="modal hidden">
|
|
<div class="flex">
|
|
<button class="btn-close" onclick="continueEditing()">X</button>
|
|
</div>
|
|
<div>
|
|
<h3>Ready to send?</h3>
|
|
<p id="modalMessage">
|
|
This message will be sent to XX people.<br>
|
|
Ready to send?
|
|
</p>
|
|
</div>
|
|
|
|
<button class="btn" onclick="continueEditing()">Continue Editing</button>
|
|
<button class="btn" onclick="submit()">Submit</button>
|
|
|
|
</section>
|
|
|
|
<div class="overlay hidden"></div>
|
|
|
|
</div>
|
|
<script src="sendMessage.js"></script>
|
|
|
|
|
|
</body>
|
|
|
|
</html> |