Add dynamic publication list

website_files/Communities/Researchers_network.md

@@ -1,3 +1,5 @@
+<link rel="stylesheet" href="../../pubs.css" />
+
 # STACK Researchers Network
 
 The STACK Researchers Network brings together education researchers with an interest in computer-aided assessment tools such as STACK.
@@ -54,15 +56,16 @@ If you would like to join the Network, please
 </div>
 
 <div class="row">
-	<div class="col-md-auto"><img class="img-profile-pic" src="../../img/people/Ben-Davies.jpg" alt="Ben Davies"></div>
+	<div class="col-md-auto"><img class="img-profile-pic" src="../../img/people/StephanBach.jpg" alt="Stephan Bach"></div>
     <div class="col">
-		<h4>Dr Ben Davies</h4>
-		<p>Uniersity of Southampton, UK<br />
-		  <a href="mailto:Ben.Davies@soton.ac.uk">Ben.Davies@soton.ac.uk</a>
+		<h4>Stephan Bach</h4>
+		<p>Ostbayerische Technische Hochschule Amberg-Weiden, Germany<br />
+		  <a href="mailto:s.bach@oth-aw.de">s.bach@oth-aw.de</a>
 		</p>
 		<p>Interests:
-			<span class="badge badge-pill badge-light">Proof</span>
 			<span class="badge badge-pill badge-light">Feedback</span>
+			<span class="badge badge-pill badge-light">Cognitive engagement</span>
+			<span class="badge badge-pill badge-light">Engineering mathematics</span>
 		</p>
 	</div>
 </div>
@@ -80,6 +83,40 @@ If you would like to join the Network, please
 	</div>
 </div>
 
+<div class="row">
+	<div class="col-md-auto"><img class="img-profile-pic" src="../../img/people/Ben-Davies.jpg" alt="Ben Davies"></div>
+    <div class="col">
+		<h4>Dr Ben Davies</h4>
+		<p>Uniersity of Southampton, UK<br />
+		  <a href="mailto:Ben.Davies@soton.ac.uk">Ben.Davies@soton.ac.uk</a>
+		</p>
+		<p>Interests:
+			<span class="badge badge-pill badge-light">Proof</span>
+			<span class="badge badge-pill badge-light">Feedback</span>
+		</p>
+	</div>
+</div>
+
+<div class="row">
+	<div class="col-md-auto"><img class="img-profile-pic" src="../../img/people/FedericoDogo.jpeg" alt="Federico Dogo"></div>
+    <div class="col">
+		<h4>Federico Dogo</h4>
+		<p>University of Trieste, Italy<br />
+		  <a href="mailto:federico.dogo@inaf.it">federico.dogo@inaf.it</a>
+		</p>
+	</div>
+</div>
+
+<div class="row">
+	<div class="col-md-auto"><img class="img-profile-pic" src="../../img/people/DanielDoz.jpg" alt="Daniel Doz"></div>
+    <div class="col">
+		<h4>Daniel Doz</h4>
+		<p>University of Primorska, Slovenia<br />
+		  <a href="mailto:Daniel.Doz@pef.upr.si">Daniel.Doz@pef.upr.si</a>
+		</p>
+	</div>
+</div>
+
 <div class="row">
 	<div class="col-md-auto"><img class="img-profile-pic" src="../../img/people/Ian-Jones.png" alt="Ian Jones"></div>
     <div class="col">
@@ -181,23 +218,201 @@ If you would like to join the Network, please
 
 ## Research publications
 
