coffeeinabit 0.0.11 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/public/dashboard.html +35 -82
- package/public/images/favicon.png +0 -0
- package/public/images/favicon.svg +8 -0
- package/public/login.html +15 -52
- package/public/styles.css +263 -123
- package/tools/get_messages.js +120 -227
- package/tools/human_typing.js +37 -2
- package/tools/send_messages.js +194 -28
package/package.json
CHANGED
package/public/dashboard.html
CHANGED
|
@@ -4,15 +4,16 @@
|
|
|
4
4
|
<meta charset="UTF-8">
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
6
|
<title>CoffeeInABit - Dashboard</title>
|
|
7
|
+
<link rel="icon" type="image/png" href="/images/favicon.png">
|
|
7
8
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
8
9
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css" rel="stylesheet">
|
|
9
10
|
<link href="/styles.css" rel="stylesheet">
|
|
10
11
|
</head>
|
|
11
|
-
<body
|
|
12
|
-
<nav class="navbar navbar-expand-lg navbar
|
|
12
|
+
<body>
|
|
13
|
+
<nav class="navbar navbar-expand-lg glass-navbar">
|
|
13
14
|
<div class="container-fluid">
|
|
14
15
|
<a class="navbar-brand fw-bold" href="#">
|
|
15
|
-
<
|
|
16
|
+
<img src="/images/favicon.svg" alt="CoffeeInABit" style="width: 35px; height: 35px; margin-bottom: 7px; vertical-align: middle;">
|
|
16
17
|
CoffeeInABit
|
|
17
18
|
</a>
|
|
18
19
|
<div class="navbar-nav ms-auto">
|
|
@@ -21,24 +22,12 @@
|
|
|
21
22
|
<i class="bi bi-person-circle me-2"></i>
|
|
22
23
|
<span>Profile</span>
|
|
23
24
|
</a>
|
|
24
|
-
<ul class="dropdown-menu dropdown-menu-end" style="min-width: 250px;">
|
|
25
|
+
<ul class="dropdown-menu dropdown-menu-end glass-dropdown" style="min-width: 250px;">
|
|
25
26
|
<li class="px-3 py-2">
|
|
26
27
|
<small class="text-muted d-block mb-1">Signed in as</small>
|
|
27
28
|
<strong id="userEmail" class="d-block text-truncate" style="max-width: 220px;">Loading...</strong>
|
|
28
29
|
</li>
|
|
29
30
|
<li><hr class="dropdown-divider"></li>
|
|
30
|
-
<li class="px-3 py-2">
|
|
31
|
-
<div class="d-flex justify-content-between align-items-center">
|
|
32
|
-
<div class="d-flex align-items-center">
|
|
33
|
-
<i class="bi bi-moon-stars me-2"></i>
|
|
34
|
-
<span>Dark Mode</span>
|
|
35
|
-
</div>
|
|
36
|
-
<div class="form-check form-switch mb-0">
|
|
37
|
-
<input class="form-check-input" type="checkbox" role="switch" id="darkModeToggle" onchange="toggleDarkMode()">
|
|
38
|
-
</div>
|
|
39
|
-
</div>
|
|
40
|
-
</li>
|
|
41
|
-
<li><hr class="dropdown-divider"></li>
|
|
42
31
|
<li class="px-3 py-2">
|
|
43
32
|
<div class="d-flex justify-content-between align-items-center">
|
|
44
33
|
<div class="d-flex align-items-center">
|
|
@@ -64,16 +53,12 @@
|
|
|
64
53
|
<div class="row">
|
|
65
54
|
<div class="col-12">
|
|
66
55
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
67
|
-
<h1 class="h3 mb-0">
|
|
68
|
-
<i class="bi bi-speedometer2 me-2"></i>
|
|
69
|
-
Dashboard
|
|
70
|
-
</h1>
|
|
71
56
|
<div class="d-flex align-items-center gap-3">
|
|
72
|
-
<button id="startAutomationBtn" class="
|
|
57
|
+
<button id="startAutomationBtn" class="glass-button btn-primary" onclick="startAutomation()">
|
|
73
58
|
<i class="bi bi-play-fill me-2"></i>
|
|
74
59
|
Start Automation
|
|
75
60
|
</button>
|
|
76
|
-
<button id="stopAutomationBtn" class="
|
|
61
|
+
<button id="stopAutomationBtn" class="glass-button btn-danger" onclick="stopAutomation()" style="display: none;">
|
|
77
62
|
<i class="bi bi-stop-fill me-2"></i>
|
|
78
63
|
Stop Automation
|
|
79
64
|
</button>
|
|
@@ -83,26 +68,30 @@
|
|
|
83
68
|
<!-- Browser State Container -->
|
|
84
69
|
<div class="row mb-4">
|
|
85
70
|
<div class="col-12">
|
|
86
|
-
<div class="card
|
|
87
|
-
<div class="card-header
|
|
71
|
+
<div class="glass-card">
|
|
72
|
+
<div class="card-header mb-3">
|
|
88
73
|
<h5 class="card-title mb-0">
|
|
89
74
|
<i class="bi bi-browser-chrome me-2"></i>
|
|
90
75
|
Browser State
|
|
91
76
|
</h5>
|
|
92
|
-
<div class="d-flex align-items-center gap-2">
|
|
93
|
-
<div id="automationStatus" class="badge bg-secondary">Idle</div>
|
|
94
|
-
<div id="currentActionBadge" class="badge bg-info" style="display: none;"></div>
|
|
95
|
-
</div>
|
|
96
77
|
</div>
|
|
97
|
-
<div class="
|
|
78
|
+
<div class="mb-3">
|
|
79
|
+
<h6 class="mb-2" style="color: #ffffff; font-weight: 500;">
|
|
80
|
+
Status: <span id="automationStatus" style="font-weight: 400;">Idle</span>
|
|
81
|
+
</h6>
|
|
82
|
+
<h6 class="mb-0" id="currentActionHeader" style="color: #ffffff; font-weight: 500; display: none;">
|
|
83
|
+
Action: <span id="currentActionText" style="font-weight: 400;"></span>
|
|
84
|
+
</h6>
|
|
85
|
+
</div>
|
|
86
|
+
<div>
|
|
98
87
|
<div id="browserStateContainer">
|
|
99
88
|
<div class="text-center text-muted py-4">
|
|
100
|
-
<i class="bi bi-browser-chrome fs-1 d-block mb-3"></i>
|
|
89
|
+
<i class="bi bi-browser-chrome fs-1 d-block mb-3" style="color: rgba(255, 255, 255, 0.7);"></i>
|
|
101
90
|
<p class="mb-0">Click "Start Automation" to launch the browser</p>
|
|
102
91
|
</div>
|
|
103
92
|
</div>
|
|
104
93
|
<div id="screenshotContainer" style="display: none;">
|
|
105
|
-
<button class="btn
|
|
94
|
+
<button class="btn-link text-decoration-none p-0 mb-3 d-flex align-items-center" onclick="toggleBrowserView()" id="browserViewToggle">
|
|
106
95
|
<i class="bi bi-chevron-right me-2" id="browserViewChevron"></i>
|
|
107
96
|
<span>Show live browser view</span>
|
|
108
97
|
</button>
|
|
@@ -122,21 +111,21 @@
|
|
|
122
111
|
|
|
123
112
|
<div class="row">
|
|
124
113
|
<div class="col-12">
|
|
125
|
-
<div class="card
|
|
126
|
-
<div class="card-header
|
|
114
|
+
<div class="glass-card">
|
|
115
|
+
<div class="card-header mb-3">
|
|
127
116
|
<h5 class="card-title mb-0">
|
|
128
117
|
<i class="bi bi-info-circle me-2"></i>
|
|
129
118
|
Account Information
|
|
130
119
|
</h5>
|
|
131
120
|
</div>
|
|
132
|
-
<div
|
|
121
|
+
<div>
|
|
133
122
|
<div class="row">
|
|
134
123
|
<div class="col-md-6">
|
|
135
124
|
<p><strong>Email:</strong> <span id="userEmailInfo">Loading...</span></p>
|
|
136
125
|
<p><strong>User ID:</strong> <span id="userId">Loading...</span></p>
|
|
137
126
|
</div>
|
|
138
127
|
<div class="col-md-6">
|
|
139
|
-
<p><strong>Status:</strong> <span class="badge
|
|
128
|
+
<p><strong>Status:</strong> <span class="glass-badge">Active</span></p>
|
|
140
129
|
<p><strong>Last Login:</strong> <span id="lastLogin">Just now</span></p>
|
|
141
130
|
</div>
|
|
142
131
|
</div>
|
|
@@ -164,31 +153,6 @@
|
|
|
164
153
|
|
|
165
154
|
const socket = io();
|
|
166
155
|
|
|
167
|
-
function initializeDarkMode() {
|
|
168
|
-
const darkModeEnabled = localStorage.getItem('darkMode') === 'true';
|
|
169
|
-
const darkModeToggle = document.getElementById('darkModeToggle');
|
|
170
|
-
|
|
171
|
-
if (darkModeEnabled) {
|
|
172
|
-
document.body.classList.add('dark-mode');
|
|
173
|
-
if (darkModeToggle) {
|
|
174
|
-
darkModeToggle.checked = true;
|
|
175
|
-
}
|
|
176
|
-
}
|
|
177
|
-
}
|
|
178
|
-
|
|
179
|
-
function toggleDarkMode() {
|
|
180
|
-
const darkModeToggle = document.getElementById('darkModeToggle');
|
|
181
|
-
const isDarkMode = darkModeToggle.checked;
|
|
182
|
-
|
|
183
|
-
if (isDarkMode) {
|
|
184
|
-
document.body.classList.add('dark-mode');
|
|
185
|
-
localStorage.setItem('darkMode', 'true');
|
|
186
|
-
} else {
|
|
187
|
-
document.body.classList.remove('dark-mode');
|
|
188
|
-
localStorage.setItem('darkMode', 'false');
|
|
189
|
-
}
|
|
190
|
-
}
|
|
191
|
-
|
|
192
156
|
function initializeKeepBrowser() {
|
|
193
157
|
const keepBrowserEnabled = localStorage.getItem('keepBrowser');
|
|
194
158
|
const keepBrowserToggle = document.getElementById('keepBrowserToggle');
|
|
@@ -415,41 +379,34 @@
|
|
|
415
379
|
switch (status) {
|
|
416
380
|
case 'starting':
|
|
417
381
|
automationStatus.textContent = 'Starting';
|
|
418
|
-
automationStatus.className = 'badge bg-warning';
|
|
419
382
|
startAutomationBtn.style.display = 'none';
|
|
420
|
-
stopAutomationBtn.style.display = 'inline-
|
|
383
|
+
stopAutomationBtn.style.display = 'inline-flex';
|
|
421
384
|
break;
|
|
422
385
|
case 'running':
|
|
423
386
|
automationStatus.textContent = 'Running';
|
|
424
|
-
automationStatus.className = 'badge bg-info';
|
|
425
387
|
break;
|
|
426
388
|
case 'manual_login_needed':
|
|
427
389
|
automationStatus.textContent = 'Manual Login Required';
|
|
428
|
-
automationStatus.className = 'badge bg-warning';
|
|
429
390
|
updateBrowserState('Opening browser for manual login...', 'https://www.linkedin.com/login');
|
|
430
391
|
showAlert('warning', 'Manual login needed. Browser will open for you to login.');
|
|
431
392
|
break;
|
|
432
393
|
case 'waiting_for_login':
|
|
433
394
|
automationStatus.textContent = 'Waiting for Login';
|
|
434
|
-
automationStatus.className = 'badge bg-warning';
|
|
435
395
|
updateBrowserState('Waiting for LinkedIn login...', 'https://www.linkedin.com/login');
|
|
436
396
|
break;
|
|
437
397
|
case 'switching_to_headless':
|
|
438
398
|
automationStatus.textContent = 'Switching to Headless';
|
|
439
|
-
automationStatus.className = 'badge bg-info';
|
|
440
399
|
updateBrowserState('Switching browser to headless mode...', 'https://www.linkedin.com/feed');
|
|
441
400
|
showAlert('info', 'Login successful! Switching browser to headless mode...');
|
|
442
401
|
break;
|
|
443
402
|
case 'linkedin_logged_in':
|
|
444
403
|
automationStatus.textContent = 'LinkedIn Connected';
|
|
445
|
-
automationStatus.className = 'badge bg-success';
|
|
446
404
|
updateBrowserState('Successfully logged into LinkedIn!', 'https://www.linkedin.com/feed');
|
|
447
405
|
updateCurrentAction(null);
|
|
448
406
|
break;
|
|
449
407
|
case 'stopped':
|
|
450
408
|
automationStatus.textContent = 'Stopped';
|
|
451
|
-
|
|
452
|
-
startAutomationBtn.style.display = 'inline-block';
|
|
409
|
+
startAutomationBtn.style.display = 'inline-flex';
|
|
453
410
|
startAutomationBtn.disabled = false;
|
|
454
411
|
startAutomationBtn.innerHTML = '<i class="bi bi-play-fill me-2"></i>Start Automation';
|
|
455
412
|
stopAutomationBtn.style.display = 'none';
|
|
@@ -457,8 +414,7 @@
|
|
|
457
414
|
break;
|
|
458
415
|
case 'error':
|
|
459
416
|
automationStatus.textContent = 'Error';
|
|
460
|
-
|
|
461
|
-
startAutomationBtn.style.display = 'inline-block';
|
|
417
|
+
startAutomationBtn.style.display = 'inline-flex';
|
|
462
418
|
startAutomationBtn.disabled = false;
|
|
463
419
|
startAutomationBtn.innerHTML = '<i class="bi bi-play-fill me-2"></i>Start Automation';
|
|
464
420
|
stopAutomationBtn.style.display = 'none';
|
|
@@ -470,10 +426,10 @@
|
|
|
470
426
|
browserStateContainer.innerHTML = `
|
|
471
427
|
<div class="d-flex align-items-center">
|
|
472
428
|
<div class="flex-shrink-0 me-3">
|
|
473
|
-
<i class="bi bi-browser-chrome fs-2
|
|
429
|
+
<i class="bi bi-browser-chrome fs-2" style="color: rgba(79, 172, 254, 1);"></i>
|
|
474
430
|
</div>
|
|
475
431
|
<div class="flex-grow-1">
|
|
476
|
-
<h6 class="mb-1">${title}</h6>
|
|
432
|
+
<h6 class="mb-1" style="color: #ffffff;">${title}</h6>
|
|
477
433
|
<p class="mb-0 text-muted small">
|
|
478
434
|
<i class="bi bi-link-45deg me-1"></i>
|
|
479
435
|
<a href="${url}" target="_blank" class="text-decoration-none">${url}</a>
|
|
@@ -486,7 +442,7 @@
|
|
|
486
442
|
function resetBrowserState() {
|
|
487
443
|
browserStateContainer.innerHTML = `
|
|
488
444
|
<div class="text-center text-muted py-4">
|
|
489
|
-
<i class="bi bi-browser-chrome fs-1 d-block mb-3"></i>
|
|
445
|
+
<i class="bi bi-browser-chrome fs-1 d-block mb-3" style="color: rgba(255, 255, 255, 0.7);"></i>
|
|
490
446
|
<p class="mb-0">Click "Start Automation" to launch the browser</p>
|
|
491
447
|
</div>
|
|
492
448
|
`;
|
|
@@ -507,16 +463,16 @@
|
|
|
507
463
|
}
|
|
508
464
|
|
|
509
465
|
function updateCurrentAction(action) {
|
|
510
|
-
const
|
|
466
|
+
const actionHeader = document.getElementById('currentActionHeader');
|
|
467
|
+
const actionText = document.getElementById('currentActionText');
|
|
511
468
|
|
|
512
469
|
if (action) {
|
|
513
470
|
const actionType = action.action || action.type || 'unknown';
|
|
514
471
|
const actionId = action.action_id || action.id || 'unknown';
|
|
515
472
|
const username = action.parameters?.username || 'N/A';
|
|
516
473
|
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
actionBadge.className = 'badge bg-warning';
|
|
474
|
+
actionText.textContent = `${actionType} (${username}) - ID: ${actionId}`;
|
|
475
|
+
actionHeader.style.display = 'block';
|
|
520
476
|
|
|
521
477
|
console.log('[Dashboard] Current action:', {
|
|
522
478
|
type: actionType,
|
|
@@ -525,9 +481,7 @@
|
|
|
525
481
|
parameters: action.parameters
|
|
526
482
|
});
|
|
527
483
|
} else {
|
|
528
|
-
|
|
529
|
-
actionBadge.style.display = 'inline-block';
|
|
530
|
-
actionBadge.className = 'badge bg-info';
|
|
484
|
+
actionHeader.style.display = 'none';
|
|
531
485
|
}
|
|
532
486
|
}
|
|
533
487
|
|
|
@@ -549,7 +503,6 @@
|
|
|
549
503
|
updateCurrentAction(data.currentAction);
|
|
550
504
|
});
|
|
551
505
|
|
|
552
|
-
initializeDarkMode();
|
|
553
506
|
initializeKeepBrowser();
|
|
554
507
|
checkAuthStatus();
|
|
555
508
|
</script>
|
|
Binary file
|