kibi/f0ckm
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

add apu bingo

Browse Source
This commit is contained in:
Kibi Kelburton
2026-05-25 09:20:40 +02:00
parent 92cc474ca3
commit d4a68f59fd
1 changed files with 108 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

190
public/s/js/meme-creator.js
View File

@@ -367,14 +367,16 @@
} }
const category = (window.memeTemplate && window.memeTemplate.category) ? window.memeTemplate.category.toLowerCase() : ''; const category = (window.memeTemplate && window.memeTemplate.category) ? window.memeTemplate.category.toLowerCase() : '';
const subCategory = (window.memeTemplate && window.memeTemplate.sub_category) ? window.memeTemplate.sub_category.toLowerCase() : ''; const subCategory = (window.memeTemplate && window.memeTemplate.sub_category) ? window.memeTemplate.sub_category.toLowerCase() : '';
const templateId = (window.memeTemplate && window.memeTemplate.id) ? window.memeTemplate.id.toLowerCase() : '';
const isOrakelVon10 = subCategory === 'von10'; const isOrakelVon10 = subCategory === 'von10';
const isOrakelUser = subCategory === 'user'; const isOrakelUser = subCategory === 'user';
const isOrakelNormal = category === 'orakel' && !isOrakelUser && !isOrakelVon10; const isOrakelBingoApu = subCategory === 'bingoapu' || templateId === 'bingoapu';
const isOrakelNormal = category === 'orakel' && !isOrakelUser && !isOrakelVon10 && !isOrakelBingoApu;
let uploadCanvas = canvas; let uploadCanvas = canvas;
if (isOrakelNormal || isOrakelUser || isOrakelVon10) { if (isOrakelNormal || isOrakelUser || isOrakelVon10 || isOrakelBingoApu) {
// Create an off-screen canvas to apply the orakel answer silently // Create an off-screen canvas to apply the orakel answer silently
uploadCanvas = document.createElement('canvas'); uploadCanvas = document.createElement('canvas');
uploadCanvas.width = canvas.width; uploadCanvas.width = canvas.width;
@@ -385,6 +387,7 @@
uCtx.drawImage(canvas, 0, 0); uCtx.drawImage(canvas, 0, 0);
let result = ''; let result = '';
let selectedCorner = null;
if (isOrakelNormal) { if (isOrakelNormal) {
const outcomes = ['JA', 'NEIN', 'VIELLEICHT', 'AUF JEDEN FALL', 'NIEMALS', 'SOWAS VON JA', 'VERGISS ES', 'FRAG SPÄTER', 'KOMMT DRAUF AN']; const outcomes = ['JA', 'NEIN', 'VIELLEICHT', 'AUF JEDEN FALL', 'NIEMALS', 'SOWAS VON JA', 'VERGISS ES', 'FRAG SPÄTER', 'KOMMT DRAUF AN'];
result = outcomes[Math.floor(Math.random() * outcomes.length)]; result = outcomes[Math.floor(Math.random() * outcomes.length)];
@@ -398,92 +401,115 @@
} }
} else if (isOrakelVon10) { } else if (isOrakelVon10) {
result = Math.floor(Math.random() * 11).toString(); result = Math.floor(Math.random() * 11).toString();
} else if (isOrakelBingoApu) {
const corners = [
{ x: 60, y: 100, label: 'YES' },
{ x: 573, y: 100, label: 'NO' },
{ x: 60, y: 615, label: 'NO' },
{ x: 573, y: 615, label: 'YES' }
];
selectedCorner = corners[Math.floor(Math.random() * corners.length)];
result = selectedCorner.label;
} }
// Draw Orakel result on the hidden canvas // Draw Orakel result on the hidden canvas
uCtx.save(); uCtx.save();
uCtx.font = (isOrakelVon10) ? 'bold 150px Impact' : 'bold 80px Impact'; // Bigger font for the rating if (isOrakelBingoApu) {
uCtx.textAlign = 'center'; // Draw "KOPS" in normal meme text style on the selected corner
uCtx.textBaseline = 'middle'; uCtx.font = `bold 28px ${memeFont}`;
uCtx.textAlign = 'center';
if (isOrakelNormal) { uCtx.textBaseline = 'middle';
uCtx.shadowBlur = 20; uCtx.fillStyle = '#fff';
uCtx.shadowColor = 'rgba(101, 37, 212, 1)'; uCtx.strokeStyle = '#000';
} else if (isOrakelVon10) { uCtx.lineWidth = 4;
uCtx.shadowBlur = 0; // No shadow as requested uCtx.miterLimit = 2;
} else {
// No shadow for the User Orakel
uCtx.shadowBlur = 0;
}
uCtx.fillStyle = '#fff';
uCtx.strokeStyle = '#000';
uCtx.lineWidth = 10;
uCtx.miterLimit = 2;
// Adjust position for user Orakel (reverting to +10 offset)
let yPos = Math.round(isOrakelUser ? (uploadCanvas.height / 2 + 10) : (uploadCanvas.height / 2 + 50));
if (isOrakelVon10) {
yPos = Math.round(uploadCanvas.height / 2 ); // 1px lower
}
const xPos = Math.round(uploadCanvas.width / 2);
// Auto-fit font size for user orakel — shrink until text fits within image width
let orakelFontSize = isOrakelVon10 ? 150 : 80;
const maxTextWidth = uploadCanvas.width - 80; // 40px padding each side
if (isOrakelUser) {
const parts = result.split('|||');
const namePart = parts[0];
const idPart = parts.length > 1 ? `(${parts[1]})` : '';
const combinedText = idPart ? `${namePart} ${idPart}` : namePart;
// Even tighter threshold for User Orakel (approx 25% total padding)
const userMaxWidth = Math.round(uploadCanvas.width * 0.75);
let currentFontSize = 74;
uCtx.font = `bold ${currentFontSize}px Impact`;
// First attempt: Shrink entire text on one line down to 58px if needed uCtx.strokeText('KOPS', selectedCorner.x, selectedCorner.y);
while (uCtx.measureText(combinedText).width > userMaxWidth && currentFontSize > 58) { uCtx.fillText('KOPS', selectedCorner.x, selectedCorner.y);
currentFontSize -= 2;
uCtx.font = `bold ${currentFontSize}px Impact`;
}
const combinedFits = uCtx.measureText(combinedText).width <= userMaxWidth;
if (combinedFits) {
// Single line — potentially shrunk for long names
uCtx.fillText(combinedText, xPos, yPos);
} else {
// Two lines — auto-fit just the name, ID below
let nameFontSize = 74;
uCtx.font = `bold ${nameFontSize}px Impact`;
while (uCtx.measureText(namePart).width > userMaxWidth && nameFontSize > 16) {
nameFontSize -= 2;
uCtx.font = `bold ${nameFontSize}px Impact`;
}
const idFontSize = Math.max(18, Math.round(nameFontSize * 0.45));
const lineGap = Math.round(nameFontSize * 0.65);
const nameY = Math.round(yPos - lineGap / 2);
const idY = Math.round(yPos + lineGap / 2) + 2;
uCtx.font = `bold ${nameFontSize}px Impact`;
uCtx.fillText(namePart, xPos, nameY);
if (idPart) {
uCtx.font = `bold ${idFontSize}px Impact`;
uCtx.fillText(idPart, xPos, idY);
}
}
} else { } else {
// Normal / von10 — single line as before uCtx.font = (isOrakelVon10) ? 'bold 150px Impact' : 'bold 80px Impact'; // Bigger font for the rating
uCtx.font = `bold ${orakelFontSize}px Impact`; uCtx.textAlign = 'center';
uCtx.strokeText(result, xPos, yPos); uCtx.textBaseline = 'middle';
uCtx.fillText(result, xPos, yPos);
if (isOrakelNormal) {
uCtx.shadowBlur = 20;
uCtx.shadowColor = 'rgba(101, 37, 212, 1)';
} else if (isOrakelVon10) {
uCtx.shadowBlur = 0; // No shadow as requested
} else {
// No shadow for the User Orakel
uCtx.shadowBlur = 0;
}
uCtx.fillStyle = '#fff';
uCtx.strokeStyle = '#000';
uCtx.lineWidth = 10;
uCtx.miterLimit = 2;
// Adjust position for user Orakel (reverting to +10 offset)
let yPos = Math.round(isOrakelUser ? (uploadCanvas.height / 2 + 10) : (uploadCanvas.height / 2 + 50));
if (isOrakelVon10) {
yPos = Math.round(uploadCanvas.height / 2 ); // 1px lower
}
const xPos = Math.round(uploadCanvas.width / 2);
// Auto-fit font size for user orakel — shrink until text fits within image width
let orakelFontSize = isOrakelVon10 ? 150 : 80;
const maxTextWidth = uploadCanvas.width - 80; // 40px padding each side
if (isOrakelUser) {
const parts = result.split('|||');
const namePart = parts[0];
const idPart = parts.length > 1 ? `(${parts[1]})` : '';
const combinedText = idPart ? `${namePart} ${idPart}` : namePart;
// Even tighter threshold for User Orakel (approx 25% total padding)
const userMaxWidth = Math.round(uploadCanvas.width * 0.75);
let currentFontSize = 74;
uCtx.font = `bold ${currentFontSize}px Impact`;
// First attempt: Shrink entire text on one line down to 58px if needed
while (uCtx.measureText(combinedText).width > userMaxWidth && currentFontSize > 58) {
currentFontSize -= 2;
uCtx.font = `bold ${currentFontSize}px Impact`;
}
const combinedFits = uCtx.measureText(combinedText).width <= userMaxWidth;
if (combinedFits) {
// Single line — potentially shrunk for long names
uCtx.fillText(combinedText, xPos, yPos);
} else {
// Two lines — auto-fit just the name, ID below
let nameFontSize = 74;
uCtx.font = `bold ${nameFontSize}px Impact`;
while (uCtx.measureText(namePart).width > userMaxWidth && nameFontSize > 16) {
nameFontSize -= 2;
uCtx.font = `bold ${nameFontSize}px Impact`;
}
const idFontSize = Math.max(18, Math.round(nameFontSize * 0.45));
const lineGap = Math.round(nameFontSize * 0.65);
const nameY = Math.round(yPos - lineGap / 2);
const idY = Math.round(yPos + lineGap / 2) + 2;
uCtx.font = `bold ${nameFontSize}px Impact`;
uCtx.fillText(namePart, xPos, nameY);
if (idPart) {
uCtx.font = `bold ${idFontSize}px Impact`;
uCtx.fillText(idPart, xPos, idY);
}
}
} else {
// Normal / von10 — single line as before
uCtx.font = `bold ${orakelFontSize}px Impact`;
uCtx.strokeText(result, xPos, yPos);
uCtx.fillText(result, xPos, yPos);
}
} }
uCtx.restore(); uCtx.restore();
} }