-Members of the STACK Researchers Network have contributed to the following studies related to STACK:
-
-* Davies, B., Crisan, C., Geraniou, E., & Smart, T. (2024). A Department-Wide Transition to a New Mode of Computer-Aided Assessment Using STACK. _International Journal of Research in Undergraduate Mathematics Education_. <https://doi.org/10.1007/s40753-024-00251-5>s
-
-* Kinnear, G. (2024). Comparing example generation with classification in the learning of new mathematics concepts. _Research in Mathematics Education, 26_(1), 109–132. <https://doi.org/10.1080/14794802.2022.2152086>
-
-* Kinnear, G., Iannone, P., & Davies, B. (2024). Student approaches to generating mathematical examples: Comparing e-assessment and paper-based tasks. _Educational Studies in Mathematics_. <https://doi.org/10.1007/s10649-024-10361-1>
-
-* Kinnear, G., Jones, I., Sangwin, C., Alarfaj, M., Davies, B., Fearn, S., Foster, C., Heck, A., Henderson, K., Hunt, T., Iannone, P., Kontorovich, I., Larson, N., Lowe, T., Meyer, J. C., O’Shea, A., Rowlett, P., Sikurajapathi, I., & Wong, T. (2024). A collaboratively-derived research agenda for E-assessment in undergraduate mathematics. _International Journal of Research in Undergraduate Mathematics Education, 10_(1), 201–231. <https://doi.org/10.1007/s40753-022-00189-6>
-
-* Kinnear, G., Wood, A. K., & Gratwick, R. (2022). Designing and evaluating an online course to support transition to university mathematics. _International Journal of Mathematical Education in Science and Technology, 53_(1), 11–34. <https://doi.org/10.1080/0020739X.2021.1962554>
-
-* Sangwin, C. J. (2013). Computer Aided Assessment of Mathematics, Oxford University Press (ISBN 978-0-19-966035-3)
-
-Further examples of research related to STACK can be found in the [list of STACK publications](https://docs.stack-assessment.org/content/stack_publications.pdf).
-
-## Meeting notes
-
-Notes from our regular meetings are available on the [archive of meeting reports](/MeetingReports).
+Many of the following studies were carried out by members of the Researchers Network.
+
+<div id="stack-pubs">
+
+  <!-- Shown only when JavaScript is unavailable -->
+  <noscript id="stack-pubs-fallback">
+    <p>
+      <a href="https://github.com/maths/moodle-qtype_stack/blob/master/doc/content/stack_publications.pdf" class="btn btn-primary btn-lg">
+        <i class="fa-regular fa-file-lines"></i> List of publications related to STACK
+      </a>
+    </p>
+  </noscript>
+
+  <!-- Hidden by CSS until JS reveals it after a successful load -->
+  <div class="controls" id="pub-controls">
+    <input type="search" id="pub-search"
+           placeholder="Search publications by author, title, year…"
+           autocomplete="off" spellcheck="false">
+    <div class="meta" id="pub-count"></div>
+  </div>
+
+  <!-- Left empty in HTML; JS either fills it or shows the fallback link -->
+  <div id="pub-list"></div>
+</div>
 
+<!-- Bundled citation.js (core + bibtex + csl plugins). Pinned for stability. -->
+<script src="https://cdn.jsdelivr.net/npm/citation-js@0.7.14"></script>
+
+<script>
+(function () {
+  "use strict";
+
+  const BIB_URL =
+    "https://raw.githubusercontent.com/maths/moodle-qtype_stack/master/doc/content/stack.bib";
+
+  const listEl     = document.getElementById("pub-list");
+  const searchEl   = document.getElementById("pub-search");
+  const countEl    = document.getElementById("pub-count");
+  const controlsEl = document.getElementById("pub-controls");
+
+  // Set loading message via JS so it never appears when JS is disabled
+  listEl.innerHTML = '<div class="status">Loading publications…</div>';
+
+  // citation-js UMD exposes a browserify-style require()
+  const Cite = (typeof require === "function")
+    ? require("citation-js")
+    : window.Cite;
+
+  let PUBS = []; // { html, text, year }
+
+  function esc(s) {
+    return String(s).replace(/[&<>"']/g, c => ({
+      "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;"
+    }[c]));
+  }
+
+  function getYear(entry) {
+    const dp = entry.issued && entry.issued["date-parts"];
+    if (dp && dp[0] && dp[0][0]) return parseInt(dp[0][0], 10);
+    return null;
+  }
+
+  // Build a plain-text blob per entry for searching.
+  function searchText(entry) {
+    const parts = [];
+    (entry.author || []).forEach(a =>
+      parts.push([a.given, a.family, a.literal].filter(Boolean).join(" ")));
+    (entry.editor || []).forEach(a =>
+      parts.push([a.given, a.family, a.literal].filter(Boolean).join(" ")));
+    ["title", "container-title", "publisher", "DOI", "URL",
+     "collection-title", "abstract", "keyword"].forEach(k => {
+      if (entry[k]) parts.push(entry[k]);
+    });
+    const y = getYear(entry);
+    if (y) parts.push(String(y));
+    return parts.join(" ").toLowerCase();
+  }
+
+  // Turn bare URLs (incl. https://doi.org/… ) in the rendered text into links.
+  // Operates only on text between tags, so it never touches existing markup.
+  function linkify(html) {
+    return html.replace(/>([^<]+)</g, (m, txt) => {
+      const linked = txt.replace(
+        /(https?:\/\/[^\s<>"')\]]+)/g,
+        (url) => {
+          const clean = url.replace(/[.,;:]+$/, "");   // drop trailing punctuation
+          const trail = url.slice(clean.length);       // …but keep it after the link
+          return '<a href="' + clean + '" target="_blank" rel="noopener noreferrer">' +
+                 esc(clean) + "</a>" + trail;
+        }
+      );
+      return ">" + linked + "<";
+    });
+  }
+
+  async function load() {
+
+    let bibText;
+    try {
+      const resp = await fetch(BIB_URL, { cache: "no-cache" });
+      if (!resp.ok) throw new Error("HTTP " + resp.status);
+      bibText = await resp.text();
+    } catch (_) {
+      listEl.innerHTML = 
+        '<div class="status error">Unable to load the interactive bibliography.</div>'
+		+ document.getElementById("stack-pubs-fallback").innerHTML;
+	  listEl.style.display = "block";
+      return;
+    }
+
+    let cite;
+    try {
+      cite = new Cite(bibText);
+    } catch (err) {
+      listEl.innerHTML =
+        '<div class="status error">Could not parse the bibliography file.</div>';
+      return;
+    }
+
+    PUBS = cite.data.map(entry => {
+      let html = new Cite(entry).format("bibliography", {
+        format: "html",
+        template: "apa",
+        lang: "en-US"
+      });
+      html = linkify(html);            // ← make DOIs / URLs clickable
+      return {
+        html: html,
+        text: searchText(entry),
+        year: getYear(entry)
+      };
+    });
+
+
+    // Newest first; undated entries at the end.
+    PUBS.sort((a, b) => (b.year || -Infinity) - (a.year || -Infinity));
+
+    // reveal the search box now that we have data to search
+    controlsEl.style.display = "block";
+    listEl.style.display = "block";
+    searchEl.disabled = false;
+
+    render("");
+  }
+
+  function highlight(html, query) {
+    if (!query) return html;
+    // Highlight only inside text nodes, never inside tags/attributes.
+    const terms = query.split(/\s+/).filter(Boolean)
+      .map(t => t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"));
+    if (!terms.length) return html;
+    const re = new RegExp("(" + terms.join("|") + ")", "gi");
+    return html.replace(/>([^<]+)</g, (m, txt) =>
+      ">" + txt.replace(re, "<mark>$1</mark>") + "<");
+  }
+
+  function render(query) {
+    const q = query.trim().toLowerCase();
+    const terms = q.split(/\s+/).filter(Boolean);
+
+    const matches = PUBS.filter(p =>
+      terms.every(t => p.text.includes(t)));
+
+    if (!matches.length) {
+      listEl.innerHTML =
+        '<div class="status">No publications match “' + esc(query) + '”.</div>';
+      countEl.textContent = "0 of " + PUBS.length + " publications";
+      return;
+    }
+
+    let out = "";
+    let currentYear;
+    matches.forEach(p => {
+      const y = p.year || "Undated";
+      if (y !== currentYear) {
+        currentYear = y;
+        out += '<h2 class="year">' + esc(currentYear) + "</h2>";
+      }
+      out += '<div class="pub">' + highlight(p.html, q) + "</div>";
+    });
+
+    listEl.innerHTML = out;
+    countEl.textContent =
+      matches.length === PUBS.length
+        ? PUBS.length + " publications"
+        : matches.length + " of " + PUBS.length + " publications";
+  }
+
+  let debounce;
+  searchEl.addEventListener("input", e => {
+    clearTimeout(debounce);
+    const v = e.target.value;
+    debounce = setTimeout(() => render(v), 120);
+  });
+
+  load();
+})();
+</script>

website_files/pubs.css

@@ -0,0 +1,76 @@
+  :root {
+    --accent: #0b5394;
+    --border: #e2e2e2;
+    --muted: #666;
+  }
+  #stack-pubs {
+    /*font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;*/
+    /*max-width: 860px;*/
+    margin: 0 auto;
+    color: #222;
+    line-height: 1.5;
+  }
+  #stack-pubs #pub-list {
+	display: none; /* un-hidden when the JS loads */
+	max-height: 30em;
+    overflow-y: scroll;
+    border: 1px solid #ccc;
+    border-radius: 6px;
+    padding: 0.5em;
+  }
+  #stack-pubs .controls {
+	display: none; /* un-hidden when the JS loads */
+    position: sticky;
+    top: 0;
+    background: #fff;
+    padding: 0 0 12px;
+    z-index: 5;
+  }
+  #stack-pubs input[type="search"] {
+    width: 100%;
+    box-sizing: border-box;
+    padding: 10px 14px;
+    font-size: 1rem;
+    border: 1px solid #bbb;
+    border-radius: 6px;
+  }
+  #stack-pubs input[type="search"]:focus {
+    outline: none;
+    border-color: var(--accent);
+    box-shadow: 0 0 0 3px rgba(11,83,148,.15);
+  }
+  #stack-pubs .meta {
+    font-size: .85rem;
+    color: var(--muted);
+    margin: 6px 2px 0;
+  }
+  #stack-pubs h2.year {
+    font-size: 1.15rem;
+    border-bottom: 1px solid var(--border);
+    padding-bottom: 4px;
+    margin: 28px 0 10px;
+  }
+  #stack-pubs .pub {
+    padding: 0 4px 10px 0;
+    font-size: .95rem;
+  }
+  /* citation.js wraps each entry in .csl-entry */
+  #stack-pubs .csl-entry {
+	display: block;
+	text-indent: -2em;
+    margin-left: 2em;
+  }
+  #stack-pubs .pub a {
+    color: var(--accent);
+    word-break: break-word;
+  }
+  #stack-pubs mark {
+    background: #fff3b0;
+    padding: 0 1px;
+  }
+  #stack-pubs .status {
+    padding: 20px 4px;
+    color: var(--muted);
+    font-style: italic;
+  }
+  #stack-pubs .status.error { color: #b00020; font-style: normal; }