This commit is contained in:
Never Gude 2026-02-21 02:07:03 +01:00
parent cf93279141
commit 6096df6978
21 changed files with 201 additions and 165 deletions

View file

@ -27,7 +27,7 @@
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<canvas id="tv-screen"></canvas>
<img id="shork" src="images/shork.png"></img>
<header id="page-header">
<a class="page-header-button" href="index.html">Home</a>
<a class="rss-button" href="rss.xml">RSS Feed</a>
@ -66,4 +66,5 @@ message</p>
</nav>
</footer>
</body>
<script src="scripts/shork.js"></script>
</html>

View file

@ -94,7 +94,7 @@
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<canvas id="tv-screen"></canvas>
<img id="shork" src="images/shork.png"></img>
<header id="page-header">
<a class="page-header-button" href="index.html">Home</a>
<a class="rss-button" href="rss.xml">RSS Feed</a>
@ -135,4 +135,5 @@ class="sourceCode bash"><code class="sourceCode bash"><span id="cb1-1"><a href="
</nav>
</footer>
</body>
<script src="scripts/shork.js"></script>
</html>

View file

@ -94,7 +94,7 @@
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<canvas id="tv-screen"></canvas>
<img id="shork" src="images/shork.png"></img>
<header id="page-header">
<a class="page-header-button" href="index.html">Home</a>
<a class="rss-button" href="rss.xml">RSS Feed</a>
@ -216,4 +216,5 @@ class="sourceCode sh"><code class="sourceCode bash"><span id="cb18-1"><a href="#
</nav>
</footer>
</body>
<script src="scripts/shork.js"></script>
</html>

View file

@ -92,7 +92,7 @@
<link rel="stylesheet" href="styles/style.css">
</head>
<body>
<canvas id="tv-screen"></canvas>
<img id="shork" src="images/shork.png"></img>
<header id="page-header">
<a class="page-header-button" href="index.html">Home</a>
<a class="rss-button" href="rss.xml">RSS Feed</a>
@ -161,73 +161,6 @@ tweaking my Linux sytem or trying to do productive things.</p>
<a href="https://cups.teabucket.eu/next?from=never" target="_parent"><img alt="Next" src="images/cups_right.svg" width="30" height="30"></a>
</nav>
</footer>
<script>
let speed = 10;
let scale = 0.33; // Image scale (I work on 1080p monitor)
let canvas;
let ctx;
let logoColor;
let dvd = {
x: 256,
y: 354,
xspeed: 2,
yspeed: 2,
img: new Image()
};
(function main(){
canvas = document.getElementById("tv-screen");
ctx = canvas.getContext("2d");
dvd.img.src = 'images/shark.png';
//Draw the "tv screen"
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
pickColor();
update();
})();
function update() {
setTimeout(() => {
//Draw the canvas background
ctx.fillStyle = '#00000000';
ctx.clearRect(0, 0, canvas.width, canvas.height);
//Draw DVD Logo and his background
//ctx.fillStyle = logoColor;
//ctx.fillRect(dvd.x, dvd.y, dvd.img.width*scale, dvd.img.height*scale);
ctx.drawImage(dvd.img, dvd.x, dvd.y, dvd.img.width*scale, dvd.img.height*scale);
//Move the logo
dvd.x+=dvd.xspeed;
dvd.y+=dvd.yspeed;
//Check for collision
checkHitBox();
update();
}, speed)
}
//Check for border collision
function checkHitBox(){
if(dvd.x+dvd.img.width*scale >= canvas.width || dvd.x <= 0){
dvd.xspeed *= -1;
pickColor();
}
if(dvd.y+dvd.img.height*scale >= canvas.height || dvd.y <= 0){
dvd.yspeed *= -1;
pickColor();
}
}
//Pick a random color in RGB format
function pickColor(){
r = Math.random() * (254 - 0) + 0;
g = Math.random() * (254 - 0) + 0;
b = Math.random() * (254 - 0) + 0;
logoColor = 'rgb('+r+','+g+', '+b+')';
}
</script>
</body>
<script src="scripts/shork.js"></script>
</html>

View file

@ -6,7 +6,7 @@
<description>Here I post random stuff.</description>
<language>en-us</language>
<pubDate>Mon, 12 Jan 2026 00:00:00 +0100</pubDate>
<lastBuildDate>Fri, 20 Feb 2026 20:09:52 +0100</lastBuildDate>
<lastBuildDate>Sat, 21 Feb 2026 02:06:53 +0100</lastBuildDate>
<docs>https://www.rssboard.org/rss-specification</docs>
<generator>pandoc</generator>
<managingEditor>n.gude@posteo.de (Never)</managingEditor>