sandtable 0.3.0

package/dashboard/js/timeline-renderer.js

@@ -0,0 +1,283 @@
+/**
+ * Timeline Renderer — v0.3 category-filtered doc tree + primary/secondary
+ */
+
+var CATEGORY_LABELS = {
+  roadmap:    '路线图与进度',
+  decision:   '决策记录',
+  spec:       '业务规格',
+  convention: '协作纪律',
+  ops:        '运维与基建',
+  archive:    '历史档案',
+  template:   '工具模板',
+  unknown:    '未分类',
+};
+
+var PRIMARY_CATEGORIES_SET = new Set(['roadmap', 'decision']);
+
+function renderTimeline(timeline, activeCat) {
+  var container = document.getElementById('timeline-container');
+  if (!container) return;
+
+  var cat = activeCat || 'all';
+  var allElements = timeline.elements || [];
+
+  // Filter by category
+  var filtered = [];
+  for (var i = 0; i < allElements.length; i++) {
+    var el = allElements[i];
+    if (cat !== 'all') {
+      var elCat = el.category || normalizeElementCategory(el.elementType);
+      // Include element if it matches OR has descendant matching
+      if (elCat !== cat && !hasDescendantWithCategory(el, cat)) continue;
+    }
+    // Primary always passes; secondary always passes (no checkbox filter)
+    filtered.push(el);
+  }
+
+  // Group by category
+  var groups = {};
+  var groupOrder = [];
+  for (var i = 0; i < filtered.length; i++) {
+    var el = filtered[i];
+    var grp = el.category || normalizeElementCategory(el.elementType);
+    if (!groups[grp]) { groups[grp] = []; groupOrder.push(grp); }
+    groups[grp].push(el);
+  }
+
+  // Sort within each group by date
+  for (var k in groups) {
+    groups[k].sort(function(a, b) {
+      if (a.date && b.date) return b.date.localeCompare(a.date);
+      return (b.order || 0) - (a.order || 0);
+    });
+  }
+
+  // Sort group order: primary first, then secondary, unknown last
+  groupOrder.sort(function(a, b) {
+    var aP = PRIMARY_CATEGORIES_SET.has(a) ? 0 : 1;
+    var bP = PRIMARY_CATEGORIES_SET.has(b) ? 0 : 1;
+    if (aP !== bP) return aP - bP;
+    if (a === 'unknown') return 1;
+    if (b === 'unknown') return -1;
+    return 0;
+  });
+
+  // Count total
+  var totalCount = 0;
+  for (var i = 0; i < groupOrder.length; i++) {
+    totalCount += groups[groupOrder[i]].length;
+  }
+  updateElementCount(totalCount);
+
+  if (totalCount === 0) {
+    container.innerHTML = '<div class="empty-state"><h3>暂无内容</h3><p>选择其他分类查看，或运行 build 刷新数据。</p></div>';
+    return;
+  }
+
+  var html = '<div class="timeline-tree">';
+  for (var i = 0; i < groupOrder.length; i++) {
+    var g = groupOrder[i];
+    var items = groups[g];
+    var label = CATEGORY_LABELS[g] || g;
+    var isPrimary = PRIMARY_CATEGORIES_SET.has(g);
+
+    html += '<div class="category-section">' +
+      '<div class="category-header ' + (isPrimary ? 'primary-section' : 'secondary-section') + '">' +
+      '<span>' + label + '</span>' +
+      '<span class="category-count">' + items.length + ' 项</span>' +
+      '</div>';
+
+    for (var j = 0; j < items.length; j++) {
+      html += renderElementCard(items[j]);
+    }
+    html += '</div>';
+  }
+  html += '</div>';
+  container.innerHTML = html;
+
+  attachDocClickHandlers();
+}
+
+function normalizeElementCategory(elementType) {
+  var map = {
+    phase: 'roadmap', milestone: 'roadmap', task: 'roadmap', subtask: 'roadmap',
+    roadmap: 'roadmap', backlog: 'roadmap', conclusion: 'roadmap',
+    decision: 'decision', refactor: 'decision',
+    spec: 'spec', intent: 'spec', prompt: 'spec',
+    convention: 'convention',
+    agent: 'ops', runbook: 'ops',
+    journal: 'archive', handover: 'archive', plan_doc: 'archive',
+    template: 'template',
+  };
+  return map[elementType] || 'unknown';
+}
+
+function hasDescendantWithCategory(el, cat) {
+  var elCat = el.category || normalizeElementCategory(el.elementType);
+  if (elCat === cat) return true;
+  if (el.children) {
+    for (var i = 0; i < el.children.length; i++) {
+      if (hasDescendantWithCategory(el.children[i], cat)) return true;
+    }
+  }
+  return false;
+}
+
+function renderElementCard(el) {
+  var sourceHtml = '';
+  if (el.source && el.source.file) {
+    sourceHtml = '<a class="source-badge" href="/' + escapeHtml(el.source.file) + '" target="_blank" title="' + escapeHtml(el.source.file) + '">' +
+      escapeHtml((el.source.title || el.source.file).substring(0, 30)) + '</a>';
+  }
+
+  var kindClass = el.kind === 'secondary' ? ' secondary-element' : '';
+  var archivedClass = el.timeGroup === 'archived' ? ' archived' : '';
+
+  var cat = el.category || normalizeElementCategory(el.elementType);
+  var unknownBadge = '';
+  if (cat === 'unknown') {
+    unknownBadge = '<span class="unknown-badge">未分类</span>';
+  }
+
+  // Time badge to indicate past/current/future
+  var timeBadge = '';
+  if (el.timeGroup === 'past') timeBadge = '<span class="time-badge time-past-badge">历史</span>';
+  else if (el.timeGroup === 'current') timeBadge = '<span class="time-badge time-current-badge">进行中</span>';
+  else if (el.timeGroup === 'future') timeBadge = '<span class="time-badge time-future-badge">未来</span>';
+
+  var html = '<div class="element-card' + kindClass + '" data-id="' + escapeHtml(el.id) + '" data-timegroup="' + escapeHtml(el.timeGroup || '') + '" data-doc="' + (el.source && el.source.file ? escapeHtml(el.source.file) : '') + '">' +
+    '<div class="element-header ' + (el.status || 'pending') + archivedClass + '">' +
+    '<span>' + statusIcon(el.status) + ' ' + escapeHtml(el.name) + '</span>' +
+    '<span class="element-meta">' +
+    timeBadge +
+    unknownBadge +
+    '<span class="element-type-tag">' + escapeHtml(el.elementType) + '</span>' +
+    sourceHtml +
+    '</span>' +
+    '</div>';
+
+  if (el.summary) {
+    html += '<div class="element-summary">' + escapeHtml(el.summary) + '</div>';
+  }
+
+  if (el.tags && el.tags.length > 0) {
+    html += '<div class="element-tags">';
+    for (var i = 0; i < el.tags.length; i++) {
+      html += '<span class="tag">' + escapeHtml(el.tags[i]) + '</span>';
+    }
+    html += '</div>';
+  }
+
+  // Render all children (no timeGroup filtering)
+  if (el.children && el.children.length > 0) {
+    html += '<div class="element-children">';
+    for (var i = 0; i < el.children.length; i++) {
+      html += renderSubElement(el.children[i]);
+    }
+    html += '</div>';
+  }
+
+  html += '</div>';
+  return html;
+}
+
+function renderSubElement(el) {
+  var sourceHtml = '';
+  if (el.source && el.source.file) {
+    sourceHtml = '<a class="source-badge" href="/' + escapeHtml(el.source.file) + '" target="_blank" title="' + escapeHtml(el.source.file) + '">' +
+      escapeHtml((el.source.title || el.source.file).substring(0, 20)) + '</a>';
+  }
+
+  // Milestone tooltip
+  var tooltipHtml = '';
+  if (el.elementType === 'milestone' && (el.timeLabel || el.summary)) {
+    tooltipHtml = '<span class="milestone-tooltip">' +
+      (el.timeLabel ? '<strong>验收信号：</strong>' + escapeHtml(el.timeLabel) + '<br>' : '') +
+      (el.summary ? escapeHtml(el.summary) : '') +
+      '</span>';
+  }
+
+  // Time badge for sub-elements
+  var timeBadge = '';
+  if (el.timeGroup === 'past') timeBadge = '<span class="time-badge time-past-badge">历史</span>';
+  else if (el.timeGroup === 'current') timeBadge = '<span class="time-badge time-current-badge">进行中</span>';
+  else if (el.timeGroup === 'future') timeBadge = '<span class="time-badge time-future-badge">未来</span>';
+
+  var html = '<div class="sub-element" data-id="' + escapeHtml(el.id) + '" data-doc="' + (el.source && el.source.file ? escapeHtml(el.source.file) : '') + '" style="position:relative">' +
+    '<span>' + statusIcon(el.status) + ' ' + escapeHtml(el.name) + '</span>' +
+    timeBadge +
+    tooltipHtml +
+    sourceHtml +
+    '</div>';
+
+  // Render grandchildren
+  if (el.children && el.children.length > 0) {
+    html += '<div class="element-children" style="margin-left:16px">';
+    for (var i = 0; i < el.children.length; i++) {
+      html += renderSubElement(el.children[i]);
+    }
+    html += '</div>';
+  }
+
+  return html;
+}
+
+function updateElementCount(count) {
+  var el = document.getElementById('element-count');
+  if (el) el.textContent = count + ' 项';
+}
+
+// ---- Category Tab Setup ----
+function setupCategoryTabs(timeline) {
+  var tabs = document.querySelectorAll('#category-tabs .cat-tab');
+  for (var i = 0; i < tabs.length; i++) {
+    tabs[i].addEventListener('click', function() {
+      // Update active state
+      var allTabs = document.querySelectorAll('#category-tabs .cat-tab');
+      for (var j = 0; j < allTabs.length; j++) {
+        allTabs[j].classList.remove('active');
+      }
+      this.classList.add('active');
+
+      var cat = this.getAttribute('data-cat');
+      renderTimeline(timeline, cat);
+    });
+  }
+}
+
+// ---- ref 双向跳转 ----
+function attachDocClickHandlers() {
+  var cards = document.querySelectorAll('.element-card[data-doc]');
+  for (var i = 0; i < cards.length; i++) {
+    cards[i].addEventListener('click', function(e) {
+      if (e.target.closest('.source-badge')) return;
+      var docPath = this.getAttribute('data-doc');
+      if (docPath) {
+        if (typeof openFloatingPreview === 'function') {
+          openFloatingPreview(docPath);
+        }
+        highlightRelatedEvents(docPath);
+      }
+    });
+  }
+}
+
+function highlightRelatedEvents(docPath) {
+  var prev = document.querySelectorAll('.event-item.highlighted');
+  for (var i = 0; i < prev.length; i++) {
+    prev[i].classList.remove('highlighted');
+  }
+
+  var items = document.querySelectorAll('.event-item .doc-ref[data-doc]');
+  for (var i = 0; i < items.length; i++) {
+    var itemDoc = items[i].getAttribute('data-doc');
+    if (itemDoc === docPath) {
+      var eventItem = items[i].closest('.event-item');
+      if (eventItem) {
+        eventItem.classList.add('highlighted');
+        eventItem.scrollIntoView({ behavior: 'smooth', block: 'center' });
+      }
+    }
+  }
+}

