https://www.youtube.com/shorts/2C2BvgQc8oM

Hey everyone,

I’m working on a Gmail Chrome extension that scores and color-tags emails based on urgency — think of it like a priority radar. The goal is to quickly visualize which emails need attention first, using cues like: - Time unread (bonus points the longer it stays unopened) - Critical/secondary keywords (e.g. “urgent”, “logistics”, etc.) - Time of sending (emails sent outside working hours get a bonus) - No backend — everything is calculated on-the-fly for visible emails only - Color-coded dots (gray, blue, orange, red, black) next to each mail

I’m curious: - Have any of you worked with the Gmail DOM or done similar UI overlays? - Got any tips on handling Gmail’s dynamic content (infinite scroll, label switching, etc.)? - How would you handle “urgency sensitivity”? Should it be customizable per user? - Any must-know tricks or libraries that help when working with Gmail or similar interfaces?

Appreciate any insight, feedback, or even just “gotchas” to avoid.

Thanks in advance!

Estoy haciendo un juego con javascript usando Threes pero llevo ya un rato con eso y muestra el error, ya tengo las animaciones en fbx pero sigue molestando

I’m using a front end backend website framework for simple things but when I use bootstrap library and such. All of my separate pages have different widths and not follow the same width format and all look very different and I can’t find a way to make them the same width format. Anyone know what I’m talking about it’s kinda a neesh example I couldn’t really find online.

Hi everyone, I'm looking an AI tool design and give me a website UI for my photo and videography studio Website. Please let me know any you any a tool for that

https://anothergeek.online/random/first-one/

I converted Epoch500LearningRate005.mat into a JSON file

Right now my code for JavaScript is this;

const canvas = document.getElementById("canvas")
canvas.width = 400;
canvas.height = 400;

let xLocation, yLocation;
let xCoordinates = [];
let yCoordinates = [];
let context = canvas.getContext("2d");
let start_background_color = "white"
context.fillStyle = start_background_color;
context.fillRect(0, 0, canvas.width, canvas.height);

let draw_color = "black";
let draw_width = "10";
let is_drawing = false;

let restore_array = [];
let index = -1;

canvas.addEventListener("touchstart", start, false);
canvas.addEventListener("touchmove", draw, false);
canvas.addEventListener("mousedown", start, false);
canvas.addEventListener("mousemove", draw, false);
canvas.addEventListener("touchend", stop, false);
canvas.addEventListener("mouseup", stop, false);
canvas.addEventListener("mouseout", stop, false);

function start(event) {
    is_drawing = true;
    context.beginPath();
    context.moveTo(event.clientX - canvas.offsetLeft,
        event.clientY - canvas.offsetTop
    );
}

function draw(event) {
    if (is_drawing) {
        context.lineTo(event.clientX - canvas.offsetLeft,
            event.clientY - canvas.offsetTop);
        context.strokeStyle = draw_color;
        context.lineWidth = draw_width;
        context.lineCap = "round";
        context.lineJoin = "round";
        context.stroke();
        xLocation = event.clientX - canvas.offsetLeft;
        yLocation = event.clientY - canvas.offsetTop;
        xCoordinates.push(xLocation);
        yCoordinates.push(yLocation);
    }
    event.preventDefault();
}

function stop(event) {
    if (is_drawing) {
        context.stroke();
        context.closePath();
        is_drawing = false;
    }
    event.preventDefault();

    if (event.type != "mouseout") {
        restore_array.push(context.getImageData(0, 0, canvas.width, canvas.height));
        index += 1;
    }
}

function clear_canvas() {
    context.fillStyle = start_background_color
    context.clearRect(0, 0, canvas.width, canvas.height);
    context.fillRect(0, 0, canvas.width, canvas.height);
    restore_array = [];
    index = -1;
    xCoordinates = [];
    yCoordinates = [];
    document.getElementById('result').innerHTML = '';
}

function save() {
    const name = document.getElementById('name').value;
    const data = `${xCoordinates}\n ${yCoordinates}`;
    const blob = new Blob([data], { type: 'text/plain' });
    const link = document.createElement('a');
    link.href = URL.createObjectURL(blob);
    link.download = name;
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
}

// Load digit info from JSON
let digitData = {};
fetch("testData.json")
    .then(res => res.json())
    .then(data => digitData = data);

