JEMcats-Software · JEMcats · Sep 14, 2025 · Sep 13, 2025 · Sep 13, 2025 · Sep 13, 2025
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
@@ -2,6 +2,8 @@
 Thank you for contributing to our project!
 
 Please refrain from deleting any text from this template, unless specifically instructed to do so.
+
+Checkboxes are filled by doing: [x]
 -->
 
 ## Breaking Change
@@ -21,7 +23,7 @@ Classify the nature of your PR change.
 Please select only one option!
 If your PR requires multiple options, consider splitting it into multiple PRs to facilitate a more efficient and expedited code review process.
 -->
-
+- [ ] Demo Functionality (code that only affects the demo HTML page)
 - [ ] Bugfix (non-breaking change that resolves an issue)
 - [ ] New Feature (which introduces functionality to an existing function)
 - [ ] New Function (a new way to do something, for example make a pane of glass)
@@ -31,6 +33,7 @@ If your PR requires multiple options, consider splitting it into multiple PRs to
 <!--
 Provide detailed information that will assist JEMcats-Software in evaluating your PR.
 Please complete any applicable additional details.
+If un-used remove this section.
 -->
 
 - This PR addresses or resolves issue: 

diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml
@@ -49,7 +49,23 @@ jobs:
             -H "Content-Type: application/json" \
             -d "$(jq -n --arg tag "$tag" --arg title "$title" --arg description "$description" \
                 '{tag_name: $tag, target_commitish: "main", name: $title, body: $description, draft: false, prerelease: false}')" \
-            https://api.github.com/repos/JEMcats-Software/WebGlass/releases
+            https://api.github.com/repos/JEMcats-Software/WebGlass/releases --output release.json
+
+          upload_url=$(jq -r '.upload_url' release.json | sed "s/{?name,label}//")
+          echo "UPLOAD_URL=$upload_url" >> $GITHUB_ENV
+
+      - name: Upload WebGlass.js to Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          UPLOAD_URL: ${{ env.UPLOAD_URL }}
+          TITLE: ${{ github.event.inputs.title }}
+        run: |
+          upload_url="${UPLOAD_URL}?name=WebGlass-${TITLE}.js"
+          curl -X POST \
+            -H "Authorization: token $GITHUB_TOKEN" \
+            -H "Content-Type: application/octet-stream" \
+            --data-binary @WebGlass.js \
+            "$upload_url"
 
   upload-to-s3:
     runs-on: ubuntu-latest
@@ -86,11 +102,11 @@ jobs:
       # Sync contents to S3 bucket while excluding .github folder
       - name: Sync to S3
         run: |
-            aws s3 cp WebGlass.js s3://cdn.jemcats.software/WebGlass/${{ github.event.inputs.tag }}/WebGlass.js
-            aws s3 cp WebGlass.min.js s3://cdn.jemcats.software/WebGlass/${{ github.event.inputs.tag }}/WebGlass.min.js
-            aws s3 cp demo/ s3://jemcats.software/github_pages/WebGlass/ --recursive
+          aws s3 cp WebGlass.js s3://cdn.jemcats.software/WebGlass/${{ github.event.inputs.tag }}/WebGlass.js --content-type "text/javascript"
+          aws s3 cp WebGlass.min.js s3://cdn.jemcats.software/WebGlass/${{ github.event.inputs.tag }}/WebGlass.min.js --content-type "text/javascript"
+          aws s3 cp demo/ s3://jemcats.software/github_pages/WebGlass/ --recursive
 
       - name: Clear and Publish Latest to S3
         run: |
           aws s3 rm s3://cdn.jemcats.software/WebGlass/latest/ --recursive
-          aws s3 cp s3://cdn.jemcats.software/WebGlass/${{ github.event.inputs.tag }}/ s3://cdn.jemcats.software/WebGlass/latest/ --recursive
+          aws s3 cp s3://cdn.jemcats.software/WebGlass/${{ github.event.inputs.tag }}/ s3://cdn.jemcats.software/WebGlass/latest/ --recursive --content-type "text/javascript" --exclude "*" --include "*.js"
diff --git a/README.md b/README.md
@@ -86,7 +86,7 @@ Fork the ```dev``` branch.
 
 Make changes.
 
-Open pull request.
+Open pull request (PLEASE FILL OUT THE QUESTIONS!).
 
 ## License
 This project is licensed under the GPL-3.0 license.

diff --git a/demo/index.html b/demo/index.html
@@ -54,61 +54,9 @@
       line-height: 1.6;
     }
   </style>
