2023-06-24 06:08:37 +00:00
<!DOCTYPE html>
< html >
2024-11-30 23:21:11 +00:00
<!-- Basic Meta Tags -->
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< meta name = "description" content = "un taller/laboratorio/oficina/salón/auditorio/a-veces-sala que alberga no sólo a hackers y sus proyectos, o hacks, sino que además fomenta la generación de nuevas ideas y la exploración de posibilidades varias para proyectos varios. Es un semillero de hacks y un afluente de hackers. Existe para quienes ya son hackers y lo saben, así como para quienes aún no se dan cuenta." >
< meta name = "keywords" content = "Kernel Panic Room, hackspace, Querétaro, open-source, free software, technology, DIY, workshops, hardware, programming, hacking, FOSS, Linux, hackers, programación, talleres, cultura libre, código libre, software libre, FLOSS" >
< meta name = "author" content = "Kernel Panic Room" >
<!-- Open Graph Meta Tags -->
< meta property = "og:title" content = "Kernel Panic Room - Hackspace en Andamaxei" >
< meta property = "og:description" content = "un taller/laboratorio/oficina/salón/auditorio/a-veces-sala que alberga no sólo a hackers y sus proyectos, o hacks, sino que además fomenta la generación de nuevas ideas y la exploración de posibilidades varias para proyectos varios. Es un semillero de hacks y un afluente de hackers. Existe para quienes ya son hackers y lo saben, así como para quienes aún no se dan cuenta." >
< meta property = "og:image" content = "https://kernelpanic.lol/templo-de-la-entropia/ignucio.png" > <!-- Replace with your logo URL -->
< meta property = "og:url" content = "https://kernelpanic.lol" > <!-- Replace with your URL -->
< meta property = "og:type" content = "website" >
<!-- Twitter Card Meta Tags -->
< meta name = "twitter:card" content = "summary_large_image" >
< meta name = "twitter:title" content = "Kernel Panic Room - Hackspace en Andamaxei" >
< meta name = "twitter:description" content = "Ven por la filosofía del código libre, quédate por la comunidad y la sensación de awesome, en el corazón de Andamaxei" >
< meta name = "twitter:image" content = "https://kernelpanic.lol/templo-de-la-entropia/ignucio.png" > <!-- Replace with your logo URL -->
<!-- Additional Tags -->
< meta name = "robots" content = "index, follow" >
2023-06-24 06:08:37 +00:00
< head >
2023-07-26 23:50:55 +00:00
< meta charset = "UTF-8" >
2023-06-26 01:34:19 +00:00
< title > {% block title %}{% endblock %}< / title >
2024-08-14 21:24:36 +00:00
< link rel = "stylesheet" type = "text/css" href = "/static/style.css" / >
2023-09-13 22:28:13 +00:00
2023-08-16 07:39:28 +00:00
2023-06-24 06:08:37 +00:00
< / head >
2023-06-21 17:30:48 +00:00
< body >
2023-09-13 22:28:13 +00:00
<!-- Llegaste al código, a ver cáele al telegram - > [arroba]kprftw -->
2023-06-24 06:08:37 +00:00
< div id = "topbar" >
2023-06-26 01:34:19 +00:00
{% block topbar %}
2023-09-19 09:05:38 +00:00
< a href = "/" > < div class = "button" > a casa< / div > < / a >
2024-08-14 21:24:36 +00:00
<!-- <a href="/spacestats"><div id="spaceStatusButton" class="button">a casa</div></a>
< a href = "/guatecon-01" > < div class = "button color-changer" id = "colorButton" > GuateCON 0.1< / div > < / a > -->
< a href = "{{'/about'|url}}" > < div class = "button" > qué es esto< / div > < / a >
2024-08-27 19:20:20 +00:00
< a href = "{{'/somos/'|url}}" > < div class = "button" > quiénes somos< / div > < / a >
2024-08-14 21:24:36 +00:00
< a href = "{{'/blog'|url}}" > < div class = "button" > blog< / div > < / a >
2023-12-03 01:06:13 +00:00
< a href = "https://box.kernelpanic.lol" > < div class = "button" > proyectos< / div > < / a >
2024-08-14 21:24:36 +00:00
<!-- <a href="/censo - hacker - latinoamericane - 2023"><div class="button">participa en el censo</div></a> -->
2023-10-20 02:20:13 +00:00
<!-- <a href="https://pat.kernelpanic.lol/calendar/#/2/calendar/view/CH1zbFeFKLPO5SPle5JNxjKqdSaidbYPYBKFC4PDSus/embed/"><div class="button">calendario</div></a> -->
2023-08-10 23:57:27 +00:00
2023-06-24 06:08:37 +00:00
<!-- Add more buttons as needed -->
2023-06-26 01:34:19 +00:00
{% endblock %}
2023-06-24 06:08:37 +00:00
< / div >
< div class = "content" >
< h1 > {{ this.title }}< / h1 >
2023-06-26 01:34:19 +00:00
{% block body %}{% endblock %}
2023-06-24 06:08:37 +00:00
< / div >
< script >
document.body.addEventListener('click', function () {
var randomColor = 'rgb(' +
Math.floor(Math.random() * 256) + ',' +
Math.floor(Math.random() * 256) + ',' +
Math.floor(Math.random() * 256) + ')';
document.body.style.backgroundColor = randomColor;
document.getElementById('topbar').style.backgroundColor = randomColor;
2023-09-13 22:28:13 +00:00
var rgb = randomColor.match(/\d+/g).map(Number);
// Calculate the brightness of the color
var brightness = Math.round((parseInt(rgb[0]) * 299 + parseInt(rgb[1]) * 587 + parseInt(rgb[2]) * 114) / 1000);
// Choose black or white for the font color based on the brightness
var randomFontColor = brightness > 150 ? 'black' : 'white';
document.body.style.color = randomFontColor;
2023-06-24 06:08:37 +00:00
});
var buttons = document.querySelectorAll('.button');
buttons.forEach(function(button) {
2023-09-13 22:28:13 +00:00
button.addEventListener('mouseover', function() {
2023-06-24 06:08:37 +00:00
var randomColor = 'rgb(' +
Math.floor(Math.random() * 256) + ',' +
Math.floor(Math.random() * 256) + ',' +
Math.floor(Math.random() * 256) + ')';
2023-09-13 22:28:13 +00:00
// Convert the RGB color to an array of numbers
var rgb = randomColor.match(/\d+/g).map(Number);
// Calculate the brightness of the color
var brightness = Math.round((parseInt(rgb[0]) * 299 + parseInt(rgb[1]) * 587 + parseInt(rgb[2]) * 114) / 1000);
// Choose black or white for the font color based on the brightness
var randomFontColor = brightness > 150 ? 'black' : 'white';
2023-06-24 06:08:37 +00:00
this.style.backgroundColor = randomColor;
2023-09-13 22:28:13 +00:00
this.style.color = randomFontColor;
2023-06-24 06:08:37 +00:00
});
});
< / script >
2024-08-14 21:24:36 +00:00
<!-- THIS IS THE GRADIENT MORPHING BUTTON
< script >
2023-12-03 01:06:13 +00:00
const button = document.getElementById('colorButton');
let t = 0;
function generateColor(t, phase) {
return Math.floor((Math.sin(t + phase) + 1) * 128);
}
function updateGradient() {
const r1 = generateColor(t, 0);
const g1 = generateColor(t, 2);
const b1 = generateColor(t, 4);
const color1 = `rgb(${r1}, ${g1}, ${b1})`;
const r2 = generateColor(t, 6);
const g2 = generateColor(t, 8);
const b2 = generateColor(t, 10);
const color2 = `rgb(${r2}, ${g2}, ${b2})`;
button.style.background = `linear-gradient(to right, ${color1}, ${color2})`;
t += 0.01;
}
setInterval(updateGradient, 1000 / 600); // 60 frames per second for a smooth transition
2024-08-14 21:24:36 +00:00
< / script > -->
<!-- <script>
2023-12-03 01:06:13 +00:00
document.addEventListener('DOMContentLoaded', function() {
const endpoint = "https://kernelpanic.lol/spacestats"; // Replace with your actual endpoint
const button = document.getElementById('spaceStatusButton');
fetch(endpoint)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json();
})
.then(data => {
2024-08-14 21:24:36 +00:00
updateButtonStatus(button, data.state.open);
2023-12-03 01:06:13 +00:00
})
.catch(error => {
console.error('There has been a problem with your fetch operation:', error);
button.textContent = 'Error fetching status';
});
});
function updateButtonStatus(button, status) {
2024-08-14 21:24:36 +00:00
if (status === 'true') {
2023-12-03 01:06:13 +00:00
button.textContent = 'Estamos aquí';
button.style.backgroundColor = 'green';
2024-08-14 21:24:36 +00:00
} else if (status === 'false') {
2023-12-03 01:06:13 +00:00
button.textContent = 'No estamos';
button.style.backgroundColor = 'red';
} else {
button.textContent = 'Algo raro sucede';
button.style.backgroundColor = 'grey';
}
}
2024-08-14 21:24:36 +00:00
< / script > -->
< script >
var canvas = document.getElementById('body');
var ctx = canvas.getContext('2d');
var gridSpacing = 180; // --s: 80px; /* control the size of the grid */
var gridSize = 20;
var distortionFactor = 10;
function drawGrid(centerX, centerY) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
for (var i = 0; i < canvas.width ; i + = gridSpacing ) {
for (var j = 0; j < canvas.height ; j + = gridSpacing ) {
var dx = i - centerX;
var dy = j - centerY;
var dist = Math.sqrt(dx*dx + dy*dy);
var offset = dist / distortionFactor;
var x = i + dx / offset;
var y = j + dy / offset;
ctx.fillRect(x, y, gridSize, gridSize);
// Connect the points with lines
if (i > 0) {
// Horizontal line
ctx.beginPath();
ctx.moveTo(x, y + gridSize / 2);
ctx.lineTo(x - gridSpacing, j + dy / (dist / (distortionFactor * gridSpacing)) + gridSize / 2);
ctx.stroke();
}
if (j > 0) {
// Vertical line
ctx.beginPath();
ctx.moveTo(x + gridSize / 2, y);
ctx.lineTo(i + dx / (dist / (distortionFactor * gridSpacing)) + gridSize / 2, y - gridSpacing);
ctx.stroke();
}
}
}
}
function resizeCanvas() {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
}
window.onresize = resizeCanvas;
resizeCanvas();
canvas.onmousemove = function(e) {
drawGrid(e.clientX, e.clientY);
};
drawGrid(canvas.width / 2, canvas.height / 2);
2023-12-03 01:06:13 +00:00
< / script >
2023-07-26 23:50:55 +00:00
< div id = "footer" >
{% block footer %}
< p > Por la gracia de San iGNUcio desde el Cuarto de Máquinas @ 2023.< / p >
< p > Contáctanos en < a href = "https://twitter.com/botkernel" > el twatter< / a > para lo que se ocupe.< / p >
{% endblock %}
< / div >
2023-06-21 17:30:48 +00:00
< / body >
2024-08-14 21:24:36 +00:00
< / html >
