271 lines
8.1 KiB
HTML
271 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Clawdbot Memory</title>
|
|
<style>
|
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: #1a1a2e;
|
|
color: #eee;
|
|
min-height: 100vh;
|
|
}
|
|
.container { max-width: 900px; margin: 0 auto; padding: 20px; }
|
|
header {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 20px 0;
|
|
border-bottom: 1px solid #333;
|
|
margin-bottom: 20px;
|
|
}
|
|
h1 { color: #ff6b6b; font-size: 1.5rem; }
|
|
.date { color: #888; font-size: 0.9rem; }
|
|
.search-box {
|
|
width: 100%;
|
|
padding: 15px;
|
|
background: #252540;
|
|
border: 1px solid #333;
|
|
border-radius: 8px;
|
|
color: #fff;
|
|
font-size: 1rem;
|
|
margin-bottom: 20px;
|
|
}
|
|
.search-box:focus { outline: none; border-color: #ff6b6b; }
|
|
.controls { display: flex; gap: 10px; margin-bottom: 20px; }
|
|
button {
|
|
padding: 10px 20px;
|
|
background: #333;
|
|
border: none;
|
|
border-radius: 6px;
|
|
color: #fff;
|
|
cursor: pointer;
|
|
transition: background 0.2s;
|
|
}
|
|
button:hover { background: #444; }
|
|
button.active { background: #ff6b6b; }
|
|
.voice-btn {
|
|
background: linear-gradient(135deg, #ff6b6b, #ee5a5a);
|
|
animation: pulse 2s infinite;
|
|
}
|
|
@keyframes pulse {
|
|
0%, 100% { box-shadow: 0 0 0 0 rgba(255,107,107,0.4); }
|
|
50% { box-shadow: 0 0 0 10px rgba(255,107,107,0); }
|
|
}
|
|
.notes-list { display: flex; flex-direction: column; gap: 15px; }
|
|
.note-card {
|
|
background: #252540;
|
|
border-radius: 10px;
|
|
padding: 20px;
|
|
border-left: 3px solid #ff6b6b;
|
|
}
|
|
.note-card h3 {
|
|
color: #ff6b6b;
|
|
margin-bottom: 10px;
|
|
font-size: 1rem;
|
|
}
|
|
.note-card p, .note-card li {
|
|
color: #bbb;
|
|
line-height: 1.6;
|
|
font-size: 0.95rem;
|
|
}
|
|
.note-card ul { margin-left: 20px; margin-top: 10px; }
|
|
.note-card code {
|
|
background: #1a1a2e;
|
|
padding: 2px 6px;
|
|
border-radius: 4px;
|
|
font-size: 0.85rem;
|
|
}
|
|
.empty { text-align: center; color: #666; padding: 40px; }
|
|
.status {
|
|
position: fixed;
|
|
bottom: 20px;
|
|
right: 20px;
|
|
background: #333;
|
|
padding: 10px 20px;
|
|
border-radius: 8px;
|
|
font-size: 0.85rem;
|
|
}
|
|
.status.listening { background: #ff6b6b; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<header>
|
|
<h1>🤙 Clawdbot Memory</h1>
|
|
<div class="date" id="currentDate"></div>
|
|
</header>
|
|
|
|
<input type="text" class="search-box" id="search" placeholder="Search your memories..." />
|
|
|
|
<div class="controls">
|
|
<button onclick="speakNotes()" class="voice-btn">🔊 Read Aloud</button>
|
|
<button onclick="stopSpeaking()" id="stopBtn">⏹ Stop</button>
|
|
<select id="dateSelect" onchange="loadDate()" style="padding: 10px; background: #333; color: #fff; border: none; border-radius: 6px;">
|
|
<option value="today">Today</option>
|
|
<option value="yesterday">Yesterday</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="notes-list" id="notesList"></div>
|
|
</div>
|
|
|
|
<div class="status" id="status">Ready</div>
|
|
|
|
<script>
|
|
// Date
|
|
document.getElementById('currentDate').textContent = new Date().toLocaleDateString('en-US', {
|
|
weekday: 'long', year: 'numeric', month: 'long', day: 'numeric'
|
|
});
|
|
|
|
// Sample memories (would load from actual files)
|
|
const memories = {
|
|
today: `# 2026-01-29
|
|
|
|
## Room Presence Project - LIVE SETUP
|
|
- **Pi 1**: livingroom-pi (192.168.0.95) - IN PROGRESS
|
|
- SSH key setup attempted (Windows/OpenSSH quirk)
|
|
- Paired phone: B0:C2:C7:07:28:B4
|
|
- Installing room-assistant via npm
|
|
|
|
## Backup System
|
|
- Location: \`P:\Clawdbot-Backups\`
|
|
- Script: \`C:\Users\admin\clawd\backup-clawdbot.ps1\`
|
|
- Cron job: Daily at 2 AM
|
|
|
|
## Skills Installed (9 total)
|
|
- clean-code, coding-agent, qbittorrent, radarr, sonarr, and more
|
|
|
|
## Voice Assistant
|
|
- STT: HA Cloud (faster than local Whisper)
|
|
- LLM: minimax-m2.1 via Ollama (local)
|
|
|
|
## Action Items
|
|
- Replace Master Hallway motion sensor battery (1%)
|
|
- Test room-assistant on Pi`,
|
|
yesterday: `# 2026-01-28
|
|
|
|
## Frigate Fix (NVIDIA GPU Decoder)
|
|
- Problem: Cannot load libnvcuvid.so.1
|
|
- Status: STIL BROKEN - will do fresh install
|
|
|
|
## Voice Assistant - Local AI
|
|
- Stack: VPE + Whisper + Ollama + minimax-m2.1
|
|
- TTS needs Piper or Qwen3-TTS for speed
|
|
|
|
## Room Presence (planned)
|
|
- Created: room-assistant-config.yml, setup-room-assistant.sh
|
|
|
|
## Battery Alert
|
|
- CRITICAL: Master Hallway motion sensor at 1%`
|
|
};
|
|
|
|
let utterance = null;
|
|
let synth = window.speechSynthesis;
|
|
|
|
function loadDate() {
|
|
const selected = document.getElementById('dateSelect').value;
|
|
renderNotes(selected === 'today' ? memories.today : memories.yesterday);
|
|
}
|
|
|
|
function parseMarkdown(text) {
|
|
// Simple markdown to HTML
|
|
return text
|
|
.replace(/^### (.*$)/gm, '<h3>$1</h3>')
|
|
.replace(/^## (.*$)/gm, '<h2>$1</h2>')
|
|
.replace(/^# (.*$)/gm, '<h1>$1</h1>')
|
|
.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
|
|
.replace(/`(.*?)`/g, '<code>$1</code>')
|
|
.replace(/^- (.*$)/gm, '<li>$1</li>')
|
|
.replace(/^(\d+)\. (.*$)/gm, '<li>$2</li>')
|
|
.replace(/\n\n/g, '</p><p>')
|
|
.replace(/\n/g, '<br>');
|
|
}
|
|
|
|
function renderNotes(text) {
|
|
const container = document.getElementById('notesList');
|
|
const searchTerm = document.getElementById('search').value.toLowerCase();
|
|
|
|
if (searchTerm) {
|
|
const lines = text.split('\n');
|
|
const matching = lines.filter(l => l.toLowerCase().includes(searchTerm));
|
|
if (matching.length === 0) {
|
|
container.innerHTML = '<div class="empty">No memories found matching "' + searchTerm + '"</div>';
|
|
return;
|
|
}
|
|
text = matching.join('\n');
|
|
}
|
|
|
|
const sections = text.split(/(?=^## )/m);
|
|
container.innerHTML = sections.map(s => {
|
|
if (!s.trim()) return '';
|
|
return '<div class="note-card">' + parseMarkdown(s) + '</div>';
|
|
}).join('');
|
|
}
|
|
|
|
function speakNotes() {
|
|
stopSpeaking();
|
|
const selected = document.getElementById('dateSelect').value;
|
|
const text = (selected === 'today' ? memories.today : memories.yesterday)
|
|
.replace(/[#*`\[\]]/g, '')
|
|
.replace(/\n\n/g, '. ');
|
|
|
|
utterance = new SpeechSynthesisUtterance(text);
|
|
utterance.rate = 1.0;
|
|
utterance.pitch = 1.0;
|
|
synth.speak(utterance);
|
|
|
|
setStatus('Reading notes...', true);
|
|
utterance.onend = () => setStatus('Ready');
|
|
}
|
|
|
|
function stopSpeaking() {
|
|
synth.cancel();
|
|
setStatus('Ready');
|
|
}
|
|
|
|
function setStatus(msg, listening = false) {
|
|
const el = document.getElementById('status');
|
|
el.textContent = msg;
|
|
el.className = 'status' + (listening ? ' listening' : '');
|
|
}
|
|
|
|
// Search
|
|
document.getElementById('search').addEventListener('input', () => loadDate());
|
|
|
|
// Voice search (Web Speech API)
|
|
if ('webkitSpeechRecognition' in window || 'SpeechRecognition' in window) {
|
|
const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
|
|
const recognition = new SpeechRecognition();
|
|
recognition.continuous = false;
|
|
recognition.interimResults = false;
|
|
|
|
recognition.onstart = () => setStatus('Listening...', true);
|
|
recognition.onend = () => setStatus('Ready');
|
|
recognition.onresult = (e) => {
|
|
const query = e.results[0][0].transcript;
|
|
document.getElementById('search').value = query;
|
|
setStatus('Searched for: ' + query);
|
|
loadDate();
|
|
};
|
|
recognition.onerror = () => setStatus('Voice error - try typing');
|
|
|
|
// Click voice button to search
|
|
document.querySelector('.voice-btn').onclick = () => {
|
|
if (synth.speaking) {
|
|
stopSpeaking();
|
|
} else {
|
|
recognition.start();
|
|
}
|
|
};
|
|
} else {
|
|
document.querySelector('.voice-btn').onclick = speakNotes;
|
|
}
|
|
|
|
// Initial load
|
|
loadDate();
|
|
</script>
|
|
</body>
|
|
</html> |