🚀 Add Structures Template (#27)

Author: AyhamAl-Ali

doc-templates/css/styles.css

@@ -119,6 +119,10 @@ html {
 
 body {
     font-family: "Poppins", sans-serif;
+    overflow: hidden;
+}
+
+#docs-body {
     background-color: var(--bg-color);
     display: grid;
     /*
@@ -256,6 +260,18 @@ a:visited {
     color: white;
 }
 
+.type-Structure {
+    border-left: 5px solid rgb(0, 219, 255);
+}
+
+.type-Structure .item-type {
+    color: rgb(0, 219, 255);
+}
+
+.type-Structure .item-examples p {
+    background-color: rgb(0, 219, 255);
+}
+
 /* Pattern right section list items */
 
 .item-details:nth-child(1) ul li:nth-child(odd) {
@@ -669,7 +685,7 @@ td ul {
 
 
 @media (max-width: 1200px) {
-    body {
+    #docs-body {
         grid-template-columns: 20% minmax(80%, 100%);
     }
 
@@ -712,7 +728,7 @@ td ul {
 
 
 @media (max-width: 1024px) {
-    body {
+    #docs-body {
         grid-template-columns: 20% minmax(80%, 100%);
     }
 
@@ -724,7 +740,7 @@ td ul {
 }
 
 @media (max-width: 768px) {
-    body {
+    #docs-body {
         grid-template-columns: 20% minmax(80%, 100%);
     }
 
@@ -751,7 +767,7 @@ td ul {
 }
 
 @media (max-width: 550px) {
-    body {
+    #docs-body {
         grid-template-columns: 0 100%;
     }
 
@@ -1168,7 +1184,7 @@ pre code { /* override styling for code blocks */
 
 #cookies-bar {
     position: sticky;
-    margin: 0 -8vw;
+    margin: 0;
     bottom: 0;
     background-color: #353535;
     color: white;

doc-templates/events.html

@@ -1,5 +1,12 @@
 <h1 id="nav-title">Events</h1>
 
 <div id="content">
+
+  <p class="box-title-red">Note:</p>
+  <p class="box-red" style="margin-bottom: 25px;">
+    You can specify the event priority after each event syntax using the following syntax <code>[with priority (lowest|low|normal|high|highest|monitor)]</code> e.g. <code>on spawn with priority lowest</code>.<br>
+    Note that not all of the events support event priority feature and they will throw an error.
+  </p>
+  
   ${generate events desc_full.html}
 </div>

doc-templates/js/main.js

@@ -90,7 +90,7 @@ document.querySelectorAll(".new-element").forEach((e) => {
 // <> Search Bar
 const versionComparePattern = /.*?(\d\.\d(?:\.\d|))(\+|-|).*/gi;
 const versionPattern = / ?v(?:ersion|):(\d\.\d(?:\.\d|-(?:beta|alpha|dev)\d*|))(\+|-|)/gi;
-const typePattern = / ?t(?:ype|):(condition|expression|type|effect|event|section|effectsection|function)/gi;
+const typePattern = / ?t(?:ype|):(\w+)/gi;
 const newPattern = / ?is:(new)/gi;
 const resultsFoundText = "result(s) found";
 
@@ -241,7 +241,7 @@ function searchNow(value = "") {
       let regex = new RegExp(searchValue, "gi")
       let name = document.querySelectorAll(`#${e.id} .item-title h1`)[0].textContent // Syntax Name
       let desc = document.querySelectorAll(`#${e.id} .item-description`)[0].textContent // Syntax Desc
-	  let keywords = e.getAttribute("data-keywords")
+      let keywords = e.getAttribute("data-keywords")
       let id = e.id // Syntax ID
       let filtersFound = false;
 
@@ -285,7 +285,7 @@ function searchNow(value = "") {
         filtersFound = true
 
       if ((regex.test(pattern.textContent.replaceAll("[ ]", " ")) || regex.test(name) ||
-           regex.test(desc) || regex.test(keywords) || "#" + id == searchValue || searchValue == "") && filtersFound) { // Replacing '[ ]' will improve some searching cases such as 'off[ ]hand'
+           regex.test(desc) || regex.test(keywords) || "#" + id.toLowerCase() == searchValue.toLowerCase() || searchValue == "") && filtersFound) { // Replacing '[ ]' will improve some searching cases such as 'off[ ]hand'
         pass = true
         break; // Performance
       }
@@ -390,7 +390,7 @@ if (examples) {
 
 // <> Cookies Accecpt
 if (!isCookiesAccepted) {
-  content.insertAdjacentHTML('beforeend', `<div id="cookies-bar"> <p> We use cookies and local storage to enhance your browsing experience and store github related statistics. By clicking "Accept", you consent to our use of cookies and local storage. </p><div style="padding: 10px; white-space: nowrap;"> <button id="cookies-accept">Accept</button> <button id="cookies-deny">Deny</button> </div></div>`);
+  document.body.insertAdjacentHTML('beforeend', `<div id="cookies-bar"> <p> We use cookies and local storage to enhance your browsing experience and store github related statistics. By clicking "Accept", you consent to our use of cookies and local storage. </p><div style="padding: 10px; white-space: nowrap;"> <button id="cookies-accept">Accept</button> <button id="cookies-deny">Deny</button> </div></div>`);
 }
 
 let cookiesBar = document.querySelector("#cookies-bar");;

doc-templates/structures.html

@@ -0,0 +1,6 @@
+<h1 id="nav-title">Structures</h1>
+
+<div id="content">
+
+  ${generate structures desc_full.html}
+</div>

doc-templates/template.html

@@ -35,17 +35,20 @@
 
 </head>
 <body>
-  <!-- loaded inside body without defer to fix theme flicker -->
-  <script src="./js/theme-switcher.js"></script>
-
-  ${include navbar.html}
-  <nav id="side-nav">
-    <div id="nav-contents">
-      ${generate ${pagename} desc_nav.html}
-    </div>
-  </nav>
-
-  ${content}
+  <div id="docs-body">
+    <!-- loaded inside body without defer to fix theme flicker -->
+    <script src="./js/theme-switcher.js"></script>
+
+    ${include navbar.html}
+    <nav id="side-nav">
+      <div id="nav-contents">
+        ${generate ${pagename} desc_nav.html}
+      </div>
+    </nav>
+
+    ${content}
 
+
+  </div>
 </body>
 </html>

doc-templates/templates/desc_full.html

@@ -14,6 +14,19 @@ <h1 style="display: inline-block">${element.name}</h1> <a href="#${element.id}"
         </td>
       </tr>
 
+      ${if structure-required-entrydata}
+      <tr class="item-details">
+        <td class="item-table-label">Required Entries:</td>
+        <td>${element.structure-required-entrydata}</td>
+      </tr>
+
+      ${end} ${if structure-optional-entrydata}
+      <tr class="item-details">
+        <td class="item-table-label">Optional Entries:</td>
+        <td>${element.structure-optional-entrydata}</td>
+      </tr>
+
+      ${end}
       <tr class="item-details">
         <td class="item-table-label">Since:</td>
         <td>${element.since}</td>

doc-templates/templates/navbar.html

@@ -10,6 +10,7 @@
       <a href="effects.html">Effects</a>
       <a href="expressions.html">Expressions</a>
       <a href="classes.html">Types</a>
+      <a href="structures.html">Structures</a>
       <a href="functions.html">Functions</a>
     </div>
   </div>