-</head>
-
-<body>
-  <!-- <div class="overlay" id="overlay">
-  </div> -->
-  <div style="position: fixed; width: 200px; height: 200px; border-radius: 25px; z-index: 10; left: 20px; top: 15px;" id="test1"></div>
-  <div style="position: fixed; width: 200px; height: 200px; border-radius: 50px; z-index: 11; left: 250px; top: 15px;" id="test2"></div>
-  <div style="position: fixed; width: 200px; height: 200px; border-radius: 100px; z-index: 12; left: 480px; top: 15px;" id="test3"></div>
-  <div style="position: fixed; width: 200px; height: 200px; border-radius: 25px; z-index: 13; left: 20px; top: 250px;" id="test4"></div>
-  <div style="position: fixed; width: 200px; height: 200px; border-radius: 50px; z-index: 14; left: 250px; top: 250px;" id="test5"></div>
-  <div style="position: fixed; width: 200px; height: 200px; border-radius: 100px; z-index: 15; left: 480px; top: 250px;" id="test6"></div>
-  <img src="images/AS11-40-5865HR.webp" alt="" />
-  <img src="images/AS11-40-5872HR.webp" alt="" />
-  <img src="images/AS11-40-5877HR.webp" alt="" />
-  <img src="images/AS11-40-5899HR.webp" alt="" />
-  <img src="images/AS11-40-5902HR.webp" alt="" />
-  <img src="images/AS11-40-6642HR.webp" alt="" />
-
-  <p>
-    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Temporibus
-    ullam, saepe eos maiores, et recusandae quis incidunt, corrupti atque
-    eum ab fugiat? Recusandae illum iure, voluptate accusamus minus maxime
-    rem? Doloremque sint repudiandae unde quos ipsa alias, repellat nulla
-    recusandae quisquam commodi aliquid iusto, suscipit quidem et ratione
-    deleniti nisi nemo deserunt! Fuga dignissimos ea aspernatur, excepturi
-    voluptatem rerum quas. Consectetur consequuntur reprehenderit illum quod
-    alias commodi aliquam temporibus adipisci, atque sequi ducimus dolor
-    laboriosam expedita debitis nulla maxime nesciunt praesentium. Illum
-    labore molestiae necessitatibus quae voluptates illo a magnam. Dolorum
-    eveniet pariatur, ipsam veritatis libero sed consectetur reiciendis
-    laudantium aut quo maxime accusamus natus unde culpa architecto
-    repellendus, rem, iure ducimus! Corrupti corporis recusandae commodi
-    earum. Laudantium, nihil harum. Sequi ab, voluptate officiis quam et
-    accusantium fugiat laudantium odio ad! Perspiciatis voluptatum, illum
-    aut aliquid, tempore animi harum laboriosam sapiente commodi doloribus
-    rem laborum sequi, temporibus ab dolorum repellat!
-  </p>
-
-  <script src="https://cdn.jemcats.software/WebGlass/latest/WebGlass.min.js"></script>
   <script>
-    // Apply to your element
-    WebGlass.Glassify(document.getElementById('test1'), { preset: "Glass" })
-    WebGlass.Glassify(document.getElementById('test2'), { preset: "Frosted Glass" })
-    WebGlass.Glassify(document.getElementById('test3'), { preset: "Liquid Glass" })
-    WebGlass.Glassify(document.getElementById('test4'), { preset: "Stained Glass", color: "#009999"})
-    WebGlass.Glassify(document.getElementById('test5'), { preset: "Stained Frosted Glass", color: "#ff9900" })
-    WebGlass.Glassify(document.getElementById('test6'), { preset: "Stained Liquid Glass", color: "#33cc33" })
-
+    const draggables = [];
 
-    makeDraggable(document.getElementById("test1"));
-    makeDraggable(document.getElementById("test2"));
-    makeDraggable(document.getElementById("test3"));
-    makeDraggable(document.getElementById("test4"));
-    makeDraggable(document.getElementById("test5"));
-    makeDraggable(document.getElementById("test6"));
     function makeDraggable(el) {
       let isDragging = false;
       let startX = 0;
@@ -118,6 +66,8 @@
 
       el.style.position = "absolute";
       el.style.cursor = "grab";
+      el.style.zIndex = draggables.length + 10;
+      draggables.push(el);
 
       el.addEventListener("mousedown", (e) => {
         isDragging = true;
@@ -127,6 +77,21 @@
         startTop = el.offsetTop;
         el.style.cursor = "grabbing";
         e.preventDefault(); // prevent text selection
+        // bring element to the front
+        let eIndex = draggables.length;
+        let i = 0;
+        for (let i = 0; i < draggables.length; i++) {
+          if (draggables[i].id === el.id) {
+            eIndex = i; // index of the current element
+          } else if (i > eIndex) {
+            // move back one level
+            draggables[i - 1] = draggables[i];
+            draggables[i].style.zIndex = i + 9;
+          }
+        }
+        // bring to front
+        el.style.zIndex = draggables.length + 9;
+        draggables[draggables.length - 1] = el;
       });
 
       document.addEventListener("mousemove", (e) => {
@@ -154,7 +119,62 @@
         }
       });
     }
