New bingo APP I built it this morning please approve

https://ray2407.github.io/250529bingo/

Mahalo

SIGNATURE:
Clifford "RAY" Hackett I founded www.adapt.org in 1980 it now has over 50 million members.
$500 of material=World’s fastest hydrofoil sailboat. http://sunrun.biz

On Fri, May 30, 2025 at 7:12 AM Clifford Hackett <3659745> wrote:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

<title>Bingo Checker</title>

<link rel="manifest" href="manifest.json" />

<style>

body { font-family: sans-serif; text-align: center; background: #f0f0f0; }

table { border-collapse: collapse; margin: 10px auto; }

td { width: 60px; height: 60px; text-align: center; vertical-align: middle;

border: 1px solid #888; font-size: 20px; cursor: pointer; }

.marked { background-color: #4caf50; color: white; }

input, button { margin: 10px; padding: 10px; font-size: 16px; }

#status { font-size: 1.2em; margin-top: 10px; color: #d32f2f; }

</style>

</head>

<body>

<h1>Bingo Checker</h1>

<div>

<table id="bingoCard"></table>

<input type="text" id="calledInput" placeholder="Enter called number (e.g., B5)" />

<button onclick="markCalled()">Mark</button>

<div id="status"></div>

</div>

<script>

const bingoCard = [

      ["B1", "B2", "B3", "B4", "B5"],

["I16", "I17", "I18", "I19", "I20"],

["N31", "N32", "FREE", "N34", "N35"],

["G46", "G47", "G48", "G49", "G50"],

["O61", "O62", "O63", "O64", "O65"]

];

const marked = Array.from({ length: 5 }, () => Array(5).fill(false));

marked[2][2] = true; // Free space

function renderCard() {

const table = document.getElementById("bingoCard");

table.innerHTML = "";

for (let r = 0; r < 5; r++) {

const row = document.createElement("tr");

for (let c = 0; c < 5; c++) {

const cell = document.createElement("td");

cell.textContent = bingoCard[r][c];

if (marked[r][c]) cell.classList.add("marked");

row.appendChild(cell);

}

table.appendChild(row);

}

}

function markCalled() {

const input = document.getElementById("calledInput").value.toUpperCase().trim();

for (let r = 0; r < 5; r++) {

for (let c = 0; c < 5; c++) {

if (bingoCard[r][c] === input) {

marked[r][c] = true;

renderCard();

checkBingo();

return;

}

}

}

document.getElementById("status").textContent = "Number not found.";

}

function checkBingo() {

const status = document.getElementById("status");

// Rows

for (let r = 0; r < 5; r++) if (marked[r].every(Boolean)) return status.textContent = "🎉 BINGO!";

// Columns

for (let c = 0; c < 5; c++) if (marked.every(row => row[c])) return status.textContent = "🎉 BINGO!";

// Diagonals

if ([0,1,2,3,4].every(i => marked[i][i]) || [0,1,2,3,4].every(i => marked[i][4-i]))

return status.textContent = "🎉 BINGO!";

status.textContent = "";

}

window.onload = () => {

renderCard();

if (‘serviceWorker’ in navigator) navigator.serviceWorker.register(‘sw.js’);

};

</script>

<!– Manifest (inlined for PWA functionality) –>

<script type="application/json" id="manifest.json">

{

"name": "Bingo Checker",

"short_name": "BingoApp",

"start_url": ".",

"display": "standalone",

"background_color": "#ffffff",

"theme_color": "#4caf50",

"icons": [{

      "src": "https://ray2407.github.io/250527b/icon.png",

      "sizes": "192×192",

      "type": "image/png"

    }]

}

</script>

<!– Service Worker (inlined for offline support) –>

<script id="sw.js" type="javascript/worker">

const cacheName = "bingo-cache-v1";

self.addEventListener("install", e => {

e.waitUntil(

caches.open(cacheName).then(cache => cache.addAll([".", "index.html"]))

);

});

self.addEventListener("fetch", e => {

e.respondWith(

caches.match(e.request).then(res => res || fetch(e.request))

);

});

</script>

</body>

</html>

Mahalo

SIGNATURE:
Clifford "RAY" Hackett I founded www.adapt.org in 1980 it now has over 50 million members.
$500 of material=World’s fastest hydrofoil sailboat. http://sunrun.biz

New bingo APP I built it this morning please approve

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0"/>

<title>Bingo Checker</title>

<link rel="manifest" href="manifest.json" />

<style>

body { font-family: sans-serif; text-align: center; background: #f0f0f0; }

table { border-collapse: collapse; margin: 10px auto; }

td { width: 60px; height: 60px; text-align: center; vertical-align: middle;

border: 1px solid #888; font-size: 20px; cursor: pointer; }

.marked { background-color: #4caf50; color: white; }

input, button { margin: 10px; padding: 10px; font-size: 16px; }

#status { font-size: 1.2em; margin-top: 10px; color: #d32f2f; }

</style>

</head>

<body>

<h1>Bingo Checker</h1>

<div>

<table id="bingoCard"></table>

<input type="text" id="calledInput" placeholder="Enter called number (e.g., B5)" />

<button onclick="markCalled()">Mark</button>

<div id="status"></div>

</div>

<script>

const bingoCard = [

      ["B1", "B2", "B3", "B4", "B5"],

["I16", "I17", "I18", "I19", "I20"],

["N31", "N32", "FREE", "N34", "N35"],

["G46", "G47", "G48", "G49", "G50"],

["O61", "O62", "O63", "O64", "O65"]

];

const marked = Array.from({ length: 5 }, () => Array(5).fill(false));

marked[2][2] = true; // Free space

function renderCard() {

const table = document.getElementById("bingoCard");

table.innerHTML = "";

for (let r = 0; r < 5; r++) {

const row = document.createElement("tr");

for (let c = 0; c < 5; c++) {

const cell = document.createElement("td");

cell.textContent = bingoCard[r][c];

if (marked[r][c]) cell.classList.add("marked");

row.appendChild(cell);

}

table.appendChild(row);

}

}

function markCalled() {

const input = document.getElementById("calledInput").value.toUpperCase().trim();

for (let r = 0; r < 5; r++) {

for (let c = 0; c < 5; c++) {

if (bingoCard[r][c] === input) {

marked[r][c] = true;

renderCard();

checkBingo();

return;

}

}

}

document.getElementById("status").textContent = "Number not found.";

}

function checkBingo() {

const status = document.getElementById("status");

// Rows

for (let r = 0; r < 5; r++) if (marked[r].every(Boolean)) return status.textContent = "🎉 BINGO!";

// Columns

for (let c = 0; c < 5; c++) if (marked.every(row => row[c])) return status.textContent = "🎉 BINGO!";

// Diagonals

if ([0,1,2,3,4].every(i => marked[i][i]) || [0,1,2,3,4].every(i => marked[i][4-i]))

return status.textContent = "🎉 BINGO!";

status.textContent = "";

}

window.onload = () => {

renderCard();

if (‘serviceWorker’ in navigator) navigator.serviceWorker.register(‘sw.js’);

};

</script>

<!– Manifest (inlined for PWA functionality) –>

<script type="application/json" id="manifest.json">

{

"name": "Bingo Checker",

"short_name": "BingoApp",

"start_url": ".",

"display": "standalone",

"background_color": "#ffffff",

"theme_color": "#4caf50",

"icons": [{

      "src": "https://ray2407.github.io/250527b/icon.png",

      "sizes": "192×192",

      "type": "image/png"

    }]

}

</script>

<!– Service Worker (inlined for offline support) –>

<script id="sw.js" type="javascript/worker">

const cacheName = "bingo-cache-v1";

self.addEventListener("install", e => {

e.waitUntil(

caches.open(cacheName).then(cache => cache.addAll([".", "index.html"]))

);

});

self.addEventListener("fetch", e => {

e.respondWith(

caches.match(e.request).then(res => res || fetch(e.request))

);

});

</script>

</body>

</html>

Mahalo

SIGNATURE:
Clifford "RAY" Hackett I founded www.adapt.org in 1980 it now has over 50 million members.
$500 of material=World’s fastest hydrofoil sailboat. http://sunrun.biz

Class and fundraiser

My general idea, and hoping for some input and feedback . Hosting a fundraiser + AI website-building class can create a powerful community-driven event that teaches valuable skills, helps participants launch online businesses for free, and supports the local government. Here’s a full plan and multiple creative ideas for you to build on:

🎯 Event Title Ideas

• “Build & Give: AI Website Workshop”

• “Code for a Cause: AI Sites for Success”

• “From Zero to AI Hero – Guam Web Fundraiser”

• “Future Ready Guam: Learn AI, Support the City”

📍 Core Structure

1. Host a Free Class (2-3 hours):

• Teach attendees to build AI websites using free tools (GitHub, OpenAI, Netlify, etc.)

• Focus on low-code/no-code solutions (good for beginners).

• Each site should include a “Powered by [Student Name]” and a suggested donation link.

2. Student Guidelines:

• Sites must be 100% free to make.

• No custom hosting or complex platforms.

• Simple rules: “Free tools, real income, local impact.”

3. Fundraising Element:

• Suggest that each student donates 10% of their first 3 months of online income to the Mayor’s Office fund (or a community project).

• Add optional “Donate Now” buttons on each site linking to the city’s donation portal or QR code.

💡 Additional Suggestions

🔹 1. Community-Building Tie-Ins:

• Invite local businesses to sponsor snacks, drinks, or raffle items.

• Offer certificates for participants who complete and publish a working site.

🔹 2. Project Ideas for Students:

• AI-powered resume builders

• Local service listings (e.g. massage, tutoring, cleaning)

• Blog + affiliate link sites (Amazon, local stores)

• Art print or AI-image storefronts

• Event promotion sites for friends/family

🔹 3. Encourage Pay-It-Forward:

• Ask participants to commit to mentoring one person after they succeed.

• Share success stories on a community Facebook or YouTube channel (maybe GUAMSNEWS?)

🔹 4. Promote Localism:

• Sites should showcase Guam, use local imagery, and include a section about how Guam supports innovation.

• You could even add a “Built in Guam” badge for everyone to proudly display.

💬 Sample Messaging for Students

“You’ll learn how to build and launch a real AI-powered website in a few hours — totally free. In return, we ask that when you succeed, you give back a little to the community that helped launch your journey. Let’s grow together.”

📦 Optional Bonus Materials

• Downloadable PWA starter kits (like your “Code Scanner” repo)

• Short YouTube tutorial recaps

• Printable PDF quick-start guides (how to set up GitHub, etc.)

• A branded donation template page they can clone

Mahalo

SIGNATURE:
Clifford "RAY" Hackett I founded www.adapt.org in 1980 it now has over 50 million members.
$500 of material=World’s fastest hydrofoil sailboat. http://sunrun.biz