admin/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

site new version with events from steam

Browse Source
This commit is contained in:
JMP Games
2025-11-04 11:10:24 +01:00
parent ae59d9654c
commit 617ff597dd
17 changed files with 307 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/android-chrome-192x192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
assets/android-chrome-512x512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

BIN
assets/apple-touch-icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
assets/favicon-16x16.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 462 B

BIN
assets/favicon-32x32.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
assets/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
assets/linkedin.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

1
assets/site.webmanifest Normal file
View File

@@ -0,0 +1 @@
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}

BIN
assets/tiktok.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

BIN
assets/youtube.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

103
index - Copia.html Normal file
View File

@@ -0,0 +1,103 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>JMP GAMES</title>
<link rel="stylesheet" href="styles.css">
<link href="https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap" rel="stylesheet">
</head>
<body>
<video autoplay muted loop playsinline id="background-video">
<source src="assets/background.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<main class="container">
<div class="card logo-card">
<img src="assets/jmpbianco.png" alt="JMP Games" class="logo">
</div>
<div class="card game-card">
<h2>GAMES</h2>
<div class="game-preview">
<h3>The Drunken Beard</h3>
<iframe style="width:100%" height="315" src="https://www.youtube.com/embed/IGv_IGnXH6s?si=nnKGEUqYjIs4Nw90" title="The Drunken Beard" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<br/>
<br/>
<p>In The Drunken Beard, you take the reins of a lively tavern where every pint tells a story. Brew craft beers, manage orders between thirsty dwarves and impatient adventurers, expand the inn and turn it into a legendary haven. Between secret recipes, rustic furnishings, and demanding customers, only the finest innkeeper will win over hearts and livers. Glory awaits.. one beer at a time!
</p>
<div class="release-date">Demo available May 2025</div>
<div class="release-date">Coming December 2025</div>
<a href="https://store.steampowered.com/app/3622810/THE_DRUNKEN_BEARD/" target="_blank"><img src="assets/steam.png" width="50px" alt="Steam"></a>
<div id="steam-events">
<p>
Searching Steam events...
</p>
</div>
</div>
</div>
<div class="card newsletter-card">
<h2>JOIN THE NEWSLETTER</h2>
<p>Subscribe for development updates and exclusive content</p>
<form id="newsletter-form">
<input type="email" placeholder="Enter your email" required>
<input id="subscribe" type="hidden" value="1">
<input id="sub_message" type="hidden" value="Check your mail for confirmation">
<button type="submit">SUBSCRIBE</button>
</form>
</div>
<div class="card team-card">
<h2>THE TEAM</h2>
<div class="team-grid">
<div class="team-member">
<h3>Michele Rossi</h3>
<p>Developer</p>
</div>
<div class="team-member">
<h3>Mauro Cirafisi</h3>
<p>Developer</p>
</div>
<div class="team-member">
<h3>Flavio Fabbrizi</h3>
<p>CEO</p>
</div>
<div class="team-member">
<h3>Matteo Sonaglioni</h3>
<p>2D & 3D Artist</p>
</div>
<div class="team-member">
<h3>Ambra Cirafisi</h3>
<p>Concept Artist</p>
</div>
<div class="team-member">
<h3>Agnese Lucchese</h3>
<p>Animator</p>
</div>
<div class="team-member">
<h3>Angelo Carnemolla</h3>
<p>Sound Designer & Composer</p>
</div>
</div>
</div>
<div class="footer-links">
<a href="privacy-policy.html" target="_self">Privacy Policy</a>
<a href="cookie-policy.html" target="_self">Cookie Policy</a>
</div>
<div class="contact-links">
<a href="https://steamcommunity.com/id/jmpgames/" target="_blank"><img src="assets/steam.png" height="50px" alt="Steam JMP Games"></a>
<a href="https://www.instagram.com/jmpgamesstudio/" target="_blank"><img src="assets/instagram.png" height="50px" alt="Instagram JMP Games"></a>
<a href="https://discord.gg/QudFnQkEcQ" target="_blank"><img src="assets/discord.png" height="50px" alt="Discord JMP Games"></a>
<a href="https://www.youtube.com/@JMPGames-x7b" target="_blank"><img src="assets/youtube.png" height="50px" alt="YouTube JMP Games"></a>
<a href="https://www.tiktok.com/@jmpgamesstudio" target="_blank"><img src="assets/tiktok.png" height="50px" alt="TikTok JMP Games"></a>
<a href="https://www.linkedin.com/company/108363891/" target="_blank"><img src="assets/linkedin.png" height="50px" alt="Linkedin JMP Games"></a>
</div>
<div class="copyright">
<p>&copy; 2025 JMP Games srls. All rights reserved.</p>
<p>VAT: IT02571090444</p>
</div>
</main>
<script src="script.js"></script>
</body>
</html>

