Spaces:

ProfRick
/

colloquium-gallery

Running

App Files Files Community

ProfRick commited on Sep 16, 2025

Commit

5be130f

verified ·

1 Parent(s): f1a5a74

Update index.html

Browse files

Files changed (1) hide show

index.html +141 -2

index.html CHANGED Viewed

@@ -1,3 +1,142 @@
 <!doctype html>
-<html><head><meta charset="utf-8"><title>Test</title></head>
-<body><h1>It works 🎉</h1><p>Static Space is serving index.html.</p></body></html>

 <!doctype html>
+<html lang="en">
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+  <meta charset="utf-8"/>
+  <meta name="viewport" content="width=device-width,initial-scale=1"/>
+  <title>Teaching Colloquium - AI Tools and Grading</title>
+  <style>
+    :root { --fg:#1a1a1a; --muted:#666; --card:#fff; --line:#e6e6e6; --accent:#1E4D2B; --btn:#1a1a1a; }
+    * { box-sizing: border-box; }
+    body { margin: 20px; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; color: var(--fg); line-height: 1.45; }
+    h1 { font-size: 1.6rem; margin: 0 0 10px; }
+    h2 { margin: 16px 0 8px; }
+    p { margin: 0 0 10px; color: var(--muted); }
+    .band { background: var(--accent); color: #fff; border-radius: 12px; padding: 18px 16px; margin-bottom: 16px; }
+    .kicker { font-size: 0.9rem; letter-spacing: 0.02em; opacity: 0.95; }
+    .section { margin: 18px 0 8px; }
+    .grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin-top: 8px; }
+    .card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
+    a.button { display: inline-block; margin-top: 8px; padding: 8px 12px; border: 1px solid var(--btn); border-radius: 8px; text-decoration: none; color: var(--btn); }
+    table { border-collapse: collapse; width: 100%; margin-top: 8px; }
+    th, td { border: 1px solid var(--line); padding: 6px; text-align: left; font-size: 0.95rem; }
+    th { background: #f6f6f6; }
+    .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size: 0.9rem; }
+    .note { color: var(--muted); font-size: 0.9rem; }
+  </style>
+</head>
+<body>
+  <div class="band">
+    <div class="kicker">Colorado State University - HES 419</div>
+    <h1>AI-Created Learning Tools and AI Grading Assistance</h1>
+    <p>Scan once, browse everything: interactive tool overview and autograding materials.</p>
+  </div>
+  <!-- Section 1: AI-Created Learning Tools -->
+  <div class="section" id="learning-tools">
+    <h2>1) AI-Created Learning Tools</h2>
+    <p><small>One-page preview of the interactive tool used in class.</small></p>
+    <div class="grid">
+      <div class="card">
+        <h3>Interactive Tool (PDF)</h3>
+        <p>Quick tour of the student-facing activity (tolerance, dependence, SUD criteria, withdrawal).</p>
+        <a class="button" href="./interactive_tool.pdf" target="_blank" rel="noopener">Open PDF</a>
+      </div>
+    </div>
+  </div>
+  <!-- Section 2: AI Grading Assistance -->
+  <div class="section" id="grading">
+    <h2>2) AI Grading Assistance</h2>
+    <p><small>See the rubric formatted for autograding and an example of the graded output.</small></p>
+    <div class="grid">
+      <div class="card">
+        <h3>Autograder-Friendly Rubric</h3>
+        <p>Criteria and weights aligned to learning objectives; PDF format.</p>
+        <a class="button" href="./autograder_friendly_rubric.pdf" target="_blank" rel="noopener">Open Rubric (PDF)</a>
+      </div>
+      <div class="card">
+        <h3>Grading Output (CSV)</h3>
+        <p>Example of AI-assisted scoring output with itemized feedback.</p>
+        <p class="mono"><a class="button" href="./autograding_example.csv" target="_blank" rel="noopener">Download CSV</a></p>
+        <div id="csv-preview">
+          <small>Inline preview:</small>
+          <div id="csv-table">Loading...</div>
+        </div>
+        <p class="note">If the preview does not load on your device, use the Download CSV button above.</p>
+      </div>
+    </div>
+  </div>
+  <p class="note" style="margin-top:20px">
+    Questions? Ask about reliability evidence, Canvas flows, and auto-download certificates.
+  </p>
+  <script>
+    // Simple CSV parser for comma-separated rows with optional quotes.
+    function parseCSV(text) {
+      const rows = [];
+      let i = 0, field = '', row = [], inQuotes = false;
+      while (i < text.length) {
+        const c = text[i];
+        if (inQuotes) {
+          if (c === '"') {
+            if (text[i+1] === '"') { field += '"'; i++; } else { inQuotes = false; }
+          } else { field += c; }
+        } else {
+          if (c === ',') { row.push(field); field = ''; }
+          else if (c === '\n' || c === '\r') {
+            if (c === '\n') { row.push(field); rows.push(row); row = []; field = ''; }
+          } else if (c === '"') { inQuotes = true; }
+          else { field += c; }
+        }
+        i++;
+      }
+      if (field.length || row.length) { row.push(field); rows.push(row); }
+      return rows.filter(r => r.length && r.some(cell => cell.trim().length));
+    }
+    async function loadCSV() {
+      try {
+        const res = await fetch('./autograding_example.csv', { cache: 'no-store' });
+        if (!res.ok) throw new Error('Fetch failed');
+        const text = await res.text();
+        const normalized = text.replace(/\r\n/g, '\n');
+        const rows = parseCSV(normalized);
+        if (!rows.length) throw new Error('No rows');
+        const header = rows[0];
+        const body = rows.slice(1);
+        const table = document.createElement('table');
+        const thead = document.createElement('thead');
+        const trh = document.createElement('tr');
+        header.forEach(h => { const th = document.createElement('th'); th.textContent = h; trh.appendChild(th); });
+        thead.appendChild(trh);
+        table.appendChild(thead);
+        const tbody = document.createElement('tbody');
+        body.forEach(r => {
+          const tr = document.createElement('tr');
+          header.forEach((_, idx) => {
+            const td = document.createElement('td');
+            td.textContent = (r[idx] ?? '').trim();
+            tr.appendChild(td);
+          });
+          tbody.appendChild(tr);
+        });
+        table.appendChild(tbody);
+        const mount = document.getElementById('csv-table');
+        mount.innerHTML = '';
+        mount.appendChild(table);
+      } catch (e) {
+        const mount = document.getElementById('csv-table');
+        mount.textContent = 'Preview unavailable (file missing or blocked). You can still use the Download CSV button above.';
+      }
+    }
+    loadCSV();
+  </script>
+</body>
+</html>