+
+    function makeDraggables() {
+      const elements = document.getElementsByClassName("draggable");
+      Array.from(elements).forEach(makeDraggable);
+    }
+
+    window.addEventListener("load", makeDraggables);
+  </script>
+</head>
+
+<body onload="makeDraggables()">
+  <!-- <div class="overlay" id="overlay">
+  </div> -->
+  <div id="test1" class="draggable" style="position: fixed; width: 200px; height: 200px; border-radius: 25px; left: 20px; top: 15px;"></div>
+  <div id="test2" class="draggable" style="position: fixed; width: 200px; height: 200px; border-radius: 50px; left: 250px; top: 15px;"></div>
+  <div id="test3" class="draggable" style="position: fixed; width: 200px; height: 200px; border-radius: 100px; left: 480px; top: 15px;"></div>
+  <div id="test4" class="draggable" style="position: fixed; width: 200px; height: 200px; border-radius: 25px; left: 20px; top: 250px;"></div>
+  <div id="test5" class="draggable" style="position: fixed; width: 200px; height: 200px; border-radius: 50px; left: 250px; top: 250px;"></div>
+  <div id="test6" class="draggable" style="position: fixed; width: 200px; height: 200px; border-radius: 100px; left: 480px; top: 250px;"></div>
+  <img src="images/AS11-40-5865HR.webp" alt="" />
+  <img src="images/AS11-40-5872HR.webp" alt="" />
+  <img src="images/AS11-40-5877HR.webp" alt="" />
+  <img src="images/AS11-40-5899HR.webp" alt="" />
+  <img src="images/AS11-40-5902HR.webp" alt="" />
+  <img src="images/AS11-40-6642HR.webp" alt="" />
+
+  <p>
+    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Temporibus
+    ullam, saepe eos maiores, et recusandae quis incidunt, corrupti atque
+    eum ab fugiat? Recusandae illum iure, voluptate accusamus minus maxime
+    rem? Doloremque sint repudiandae unde quos ipsa alias, repellat nulla
+    recusandae quisquam commodi aliquid iusto, suscipit quidem et ratione
+    deleniti nisi nemo deserunt! Fuga dignissimos ea aspernatur, excepturi
+    voluptatem rerum quas. Consectetur consequuntur reprehenderit illum quod
+    alias commodi aliquam temporibus adipisci, atque sequi ducimus dolor
+    laboriosam expedita debitis nulla maxime nesciunt praesentium. Illum
+    labore molestiae necessitatibus quae voluptates illo a magnam. Dolorum
+    eveniet pariatur, ipsam veritatis libero sed consectetur reiciendis
+    laudantium aut quo maxime accusamus natus unde culpa architecto
+    repellendus, rem, iure ducimus! Corrupti corporis recusandae commodi
+    earum. Laudantium, nihil harum. Sequi ab, voluptate officiis quam et
+    accusantium fugiat laudantium odio ad! Perspiciatis voluptatum, illum
+    aut aliquid, tempore animi harum laboriosam sapiente commodi doloribus
+    rem laborum sequi, temporibus ab dolorum repellat!
+  </p>
+
+  <script src="https://cdn.jemcats.software/WebGlass/latest/WebGlass.min.js"></script>
+  <script>
+    // Apply to your element
+    WebGlass.Glassify(document.getElementById('test1'), { preset: "Glass" })
+    WebGlass.Glassify(document.getElementById('test2'), { preset: "Frosted Glass" })
+    WebGlass.Glassify(document.getElementById('test3'), { preset: "Liquid Glass" })
+    WebGlass.Glassify(document.getElementById('test4'), { preset: "Stained Glass", color: "#009999"})
+    WebGlass.Glassify(document.getElementById('test5'), { preset: "Stained Frosted Glass", color: "#ff9900" })
+    WebGlass.Glassify(document.getElementById('test6'), { preset: "Stained Liquid Glass", color: "#33cc33" })
   </script>
 </body>
 
-</html>
+</html>
diff --git a/release_descriptions/v1.0.2.md b/release_descriptions/v1.0.2.md
@@ -0,0 +1,11 @@
+# v1.0.2
+This release brings new functionality to demo page:
+- Bring element to front on drag in demo
+- Minor changes to documentation/README
+- Better CodeQL handling
+- Update publishing workflow
+
+## Contributers
+- [emattheis](https://github.com/emattheis)
+
+**Full Changelog**: https://github.com/JEMcats-Software/WebGlass/compare/v1.0.1...v1.0.2