10
index.html
View File

@@ -25,9 +25,14 @@
<br/>
<p>In The Drunken Beard, you take the reins of a lively tavern where every pint tells a story. Brew craft beers, manage orders between thirsty dwarves and impatient adventurers, expand the inn and turn it into a legendary haven. Between secret recipes, rustic furnishings, and demanding customers, only the finest innkeeper will win over hearts and livers. Glory awaits.. one beer at a time!
</p>
<div class="release-date">Demo available May 9th 2025</div>
<div class="release-date">Demo available May 2025</div>
<div class="release-date">Coming December 2025</div>
<a href="https://store.steampowered.com/app/3622810/THE_DRUNKEN_BEARD/" target="_blank"><img src="assets/steam.png" width="50px" alt="Steam"></a>
<div id="steam-events">
<p>
Searching Steam events...
</p>
</div>
</div>
</div>
@@ -83,6 +88,9 @@
<a href="https://steamcommunity.com/id/jmpgames/" target="_blank"><img src="assets/steam.png" height="50px" alt="Steam JMP Games"></a>
<a href="https://www.instagram.com/jmpgamesstudio/" target="_blank"><img src="assets/instagram.png" height="50px" alt="Instagram JMP Games"></a>
<a href="https://discord.gg/QudFnQkEcQ" target="_blank"><img src="assets/discord.png" height="50px" alt="Discord JMP Games"></a>
<a href="https://www.youtube.com/@JMPGames-x7b" target="_blank"><img src="assets/youtube.png" height="50px" alt="YouTube JMP Games"></a>
<a href="https://www.tiktok.com/@jmpgamesstudio" target="_blank"><img src="assets/tiktok.png" height="50px" alt="TikTok JMP Games"></a>
<a href="https://www.linkedin.com/company/108363891/" target="_blank"><img src="assets/linkedin.png" height="50px" alt="Linkedin JMP Games"></a>
</div>
<div class="copyright">
<p>&copy; 2025 JMP Games srls. All rights reserved.</p>

111
script - Copia.js Normal file
View File

@@ -0,0 +1,111 @@
document.addEventListener('DOMContentLoaded', () => {
// Newsletter form submission
const form = document.getElementById('newsletter-form');
form.addEventListener('submit', async (e) => {
e.preventDefault();
const email = e.target.querySelector('input[type="email"]').value;
const subscribe = e.target.querySelector('input[id="subscribe"]').value;
const message = e.target.querySelector('input[id="sub_message"]');
message.setAttribute('type','text');
message.type = 'text';
const response = await fetch('/api/newsletter', {
method: 'POST',
body: JSON.stringify({
"email": email,
"subscribe": subscribe
}),
headers: {
'Content-Type': 'application/json'
}
});
});
// Add subtle parallax effect to video background
document.addEventListener('mousemove', (e) => {
const mouseX = e.clientX / window.innerWidth;
const mouseY = e.clientY / window.innerHeight;
const video = document.getElementById('background-video');
video.style.transform = `scale(1.1) translate(${mouseX * -20}px, ${mouseY * -20}px)`;
});
//retrieve steam events
(async () => {
const container = document.querySelector("#steam-events");
console.log(container);
if (!container) return;
const appId = container.dataset.appid || "3622810";
const count = 5;
async function loadSteamEvents({ appId, count }) {
const url = `/api/steamevents?appId=${appId}&count=${count}`;
const res = await fetch(url);
if (!res.ok) throw new Error("Unable to retrieve events");
return res.json();
}
function escapeHTML(str) {
const p = document.createElement("p");
p.textContent = str || "";
return p.innerHTML;
}
function renderSteamEvents(container, data) {
if (!data.items?.length) {
container.innerHTML = "<p>No event available.</p>";
return;
}
const list = document.createElement("ul");
list.style.listStyle = "none";
list.style.padding = "0";
list.style.margin = "0";
data.items.forEach(item => {
const li = document.createElement("li");
li.style.border = "1px solid #ddd";
li.style.borderRadius = "12px";
li.style.padding = "12px 16px";
li.style.margin = "8px 0";
li.style.background = "#fff";
li.style.boxShadow = "0 1px 2px rgba(0,0,0,0.05)";
const title = document.createElement("a");
title.href = item.url;
title.target = "_blank";
title.rel = "noopener";
title.textContent = item.title || "Update";
const meta = document.createElement("div");
meta.style.fontSize = "12px";
meta.style.opacity = "0.7";
const d = item.date ? new Date(item.date).toLocaleString() : "";
meta.textContent = [d, item.feedlabel].filter(Boolean).join(" • ");
const excerpt = document.createElement("p");
const short = (item.contents || "").replace(/\s+/g, " ").trim().slice(0, 240);
excerpt.innerHTML = escapeHTML(short) + (short.length >= 240 ? "…" : "");
li.appendChild(title);
li.appendChild(meta);
li.appendChild(excerpt);
list.appendChild(li);
});
container.innerHTML = "";
container.appendChild(list);
}
try {
const data = await loadSteamEvents({ appId, count });
renderSteamEvents(container, data);
} catch (e) {
container.innerHTML = "<p>Error loading Steam events.</p>";
console.error(e);
}
})();
});

