Events javascript

site/_extensions/cookbook_gallery_generator.py

@@ -9,19 +9,14 @@ def main(app):
 
     title = "Cookbooks Gallery"
 
-    subtext = ""
-    with open("cookbook_gallery_subtext.md") as fid:
-        for line in fid:
-            subtext = subtext + line
-
     submit_btn_link = "https://projectpythia.org/cookbook-guide.html"
     submit_btn_txt = "How can I create a new Cookbook?"
     menu_html = generate_menu(
         repo_dicts, submit_btn_txt=submit_btn_txt, submit_btn_link=submit_btn_link
     )
 
     build_from_repos(
-        repo_dicts, "index", title=title, subtext=subtext, menu_html=menu_html
+        repo_dicts, "index", title=title, menu_html=menu_html
     )
 
 def setup(app):

site/_extensions/gallery_generator.py

@@ -269,8 +269,12 @@ def build_from_repos(
     grid = f"""
         # {title}
 
-        {stitle}
-        {stext}
+        <div class="subtext">
+            <p>Pythia Cookbooks provide example workflows on more advanced and domain-specific problems developed by the Pythia community. Cookbooks build on top of skills you learn in <a href="https://foundations.projectpythia.org/landing-page.html">Pythia Foundations</a>.</p>
+            <p>Cookbooks are created from Jupyter Notebooks that we strive to binderize so each Cookbook can be <a href="https://foundations.projectpythia.org/preamble/how-to-use.html#interacting-with-jupyter-notebooks-in-the-cloud-via-binder">executed in the cloud with a single click from your browser</a>, but in some instances executing a Cookbook will require <a href="https://foundations.projectpythia.org/preamble/how-to-use.html#interacting-with-jupyter-books-locally">running the notebooks locally</a>.</p>
+            <p>Interested in contributing a new Cookbook or contributing to an existing Cookbook? Great! Please see the <a href="https://github.com/ProjectPythia/.github/blob/main/.github/CONTRIBUTING.md">Project Pythia Cookbook Contributor's Guide</a>, and consider opening a discussion under the <a href="https://discourse.pangeo.io/c/education/project-pythia/60">Project Pythia category of the Pangeo Discourse</a>.</p>
+        </div>
+
 
         {menu_html}
 

site/_static/custom.js

@@ -11,13 +11,16 @@ function getClassOfCheckedCheckboxes(checkboxes) {
 function change() {
   console.log("Change event fired.");
   var domainsCbs = document.querySelectorAll(".domains input[type='checkbox']");
+  var eventsCbs = document.querySelectorAll(".events input[type='checkbox']");
   var packagesCbs = document.querySelectorAll(".packages input[type='checkbox']");
 
   var domainTags = getClassOfCheckedCheckboxes(domainsCbs);
+  var eventTags = getClassOfCheckedCheckboxes(eventsCbs);
   var packageTags = getClassOfCheckedCheckboxes(packagesCbs);
 
   var filters = {
     domains: domainTags,
+    events: eventTags,
     packages: packageTags
   };
 
@@ -31,13 +34,22 @@ function filterResults(filters) {
   rElems.forEach(function (el) {
     var isVisible = true; // Assume visible by default
 
-    // Check if the element has any domain or package filter
-    if (filters.domains.length > 0 || filters.packages.length > 0) {
-      var hasMatchingDomain = filters.domains.length === 0 || filters.domains.some(domain => el.classList.contains(domain));
-      var hasMatchingPackage = filters.packages.length === 0 || filters.packages.some(package => el.classList.contains(package));
+    // Check for matching domains
+    if (filters.domains.length > 0) {
+      var hasMatchingDomain = filters.domains.some(domain => el.classList.contains(domain));
+      isVisible = isVisible && hasMatchingDomain;
+    }
+
+    // Check for matching events
+    if (filters.events.length > 0) {
+      var hasMatchingEvent = filters.events.some(event => el.classList.contains(event));
+      isVisible = isVisible && hasMatchingEvent;
+    }
 
-      // The element should be visible if it matches any filter within each category
-      isVisible = hasMatchingDomain && hasMatchingPackage;
+    // Check for matching packages
+    if (filters.packages.length > 0) {
+      var hasMatchingPackage = filters.packages.some(package => el.classList.contains(package));
+      isVisible = isVisible && hasMatchingPackage;
     }
 
     // Toggle visibility based on the result
@@ -88,4 +100,4 @@ function clearCbs() {
 // Initial call to set up correct margins when the page loads
 document.addEventListener('DOMContentLoaded', updateMargins);
 
-console.log("Script loaded.");
+console.log("Script loaded.");