package/dashboard/js/waterfall-renderer.js

@@ -0,0 +1,189 @@
+/**
+ * Waterfall Renderer — §11 7 大事件类 event stream
+ */
+var EVENT_COLORS = {
+  code_change:      '#569CD6',
+  decision:          '#4EC9B0',
+  spec_evolution:    '#CE9178',
+  test_quality:      '#C586C0',
+  review_handover:   '#DCDCAA',
+  ops_event:         '#F44747',
+  lesson:            '#D7BA7D',
+};
+
+var EVENT_ICONS = {
+  code_change:      '📝',
+  decision:         '🔈',
+  spec_evolution:    '📐',
+  test_quality:      '✅',
+  review_handover:   '🤝',
+  ops_event:         '⚙',
+  lesson:            '⚠',
+};
+
+var EVENT_LABELS = {
+  code_change:      '代码变更',
+  decision:         '对齐拍板',
+  spec_evolution:    '规格演进',
+  test_quality:      '测试质量',
+  review_handover:   '审批交接',
+  ops_event:         '运维事件',
+  lesson:            '教训沉淀',
+};
+
+// 5 "must-record" events — always highlighted, never collapsible
+var MUST_RECORD_TYPES = new Set(['decision', 'spec_evolution']);
+
+function renderWaterfall(timeline) {
+  var container = document.getElementById('waterfall-container');
+  if (!container) return;
+
+  var events = (timeline && timeline.events) ? timeline.events.slice() : [];
+
+  // Fallback: if no events, render elements as simple waterfall
+  if (events.length === 0) {
+    renderWaterfallFromElements(timeline);
+    return;
+  }
+
+  // Sort by timestamp descending
+  events.sort(function(a, b) { return b.timestamp.localeCompare(a.timestamp); });
+
+  if (events.length === 0) {
+    container.innerHTML = '<div class="empty-state"><h3>暂无事件记录</h3><p>运行 build 后，git log 与 doc 时间线将合并为事件流显示于此。</p></div>';
+    return;
+  }
+
+  var html = '<div class="waterfall">';
+  var currentDate = '';
+
+  for (var i = 0; i < events.length; i++) {
+    var evt = events[i];
+    var dateStr = evt.timestamp.substring(0, 10);
+
+    // Date header
+    if (dateStr !== currentDate) {
+      currentDate = dateStr;
+      html += '<div class="waterfall-date-header">' + escapeHtml(dateStr) + '</div>';
+    }
+
+    var color = EVENT_COLORS[evt.type] || '#999';
+    var icon = EVENT_ICONS[evt.type] || '&#x1F4C4;';
+    var label = EVENT_LABELS[evt.type] || evt.type;
+    var isMustRecord = MUST_RECORD_TYPES.has(evt.type);
+    var mustClass = isMustRecord ? ' must-record' : '';
+
+    html += '<div class="waterfall-event' + mustClass + '" style="border-left-color:' + color + '" data-ref-doc="' + (evt.ref && evt.ref.doc ? escapeHtml(evt.ref.doc) : '') + '">' +
+      '<div class="waterfall-date">' +
+        '<span class="event-icon" style="color:' + color + '">' + icon + '</span>' +
+        escapeHtml(dateStr) +
+        ' <span class="event-time">' + escapeHtml(evt.timestamp.substring(11, 16)) + '</span>' +
+      '</div>' +
+      '<div class="waterfall-body">' +
+        '<div class="waterfall-title">' +
+          '<span class="kind-badge" style="background:' + color + '20;color:' + color + '">' + label + '</span>' +
+          (evt.subtype ? '<span class="subtype-tag">' + escapeHtml(evt.subtype) + '</span>' : '') +
+          escapeHtml(evt.title) +
+        '</div>';
+
+    // Ref links
+    if (evt.ref) {
+      html += '<div class="waterfall-refs">';
+      if (evt.ref.doc) {
+        html += '<a class="ref-link doc-ref" href="/' + escapeHtml(evt.ref.doc) + '" target="_blank" title="' + escapeHtml(evt.ref.doc) + '">&#x1F4C4; ' + escapeHtml(evt.ref.doc.substring(evt.ref.doc.lastIndexOf('/') + 1)) + '</a>';
+      }
+      if (evt.ref.commit) {
+        html += '<span class="ref-link commit-ref" title="' + escapeHtml(evt.ref.commit) + '">&#x1F517; ' + escapeHtml(evt.ref.commit) + '</span>';
+      }
+      if (evt.ref.pr) {
+        html += '<span class="ref-link pr-ref">&#x1F4AC; ' + escapeHtml(evt.ref.pr) + '</span>';
+      }
+      html += '</div>';
+    }
+
+    // Impact + actor
+    if (evt.impact && evt.impact !== 'low') {
+      html += '<span class="impact-badge impact-' + evt.impact + '">' + (evt.impact === 'high' ? '高影响' : '中影响') + '</span>';
+    }
+    if (evt.actor) {
+      html += '<span class="actor-badge">' + escapeHtml(evt.actor) + '</span>';
+    }
+
+    // Tags
+    if (evt.tags && evt.tags.length > 0) {
+      html += '<div class="event-tags">';
+      for (var j = 0; j < evt.tags.length; j++) {
+        html += '<span class="tag">' + escapeHtml(evt.tags[j]) + '</span>';
+      }
+      html += '</div>';
+    }
+
+    html += '</div></div>';
+  }
+
+  html += '</div>';
+  container.innerHTML = html;
+}
+
+// Fallback: render elements when no events available
+function renderWaterfallFromElements(timeline) {
+  var container = document.getElementById('waterfall-container');
+  if (!container) return;
+
+  var allElements = (timeline && timeline.elements || []).slice();
+
+  var flat = [];
+  function flatten(arr) {
+    for (var i = 0; i < arr.length; i++) {
+      flat.push(arr[i]);
+      if (arr[i].children && arr[i].children.length > 0) {
+        flatten(arr[i].children);
+      }
+    }
+  }
+  flatten(allElements);
+
+  flat.sort(function(a, b) {
+    if (a.date && b.date) return b.date.localeCompare(a.date);
+    return 0;
+  });
+
+  if (flat.length === 0) {
+    container.innerHTML = '<div class="empty-state"><h3>暂无记录</h3><p>运行 build 后，所有元素将按时间序显示于此。</p></div>';
+    return;
+  }
+
+  var html = '<div class="waterfall">';
+  for (var i = 0; i < flat.length; i++) {
+    var el = flat[i];
+    var cat = el.category || 'unknown';
+    var color = EVENT_COLORS.code_change;
+    if (cat === 'decision') color = EVENT_COLORS.decision;
+    else if (cat === 'archive') color = EVENT_COLORS.lesson;
+    else if (cat === 'convention') color = EVENT_COLORS.test_quality;
+
+    html += '<div class="waterfall-event" style="border-left-color:' + color + '" data-ref-doc="' + (el.source && el.source.file ? escapeHtml(el.source.file) : '') + '">' +
+      '<div class="waterfall-date">' + escapeHtml(el.date || '--') + '</div>' +
+      '<div class="waterfall-body">' +
+      '<div class="waterfall-title">' +
+      '<span class="kind-badge ' + el.kind + '" style="background:' + color + '20;color:' + color + '">' + (el.kind === 'primary' ? '主线' : '次要') + '</span>' +
+      escapeHtml(el.name) +
+      '</div>';
+
+    if (el.source && el.source.file) {
+      html += '<div class="waterfall-source">源文档：<a href="/' + escapeHtml(el.source.file) + '" target="_blank"><code>' + escapeHtml(el.source.file) + '</code></a></div>';
+    }
+
+    if (el.summary) {
+      html += '<div class="waterfall-summary">' + escapeHtml(el.summary) + '</div>';
+    }
+
+    if (el.related && el.related.length > 0) {
+      html += '<div class="waterfall-related">关联：' + escapeHtml(el.related.join(', ')) + '</div>';
+    }
+
+    html += '</div></div>';
+  }
+  html += '</div>';
+  container.innerHTML = html;
+}