82
script.js
View File

@@ -1,4 +1,5 @@
document.addEventListener('DOMContentLoaded', () => {
// Newsletter form submission
const form = document.getElementById('newsletter-form');
form.addEventListener('submit', async (e) => {
@@ -8,7 +9,7 @@ document.addEventListener('DOMContentLoaded', () => {
const message = e.target.querySelector('input[id="sub_message"]');
message.setAttribute('type','text');
message.type = 'text';
const response = await fetch('http://localhost:3001/newsletter', {
const response = await fetch('/api/newsletter', {
method: 'POST',
body: JSON.stringify({
"email": email,
@@ -28,4 +29,83 @@ document.addEventListener('DOMContentLoaded', () => {
const video = document.getElementById('background-video');
video.style.transform = `scale(1.1) translate(${mouseX * -20}px, ${mouseY * -20}px)`;
});
//retrieve steam events
(async () => {
const container = document.querySelector("#steam-events");
console.log(container);
if (!container) return;
const appId = container.dataset.appid || "3622810";
const count = 5;
async function loadSteamEvents({ appId, count }) {
const url = `/api/steamevents?appId=${appId}&count=${count}`;
const res = await fetch(url);
if (!res.ok) throw new Error("Unable to retrieve events");
return res.json();
}
function escapeHTML(str) {
const p = document.createElement("p");
p.textContent = str || "";
return p.innerHTML;
}
function renderSteamEvents(container, data) {
if (!data.items?.length) {
container.innerHTML = "<p>No event available.</p>";
return;
}
const list = document.createElement("ul");
list.style.listStyle = "none";
list.style.padding = "0";
list.style.margin = "0";
data.items.forEach(item => {
const li = document.createElement("li");
li.style.border = "1px solid #ddd";
li.style.borderRadius = "12px";
li.style.padding = "12px 16px";
li.style.margin = "8px 0";
li.style.background = "#fff";
li.style.boxShadow = "0 1px 2px rgba(0,0,0,0.05)";
const title = document.createElement("a");
title.href = item.url;
title.target = "_blank";
title.rel = "noopener";
title.textContent = item.title || "Update";
const meta = document.createElement("div");
meta.style.fontSize = "12px";
meta.style.opacity = "0.7";
const d = item.date ? new Date(item.date).toLocaleString() : "";
meta.textContent = [d, item.feedlabel].filter(Boolean).join(" • ");
const excerpt = document.createElement("p");
const short = (item.contents || "").replace(/\s+/g, " ").trim().slice(0, 240);
excerpt.innerHTML = escapeHTML(short) + (short.length >= 240 ? "…" : "");
li.appendChild(title);
li.appendChild(meta);
li.appendChild(excerpt);
list.appendChild(li);
});
container.innerHTML = "";
container.appendChild(list);
}
try {
const data = await loadSteamEvents({ appId, count });
renderSteamEvents(container, data);
} catch (e) {
container.innerHTML = "<p>Error loading Steam events.</p>";
console.error(e);
}
})();
});

1
site-server Submodule

Submodule site-server added at 4829615367

1
styles.css
View File

@@ -18,7 +18,6 @@
body {
font-family: 'Rajdhani', sans-serif;
background-color: var(--bg-dark);
background-image: url('norse-pattern.png');
background-blend-mode: overlay;
color: var(--text-light);
min-height: 100vh;