diff options
| author | LLLL Colonq <llll@colonq> | 2026-08-17 20:14:16 -0400 |
|---|---|---|
| committer | LLLL Colonq <llll@colonq> | 2026-08-17 20:14:16 -0400 |
| commit | de99c5f7636a952025ea13de02bafd25bcb6bdec (patch) | |
| tree | be359424af4f6717103e3b667b6529ae5a4b4e6a /2026/games_submissions/steeledshield | |
| parent | 4d4d1f24721f27fbf37e1070be6414de130ace61 (diff) | |
Fix broken
Diffstat (limited to '2026/games_submissions/steeledshield')
13 files changed, 449 insertions, 0 deletions
diff --git a/2026/games_submissions/steeledshield/LICENSE.txt b/2026/games_submissions/steeledshield/LICENSE.txt new file mode 100644 index 0000000..9c1aa69 --- /dev/null +++ b/2026/games_submissions/steeledshield/LICENSE.txt @@ -0,0 +1,21 @@ +MIT License
+
+Copyright (c) 2026 Steeledshield
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
\ No newline at end of file diff --git a/2026/games_submissions/steeledshield/assets/Clonk.png b/2026/games_submissions/steeledshield/assets/Clonk.png Binary files differnew file mode 100644 index 0000000..67cde0d --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/Clonk.png diff --git a/2026/games_submissions/steeledshield/assets/Eat.wav b/2026/games_submissions/steeledshield/assets/Eat.wav Binary files differnew file mode 100644 index 0000000..20d03c8 --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/Eat.wav diff --git a/2026/games_submissions/steeledshield/assets/Explode.wav b/2026/games_submissions/steeledshield/assets/Explode.wav Binary files differnew file mode 100644 index 0000000..a2f4a40 --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/Explode.wav diff --git a/2026/games_submissions/steeledshield/assets/Mod.png b/2026/games_submissions/steeledshield/assets/Mod.png Binary files differnew file mode 100644 index 0000000..3389fc7 --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/Mod.png diff --git a/2026/games_submissions/steeledshield/assets/Win.wav b/2026/games_submissions/steeledshield/assets/Win.wav Binary files differnew file mode 100644 index 0000000..26e548d --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/Win.wav diff --git a/2026/games_submissions/steeledshield/assets/click_image.png b/2026/games_submissions/steeledshield/assets/click_image.png Binary files differnew file mode 100644 index 0000000..f9a6e5a --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/click_image.png diff --git a/2026/games_submissions/steeledshield/assets/feeding_friend-zy_beat.wav b/2026/games_submissions/steeledshield/assets/feeding_friend-zy_beat.wav Binary files differnew file mode 100644 index 0000000..2644a45 --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/feeding_friend-zy_beat.wav diff --git a/2026/games_submissions/steeledshield/assets/friend.png b/2026/games_submissions/steeledshield/assets/friend.png Binary files differnew file mode 100644 index 0000000..8658706 --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/friend.png diff --git a/2026/games_submissions/steeledshield/assets/friend_happy.png b/2026/games_submissions/steeledshield/assets/friend_happy.png Binary files differnew file mode 100644 index 0000000..8ee01b9 --- /dev/null +++ b/2026/games_submissions/steeledshield/assets/friend_happy.png diff --git a/2026/games_submissions/steeledshield/index.html b/2026/games_submissions/steeledshield/index.html new file mode 100644 index 0000000..2916def --- /dev/null +++ b/2026/games_submissions/steeledshield/index.html @@ -0,0 +1,31 @@ +<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Feeding Friend-zy</title>
+ <link rel="stylesheet" href="style.css">
+ <link rel="preconnect" href="https://fonts.googleapis.com">
+ <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+ <link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
+</head>
+<body>
+ <div id="layout">
+ <p id="counter"></p>
+ <img id="Clonk" src="assets/Clonk.png">
+ <img id="Mod" src="assets/Mod.png">
+ <img id="click_image" src="assets/click_image.png" alt="">
+ <div id="game">
+ <div id="container">
+ <div id="bomb" class="objects">π£</div>
+ <div id="blank" class="objects"></div>
+ <div id="food" class="objects"></div>
+ </div>
+ <div id="friend">
+ <img src="assets/friend.png">
+ </div>
+ </div>
+ </div>
+</body>
+<script src="script.js"></script>
+</html>
\ No newline at end of file diff --git a/2026/games_submissions/steeledshield/script.js b/2026/games_submissions/steeledshield/script.js new file mode 100644 index 0000000..6ccfe0a --- /dev/null +++ b/2026/games_submissions/steeledshield/script.js @@ -0,0 +1,200 @@ +//Assets & Elements
+var bomb = document.getElementById("bomb");
+var food = document.getElementById("food");
+var blank = document.getElementById("blank");
+var friend = document.getElementById("friend");
+var container = document.getElementById("container");
+const objects = document.querySelectorAll(".objects");
+var explode = new Audio('assets/Explode.wav');
+var eat = new Audio('assets/Eat.wav');
+var win = new Audio('assets/Win.wav');
+var music = new Audio('assets/feeding_friend-zy_beat.wav');
+music.loop = true;
+music.volume = 0.33;
+
+//Score counter
+var counter = 0;
+
+//Randomizes food & bombs, as well as food emoji
+var random = Math.floor(Math.random() * 3);
+var foodItemRand = Math.floor(Math.random() * 3);
+
+//Iterator
+let i = 0;
+
+//result & randoStart ensure that food & bomb start on either side of friend,
+//this will make it so that a bomb doesn't spawn immediatley oncoming to the player
+const result = Math.floor(Math.random() * 2) * 2;
+
+function randoStart(){for (i; i < objects.length; i++) {
+ objects[0].style.order = result;
+ objects[1].style.order = 1;
+ if(result == 0){
+ objects[2].style.order = 2;
+ }
+ else{
+ objects[2].style.order = 0;
+ }
+ food.innerHTML = foodItem[foodItemRand];
+
+}};
+
+//Moves the food & bomb
+function objectMove(){
+ for (let i = 0; i < objects.length; i++) {
+ objects[i].style.animation = "slide 1.5s infinite";
+ }
+}
+
+//Pauses food & bomb scrolling
+function objectStop(){
+ for (let i = 0; i < objects.length; i++) {
+ objects[i].style.animation = "none";
+ }
+}
+
+//Pauses food & bomb scrolling
+objectStop();
+
+
+//Pauses the game to show instructions
+//Once the message has been received from Clonk's harness the game will begin
+function clonkload(){
+ //for the love of god Steeled, do NOT touch this line of code
+ //it is finally working now
+ window.parent.postMessage({op: "ready"});
+ //this one too, this is a load-bearing eventlistener
+ //game will fall apart like a jengaβ’ structure if this eventlistener is broken
+ window.addEventListener("message", ev => {
+ window.parent.postMessage({op: "started", verb: "Feed Friend!"}),
+ setTimeout(() => {
+ objectMove(),
+ document.getElementById("counter").innerHTML = "Foods eated: " + counter,
+ document.getElementById("counter").style.width = "75px"
+ }, 2000)
+ });
+}
+
+//Food emojis, purely visual, has no gameplay effect
+const foodItem = [];
+foodItem[0]= "π";
+foodItem[1]= "π";
+foodItem[2]= "π";
+
+//Loads instructions, randomizes the bomb & food positions and runs the harness check
+document.addEventListener("load",
+ randoStart(),
+ clonkload(),
+ document.getElementById("counter").innerHTML = "Feed Friend! <br> Avoid the Bombs!",
+ document.getElementById("counter").style.width = "100%"
+);
+
+//Prevents context menu on right click, so that the player can move right without issues
+document.addEventListener('contextmenu', (event) => {
+ event.preventDefault();
+});
+
+function moveLeft(){
+ let left = parseInt(window.getComputedStyle(friend)
+ .getPropertyValue("left"));
+ left -= 32;
+ if(left>=0){
+ friend.style.left = left + "px";
+ };
+ music.play();
+}
+
+function moveRight(){
+ let left = parseInt(window.getComputedStyle(friend)
+ .getPropertyValue("left"));
+ left += 32;
+ if(left<96){
+ friend.style.left = left + "px";
+ };
+ music.play();
+}
+
+//Checks mouse input, to get direction of movement
+document.addEventListener('mousedown', (event) => {
+ switch (event.button) {
+ case 0:
+ moveLeft();
+ break;
+ case 2:
+ moveRight();
+ break;
+ }
+});
+
+//Moves the food & bomb row back to the top once it reaches the bottom of the game screen
+setInterval(function(){for (let i = 0; i < objects.length; i++) {
+ objects[i].addEventListener('animationiteration', () => {
+ random = Math.floor(Math.random() * 3) + 1;
+ foodItemRand = Math.floor(Math.random() * 3);
+ objects[i].style.order = random;
+ food.innerHTML = foodItem[foodItemRand];
+})}},125);
+
+//Underlying collision code to be used for both food & bombs
+function isCollide(a, b) {
+ var aRect = a.getBoundingClientRect();
+ var bRect = b.getBoundingClientRect();
+
+ return !(
+ ((aRect.top + aRect.height) < (bRect.top)) ||
+ (aRect.top > (bRect.top + bRect.height)) ||
+ ((aRect.left + aRect.width) < bRect.left) ||
+ (aRect.left > (bRect.left + bRect.width))
+ );
+}
+
+//Checks collisions on an interval
+setInterval(function(){
+ //Food collision check
+ if(isCollide(friend, food)){
+ friend.innerHTML = "<img src='assets/friend_happy.png'>";
+ counter++;
+ eat.play();
+ document.getElementById("counter").innerHTML = "Foods eated: " + counter;
+ //Ends game at 10 food eaten
+ if(counter>9){
+ win.play();
+ container.style.visibility = "hidden";
+ objectStop();
+ document.getElementById("counter").style.width = "100%";
+ document.getElementById("counter").innerHTML = "YOU WIN! CONGLATURATIONS!";
+ //Tells harness that the game is won and resets, to await the harness check again
+ setTimeout(function(){
+ window.parent.postMessage({op: "done", win: true}),
+ location.reload()
+ },2000);
+ }
+ else{
+ //Makes friend a happy fella :) on collision with food
+ setTimeout(function(){
+ friend.innerHTML = "<img src='assets/friend.png'>";
+ },1000);
+ }
+ }
+ //Bomb collsion check
+ if(isCollide(friend, bomb)){
+ container.style.visibility = "hidden";
+ objectStop();
+ explode.play();
+ document.getElementById("counter").style.width = "100%";
+ document.getElementById("counter").innerHTML = "oh no...";
+ //Makes friend explode :( on collision with bomb
+ friend.innerHTML = "π₯";
+ setTimeout(function(){
+ //Tells harness that the game is lost and resets, to await the harness check again
+ window.parent.postMessage({op: "done", win: false}),
+ location.reload()
+ },2000);
+ }
+},250);
+
+//Hate. Let me tell you how much I've come to hate Javascript since I began to jam.
+//There are 5771 characters contained in the total lines of code that fill my script.js file.
+//If the word 'hate' was engraved on each subpixel of those 5771 characters
+//it would not equal one one-billionth of the hate I feel for javascript at this micro-instant.
+//For js. Hate. Hate.
\ No newline at end of file diff --git a/2026/games_submissions/steeledshield/style.css b/2026/games_submissions/steeledshield/style.css new file mode 100644 index 0000000..b046eff --- /dev/null +++ b/2026/games_submissions/steeledshield/style.css @@ -0,0 +1,197 @@ +:root {
+ --crt-red: rgb(218, 49, 49);
+ --crt-green: rgb(112, 159, 115);
+ --crt-blue: rgb(40, 129, 206);
+}
+
+body{
+ margin: 0;
+ height: 100vh;
+ font-family: "VT323", monospace;
+ font-weight: 400;
+ font-style: bold;
+ user-select: none; /* standard syntax */
+ -webkit-user-select: none; /* webkit (safari, chrome) browsers */
+ -moz-user-select: none; /* mozilla browsers */
+ -khtml-user-select: none; /* webkit (konqueror) browsers */
+ -ms-user-select: none; /* IE10+ */
+}
+
+#layout{
+ width: 240px;
+ height: 160px;
+ margin: auto;
+ border: 1px solid black;
+ background: linear-gradient(270deg, #03A688, #014040);
+ background-size: 400% 400%;
+
+ -webkit-animation: AnimationName 2s ease infinite;
+ -moz-animation: AnimationName 2s ease infinite;
+ animation: AnimationName 2s ease infinite;
+ background-color: rgb(25, 25, 30);
+ text-shadow: 0 0 0.2em currentColor, 1px 1px rgba(255, 0, 255, 0.5),
+ -1px -1px rgba(0, 255, 255, 0.4);
+ position: relative;
+ &:before,
+ &:after {
+ content: "";
+ transform: translateZ(0);
+ pointer-events: none;
+ opacity: 0.5;
+ mix-blend-mode: overlay;
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ left: 0;
+ top: 0;
+ z-index: 2;
+ }
+
+ &:before {
+ background: repeating-linear-gradient(
+ var(--crt-red) 0px,
+ var(--crt-green) 2px,
+ var(--crt-blue) 4px
+ );
+ }
+ &:after {
+ background: repeating-linear-gradient(
+ 90deg,
+ var(--crt-red) 1px,
+ var(--crt-green) 2px,
+ var(--crt-blue) 3px
+ );
+ }
+}
+
+@-webkit-keyframes AnimationName {
+ 0%{background-position:0% 50%}
+ 50%{background-position:100% 50%}
+ 100%{background-position:0% 50%}
+}
+@-moz-keyframes AnimationName {
+ 0%{background-position:0% 50%}
+ 50%{background-position:100% 50%}
+ 100%{background-position:0% 50%}
+}
+@keyframes AnimationName {
+ 0%{background-position:0% 50%}
+ 50%{background-position:100% 50%}
+ 100%{background-position:0% 50%}
+}
+
+#game{
+ width: 40%;
+ height: 100%;
+ margin: auto;
+ overflow: hidden;
+ background: linear-gradient(270deg, #abe2b8, #C2F2CE);
+ background-size: 400% 400%;
+
+ -webkit-animation: AnimationName 2s ease infinite;
+ -moz-animation: AnimationName 2s ease infinite;
+ animation: AnimationName 2s ease infinite;
+}
+
+@-webkit-keyframes AnimationName {
+ 0%{background-position:0% 50%}
+ 50%{background-position:100% 50%}
+ 100%{background-position:0% 50%}
+}
+@-moz-keyframes AnimationName {
+ 0%{background-position:0% 50%}
+ 50%{background-position:100% 50%}
+ 100%{background-position:0% 50%}
+}
+@keyframes AnimationName {
+ 0%{background-position:0% 50%}
+ 50%{background-position:100% 50%}
+ 100%{background-position:0% 50%}
+}
+
+#friend{
+ width: 32px;
+ height: 32px;
+ position: relative;
+ top: 67%;
+ left: 32px;
+ font-size: 28px;
+ text-align: center;
+}
+
+#friend img{
+ width: 32px;
+ height: 32px;
+}
+
+#container{
+ display: flex;
+}
+
+#bomb{
+ width: 22%;
+ height: 22%;
+ font-size: auto;
+}
+
+#blank{
+ width: 22%;
+ height: 22%;
+ font-size: auto;
+}
+
+#food{
+ width: 22%;
+ height: 22%;
+ font-size: auto;
+}
+
+.objects{
+ position: relative;
+ animation: none;
+ animation-timing-function: linear;
+ text-align: center;
+ margin: auto;
+}
+
+#counter{
+ position: absolute;
+ width: 75px;
+ font-size: 25px;
+ top: -10%;
+ color: white;
+ text-align: center;
+ -webkit-text-stroke-width: 6px;
+ -webkit-text-stroke-color: black;
+ paint-order: stroke fill;
+ z-index: 1;
+}
+
+#click_image{
+ position: absolute;
+ width: 50px;
+ right: 10px;
+ top: 10px;
+ z-index: 0;
+}
+
+@keyframes slide {
+ 0% {top: -26.6px;}
+ 100% {top: 200px;}
+}
+#Clonk{
+ position: absolute;
+ width: 30%;
+ height:60%;
+ bottom: 0;
+ opacity: 0.5;
+}
+
+#Mod{
+ position: absolute;
+ width: 30%;
+ height:60%;
+ right: 0;
+ bottom: 0;
+ opacity: 0.5;
+}
\ No newline at end of file |