package/harness/install-hooks.sh

@@ -0,0 +1,34 @@
+#!/bin/sh
+# Install sandtable git hooks into the current repo
+# Usage: sh harness/install-hooks.sh [project-root]
+
+ROOT="${1:-$(pwd)}"
+HOOKS_DIR="$ROOT/.git/hooks"
+
+if [ ! -d "$HOOKS_DIR" ]; then
+  echo "Error: not a git repository (no .git/hooks)"
+  exit 1
+fi
+
+cp harness/post-commit "$HOOKS_DIR/post-commit.sandtable"
+cp harness/post-merge "$HOOKS_DIR/post-merge.sandtable"
+chmod +x "$HOOKS_DIR/post-commit.sandtable"
+chmod +x "$HOOKS_DIR/post-merge.sandtable"
+
+# Append to existing hook or create wrapper
+for hook in post-commit post-merge; do
+  HOOK_PATH="$HOOKS_DIR/$hook"
+  SANDBOX_PATH="$HOOKS_DIR/$hook.sandtable"
+
+  if [ -f "$HOOK_PATH" ]; then
+    if ! grep -q "sandtable" "$HOOK_PATH" 2>/dev/null; then
+      echo "" >> "$HOOK_PATH"
+      echo "# Sandtable auto rebuild" >> "$HOOK_PATH"
+      echo "sh $SANDBOX_PATH" >> "$HOOK_PATH"
+    fi
+  else
+    ln -sf "$SANDBOX_PATH" "$HOOK_PATH" 2>/dev/null || cp "$SANDBOX_PATH" "$HOOK_PATH"
+  fi
+done
+
+echo "Sandtable hooks installed: $HOOKS_DIR/post-commit, post-merge"