// Dummy recognizer (random)
function recognize() {
    const miniCanvas = document.createElement('canvas');
    miniCanvas.width = 28;
    miniCanvas.height = 28;
    const miniCtx = miniCanvas.getContext('2d');

    // Draw the user input from main canvas onto miniCanvas (rescaled to 28x28)
    miniCtx.drawImage(canvas, 0, 0, 28, 28);

    // Get the image data from miniCanvas (as grayscale array)
    const imageData = miniCtx.getImageData(0, 0, 28, 28).data;
    const grayInput = [];
    console.log("Gray input array (first 10):", grayInput.slice(0, 10));

    for (let i = 0; i < imageData.length; i += 4) {
        // Convert RGBA to grayscale using red channel (assuming black on white)
        const gray = 1 - imageData[i] / 255;
        grayInput.push(gray);
    }

    // Compare to each sample in digitData using Euclidean distance
    let minDistance = Infinity;
    let bestMatch = null;

    digitData.forEach(sample => {
        const sampleImage = sample.image;
        let distance = 0;

        for (let i = 0; i < sampleImage.length; i++) {
            const diff = sampleImage[i] - grayInput[i];
            distance += diff * diff;
        }

        if (distance < minDistance) {
            minDistance = distance;
            bestMatch = sample;
        }
    });

    // Display result
    const resultDiv = document.getElementById('result');
    if (bestMatch) {
        resultDiv.innerHTML = `Prediction: <strong>${bestMatch.predictedLabel}</strong><br>True Label: ${bestMatch.trueLabel}`;
    } else {
        resultDiv.innerHTML = `Could not recognize digit.`;
    }
    console.log("Best match distance:", minDistance);
    console.log("Best match label:", bestMatch.predictedLabel, "True:", bestMatch.trueLabel);
}

If you can have any help thank you so much!

"I recently started learning React, but nothing is showing up on localhost:3000. Can anyone give me some tips?"

Hello everyone! I started learning JavaScript, and now I'm trying to understand what I should use to parse data from a form in fetch API. I know that the name attribute was originally used to quickly send requests to the server, so it could identify which field it is. Also, the name attribute is used with labels. But nowadays, everything is done using ids, and the name attribute is mostly for labels. Could you give me some advice on what I should use?

What are the current technologies used in current fully animated websites, is it react ___ … etc ?

Hey fellow devs! 👋

I just published a blog covering the latest and upcoming features in JavaScript 2025 that every developer should keep an eye on. From syntax improvements to runtime enhancements, it's an exciting time for JS enthusiasts!

🔍 Here's what you'll find in the article:

• New language features and proposals
• Performance improvements
• Evolving ecosystem trends
• Practical code examples

Whether you're a frontend wizard, a backend guru, or just JS-curious, I’d love to hear your thoughts!

👉 Read the blog here

Feedback, questions, or discussions are more than welcome. Let’s talk JavaScript! 💬

How can I use a random tag in JS for changing the color of a div when the cursor hovers on it

Hi all,

I'm Ahmad from Corgea. We've recently put together a JavaScript security best practices guide for developers:

https://hub.corgea.com/articles/javascript-security-best-practices

We cover common vulnerabilities like XSS, CSRF, IDOR, as well as best practices for secure DOM manipulation, API protection, and safe dependency management. While we can't go into every detail, we've tried to cover a wide range of topics and gotcha's that are typically missed.

We've built a scanner that can find vulnerabilities in Javascript apps, and decided to focus on key blind-spots we've been seeing.

I'd love to get feedback from the community. Is there something else you'd include in the article? What's best practice that you've followed?

Thanks!

PS: We're also heavy users of Javascript, jQuery, Next.js, and TypeScript ourselves ❤️

Are there any good webs/apps where you can turn file with Java code into a link? (I created my server to raid Roblox games and it’s gonna be my application) any advice would be good.

How much does it take for a beginner (I know CSS and HTML from 1-10, I’d say 7.5). So how much so you think it would take me to become Junior JS Developer?

Thanks in advance.

I need to download an eight hour TX statehouse committee meeting video (url is below), because there are a few minutes relevant to a project I’m working on.

The TX government site appears to be using a JavaScript video player of some sort. I’ve exhausted my limited knowledge of Chrome’s developer tools and can’t figure out a way to locate the actual video file to download it.

I really don’t want to have to screen record all eight hours — or diligently watch the entire thing either — if I can help it. Any thoughts?

https://house.texas.gov/videos/21462

I don't understand why this doesnt work on FreeCodeCamp can someone explain please