🎯 Task Board

Filter by Project: All Projects 🐝 Bumble ⭐ Star Sailors 🏃 Roving 🏠 Station 198

⏫ High Priority (0)

🔼 Medium Priority (0)

🔽 Low Priority (0)

const projectColors = {
  'bumble': '#FFB800',
  'star-sailors': '#4A90E2',
  'roving': '#50C878',
  'station-198': '#9B59B6'
};
 
const projectIcons = {
  'bumble': '🐝',
  'star-sailors': '⭐',
  'roving': '🏃',
  'station-198': '🏠'
};
 
function detectProject(text) {
  const textLower = text.toLowerCase();
  if (textLower.includes('bumble') || textLower.includes('#bumble')) return 'bumble';
  if (textLower.includes('star-sailors') || textLower.includes('#star-sailors') || textLower.includes('star sailors')) return 'star-sailors';
  if (textLower.includes('roving') || textLower.includes('#roving')) return 'roving';
  if (textLower.includes('station') || textLower.includes('#station-198')) return 'station-198';
  return 'general';
}
 
function detectPriority(text) {
  if (text.includes('⏫') || text.includes('#high-priority') || text.includes('#p1')) return 'high';
  if (text.includes('🔼') || text.includes('#p2') || text.includes('#p3')) return 'medium';
  if (text.includes('🔽') || text.includes('#p4') || text.includes('#p5')) return 'low';
  return 'medium';
}
 
function createTaskCard(task, filePath) {
  const project = detectProject(task.text);
  const priority = detectPriority(task.text);
  const color = projectColors[project] || '#999999';
  const icon = projectIcons[project] || '📋';
  
  const fileName = filePath.split('/').pop().replace('.md', '');
  
  return `
    <div class="task-card" data-project="${project}" data-priority="${priority}" data-completed="${task.completed}">
      <div class="task-card-header" style="border-left: 4px solid ${color}">
        <span class="task-project-icon">${icon}</span>
        <span class="task-project">${project}</span>
      </div>
      <div class="task-card-body">
        <label class="task-checkbox">
          <input type="checkbox" ${task.completed ? 'checked' : ''} disabled>
          <span class="task-text">${task.text}</span>
        </label>
      </div>
      <div class="task-card-footer">
        <span class="task-source">📄 ${fileName}</span>
      </div>
    </div>
  `;
}
 
// Get all tasks from content folder
const tasks = [];
for (let page of dv.pages('"content"')) {
  if (page.file.tasks) {
    for (let task of page.file.tasks) {
      tasks.push({
        text: task.text,
        completed: task.completed,
        path: page.file.path,
        project: detectProject(task.text),
        priority: detectPriority(task.text)
      });
    }
  }
}
 
// Store tasks globally for filtering (only incomplete tasks)
window.allTasks = tasks.filter(t => !t.completed);
 
// Function to render tasks
function renderTasks(tasksToRender) {
  const highPriorityTasks = tasksToRender.filter(t => t.priority === 'high');
  const mediumPriorityTasks = tasksToRender.filter(t => t.priority === 'medium');
  const lowPriorityTasks = tasksToRender.filter(t => t.priority === 'low');
 
  const highContainer = document.getElementById('high-priority-tasks');
  const mediumContainer = document.getElementById('medium-priority-tasks');
  const lowContainer = document.getElementById('low-priority-tasks');
 
  if (highContainer) {
    highContainer.innerHTML = highPriorityTasks.map(t => createTaskCard(t, t.path)).join('') || '<div class="empty-state">No tasks</div>';
  }
  if (mediumContainer) {
    mediumContainer.innerHTML = mediumPriorityTasks.map(t => createTaskCard(t, t.path)).join('') || '<div class="empty-state">No tasks</div>';
  }
  if (lowContainer) {
    lowContainer.innerHTML = lowPriorityTasks.map(t => createTaskCard(t, t.path)).join('') || '<div class="empty-state">No tasks</div>';
  }
  
  // Update counts
  document.getElementById('high-count').textContent = `(${highPriorityTasks.length})`;
  document.getElementById('medium-count').textContent = `(${mediumPriorityTasks.length})`;
  document.getElementById('low-count').textContent = `(${lowPriorityTasks.length})`;
}
 
// Initial render
renderTasks(tasks);
 
// Add filter event listener
const filterSelect = document.getElementById('project-filter');
if (filterSelect) {
  filterSelect.addEventListener('change', function() {
    const filter = this.value;
    if (filter === 'all') {
      renderTasks(window.allTasks);
    } else {
      const filtered = window.allTasks.filter(t => t.project === filter);
      renderTasks(filtered);
    }
  });
}