downshift-js / downshift-js/downshift

bn022

Open
#1,697 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
12.3k
Forks
936
PR merge metrics
No merged PRs in 30d

Description

* {
margin: 0;
padding: 0;
box-sizing: border-box;
user-select: none;
}
html, body {
width: 100%;
height: 100%;
overflow: hidden;
background: #000;
font-family: Arial, sans-serif;
}
canvas {
display: block;
width: 100vw;
height: 100vh;
}
const canvas = document.getElementById("c");
const ctx = canvas.getContext("2d");
let W, H, CX, CY, SCALE;
const DPR = Math.min(window.devicePixelRatio || 1, 2);
const text = "I love you";
const points = [];
const TOTAL = 95; // menos puntos = menos amontonado, más limpio
function resize() {
W = window.innerWidth;
H = window.innerHeight;
canvas.width = W * DPR;
canvas.height = H * DPR;
canvas.style.width = W + "px";
canvas.style.height = H + "px";
ctx.setTransform(1, 0, 0, 1, 0, 0);
ctx.scale(DPR, DPR);
CX = W / 2;
CY = H / 2 + 20;
// tamaño adaptado a celular
SCALE = Math.min(W, H) * 0.014;
buildPoints();
}
// Ecuación clásica del corazón
function heart(t) {
const x = 16 * Math.pow(Math.sin(t), 3);
const y = 13 * Math.cos(t) - 5 * Math.cos(2*t) - 2 * Math.cos(3*t) - Math.cos(4*t);
return {
x: x * SCALE,
y: -y * SCALE
};
}
function buildPoints() {
points.length = 0;
for (let i = 0; i < TOTAL; i++) {
const t = (i / TOTAL) * Math.PI * 2;
points.push({
baseT: t,
phase: Math.random() * Math.PI * 2
});
}
}
function glowText(txt, x, y, angle, size, alpha = 1) {
ctx.save();
ctx.translate(x, y);
ctx.rotate(angle);
ctx.font = `bold ${size}px Arial, sans-serif`;
ctx.textAlign = "center";
ctx.textBaseline = "middle";
// Glow fuerte tipo neón
ctx.shadowColor = "rgba(255, 120, 190, 0.95)";

Contributor guide

Open the contributing guide

Research direction

The body contains a partial JavaScript canvas animation snippet but names no Downshift file, component, test, or requested change. Start by clarifying how this relates to Downshift and the intended outcome; completion cannot be defined until a concrete change and acceptance criteria are provided.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Active
Clarity
Needs clarification
Newbie friendliness
10/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.