package/harness/post-commit

@@ -0,0 +1,17 @@
+#!/bin/sh
+# Sandtable post-commit hook — auto rebuild on each commit
+# Install: copy to .git/hooks/post-commit and chmod +x
+
+ROOT=$(git rev-parse --show-toplevel 2>/dev/null || pwd)
+SANDBIN=$(which sandtable 2>/dev/null)
+if [ -z "$SANDBIN" ]; then
+  SANDBIN="npx sandtable"
+fi
+# Local dev fallback
+if ! $SANDBIN --version >/dev/null 2>&1 && [ -f "$ROOT/src/cli/sandtable.js" ]; then
+  SANDBIN="node $ROOT/src/cli/sandtable.js"
+fi
+
+echo "[sandtable] post-commit hook: auto rebuild..."
+$SANDBIN build "$ROOT" 2>&1 || true
+echo "[sandtable] done."

package/harness/post-merge

@@ -0,0 +1,17 @@
+#!/bin/sh
+# Sandtable post-merge hook — auto rebuild after merge/pull
+# Install: copy to .git/hooks/post-merge and chmod +x
+
+ROOT=$(git rev-parse --show-toplevel 2>/dev/null || pwd)
+SANDBIN=$(which sandtable 2>/dev/null)
+if [ -z "$SANDBIN" ]; then
+  SANDBIN="npx sandtable"
+fi
+# Local dev fallback
+if ! $SANDBIN --version >/dev/null 2>&1 && [ -f "$ROOT/src/cli/sandtable.js" ]; then
+  SANDBIN="node $ROOT/src/cli/sandtable.js"
+fi
+
+echo "[sandtable] post-merge hook: auto rebuild..."
+$SANDBIN build "$ROOT" 2>&1 || true
+echo "[sandtable] done."

