UI: Add Sticky Notes tab and api
This commit is contained in:
1 parent
34cf8fc8ca
commit
2bdafa6cc5
2 files changed
+59
No files matched your search
@@ -413,6 +413,24 @@
|
|||||||
background: rgba(46, 204, 113, 0.1);
|
background: rgba(46, 204, 113, 0.1);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Sticky Notes */
|
||||||
|
.sticky-note {
|
||||||
|
background-color: #f1c40f;
|
||||||
|
color: #2c3e50;
|
||||||
|
padding: 15px;
|
||||||
|
border-radius: 4px;
|
||||||
|
width: 250px;
|
||||||
|
box-shadow: 2px 2px 8px rgba(0,0,0,0.15);
|
||||||
|
position: relative;
|
||||||
|
font-size: 0.9em;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
.sticky-note:hover {
|
||||||
|
transform: scale(1.02);
|
||||||
|
box-shadow: 2px 4px 12px rgba(0,0,0,0.2);
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
}
|
||||||
|
|
||||||
.activity-panel {
|
.activity-panel {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -456,6 +474,7 @@
|
|||||||
<button class="tab-button active" onclick="switchTab('graph-tab', this)">Graph Explorer</button>
|
<button class="tab-button active" onclick="switchTab('graph-tab', this)">Graph Explorer</button>
|
||||||
<button class="tab-button" onclick="switchTab('search-tab', this)">Omni-Search</button>
|
<button class="tab-button" onclick="switchTab('search-tab', this)">Omni-Search</button>
|
||||||
<button class="tab-button" onclick="switchTab('task-tab', this)">Task Board</button>
|
<button class="tab-button" onclick="switchTab('task-tab', this)">Task Board</button>
|
||||||
|
<button class="tab-button" onclick="switchTab('sticky-tab', this)">Sticky Notes</button>
|
||||||
<button class="tab-button" onclick="switchTab('activity-tab', this)">Live Activity</button>
|
<button class="tab-button" onclick="switchTab('activity-tab', this)">Live Activity</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -508,6 +527,13 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="sticky-tab" class="tab-content">
|
||||||
|
<div class="panel sticky-panel" style="flex:1; display:flex; flex-direction:column;">
|
||||||
|
<h2>Sticky Notes</h2>
|
||||||
|
<div id="sticky-notes-container" style="flex:1; overflow-y:auto; display:flex; flex-wrap:wrap; gap:15px; align-items:flex-start; align-content:flex-start;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="activity-tab" class="tab-content">
|
<div id="activity-tab" class="tab-content">
|
||||||
<div class="panel activity-panel" style="flex:1; display:flex; flex-direction:column;">
|
<div class="panel activity-panel" style="flex:1; display:flex; flex-direction:column;">
|
||||||
<div id="activity-feed" style="flex:1;"></div>
|
<div id="activity-feed" style="flex:1;"></div>
|
||||||
@@ -812,9 +838,34 @@
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadStickyNotes() {
|
||||||
|
try {
|
||||||
|
const res = await fetch('/api/sticky');
|
||||||
|
const sticky = await res.json();
|
||||||
|
|
||||||
|
const container = document.getElementById('sticky-notes-container');
|
||||||
|
container.innerHTML = '';
|
||||||
|
|
||||||
|
sticky.forEach(note => {
|
||||||
|
const card = document.createElement('div');
|
||||||
|
card.className = 'sticky-note';
|
||||||
|
|
||||||
|
const date = new Date(note.timestamp * 1000).toLocaleString();
|
||||||
|
|
||||||
|
card.innerHTML = `<div style="font-size:0.75em; color:#7f8c8d; margin-bottom:8px;">${date}</div>
|
||||||
|
<div>${note.content}</div>`;
|
||||||
|
|
||||||
|
container.appendChild(card);
|
||||||
|
});
|
||||||
|
} catch (err) {
|
||||||
|
console.error("Failed to load sticky notes", err);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// --- Start ---
|
// --- Start ---
|
||||||
loadGraph();
|
loadGraph();
|
||||||
loadTasks();
|
loadTasks();
|
||||||
|
loadStickyNotes();
|
||||||
setupWS();
|
setupWS();
|
||||||
|
|
||||||
// Listen to theme toggle changes to update graph font colors
|
// Listen to theme toggle changes to update graph font colors
|
||||||
@@ -824,6 +875,7 @@
|
|||||||
setInterval(() => {
|
setInterval(() => {
|
||||||
loadGraph();
|
loadGraph();
|
||||||
loadTasks();
|
loadTasks();
|
||||||
|
loadStickyNotes();
|
||||||
}, 5000);
|
}, 5000);
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@@ -375,6 +375,13 @@ fn run_server(state: Arc<MemoryState>) -> Result<(), Box<dyn std::error::Error>>
|
|||||||
axum::Json(tasks.clone())
|
axum::Json(tasks.clone())
|
||||||
}
|
}
|
||||||
}))
|
}))
|
||||||
|
.route("/api/sticky", get({
|
||||||
|
let state_clone = app_state.handler.state.clone();
|
||||||
|
move || async move {
|
||||||
|
let sticky = state_clone.sticky.read();
|
||||||
|
axum::Json(sticky.clone())
|
||||||
|
}
|
||||||
|
}))
|
||||||
.route("/api/search", get({
|
.route("/api/search", get({
|
||||||
let state_clone = app_state.handler.state.clone();
|
let state_clone = app_state.handler.state.clone();
|
||||||
move |axum::extract::Query(params): axum::extract::Query<std::collections::HashMap<String, String>>| async move {
|
move |axum::extract::Query(params): axum::extract::Query<std::collections::HashMap<String, String>>| async move {
|
||||||
|
|||||||
Reference in new issue
Block a user