test

kiannp44 · May 22, 2023 · 1857924 · 1857924
1 parent 73b3a99
commit 1857924
Showing 1 changed file with 121 additions and 0 deletions.
diff --git a/_notebooks/2023-05-16-jstest.ipynb b/_notebooks/2023-05-16-jstest.ipynb
@@ -737,6 +737,127 @@
     "</body>\n",
     "</html>"
    ]
+  },
+  {
+   "attachments": {},
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "<script lang=\"ts\">\n",
+    "    import Card from \"../../../components/Card.svelte\";\n",
+    "</script>\n",
+    "\n",
+    "<div id=\"myBtnContainer\" class=\"bg-green-700\">\n",
+    "    <button class=\"btn active\" onclick=\"filterSelection('all')\"> Show all</button>\n",
+    "    <button class=\"btn\" onclick=\"filterSelection('mncs')\"> Methods and Control Structures</button>\n",
+    "    <button class=\"btn\" onclick=\"filterSelection('classes')\"> Classes</button>\n",
+    "    <button class=\"btn\" onclick=\"filterSelection('arrays')\"> Array/ArrayList</button>\n",
+    "    <button class=\"btn\" onclick=\"filterSelection('2d')\"> 2D Array</button>\n",
+    "  </div>\n",
+    "\n",
+    "  <style>\n",
+    "    .filterDiv {\n",
+    "      float: left;\n",
+    "      background-color: #2196F3;\n",
+    "      color: #ffffff;\n",
+    "      width: 100px;\n",
+    "      line-height: 100px;\n",
+    "      text-align: center;\n",
+    "      margin: 2px;\n",
+    "      display: none;\n",
+    "    }\n",
+    "    \n",
+    "    .show {\n",
+    "      display: block;\n",
+    "    }\n",
+    "    \n",
+    "    .container {\n",
+    "      margin-top: 20px;\n",
+    "      overflow: hidden;\n",
+    "    }\n",
+    "    \n",
+    "    /* Style the buttons */\n",
+    "    .btn {\n",
+    "      border: none;\n",
+    "      outline: none;\n",
+    "      padding: 12px 16px;\n",
+    "      background-color: #f1f1f1;\n",
+    "      cursor: pointer;\n",
+    "    }\n",
+    "    \n",
+    "    .btn:hover {\n",
+    "      background-color: #ddd;\n",
+    "    }\n",
+    "    \n",
+    "    .btn.active {\n",
+    "      background-color: #666;\n",
+    "      color: white;\n",
+    "    }\n",
+    "    </style>\n",
+    "\n",
+    "<script>\n",
+    "    filterSelection(\"all\")\n",
+    "    function filterSelection(c) {\n",
+    "      var x, i;\n",
+    "      x = document.getElementsByClassName(\"filterDiv\");\n",
+    "      if (c == \"all\") c = \"\";\n",
+    "      for (i = 0; i < x.length; i++) {\n",
+    "        w3RemoveClass(x[i], \"show\");\n",
+    "        if (x[i].className.indexOf(c) > -1) w3AddClass(x[i], \"show\");\n",
+    "      }\n",
+    "    }\n",
+    "    \n",
+    "    function w3AddClass(element, name) {\n",
+    "      var i, arr1, arr2;\n",
+    "      arr1 = element.className.split(\" \");\n",
+    "      arr2 = name.split(\" \");\n",
+    "      for (i = 0; i < arr2.length; i++) {\n",
+    "        if (arr1.indexOf(arr2[i]) == -1) {element.className += \" \" + arr2[i];}\n",
+    "      }\n",
+    "    }\n",
+    "    \n",
+    "    function w3RemoveClass(element, name) {\n",
+    "      var i, arr1, arr2;\n",
+    "      arr1 = element.className.split(\" \");\n",
+    "      arr2 = name.split(\" \");\n",
+    "      for (i = 0; i < arr2.length; i++) {\n",
+    "        while (arr1.indexOf(arr2[i]) > -1) {\n",
+    "          arr1.splice(arr1.indexOf(arr2[i]), 1);     \n",
+    "        }\n",
+    "      }\n",
+    "      element.className = arr1.join(\" \");\n",
+    "    }\n",
+    "    \n",
+    "    // Add active class to the current button (highlight it)\n",
+    "    var btnContainer = document.getElementById(\"myBtnContainer\");\n",
+    "    var btns = btnContainer.getElementsByClassName(\"btn\");\n",
+    "    for (var i = 0; i < btns.length; i++) {\n",
+    "      btns[i].addEventListener(\"click\", function(){\n",
+    "        var current = document.getElementsByClassName(\"active\");\n",
+    "        current[0].className = current[0].className.replace(\" active\", \"\");\n",
+    "        this.className += \" active\";\n",
+    "      });\n",
+    "    }\n",
+    "</script>\n",
+    "\n",
+    "<div class=\"flex flex-wrap w-screen h-full min-h-screen py-24 px-8 gap-10 bg-green-600\">\n",
+    "\n",
+    "    <Card title=\"2018 FRQ 3A\" text=\"Run code for this FRQ\" link=\"2018A\" level=\"0\" class=\"filterDiv mncs\"/>\n",
+    "\n",
+    "    <Card title=\"2018 FRQ 3B\" text=\"Run code for this FRQ\" link=\"2018B\" level=\"1\" class=\"filterDiv mncs\"/>\n",
+    "\n",
+    "    <Card title=\"2017 FRQ 4A\" text=\"Run code for this FRQ\" link=\"2017A\" level=\"2\" class=\"filterDiv classes\"/>\n",
+    "\n",
+    "    <Card title=\"2017 FRQ 4B\" text=\"Run code for this FRQ\" link=\"2017B\" level=\"3\" class=\"filterDiv classes\"/>\n",
+    "\n",
+    "    <Card title=\"2016 FRQ A\" text=\"Run code for this FRQ\" link=\"2016A\" level=\"4\" class=\"filterDiv arrays\"/>\n",
+    "\n",
+    "    <Card title=\"2016 FRQ B\" text=\"Run code for this FRQ\" link=\"2016B\" level=\"5\" class=\"filterDiv 2d\"/>\n",
+    "\n",
+    "    <Card title=\"Extra Credit\" text=\"Run code for this FRQ\" link=\"extra\" level=\"6\" class=\"filterDiv 2d\"/>\n",
+    "\n",
+    "</div>"
+   ]
   }
  ],
  "metadata": {