package/harness/summary-hook.md

@@ -0,0 +1,18 @@
+# 摘要块 Harness 预埋指令
+
+将以下指令添加到项目的 Claude Code settings.local.json 的 hooks 中：
+
+```json
+{
+  "hooks": {
+    "SessionStart": [
+      {
+        "matcher": "",
+        "command": "echo '本会话如有产出 .md 文档，请在文件头部添加 SUMMARY 摘要块（格式见 templates/summary-block.md）'"
+      }
+    ]
+  }
+}
+```
+
+> MVP 阶段不自动执行，作为手动参考。

package/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "sandtable",
+  "version": "0.3.0",
+  "description": "AI 编程项目可视化指挥面板 — 双视图 dashboard，多源数据融合",
+  "main": "src/cli/sandtable.js",
+  "bin": {
+    "sandtable": "src/cli/sandtable.js"
+  },
+  "files": [
+    "src/",
+    "dashboard/",
+    "templates/",
+    "skills/",
+    "harness/",
+    "server.js"
+  ],
+  "scripts": {
+    "scan": "node src/cli/sandtable.js scan",
+    "build": "node src/cli/sandtable.js build",
+    "serve": "node src/cli/sandtable.js serve",
+    "summarize": "node src/cli/sandtable.js summarize"
+  },
+  "keywords": [
+    "ai",
+    "dashboard",
+    "visualization",
+    "project-management",
+    "coding-assistant"
+  ],
+  "license": "MIT",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/anthropics/sandtable"
+  }
+}

package/server.js

@@ -0,0 +1,60 @@
+const http = require('http');
+const fs = require('fs');
+const path = require('path');
+
+const ROOT = path.resolve(__dirname);
+const PORT = parseInt(process.env.PORT || process.argv[2], 10) || 3000;
+
+const MIME = {
+  '.html': 'text/html; charset=utf-8',
+  '.css': 'text/css; charset=utf-8',
+  '.js': 'application/javascript; charset=utf-8',
+  '.json': 'application/json; charset=utf-8',
+  '.jsonl': 'text/plain; charset=utf-8',
+  '.md': 'text/markdown; charset=utf-8',
+  '.png': 'image/png',
+  '.svg': 'image/svg+xml',
+};
+
+// Only serve from these two directories — project sources are not exposed
+const ALLOWED_PREFIXES = [
+  path.join(ROOT, 'dashboard'),
+  path.join(ROOT, 'data'),
+];
+
+function isAllowed(filePath) {
+  if (!filePath.startsWith(ROOT)) return false;
+  for (const prefix of ALLOWED_PREFIXES) {
+    if (filePath.startsWith(prefix)) return true;
+  }
+  return false;
+}
+
+http.createServer((req, res) => {
+  let url = req.url === '/' ? '/dashboard/dashboard.html' : req.url;
+  url = url.replace(/^\/(css|js)\//, '/dashboard/$1/');
+
+  const filePath = path.join(ROOT, url);
+
+  if (!isAllowed(filePath)) {
+    res.writeHead(403, { 'Content-Type': 'text/plain' });
+    return res.end('403 Forbidden');
+  }
+
+  const ext = path.extname(filePath);
+  try {
+    if (fs.existsSync(filePath) && fs.statSync(filePath).isFile()) {
+      res.writeHead(200, { 'Content-Type': MIME[ext] || 'text/plain' });
+      res.end(fs.readFileSync(filePath));
+    } else {
+      res.writeHead(404, { 'Content-Type': 'text/plain' });
+      res.end('404 Not Found');
+    }
+  } catch (e) {
+    res.writeHead(500, { 'Content-Type': 'text/plain' });
+    res.end('500: ' + e.message);
+  }
+}).listen(PORT, () => {
+  console.log('Sandtable: http://localhost:' + PORT);
+  console.log('Project:', ROOT);
+});