= 75) return { label:'ATS Friendly', color:'#16a34a', bg:'rgba(22,163,74,0.12)', border:'rgba(22,163,74,0.30)' }; if (s >= 51) return { label:'Needs Improvement', color:'#b45309', bg:'rgba(180,83,9,0.10)', border:'rgba(180,83,9,0.28)' }; return { label:'High ATS Risk', color:'#b91c1c', bg:'rgba(185,28,28,0.09)', border:'rgba(185,28,28,0.26)' }; } function setStep(n) { for (var i = 1; i <= 4; i++) { document.getElementById('step-' + i).className = 'atsStep' + (i < n ? ' done' : i === n ? ' active' : ''); } } function animateCount(target, duration) { var el = document.getElementById('r-score'); var cur = 0; var step = Math.max(1, Math.ceil(duration / Math.max(target, 1))); var timer = setInterval(function () { cur = Math.min(cur + 1, target); el.textContent = cur; if (cur >= target) clearInterval(timer); }, step); } function animateBar(id, pct, color) { setTimeout(function () { var el = document.getElementById(id); if (!el) return; el.style.width = pct + '%'; if (color) el.style.background = color; }, 120); } /* ─── Keyword extraction ────────────────── */ function extractKeywords(text, limit) { var freq = {}; text.toLowerCase() .replace(/[^a-z0-9\s\+\#\.]/g, ' ') .split(/\s+/) .forEach(function (w) { w = w.replace(/[^a-z0-9\+\#]/g, ''); if (w.length < 3 || STOP.has(w)) return; freq[w] = (freq[w] || 0) + 1; }); var arr = Object.keys(freq).map(function (k) { return { word: k, count: freq[k] }; }); arr.sort(function (a, b) { return b.count - a.count; }); return limit ? arr.slice(0, limit) : arr; } /* ─── Stemmer ───────────────────────────── */ function stem(w) { w = w.toLowerCase(); var rules = [ [/ations?$/,'ate'],[/ments?$/,''],[/nesses?$/,''],[/ings?$/,''], [/tion$/,'te'],[/ities?$/,'ity'],[/ers?$/,''],[/ied$/,'y'], [/ed$/,''],[/ly$/,''],[/ful$/,''],[/ive$/,''],[/al$/,''], [/ous$/,''],[/ence$/,''],[/ance$/,''],[/ship$/,''] ]; for (var i = 0; i < rules.length; i++) { var r = rules[i]; if (r[0].test(w)) { var res = w.replace(r[0], r[1]); if (res.length >= 3) return res; } } return w; } /* ─── Match type ────────────────────────── */ function matchType(jdWord, cvText) { var lcv = cvText.toLowerCase(); var lcw = jdWord.toLowerCase(); if (new RegExp('\\b' + lcw.replace(/[+#]/g,'\\$&') + '\\b').test(lcv)) return 'exact'; var stemJd = stem(lcw); var found = lcv.split(/\s+/).some(function (w) { return stem(w.replace(/[^a-z]/g,'')) === stemJd; }); if (found) return 'partial'; if (lcw.length >= 5 && lcv.indexOf(lcw.slice(0, lcw.length - 2)) !== -1) return 'partial'; return 'miss'; } /* ─── Count occurrences in CV ───────────── */ function countInCv(word, cvText) { var m = cvText.toLowerCase().match(new RegExp('\\b' + word.replace(/[+#]/g,'\\$&') + '\\b', 'gi')); return m ? m.length : 0; } /* ─── Section detection ─────────────────── */ function detectSections(cvText) { var r = {}; Object.keys(SECTIONS).forEach(function (k) { r[k] = SECTIONS[k].some(function (re) { return re.test(cvText); }); }); return r; } /* ─── Experience recency (15 pts) ───────── */ function scoreExperienceRecency(cvText) { var now = new Date().getFullYear(); var years = (cvText.match(/\b(19|20)\d{2}\b/g) || []).map(Number).filter(function (y) { return y >= 1970 && y <= now + 1; }); var unique = Array.from(new Set(years)).sort(function (a,b) { return b - a; }); if (unique.length === 0) return { score: 4, hasRecent: false }; var mostRecent = unique[0]; var oldest = unique[unique.length - 1]; var recency = now - mostRecent; var span = mostRecent - oldest; var pts = 0; if (recency <= 1) pts += 7; else if (recency <= 2) pts += 5; else if (recency <= 4) pts += 3; else pts += 1; if (span >= 5 && unique.length >= 4) pts += 5; else if (span >= 2) pts += 3; else pts += 1; if (/\b(present|current|now|ongoing)\b/i.test(cvText)) pts += 3; return { score: Math.min(15, pts), hasRecent: recency <= 2 }; } /* ─── Formatting quality (10 pts) ────────── */ function scoreFormatting(cvText) { var pts = 10; var warn = []; var words = cvText.trim().split(/\s+/).length; var lines = cvText.trim().split(/\n/).length; if (words < 150) { pts -= 4; warn.push('CV appears too short (' + words + ' words). Aim for 400\u2013800 words.'); } else if (words < 300) { pts -= 2; warn.push('CV is on the short side (' + words + ' words). Add more detail to experience.'); } if (words > 1200) { pts -= 2; warn.push('CV may be too long (' + words + ' words). Keep it focused and concise.'); } var specials = (cvText.match(/[|■●▪►◄▶★☆✦✧✓✗✘•‣⁃]/g) || []).length; if (specials > 20) { pts -= 2; warn.push('Too many special characters (' + specials + '). These can break ATS parsing.'); } var seps = (cvText.match(/[-\u2500\u2501\u2550\u2015]{5,}/g) || []).length; if (seps > 5) { pts -= 1; warn.push('Many separator lines detected. Use standard section headers instead.'); } var avgLen = lines > 0 ? cvText.length / lines : 999; if (avgLen < 15 && lines > 30) { pts -= 2; warn.push('Short fragmented lines detected \u2014 possible table or column layout. ATS may misparse this.'); } return { score: Math.max(0, pts), warnings: warn }; } /* ─── Section recognition score (15 pts) ── */ function scoreSections(sections) { var w = { experience:5, skills:4, education:3, summary:2, certifications:1 }; return Math.min(15, Object.keys(w).reduce(function (t,k) { return t + (sections[k] ? w[k] : 0); }, 0)); } /* ─── Keyword placement score (20 pts) ───── */ function scoreKeywordPlacement(jdKws, cvText) { if (!jdKws || jdKws.length === 0) return 10; var lines = cvText.split('\n'); var sMap = { summary:'', skills:'', experience:'', education:'', other:'' }; var cur = 'other'; lines.forEach(function (line) { var l = line.toLowerCase(); if (/\b(summary|profile|objective|overview)\b/.test(l)) cur = 'summary'; else if (/\b(skills|competencies|technologies|expertise)\b/.test(l)) cur = 'skills'; else if (/\b(experience|employment|career|work\s+history)\b/.test(l)) cur = 'experience'; else if (/\b(education|academic|university|college)\b/.test(l)) cur = 'education'; if (sMap[cur] !== undefined) sMap[cur] += ' ' + line; }); var weights = { summary:4, skills:3, experience:2, education:1 }; var found = 0, possible = 0; jdKws.slice(0, 15).forEach(function (kw) { Object.keys(weights).forEach(function (sec) { possible += weights[sec]; if (matchType(kw.word, sMap[sec]) !== 'miss') found += weights[sec]; }); }); return Math.round(possible > 0 ? (found / possible) * 20 : 0); } /* ─── Keyword match score (40 pts) ─────── */ function scoreKeywordMatch(jdKws, cvText) { if (!jdKws || jdKws.length === 0) { var cvRich = Math.min(1, extractKeywords(cvText).length / 40); return { score: Math.round(cvRich * 28), matched:[], missing:[], partial:[], all:[] }; } var matched = [], missing = [], partial = []; var wScore = 0, wMax = 0; jdKws.forEach(function (kw, idx) { var w = Math.max(1, jdKws.length - idx); wMax += w; var mt = matchType(kw.word, cvText); if (mt === 'exact') { wScore += w; matched.push(kw.word); } else if (mt === 'partial') { wScore += w * 0.5; partial.push(kw.word); } else { missing.push(kw.word); } }); return { score: Math.min(40, Math.round(wMax > 0 ? (wScore / wMax) * 40 : 0)), matched: matched, missing: missing, partial: partial, all: jdKws }; } /* ─── Contact & quality signals ────────── */ function detectContact(t) { return { email: /[a-zA-Z0-9._%+\-]+@[a-zA-Z0-9.\-]+\.[a-z]{2,}/.test(t), phone: /(\+?\d[\d\s\-().]{7,}\d)/.test(t), linkedin: /linkedin\.com\/in\//i.test(t) || /linkedin/i.test(t) }; } function detectQuality(t) { return { has_dates: /\b(19|20)\d{2}\b/.test(t) || /\b(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)[a-z]*\.?\s*\d{4}\b/i.test(t), has_metrics: /\b(\d+\s*(%|percent|k|m|million|billion|users|clients|employees|team|projects?|years?))\b/i.test(t), has_action_verbs: ACTION_VERBS.some(function (v) { return new RegExp('\\b' + v + '\\b', 'i').test(t); }) }; } /* ─── Word count & page estimate ─────────── */ function wc(t) { return t.trim().split(/\s+/).filter(Boolean).length; } function pages(w) { return Math.max(1, Math.round(w / 400)); } /* ─── Career level ───────────────────────── */ function level(t) { var now = new Date().getFullYear(); var years = (t.match(/\b(19|20)\d{2}\b/g) || []).map(Number).filter(function (y) { return y >= 1970 && y <= now; }); if (!years.length) return 'Unknown'; var exp = now - Math.min.apply(null, years); if (exp >= 15) return 'Senior+'; if (exp >= 8) return 'Senior'; if (exp >= 3) return 'Mid-Level'; return 'Junior'; } /* ─── Generate tips ──────────────────────── */ function generateTips(sections, contact, quality, kwResult, fmtWarns, hasJd) { var warn = fmtWarns.slice(), sugg = []; if (!contact.email) warn.push('No email address detected. Always include your email at the top.'); if (!contact.phone) warn.push('No phone number detected. Recruiters need a way to contact you.'); if (!contact.linkedin) sugg.push('Add your LinkedIn profile URL to increase credibility.'); if (!sections.experience) warn.push('No Work Experience section detected. This is critical for ATS ranking.'); if (!sections.skills) warn.push('No Skills section detected. ATS systems heavily weight dedicated skills sections.'); if (!sections.education) sugg.push('Add an Education section \u2014 even if brief, ATS may require it.'); if (!sections.summary) sugg.push('Add a Professional Summary at the top with 2\u20133 keywords from the job description.'); if (!sections.certifications) sugg.push('Add a Certifications section if you hold any relevant credentials.'); if (!quality.has_dates) warn.push('No dates detected. Always include start/end dates for each role.'); if (!quality.has_metrics) sugg.push('Add measurable achievements: percentages, revenue figures, team sizes, etc.'); if (!quality.has_action_verbs) sugg.push('Start bullet points with strong action verbs: Led, Built, Delivered, Increased\u2026'); if (hasJd && kwResult.missing.length > 0) { warn.push('Missing JD keywords: ' + kwResult.missing.slice(0, 5).join(', ') + '. Add them naturally to your CV.'); } if (hasJd && kwResult.matched.length === 0) { warn.push('No exact keyword matches with the job description. Tailor your CV language to match the JD.'); } if (hasJd && kwResult.partial.length > 3) { sugg.push('Use exact keyword forms: e.g. "project management" not "managing projects".'); } if (!sugg.length) sugg.push('Your CV looks good. Keep keywords consistent with each job you apply for.'); if (!warn.length) warn.push('No major ATS issues detected. Review suggestions above for further improvement.'); return { warnings: warn, suggestions: sugg }; } /* ─── MAIN ANALYZE ───────────────────────── */ function analyzeCv(cvText, jdText, ext) { var hasJd = jdText && jdText.trim().length > 30; var jdKws = hasJd ? extractKeywords(jdText, 30) : []; var kwRes = scoreKeywordMatch(jdKws, cvText); var kpScore = scoreKeywordPlacement(jdKws, cvText); var sects = detectSections(cvText); var srScore = scoreSections(sects); var erRes = scoreExperienceRecency(cvText); var fmtRes = scoreFormatting(cvText); var contact = detectContact(cvText); var quality = detectQuality(cvText); var tips = generateTips(sects, contact, quality, kwRes, fmtRes.warnings, hasJd); var total = Math.min(100, Math.max(0, kwRes.score + kpScore + srScore + erRes.score + fmtRes.score)); var words = wc(cvText); return { score: total, breakdown: { kw: kwRes.score, kp: kpScore, sr: srScore, er: erRes.score, fq: fmtRes.score }, sections: sects, contact: contact, quality: quality, words: words, pages: pages(words), level: level(cvText), fileExt: ext.toUpperCase(), kwResult: kwRes, jdKws: jdKws, hasJd: hasJd, warnings: tips.warnings, suggestions: tips.suggestions, hasRecent: erRes.hasRecent }; } /* ─── RENDER RESULTS ─────────────────────── */ function renderResults(r) { var si = scoreInfo(r.score); setStep(4); document.getElementById('r-score').textContent = '0'; document.getElementById('r-score').style.color = si.color; animateCount(r.score, 800); var badge = document.getElementById('r-badge'); badge.textContent = si.label; badge.style.cssText = 'background:' + si.bg + ';border:1px solid ' + si.border + ';color:' + si.color; animateBar('r-bar', r.score, si.color); document.getElementById('r-type').textContent = r.fileExt; document.getElementById('r-words').textContent = r.words; document.getElementById('r-pages').textContent = r.pages; document.getElementById('r-level').textContent = r.level; var bd = r.breakdown; document.getElementById('bd-kw').textContent = bd.kw + '/40'; document.getElementById('bd-kp').textContent = bd.kp + '/20'; document.getElementById('bd-sr').textContent = bd.sr + '/15'; document.getElementById('bd-er').textContent = bd.er + '/15'; document.getElementById('bd-fq').textContent = bd.fq + '/10'; animateBar('bdf-kw', (bd.kw/40)*100, '#2563eb'); animateBar('bdf-kp', (bd.kp/20)*100, '#7c3aed'); animateBar('bdf-sr', (bd.sr/15)*100, '#0891b2'); animateBar('bdf-er', (bd.er/15)*100, '#059669'); animateBar('bdf-fq', (bd.fq/10)*100, '#d97706'); setCheck('c-email', r.contact.email); setCheck('c-phone', r.contact.phone); setCheck('c-linkedin', r.contact.linkedin); setCheck('c-exp', r.sections.experience); setCheck('c-skills', r.sections.skills); setCheck('c-edu', r.sections.education); setCheck('c-summary', r.sections.summary); setCheck('c-certs', r.sections.certifications); setCheck('c-dates', r.quality.has_dates); setCheck('c-metrics', r.quality.has_metrics); setCheck('c-verbs', r.quality.has_action_verbs); setCheck('c-recent', r.hasRecent); /* Keyword tags */ var kwSec = document.getElementById('ats-kwSection'); if (r.hasJd) { kwSec.style.display = 'block'; var tags = document.getElementById('r-kwTags'); tags.innerHTML = ''; r.kwResult.matched.slice(0,20).forEach(function (w) { var t = document.createElement('span'); t.className = 'atsKwTag atsKwTag-match'; t.textContent = w; tags.appendChild(t); }); r.kwResult.partial.slice(0,15).forEach(function (w) { var t = document.createElement('span'); t.className = 'atsKwTag atsKwTag-partial'; t.textContent = w + ' ~'; tags.appendChild(t); }); r.kwResult.missing.slice(0,15).forEach(function (w) { var t = document.createElement('span'); t.className = 'atsKwTag atsKwTag-miss'; t.textContent = w; tags.appendChild(t); }); } else { kwSec.style.display = 'none'; } /* Density table */ var densitySec = document.getElementById('ats-kwDensity'); if (r.hasJd && r.jdKws.length > 0) { densitySec.style.display = 'block'; var tbody = document.getElementById('r-densityBody'); tbody.innerHTML = ''; r.jdKws.slice(0,20).forEach(function (kw) { var mt = matchType(kw.word, extractedCvText); var count = mt !== 'miss' ? countInCv(kw.word, extractedCvText) : 0; var colorMap = { exact:'#15803d', partial:'#92400e', miss:'#b91c1c' }; var bgMap = { exact:'rgba(22,163,74,0.10)', partial:'rgba(180,83,9,0.08)', miss:'rgba(220,38,38,0.07)' }; var labelMap = { exact:'Exact', partial:'Partial', miss:'Missing' }; var tr = document.createElement('tr'); tr.innerHTML = '<td class="atsDtKw">' + kw.word + '</td>' + '<td class="atsDtCount" style="color:' + colorMap[mt] + '">' + count + '</td>' + '<td><span class="atsDtType" style="color:' + colorMap[mt] + ';background:' + bgMap[mt] + '">' + labelMap[mt] + '</span></td>'; tbody.appendChild(tr); }); } else { densitySec.style.display = 'none'; } fillList('r-warnings', r.warnings); fillList('r-suggestions', r.suggestions); ctaEl.style.display = r.score < 75 ? 'block' : 'none'; resultsEl.style.display = 'block'; } /* ─── FILE HANDLING ──────────────────────── */ function handleFile(f) { if (!f) return; var ext = f.name.split('.').pop().toLowerCase(); if (['pdf','docx'].indexOf(ext) === -1) { setStatus('Only PDF or DOCX files are supported.', 'error'); return; } if (f.size > 5*1024*1024) { setStatus('File is too large. Maximum 5MB.', 'error'); return; } currentFile = f; runBtn.disabled = false; document.getElementById('ats-dropTitle').textContent = f.name; setStatus('CV loaded \u2014 paste a job description (optional) then click Analyze CV.', 'info'); resultsEl.style.display = 'none'; ctaEl.style.display = 'none'; setStep(2); } /* ─── TEXT EXTRACTION ────────────────────── */ function extractDocx(file) { return file.arrayBuffer().then(function (buf) { return mammoth.extractRawText({ arrayBuffer: buf }); }).then(function (r) { var text = r.value || ''; if (text.trim().length < 50) throw new Error('Could not extract enough text from DOCX.'); return text; }); } function extractPdf(file) { if (typeof pdfjsLib === 'undefined') throw new Error('PDF.js library failed to load. Please reload the page.'); return file.arrayBuffer().then(function (buf) { return pdfjsLib.getDocument({ data: buf }).promise; }).then(function (pdf) { var pagePromises = []; for (var i = 1; i <= pdf.numPages; i++) { pagePromises.push( pdf.getPage(i).then(function (page) { return page.getTextContent(); }).then(function (content) { return content.items.map(function (item) { return item.str; }).join(' '); }) ); } return Promise.all(pagePromises); }).then(function (texts) { var text = texts.join('\n'); if (text.trim().length < 50) throw new Error('Could not extract text from PDF. Ensure it is not a scanned image.'); return text; }); } /* ─── EVENT LISTENERS ────────────────────── */ dropzone.addEventListener('click', function () { fileInput.click(); }); fileInput.addEventListener('change', function () { handleFile(fileInput.files[0]); }); dropzone.addEventListener('dragover', function (e) { e.preventDefault(); dropzone.classList.add('drag-over'); }); dropzone.addEventListener('dragleave', function () { dropzone.classList.remove('drag-over'); }); dropzone.addEventListener('drop', function (e) { e.preventDefault(); dropzone.classList.remove('drag-over'); handleFile(e.dataTransfer.files[0]); }); clearBtn.addEventListener('click', function () { currentFile = null; extractedCvText = ''; fileInput.value = ''; runBtn.disabled = true; jdArea.value = ''; document.getElementById('ats-dropTitle').textContent = 'Drop your CV here to analyze'; resultsEl.style.display = 'none'; ctaEl.style.display = 'none'; setStatus(''); setStep(1); }); jdArea.addEventListener('input', function () { if (currentFile) setStep(jdArea.value.trim().length > 30 ? 3 : 2); }); /* ─── RUN ────────────────────────────────── */ runBtn.addEventListener('click', function () { if (!currentFile) return; runBtn.disabled = true; resultsEl.style.display = 'none'; ctaEl.style.display = 'none'; setStatus('Reading file\u2026', 'info'); setStep(3); var ext = currentFile.name.split('.').pop().toLowerCase(); var jdText = jdArea.value || ''; var promise = ext === 'docx' ? extractDocx(currentFile) : extractPdf(currentFile); promise.then(function (cvText) { extractedCvText = cvText; setStatus('Analyzing\u2026', 'info'); var result = analyzeCv(cvText, jdText, ext); renderResults(result); setStatus('Analysis complete \u2713', 'success'); }).catch(function (err) { setStatus('Error: ' + (err.message || 'Could not parse file.'), 'error'); setStep(currentFile ? 1 : 1); }).finally(function () { runBtn.disabled = false; }); }); })();</script> </div><!-- .entry-content .clear --> </article><!-- #post-## --> </main><!-- #main --> </div><!-- #primary --> </div> <!-- ast-container --> </div><!-- #content --> <footer class="site-footer" id="colophon" itemtype="https://schema.org/WPFooter" itemscope="itemscope" itemid="#colophon"> <div class="site-primary-footer-wrap ast-builder-grid-row-container site-footer-focus-item ast-builder-grid-row-4-equal ast-builder-grid-row-tablet-2-equal ast-builder-grid-row-mobile-full ast-footer-row-stack ast-footer-row-tablet-stack ast-footer-row-mobile-stack" data-section="section-primary-footer-builder"> <div class="ast-builder-grid-row-container-inner"> <div class="ast-builder-footer-grid-columns site-primary-footer-inner-wrap ast-builder-grid-row"> <div class="site-footer-primary-section-1 site-footer-section site-footer-section-1"> <aside class="footer-widget-area widget-area site-footer-focus-item footer-widget-area-inner" data-section="sidebar-widgets-footer-widget-2" aria-label="Footer Widget 2" role="region" > <section id="block-19" class="widget widget_block"><div style="font-size:14px;line-height:1.6;max-width:260px;"> <img decoding="async" src="http://fair.darekdari.com/wp-content/uploads/2026/03/cropped-Untitled-design.png" alt="Fair Darekdari" style="height:36px;width:auto;margin-bottom:10px;display:block;"> <p style="margin:0;color:inherit;"> Free online tools for images, PDF, SEO and productivity. Fast, simple and powerful utilities designed to help you work smarter. </p> </div></section> </aside> <div class="ast-builder-layout-element ast-flex site-footer-focus-item" data-section="section-fb-social-icons-1"> <div class="ast-footer-social-1-wrap ast-footer-social-wrap"><div class="footer-social-inner-wrap element-social-inner-wrap social-show-label-false ast-social-color-type-custom ast-social-stack-none ast-social-element-style-filled"><a href="https://www.youtube.com/@pauseplay2023" aria-label="Youtube" target="_blank" rel="noopener noreferrer" style="--color: #7acdee; --background-color: transparent;" class="ast-builder-social-element ast-inline-flex ast-twitter footer-social-item"><span aria-hidden="true" class="ahfb-svg-iconset ast-inline-flex svg-baseline"><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512'><path d='M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z'></path></svg></span></a><a href="http://pinterest.com/darekdari3/" aria-label="Pinterest" target="_blank" rel="noopener noreferrer" style="--color: #557dbc; --background-color: transparent;" class="ast-builder-social-element ast-inline-flex ast-facebook footer-social-item"><span aria-hidden="true" class="ahfb-svg-iconset ast-inline-flex svg-baseline"><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 496 512'><path d='M496 256c0 137-111 248-248 248-25.6 0-50.2-3.9-73.4-11.1 10.1-16.5 25.2-43.5 30.8-65 3-11.6 15.4-59 15.4-59 8.1 15.4 31.7 28.5 56.8 28.5 74.8 0 128.7-68.8 128.7-154.3 0-81.9-66.9-143.2-152.9-143.2-107 0-163.9 71.8-163.9 150.1 0 36.4 19.4 81.7 50.3 96.1 4.7 2.2 7.2 1.2 8.3-3.3.8-3.4 5-20.3 6.9-28.1.6-2.5.3-4.7-1.7-7.1-10.1-12.5-18.3-35.3-18.3-56.6 0-54.7 41.4-107.6 112-107.6 60.9 0 103.6 41.5 103.6 100.9 0 67.1-33.9 113.6-78 113.6-24.3 0-42.6-20.1-36.7-44.8 7-29.5 20.5-61.3 20.5-82.6 0-19-10.2-34.9-31.4-34.9-24.9 0-44.9 25.7-44.9 60.2 0 22 7.4 36.8 7.4 36.8s-24.5 103.8-29 123.2c-5 21.4-3 51.6-.9 71.2C65.4 450.9 0 361.1 0 256 0 119 111 8 248 8s248 111 248 248z'></path></svg></span></a></div></div> </div> </div> <div class="site-footer-primary-section-2 site-footer-section site-footer-section-2"> <aside class="footer-widget-area widget-area site-footer-focus-item footer-widget-area-inner" data-section="sidebar-widgets-footer-widget-1" aria-label="Footer Widget 1" role="region" > <section id="block-20" class="widget widget_block"><div style="font-size:14px;line-height:1.6;"> <h4 style="margin-bottom:12px;font-size:15px;">Image Tools</h4> <ul style="list-style:none;padding:0;margin:0;"> <li style="margin-bottom:7px;"> <a href="/compress-image-to-50kb-online/" style="text-decoration:none;">• Compress Image</a> </li> <li style="margin-bottom:7px;"> <a href="/resize-image/" style="text-decoration:none;">• Resize Image</a> </li> <li style="margin-bottom:7px;"> <a href="/image-cropper/" style="text-decoration:none;">• Crop Image</a> </li> <li style="margin-bottom:7px;"> <a href="/remove-background/" style="text-decoration:none;">• Remove Background</a> </li> <li style="margin-bottom:7px;"> <a href="/color-palette-extractor/" style="text-decoration:none;">• Color Palette Extractor</a> </li> </ul> </div></section> </aside> </div> <div class="site-footer-primary-section-3 site-footer-section site-footer-section-3"> <aside class="footer-widget-area widget-area site-footer-focus-item footer-widget-area-inner" data-section="sidebar-widgets-footer-widget-3" aria-label="Footer Widget 3" role="region" > <section id="block-23" class="widget widget_block"><div style="font-size:14px;line-height:1.6;"> <h4 style="margin-bottom:12px;font-size:15px;">PDF Tools</h4> <ul style="list-style:none;padding:0;margin:0;"> <li style="margin-bottom:7px;"> <a href="/image-to-pdf/" style="text-decoration:none;">• Image to PDF</a> </li> <li style="margin-bottom:7px;"> <a href="/merge-pdf/" style="text-decoration:none;">• Merge PDF</a> </li> <li style="margin-bottom:7px;"> <a href="/split-pdf/" style="text-decoration:none;">• Split PDF</a> </li> <li style="margin-bottom:7px;"> <a href="/compress-pdf/" style="text-decoration:none;">• Compress PDF</a> </li> <li style="margin-bottom:7px;"> <a href="/pdf-to-image/" style="text-decoration:none;">• PDF to Image</a> </li> </ul> </div></section> </aside> </div> <div class="site-footer-primary-section-4 site-footer-section site-footer-section-4"> <aside class="footer-widget-area widget-area site-footer-focus-item footer-widget-area-inner" data-section="sidebar-widgets-footer-widget-4" aria-label="Footer Widget 4" role="region" > <section id="block-22" class="widget widget_block"><div style="font-size:14px;line-height:1.6;"> <h4 style="margin-bottom:12px;font-size:15px;">Resources</h4> <ul style="list-style:none;padding:0;margin:0;"> <li style="margin-bottom:7px;"> <a href="/seo-tools/" style="text-decoration:none;">• SEO Tools</a> </li> <li style="margin-bottom:7px;"> <a href="/math-tools/" style="text-decoration:none;">• Math Tools</a> </li> <li style="margin-bottom:7px;"> <a href="/blog/" style="text-decoration:none;">• Blog</a> </li> <li style="margin-bottom:7px;"> <a href="/privacy-policy/" style="text-decoration:none;">• Privacy Policy</a> </li> <li style="margin-bottom:7px;"> <a href="/contact/" style="text-decoration:none;">• Contact</a> </li> </ul> </div></section> </aside> </div> </div> </div> </div> <div class="site-below-footer-wrap ast-builder-grid-row-container site-footer-focus-item ast-builder-grid-row-2-equal ast-builder-grid-row-tablet-2-equal ast-builder-grid-row-mobile-full ast-footer-row-stack ast-footer-row-tablet-stack ast-footer-row-mobile-stack" data-section="section-below-footer-builder"> <div class="ast-builder-grid-row-container-inner"> <div class="ast-builder-footer-grid-columns site-below-footer-inner-wrap ast-builder-grid-row"> <div class="site-footer-below-section-1 site-footer-section site-footer-section-1"> <div class="ast-builder-layout-element ast-flex site-footer-focus-item ast-footer-copyright" data-section="section-footer-builder"> <div class="ast-footer-copyright"><p>Copyright © 2026 | Powered by Fair Darekdari</p> </div> </div> </div> <div class="site-footer-below-section-2 site-footer-section site-footer-section-2"> <div class="footer-widget-area widget-area site-footer-focus-item" data-section="section-footer-menu"> <div class="footer-bar-navigation"><nav class="site-navigation ast-flex-grow-1 navigation-accessibility footer-navigation" id="footer-site-navigation" aria-label="Site Navigation: Footer Menu" itemtype="https://schema.org/SiteNavigationElement" itemscope="itemscope"><div class="footer-nav-wrap"><ul id="astra-footer-menu" class="ast-nav-menu ast-flex astra-footer-horizontal-menu astra-footer-tablet-vertical-menu astra-footer-mobile-vertical-menu"><li id="menu-item-2536" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2536"><a href="#" class="menu-link">Privacy</a></li> <li id="menu-item-2537" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2537"><a href="#" class="menu-link">Cookies</a></li> <li id="menu-item-2538" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2538"><a href="#" class="menu-link">Terms and Conditions</a></li> </ul></div></nav></div> </div> </div> </div> </div> </div> </footer><!-- #colophon --> </div><!-- #page --> <script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/astra/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script> <script>/* ═══════════════════════════════════════════════════════════════════════════ PhotoID — Biometric Photo Tool app.js — complete logic, rebuilt from scratch Key fixes vs previous version: ① Canvas resizes correctly with each preset change ② Auto-crop math is pixel-perfect (eye midpoint → eyeLineFrac target) ③ Brightness/contrast done via pixel ops NEVER ctx.filter (prevents taint) ④ Background whitening uses adaptive edge-color sampling + flood fill ⑤ Guide overlay geometry is accurate (head zone from top% to bot% of canvas) ⑥ Custom width/height properly reconstruct aspect ratio & redraw ⑦ Preset select actually updates canvas dimensions on change ═══════════════════════════════════════════════════════════════════════════ */ (function () { 'use strict'; const $ = id => document.getElementById(id); function avg(arr) { return arr.length ? arr.reduce((s, v) => s + v, 0) / arr.length : 0; } function variance(arr) { if (!arr.length) return 0; const m = avg(arr); return avg(arr.map(v => (v - m) ** 2)); } function stdDev(arr) { return Math.sqrt(variance(arr)); } function clamp(v, lo, hi) { return Math.max(lo, Math.min(hi, v)); } const PRESETS = { 'passport-35x45': { label: 'Passport 35×45', pw: 413, ph: 531, eyeLineFrac: 0.37, headTopFrac: 0.12, headBotFrac: 0.82 }, 'us-2x2': { label: 'US 2×2 inch', pw: 600, ph: 600, eyeLineFrac: 0.40, headTopFrac: 0.10, headBotFrac: 0.85 }, 'visa-35x45': { label: 'Visa 35×45', pw: 413, ph: 531, eyeLineFrac: 0.37, headTopFrac: 0.12, headBotFrac: 0.82 }, 'id-35x45': { label: 'ID Card 35×45', pw: 413, ph: 531, eyeLineFrac: 0.38, headTopFrac: 0.12, headBotFrac: 0.82 }, 'eu-passport': { label: 'EU Passport 35×45', pw: 413, ph: 531, eyeLineFrac: 0.37, headTopFrac: 0.12, headBotFrac: 0.82 }, 'custom': { label: 'Custom', pw: 413, ph: 531, eyeLineFrac: 0.37, headTopFrac: 0.12, headBotFrac: 0.82 }, }; function getPreset() { const key = ST.presetKey; if (key !== 'custom') return PRESETS[key]; const pw = Math.max(100, parseInt($('custom-w').value) || 413); const ph = Math.max(100, parseInt($('custom-h').value) || 531); return { ...PRESETS.custom, pw, ph }; } const ST = { modelsReady: false, modelsLoading: false, img: null, imgURL: '', fileMeta: null, detections: [], face: null, presetKey: 'passport-35x45', exportFmt: 'jpg', sheetCopies: 4, showGuide: true, bgWhiten: false, tr: { zoom: 1, rotateDeg: 0, offsetX: 0, offsetY: 0, brightness: 1, contrast: 1, }, }; const DISP_W = 280; let CW = 280, CH = 360; const mainCvs = $('main-canvas'); const guideCvs = $('guide-canvas'); const mCtx = mainCvs.getContext('2d'); const gCtx = guideCvs.getContext('2d'); function resizeCanvases() { const p = getPreset(); CW = DISP_W; CH = Math.round(DISP_W * p.ph / p.pw); mainCvs.width = CW; mainCvs.height = CH; guideCvs.width = CW; guideCvs.height = CH; $('canvas-frame').style.height = CH + 'px'; $('canvas-frame').style.maxHeight = ''; mainCvs.style.width = guideCvs.style.width = '100%'; mainCvs.style.height = guideCvs.style.height = '100%'; } function drawAll() { drawImage(); drawGuide(); updateCanvasMeta(); } function drawImage() { mCtx.clearRect(0, 0, CW, CH); mCtx.fillStyle = '#ffffff'; mCtx.fillRect(0, 0, CW, CH); if (!ST.img) return; const tr = ST.tr; const iw = ST.img.naturalWidth; const ih = ST.img.naturalHeight; const cs = Math.max(CW / iw, CH / ih) * tr.zoom; mCtx.save(); mCtx.translate(CW / 2 + tr.offsetX, CH / 2 + tr.offsetY); mCtx.rotate(tr.rotateDeg * Math.PI / 180); mCtx.drawImage(ST.img, -(iw * cs) / 2, -(ih * cs) / 2, iw * cs, ih * cs); mCtx.restore(); applyBrightnessContrast(); if (ST.bgWhiten) applyBgWhiten(); } function applyBrightnessContrast() { const b = ST.tr.brightness; const c = ST.tr.contrast; if (Math.abs(b - 1) < 0.005 && Math.abs(c - 1) < 0.005) return; const id = mCtx.getImageData(0, 0, CW, CH); const d = id.data; const brightnessAdd = (b - 1) * 255; for (let i = 0; i < d.length; i += 4) { d[i] = clamp(((d[i] / 255 - 0.5) * c + 0.5) * 255 + brightnessAdd, 0, 255); d[i+1] = clamp(((d[i+1] / 255 - 0.5) * c + 0.5) * 255 + brightnessAdd, 0, 255); d[i+2] = clamp(((d[i+2] / 255 - 0.5) * c + 0.5) * 255 + brightnessAdd, 0, 255); } mCtx.putImageData(id, 0, 0); } function applyBgWhiten() { const id = mCtx.getImageData(0, 0, CW, CH); const d = id.data; const mask = new Float32Array(CW * CH); const TARGET = 250; // ── Sample actual background color from image edges (adaptive) ────── const edgeSamples = { r: [], g: [], b: [] }; const sampleMargin = 6; for (let y = 0; y < CH; y += 2) { for (let x = 0; x < CW; x += 2) { if (x < sampleMargin || x >= CW - sampleMargin || y < sampleMargin || y >= CH - sampleMargin) { const i = (y * CW + x) * 4; edgeSamples.r.push(d[i]); edgeSamples.g.push(d[i+1]); edgeSamples.b.push(d[i+2]); } } } const bgRefR = avg(edgeSamples.r); const bgRefG = avg(edgeSamples.g); const bgRefB = avg(edgeSamples.b); // ── A) Seed subject mask from face box or centre fallback ─────────── const fb = faceBoxOnCanvas(); let faceKnown = false; let fkx1 = 0, fky1 = 0, fkx2 = CW, fky2 = CH; if (fb && fb.w > 10 && fb.h > 10) { faceKnown = true; const padX = fb.w * 0.80; const padT = fb.h * 0.60; const padB = fb.h * 1.60; fkx1 = Math.max(0, Math.round(fb.x - padX)); fky1 = Math.max(0, Math.round(fb.y - padT)); fkx2 = Math.min(CW, Math.round(fb.x + fb.w + padX)); fky2 = Math.min(CH, Math.round(fb.y + fb.h + padB)); for (let y = fky1; y < fky2; y++) { for (let x = fkx1; x < fkx2; x++) { mask[y * CW + x] = 1; } } } else { // No face detected: protect a moderate centre region fkx1 = Math.round(CW * 0.22); fky1 = Math.round(CH * 0.08); fkx2 = Math.round(CW * 0.78); fky2 = Math.round(CH * 0.92); for (let y = fky1; y < fky2; y++) { for (let x = fkx1; x < fkx2; x++) { mask[y * CW + x] = 1; } } } // ── Tight face box (never touch these pixels) ────────────────────── let tightX1 = 0, tightY1 = 0, tightX2 = CW, tightY2 = CH; if (fb && faceKnown) { tightX1 = Math.max(0, Math.round(fb.x - fb.w * 0.10)); tightY1 = Math.max(0, Math.round(fb.y - fb.h * 0.10)); tightX2 = Math.min(CW, Math.round(fb.x + fb.w * 1.10)); tightY2 = Math.min(CH, Math.round(fb.y + fb.h * 1.10)); } else { tightX1 = Math.round(CW * 0.25); tightY1 = Math.round(CH * 0.10); tightX2 = Math.round(CW * 0.75); tightY2 = Math.round(CH * 0.90); } // ── B) Colour-based background detection (adaptive) ──────────────── for (let y = 0; y < CH; y++) { for (let x = 0; x < CW; x++) { if (x >= tightX1 && x < tightX2 && y >= tightY1 && y < tightY2) continue; const i = (y * CW + x) * 4; const r = d[i], g = d[i+1], b = d[i+2]; const dist = Math.sqrt( (r - bgRefR) ** 2 + (g - bgRefG) ** 2 + (b - bgRefB) ** 2 ); const rn = r/255, gn = g/255, bn = b/255; const mx = Math.max(rn,gn,bn), mn = Math.min(rn,gn,bn); const l = (mx + mn) / 2; const s = mx === mn ? 0 : l < 0.5 ? (mx-mn)/(mx+mn) : (mx-mn)/(2-mx-mn); const nearEdgeColor = dist < 45; const nearWhite = r > 200 && g > 200 && b > 200 && s < 0.22; const lightGray = l > 0.72 && s < 0.22; if (nearEdgeColor || nearWhite || lightGray) { mask[y * CW + x] = 0; } } } // ── C) Edge-connected flood-fill ─────────────────────────────────── const visited = new Uint8Array(CW * CH); const queue = []; for (let x = 0; x < CW; x++) { queue.push(0 * CW + x); queue.push((CH-1) * CW + x); } for (let y = 1; y < CH-1; y++) { queue.push(y * CW + 0); queue.push(y * CW + (CW-1)); } let qi = 0; while (qi < queue.length) { const idx = queue[qi++]; if (visited[idx]) continue; visited[idx] = 1; const px = idx % CW, py = Math.floor(idx / CW); const i = idx * 4; const r = d[i], g = d[i+1], b = d[i+2]; const dist = Math.sqrt( (r - bgRefR) ** 2 + (g - bgRefG) ** 2 + (b - bgRefB) ** 2 ); const rn = r/255, gn = g/255, bn = b/255; const mx = Math.max(rn,gn,bn), mn = Math.min(rn,gn,bn); const s = mx === mn ? 0 : ((mx+mn)/2) < 0.5 ? (mx-mn)/(mx+mn) : (mx-mn)/(2-mx-mn); const isBg = dist < 60 || ((r+g+b)/3 > 140 && s < 0.35); if (!isBg) continue; if (px >= tightX1 && px < tightX2 && py >= tightY1 && py < tightY2) continue; mask[idx] = 0; if (px > 0) queue.push(idx - 1); if (px < CW-1) queue.push(idx + 1); if (py > 0) queue.push(idx - CW); if (py < CH-1) queue.push(idx + CW); } // ── Step 2: Apply whitening ──────────────────────────────────────── for (let y = 0; y < CH; y++) { for (let x = 0; x < CW; x++) { const idx = y * CW + x; if (mask[idx] > 0) continue; const i = idx * 4; d[i] = TARGET; d[i+1] = TARGET; d[i+2] = TARGET; } } // Feather pass: soften transition edges const FEATHER = 5; for (let y = 0; y < CH; y++) { for (let x = 0; x < CW; x++) { if (mask[y * CW + x] === 0) continue; let minDist = Infinity; for (let dy = -FEATHER; dy <= FEATHER; dy++) { for (let dx = -FEATHER; dx <= FEATHER; dx++) { const nx = x + dx, ny = y + dy; if (nx < 0 || nx >= CW || ny < 0 || ny >= CH) continue; if (mask[ny * CW + nx] === 0) { const d2 = Math.sqrt(dx*dx + dy*dy); if (d2 < minDist) minDist = d2; } } } if (minDist <= FEATHER) { const alpha = (1 - minDist / FEATHER) * 0.55; const i = (y * CW + x) * 4; d[i] = Math.round(d[i] + (TARGET - d[i]) * alpha); d[i+1] = Math.round(d[i+1] + (TARGET - d[i+1]) * alpha); d[i+2] = Math.round(d[i+2] + (TARGET - d[i+2]) * alpha); } } } mCtx.putImageData(id, 0, 0); } function drawGuide() { gCtx.clearRect(0, 0, CW, CH); if (!ST.showGuide) return; const p = getPreset(); const eyeY = CH * p.eyeLineFrac; const topY = CH * p.headTopFrac; const botY = CH * p.headBotFrac; const zW = CW * 0.46; const zX = (CW - zW) / 2; gCtx.save(); gCtx.strokeStyle = 'rgba(30,80,220,0.40)'; gCtx.lineWidth = 1.5; gCtx.strokeRect(1, 1, CW - 2, CH - 2); gCtx.setLineDash([7, 5]); gCtx.beginPath(); gCtx.moveTo(0, eyeY); gCtx.lineTo(CW, eyeY); gCtx.strokeStyle = 'rgba(30,80,220,0.65)'; gCtx.lineWidth = 1.5; gCtx.stroke(); gCtx.setLineDash([]); gCtx.setLineDash([4, 5]); gCtx.beginPath(); gCtx.moveTo(CW / 2, topY); gCtx.lineTo(CW / 2, botY); gCtx.strokeStyle = 'rgba(30,80,220,0.25)'; gCtx.lineWidth = 1; gCtx.stroke(); gCtx.setLineDash([]); gCtx.setLineDash([8, 5]); gCtx.strokeStyle = 'rgba(22,150,80,0.70)'; gCtx.lineWidth = 1.5; gCtx.strokeRect(zX, topY, zW, botY - topY); gCtx.setLineDash([]); gCtx.fillStyle = 'rgba(30,80,220,0.80)'; gCtx.font = 'bold 10px DM Sans, sans-serif'; gCtx.fillText('Eye line', 6, eyeY - 5); gCtx.fillStyle = 'rgba(22,150,80,0.85)'; gCtx.font = '10px DM Sans, sans-serif'; gCtx.fillText('Head zone', zX + 4, topY + 13); gCtx.restore(); } function updateCanvasMeta() { if (!ST.img) { $('canvas-meta').textContent = 'No image'; return; } const p = getPreset(); $('canvas-meta').textContent = ST.img.naturalWidth + '×' + ST.img.naturalHeight + 'px → ' + p.pw + '×' + p.ph + 'px output'; } function imgPtToCanvas(ix, iy) { if (!ST.img) return { x: 0, y: 0 }; const tr = ST.tr; const iw = ST.img.naturalWidth; const ih = ST.img.naturalHeight; const cs = Math.max(CW / iw, CH / ih) * tr.zoom; const rx = (ix - iw / 2) * cs; const ry = (iy - ih / 2) * cs; const rad = tr.rotateDeg * Math.PI / 180; const cx2 = rx * Math.cos(rad) - ry * Math.sin(rad); const cy2 = rx * Math.sin(rad) + ry * Math.cos(rad); return { x: CW / 2 + tr.offsetX + cx2, y: CH / 2 + tr.offsetY + cy2, }; } function faceBoxOnCanvas() { if (!ST.face || !ST.img) return null; const b = ST.face.detection.box; const corners = [ imgPtToCanvas(b.x, b.y), imgPtToCanvas(b.x + b.width, b.y), imgPtToCanvas(b.x, b.y + b.height), imgPtToCanvas(b.x + b.width, b.y + b.height), ]; const xs = corners.map(c => c.x); const ys = corners.map(c => c.y); return { x: Math.min(...xs), y: Math.min(...ys), w: Math.max(...xs) - Math.min(...xs), h: Math.max(...ys) - Math.min(...ys), }; } function autoCrop() { if (!ST.face || !ST.img) { setStatus('No face found — run Detect first or adjust manually.', 'warn'); return; } const p = getPreset(); const lm = ST.face.landmarks; const box = ST.face.detection.box; const iw = ST.img.naturalWidth; const ih = ST.img.naturalHeight; const ptAvg = pts => ({ x: avg(pts.map(q => q.x)), y: avg(pts.map(q => q.y)), }); const le = ptAvg(lm.getLeftEye()); const re = ptAvg(lm.getRightEye()); const eyeMidX = (le.x + re.x) / 2; const eyeMidY = (le.y + re.y) / 2; const tiltDeg = Math.atan2(re.y - le.y, re.x - le.x) * 180 / Math.PI; const jaw = lm.getJawOutline(); const headTop = box.y; const headBot = Math.max(...jaw.map(q => q.y)); const headH_img = Math.max(1, headBot - headTop); const targetHeadH = CH * (p.headBotFrac - p.headTopFrac); const baseScale = Math.max(CW / iw, CH / ih); const rawZoom = targetHeadH / (headH_img * baseScale); const newZoom = clamp(rawZoom, 0.3, 5.0); const cs = baseScale * newZoom; const eyeOnCvsX = CW / 2 + (eyeMidX - iw / 2) * cs; const eyeOnCvsY = CH / 2 + (eyeMidY - ih / 2) * cs; const eyeTargX = CW / 2; const eyeTargY = CH * p.eyeLineFrac; ST.tr.zoom = newZoom; ST.tr.rotateDeg = clamp(-tiltDeg, -20, 20); ST.tr.offsetX = eyeTargX - eyeOnCvsX; ST.tr.offsetY = eyeTargY - eyeOnCvsY; syncSlidersFromState(); drawAll(); setStatus('Auto-crop applied — fine-tune with sliders if needed.', 'success'); setStep(3); } async function loadModels() { if (ST.modelsReady) return true; if (ST.modelsLoading) return false; if (typeof faceapi === 'undefined') { setStatus('face-api.js failed to load. Check your internet connection.', 'error'); return false; } ST.modelsLoading = true; setStatus('Loading AI face models (first time only)…', 'info'); try { const BASE = 'https://cdn.jsdelivr.net/npm/@vladmandic/face-api/model/'; await Promise.all([ faceapi.nets.tinyFaceDetector.loadFromUri(BASE), faceapi.nets.faceLandmark68TinyNet.loadFromUri(BASE), ]); ST.modelsReady = true; ST.modelsLoading = false; setStatus('Models ready. Upload a photo to begin.', 'success'); return true; } catch (e) { ST.modelsLoading = false; console.error(e); setStatus('Could not load face models — check connection.', 'error'); return false; } } async function detectFaces() { if (!ST.img) return; if (!ST.modelsReady) { if (!(await loadModels())) return; } setStatus('Detecting face…', 'info'); try { const opts = new faceapi.TinyFaceDetectorOptions({ inputSize: 512, scoreThreshold: 0.38 }); const dets = await faceapi.detectAllFaces(ST.img, opts).withFaceLandmarks(true); ST.detections = dets; ST.face = dets.length ? dets.slice().sort((a, b) => b.detection.box.area - a.detection.box.area)[0] : null; if (ST.face) { setStatus(dets.length + ' face' + (dets.length > 1 ? 's' : '') + ' detected.', 'success'); } else { setStatus('No face detected — adjust manually or try another photo.', 'warn'); } } catch (e) { console.error(e); setStatus('Face detection error.', 'error'); } } function analyzePhoto() { const p = getPreset(); const faceCount = ST.detections.length; const warnings = []; const suggestions = []; const id = mCtx.getImageData(0, 0, CW, CH); const d = id.data; const mg = Math.floor(Math.min(CW, CH) * 0.10); const bgL = [], bgS = []; for (let y = 0; y < CH; y += 3) { for (let x = 0; x < CW; x += 3) { if (x < mg || x > CW - mg || y < mg || y > CH - mg) { const i = (y * CW + x) * 4; const r = d[i], g = d[i+1], b = d[i+2]; bgL.push((r + g + b) / 3); bgS.push(Math.max(r, g, b) - Math.min(r, g, b)); } } } const bgAvg = avg(bgL); const bgStdv = stdDev(bgL); const bgColor = avg(bgS); const gray = new Float32Array(CW * CH); for (let i = 0, p2 = 0; i < d.length; i += 4, p2++) { gray[p2] = d[i] * 0.299 + d[i+1] * 0.587 + d[i+2] * 0.114; } const lap = []; for (let y = 1; y < CH - 1; y += 2) { for (let x = 1; x < CW - 1; x += 2) { const c = gray[y * CW + x] * 4; const s = gray[(y-1)*CW+x] + gray[(y+1)*CW+x] + gray[y*CW+(x-1)] + gray[y*CW+(x+1)]; lap.push(Math.abs(c - s)); } } const lapVar = variance(lap); let headRatio = 0, centerOff = 0, eyeLineOff = 0, tiltAbs = 0, shadowDiff = 0, mouthOpen = 0, eyeDistRatio = 0; if (ST.face) { const lm = ST.face.landmarks; const box = ST.face.detection.box; const ptAvg = pts => ({ x: avg(pts.map(q => q.x)), y: avg(pts.map(q => q.y)) }); const le = ptAvg(lm.getLeftEye()); const re = ptAvg(lm.getRightEye()); const mth = lm.getMouth(); const jaw = lm.getJawOutline(); tiltAbs = Math.abs(Math.atan2(re.y - le.y, re.x - le.x) * 180 / Math.PI); eyeDistRatio = Math.abs(re.x - le.x) / box.width; mouthOpen = mth.length >= 20 ? Math.abs(mth[14].y - mth[18].y) / box.height : 0; const fb = faceBoxOnCanvas(); if (fb) { headRatio = fb.h / CH; centerOff = Math.abs((fb.x + fb.w / 2) / CW - 0.5); const eyeMidCvs = imgPtToCanvas((le.x + re.x) / 2, (le.y + re.y) / 2); eyeLineOff = Math.abs(eyeMidCvs.y / CH - p.eyeLineFrac); const fx1 = Math.max(0, Math.floor(fb.x)); const fy1 = Math.max(0, Math.floor(fb.y)); const fx2 = Math.min(CW-1, Math.floor(fb.x + fb.w)); const fy2 = Math.min(CH-1, Math.floor(fb.y + fb.h)); const midX = (fx1 + fx2) / 2; const lv = [], rv = []; for (let y = fy1; y <= fy2; y += 3) { for (let x = fx1; x <= fx2; x += 3) { const i = (y * CW + x) * 4; const v = (d[i] + d[i+1] + d[i+2]) / 3; (x < midX ? lv : rv).push(v); } } shadowDiff = Math.abs(avg(lv) - avg(rv)); } } const idealHeadMin = (p.headBotFrac - p.headTopFrac) * 0.80; const idealHeadMax = (p.headBotFrac - p.headTopFrac) * 1.18; const C = { faceFound: faceCount >= 1 ? 'pass' : 'fail', singleFace: faceCount === 1 ? 'pass' : 'fail', centered: centerOff <= 0.07 ? 'pass' : centerOff <= 0.14 ? 'warn' : 'fail', headSize: headRatio >= idealHeadMin && headRatio <= idealHeadMax ? 'pass' : headRatio >= idealHeadMin * 0.85 && headRatio <= idealHeadMax * 1.12 ? 'warn' : 'fail', bgPlain: bgStdv <= 15 && bgColor <= 15 ? 'pass' : bgStdv <= 26 && bgColor <= 28 ? 'warn' : 'fail', bgLight: bgAvg >= 210 ? 'pass' : bgAvg >= 175 ? 'warn' : 'fail', evenLight: shadowDiff <= 16 ? 'pass' : shadowDiff <= 30 ? 'warn' : 'fail', shadows: shadowDiff <= 16 ? 'pass' : shadowDiff <= 30 ? 'warn' : 'fail', sharpness: lapVar >= 300 ? 'pass' : lapVar >= 130 ? 'warn' : 'fail', eyes: eyeDistRatio >= 0.22 ? 'pass' : eyeDistRatio >= 0.15 ? 'warn' : 'fail', pose: tiltAbs <= 4 && eyeLineOff <= 0.06 ? 'pass' : tiltAbs <= 9 && eyeLineOff <= 0.11 ? 'warn' : 'fail', technical: (ST.fileMeta && ['image/jpeg','image/png','image/webp'].includes(ST.fileMeta.type) && ST.img?.naturalWidth >= 600 && ST.img?.naturalHeight >= 600) ? 'pass' : 'warn', expression: mouthOpen <= 0.04 ? 'pass' : mouthOpen <= 0.07 ? 'warn' : 'fail', }; if (C.singleFace !== 'pass') { warnings.push(faceCount > 1 ? 'Multiple faces detected in frame.' : 'No face detected.'); } if (C.centered !== 'pass') { warnings.push('Face is not horizontally centered.'); suggestions.push('Use the Move X slider to center the face.'); } if (C.headSize !== 'pass') { warnings.push('Head is ' + (headRatio < idealHeadMin ? 'too small' : 'too large') + ' for the selected preset.'); suggestions.push(headRatio < idealHeadMin ? 'Zoom in until head fills the green guide box.' : 'Zoom out — head is outside the green guide box.'); } if (C.bgPlain !== 'pass') { warnings.push('Background is too busy or colorful.'); suggestions.push('Enable "Whiten background" or retake against a plain white wall.'); } if (C.bgLight !== 'pass') { warnings.push('Background is too dark.'); suggestions.push('Enable background whitening or increase brightness.'); } if (C.evenLight !== 'pass') { warnings.push('Lighting is uneven across the face.'); suggestions.push('Use softer, more frontal lighting in the source photo.'); } if (C.sharpness !== 'pass') { warnings.push('Image appears blurry or low-resolution.'); suggestions.push('Upload the highest-quality original photo you have.'); } if (C.pose !== 'pass') { warnings.push('Head tilt or eye-line alignment is off target.'); suggestions.push('Use Auto-Crop to level, then fine-tune with the Rotate slider.'); } if (C.expression !== 'pass') { warnings.push('Expression does not appear neutral (mouth may be open).'); suggestions.push('Use a photo with a relaxed, closed-mouth expression.'); } if (ST.img?.naturalWidth < 600 || ST.img?.naturalHeight < 600) { warnings.push('Source image resolution is low (< 600px).'); suggestions.push('Use a photo that is at least 600×600 pixels.'); } const sp = { face: C.faceFound === 'pass' && C.singleFace === 'pass' ? 20 : C.faceFound === 'pass' ? 10 : 0, head: (C.centered === 'pass' ? 10 : C.centered === 'warn' ? 6 : 0) + (C.headSize === 'pass' ? 10 : C.headSize === 'warn' ? 6 : 0), bg: (C.bgPlain === 'pass' ? 8 : C.bgPlain === 'warn' ? 3 : 0) + (C.bgLight === 'pass' ? 7 : C.bgLight === 'warn' ? 2 : 0), light: (C.evenLight === 'pass' ? 8 : C.evenLight === 'warn' ? 4 : 0) + (C.shadows === 'pass' ? 7 : C.shadows === 'warn' ? 4 : 0), sharp: C.sharpness === 'pass' ? 10 : C.sharpness === 'warn' ? 6 : 0, pose: (C.pose === 'pass' ? 6 : C.pose === 'warn' ? 2 : 0) + (C.expression === 'pass' ? 4 : C.expression=== 'warn' ? 1 : 0), tech: (C.eyes === 'pass' ? 4 : C.eyes === 'warn' ? 2 : 0) + (C.technical === 'pass' ? 6 : C.technical === 'warn' ? 3 : 0), }; const score = Object.values(sp).reduce((a, b) => a + b, 0); return { C, score, sp, warnings, suggestions, faceCount, preset: p }; } function renderAnalysis(res) { if (!res) return; const rs = $('results-section'); rs.style.display = 'block'; rs.classList.remove('anim-in'); void rs.offsetWidth; rs.classList.add('anim-in'); const badge = scoreBadge(res.score); $('r-score').innerHTML = res.score + '<span class="score-denom">/100</span>'; setEl('r-badge', badge.label, { color: badge.color, background: badge.bg, border: '1px solid ' + badge.color + '44' }); $('r-preset').textContent = res.preset.label; $('r-res').textContent = ST.img ? ST.img.naturalWidth + '×' + ST.img.naturalHeight : '—'; $('r-faces').textContent = res.faceCount; $('r-out').textContent = res.preset.pw + '×' + res.preset.ph; $('r-bar').style.width = res.score + '%'; $('r-bar').style.background = badge.color; const sp = res.sp; setBdBar('face', sp.face, 20, badge.color); setBdBar('head', sp.head, 20, badge.color); setBdBar('bg', sp.bg, 15, badge.color); setBdBar('light', sp.light, 15, badge.color); setBdBar('sharp', sp.sharp, 10, badge.color); setBdBar('pose', sp.pose, 10, badge.color); setBdBar('tech', sp.tech, 10, badge.color); const C = res.C; function chk(id, key, passT, warnT, failT) { setChk(id, C[key], C[key]==='pass' ? passT : C[key]==='warn' ? warnT : failT); } chk('c-face', 'faceFound', 'Pass', '—', 'Fail'); chk('c-single', 'singleFace', 'Pass', 'Multiple', 'Fail'); chk('c-center', 'centered', 'Pass', 'Off', 'Fail'); chk('c-headsize','headSize', 'Pass', 'Warn', 'Fail'); chk('c-bgplain', 'bgPlain', 'Pass', 'Warn', 'Fail'); chk('c-bglight', 'bgLight', 'Pass', 'Warn', 'Fail'); chk('c-light', 'evenLight', 'Pass', 'Uneven', 'Fail'); chk('c-shadow', 'shadows', 'Low', 'Moderate', 'High'); chk('c-sharp', 'sharpness', 'Pass', 'Soft', 'Blurry'); chk('c-eyes', 'eyes', 'Visible', 'Partial', 'Hidden'); chk('c-pose', 'pose', 'Pass', 'Warn', 'Fail'); chk('c-expr', 'expression', 'Neutral', 'Slight', 'Open'); fillList('r-warnings', res.warnings, 'No major issues detected.'); fillList('r-suggestions', res.suggestions, 'Photo looks well prepared.'); $('btn-download').disabled = false; $('btn-sheet').disabled = false; const type = res.score >= 75 ? 'success' : res.score >= 50 ? 'warn' : 'error'; setStatus('Analysis complete — ' + badge.label + ' (' + res.score + '/100)', type); setStep(4); setTimeout(() => rs.scrollIntoView({ behavior: 'smooth', block: 'start' }), 100); } function exportPhoto() { const p = getPreset(); const out = document.createElement('canvas'); out.width = p.pw; out.height = p.ph; out.getContext('2d').drawImage(mainCvs, 0, 0, p.pw, p.ph); const mime = ST.exportFmt === 'png' ? 'image/png' : 'image/jpeg'; const ext = ST.exportFmt === 'png' ? 'png' : 'jpg'; out.toBlob(blob => dlBlob(blob, 'biometric-photo.' + ext), mime, 0.95); } function exportSheet() { const p = getPreset(); const sh = document.createElement('canvas'); sh.width = 2480; sh.height = 3508; const sc = sh.getContext('2d'); sc.fillStyle = '#ffffff'; sc.fillRect(0, 0, 2480, 3508); const cols = 2; const rows = Math.ceil(ST.sheetCopies / cols); const mg = 120, gap = 80; const maxW = (2480 - mg * 2 - gap * (cols - 1)) / cols; const maxH = (3508 - mg * 2 - gap * (rows - 1)) / rows; const ratio = p.pw / p.ph; let pw2 = maxW, ph2 = pw2 / ratio; if (ph2 > maxH) { ph2 = maxH; pw2 = ph2 * ratio; } for (let i = 0; i < ST.sheetCopies; i++) { const col = i % cols; const row = Math.floor(i / cols); const x = mg + col * (pw2 + gap); const y = mg + row * (ph2 + gap); sc.drawImage(mainCvs, x, y, pw2, ph2); sc.strokeStyle = 'rgba(0,0,0,0.10)'; sc.lineWidth = 1; sc.strokeRect(x, y, pw2, ph2); } sh.toBlob(blob => dlBlob(blob, 'biometric-sheet-' + ST.sheetCopies + 'x.png'), 'image/png'); } function dlBlob(blob, name) { const url = URL.createObjectURL(blob); const a = Object.assign(document.createElement('a'), { href: url, download: name }); document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } async function handleFile(file) { if (!file) return; if (!/^image\/(jpeg|png|webp)$/.test(file.type)) { setStatus('Unsupported file type. Use JPG, PNG or WEBP.', 'error'); return; } ST.fileMeta = { name: file.name, size: file.size, type: file.type }; if (ST.imgURL) URL.revokeObjectURL(ST.imgURL); ST.imgURL = URL.createObjectURL(file); const img = new Image(); img.onload = async () => { ST.img = img; ST.detections = []; ST.face = null; ST.bgWhiten = false; ST.showGuide = true; ST.tr = { zoom: 1, rotateDeg: 0, offsetX: 0, offsetY: 0, brightness: 1, contrast: 1 }; $('tog-whiten').checked = false; $('tog-guide').checked = true; clearResults(); resizeCanvases(); syncSlidersFromState(); drawAll(); setStep(2); $('drop-title').textContent = file.name; ['btn-autocrop', 'btn-analyze', 'btn-reset'].forEach(id => $(id).disabled = false); setStatus('Photo loaded — detecting face…', 'success'); if (await loadModels()) { await detectFaces(); if (ST.face) autoCrop(); } }; img.onerror = () => setStatus('Failed to load image.', 'error'); img.src = ST.imgURL; } function resetTransform() { ST.tr = { zoom: 1, rotateDeg: 0, offsetX: 0, offsetY: 0, brightness: 1, contrast: 1 }; syncSlidersFromState(); drawAll(); setStatus('Transform reset.', 'info'); } function fullClear() { if (ST.imgURL) URL.revokeObjectURL(ST.imgURL); ST.img = null; ST.imgURL = ''; ST.fileMeta = null; ST.detections = []; ST.face = null; ST.bgWhiten = false; ST.showGuide = true; ST.tr = { zoom: 1, rotateDeg: 0, offsetX: 0, offsetY: 0, brightness: 1, contrast: 1 }; $('file-input').value = ''; $('drop-title').textContent = 'Drop your portrait photo here'; $('tog-whiten').checked = false; $('tog-guide').checked = true; ['btn-autocrop','btn-analyze','btn-reset','btn-download','btn-sheet'] .forEach(id => $(id).disabled = true); clearResults(); syncSlidersFromState(); resizeCanvases(); drawAll(); setStatus('Cleared — ready for a new photo.', 'info'); setStep(1); } function clearResults() { $('results-section').style.display = 'none'; ['face','head','bg','light','sharp','pose','tech'].forEach(k => { $('bd-' + k).textContent = '0/' + (k === 'face'||k==='head'?'20':k==='bg'||k==='light'?'15':'10'); $('bdf-' + k).style.width = '0%'; }); ['c-face','c-single','c-center','c-headsize','c-bgplain','c-bglight', 'c-light','c-shadow','c-sharp','c-eyes','c-pose','c-expr'].forEach(id => { $(id).textContent = '—'; $(id).className = ''; }); $('r-score').innerHTML = '0<span class="score-denom">/100</span>'; $('r-badge').textContent = '—'; $('r-preset').textContent = $('r-res').textContent = $('r-faces').textContent = $('r-out').textContent = '—'; $('r-bar').style.width = '0%'; $('r-warnings').innerHTML = $('r-suggestions').innerHTML = ''; } function syncStateFromSliders() { ST.tr.zoom = parseFloat($('r-zoom').value); ST.tr.rotateDeg = parseFloat($('r-rotate').value); ST.tr.offsetX = parseFloat($('r-x').value); ST.tr.offsetY = parseFloat($('r-y').value); ST.tr.brightness = parseFloat($('r-bright').value); ST.tr.contrast = parseFloat($('r-contrast').value); updateLabels(); drawAll(); } function syncSlidersFromState() { $('r-zoom').value = ST.tr.zoom; $('r-rotate').value = ST.tr.rotateDeg; $('r-x').value = Math.round(ST.tr.offsetX); $('r-y').value = Math.round(ST.tr.offsetY); $('r-bright').value = ST.tr.brightness; $('r-contrast').value = ST.tr.contrast; updateLabels(); } function updateLabels() { $('rv-zoom').textContent = Math.round(ST.tr.zoom * 100) + '%'; $('rv-rotate').textContent = ST.tr.rotateDeg.toFixed(1) + '°'; $('rv-x').textContent = Math.round(ST.tr.offsetX); $('rv-y').textContent = Math.round(ST.tr.offsetY); $('rv-bright').textContent = Math.round(ST.tr.brightness * 100) + '%'; $('rv-contrast').textContent = Math.round(ST.tr.contrast * 100) + '%'; } const STATUS_ICONS = { info:'ℹ️', success:'✅', warn:'⚠️', error:'❌' }; function setStatus(msg, type) { type = type || 'info'; const bar = $('status-bar'); bar.className = 'status-bar show ' + type; $('status-icon').textContent = STATUS_ICONS[type] || 'ℹ️'; $('status-text').textContent = msg; } function setStep(n) { for (let i = 1; i <= 4; i++) { const el = $('step-' + i); if (!el) continue; el.classList.remove('active', 'done'); if (i < n) el.classList.add('done'); if (i === n) el.classList.add('active'); } } function setEl(id, text, styles) { const el = $(id); if (!el) return; el.textContent = text; if (styles) Object.assign(el.style, styles); } function setChk(id, status, text) { const el = $(id); if (!el) return; el.textContent = text; el.className = status === 'pass' ? 'chk-pass' : status === 'warn' ? 'chk-warn' : 'chk-fail'; } function setBdBar(key, value, max, color) { $('bd-' + key).textContent = value + '/' + max; $('bdf-' + key).style.width = ((value / max) * 100) + '%'; $('bdf-' + key).style.background = color; } function fillList(id, items, fallback) { const ul = $(id); if (!ul) return; ul.innerHTML = ''; (items && items.length ? items : [fallback]).forEach(t => { const li = document.createElement('li'); li.textContent = t; ul.appendChild(li); }); } function scoreBadge(s) { if (s >= 90) return { label: 'Excellent', color: '#166534', bg: 'rgba(22,163,74,0.18)' }; if (s >= 75) return { label: 'Acceptable', color: '#1e40af', bg: 'rgba(37,99,235,0.18)' }; if (s >= 50) return { label: 'Needs Improvement', color: '#92400e', bg: 'rgba(180,83,9,0.20)' }; return { label: 'Not Suitable', color: '#991b1b', bg: 'rgba(220,38,38,0.18)' }; } function bindChips(containerId, dataAttr, setter) { const wrap = $(containerId); if (!wrap) return; wrap.querySelectorAll('.chip').forEach(btn => { btn.addEventListener('click', () => { wrap.querySelectorAll('.chip').forEach(b => b.classList.remove('active')); btn.classList.add('active'); setter(btn.dataset[dataAttr]); }); }); } function init() { resizeCanvases(); syncSlidersFromState(); drawAll(); setStep(1); setStatus('Upload a portrait photo to begin.', 'info'); ['r-zoom','r-rotate','r-x','r-y','r-bright','r-contrast'].forEach(id => $(id).addEventListener('input', syncStateFromSliders) ); $('tog-whiten').addEventListener('change', e => { ST.bgWhiten = e.target.checked; drawAll(); }); $('tog-guide').addEventListener('change', e => { ST.showGuide = e.target.checked; drawGuide(); }); $('preset-select').addEventListener('change', function () { ST.presetKey = this.value; const isCustom = ST.presetKey === 'custom'; $('custom-w').disabled = !isCustom; $('custom-h').disabled = !isCustom; resizeCanvases(); drawAll(); setStatus('Preset: ' + getPreset().label, 'info'); }); $('custom-w').addEventListener('input', () => { resizeCanvases(); drawAll(); }); $('custom-h').addEventListener('input', () => { resizeCanvases(); drawAll(); }); $('file-input').addEventListener('change', e => handleFile(e.target.files[0])); const dz = $('drop-zone'); ['dragenter','dragover'].forEach(evt => dz.addEventListener(evt, e => { e.preventDefault(); dz.classList.add('drag-over'); }) ); ['dragleave','drop'].forEach(evt => dz.addEventListener(evt, e => { e.preventDefault(); dz.classList.remove('drag-over'); }) ); dz.addEventListener('drop', e => { const f = e.dataTransfer?.files?.[0]; if (f) handleFile(f); }); $('btn-autocrop').addEventListener('click', async () => { if (!ST.img) return; if (!ST.face) await detectFaces(); if (ST.face) autoCrop(); else setStatus('No face found — try a clear frontal portrait.', 'warn'); }); $('btn-analyze').addEventListener('click', async () => { if (!ST.img) { setStatus('Upload a photo first.', 'warn'); return; } setStatus('Analyzing photo…', 'info'); setStep(3); if (!ST.face) await detectFaces(); drawAll(); const result = analyzePhoto(); renderAnalysis(result); }); $('btn-reset').addEventListener('click', resetTransform); $('btn-clear').addEventListener('click', fullClear); $('btn-download').addEventListener('click', exportPhoto); $('btn-sheet').addEventListener('click', exportSheet); bindChips('fmt-chips', 'fmt', v => { ST.exportFmt = v; }); bindChips('sheet-chips', 'sheet', v => { ST.sheetCopies = parseInt(v); }); loadModels(); } init(); })();</script><script>(function(){ function initImageToolsPage(){ var wrap=document.querySelector(".imageToolsPage"); if(!wrap) return; var input=wrap.querySelector("#imageToolsSearch"); var clearBtn=wrap.querySelector("#imageToolsClear"); var cards=Array.from(wrap.querySelectorAll("[data-tool]")); var filters=Array.from(wrap.querySelectorAll(".imageToolsPage__filter")); var countEl=wrap.querySelector("#imageToolsCount"); var emptyEl=wrap.querySelector("#imageToolsEmpty"); if(!input || !clearBtn || !cards.length || !filters.length || !countEl || !emptyEl) return; var activeFilter="all"; function normalize(str){ return String(str || "").toLowerCase().replace(/\s+/g," ").trim(); } function getCardText(card){ return normalize(card.innerText); } function update(){ var q=normalize(input.value); var shown=0; cards.forEach(function(card){ var category=card.getAttribute("data-category") || ""; var matchFilter=(activeFilter==="all" || category===activeFilter); var matchSearch=(!q || getCardText(card).includes(q)); var show=(matchFilter && matchSearch); card.classList.toggle("is-hidden", !show); if(show) shown++; }); countEl.textContent="Showing " + shown + " tool" + (shown===1 ? "" : "s"); emptyEl.hidden=(shown !== 0); } filters.forEach(function(btn){ btn.addEventListener("click", function(){ filters.forEach(function(b){ b.classList.remove("is-active"); }); btn.classList.add("is-active"); activeFilter=btn.getAttribute("data-filter") || "all"; update(); }); }); input.addEventListener("input", update); clearBtn.addEventListener("click", function(){ input.value=""; input.focus(); update(); }); update(); } document.addEventListener("DOMContentLoaded", initImageToolsPage); })();</script><script>(function () { function initAtsCompareHub() { var wrap = document.querySelector(".atsCompareHub"); if (!wrap) return; var input = wrap.querySelector("#atsCompareSearch"); var clearBtn = wrap.querySelector("#atsCompareClear"); var cards = Array.from(wrap.querySelectorAll("[data-tool]")); var countEl = wrap.querySelector("#atsCompareCount"); var emptyEl = wrap.querySelector("#atsCompareEmpty"); if (!input || !clearBtn || !cards.length || !countEl || !emptyEl) return; function normalize(str) { return String(str || "").toLowerCase().replace(/\s+/g, " ").trim(); } function cardText(card) { var title = card.querySelector("h2"); var desc = card.querySelector("p"); var badge = card.querySelector(".atsCompareHub__badge"); return normalize( (title ? title.textContent : "") + " " + (desc ? desc.textContent : "") + " " + (badge ? badge.textContent : "") ); } function update() { var q = normalize(input.value); var shown = 0; cards.forEach(function (card) { var show = !q || cardText(card).indexOf(q) !== -1; card.classList.toggle("is-hidden", !show); if (show) shown++; }); countEl.textContent = "Showing " + shown + " tool" + (shown === 1 ? "" : "s"); emptyEl.hidden = shown !== 0; } input.addEventListener("input", update); clearBtn.addEventListener("click", function () { input.value = ""; input.focus(); update(); }); update(); } document.addEventListener("DOMContentLoaded", initAtsCompareHub); window.addEventListener("load", initAtsCompareHub); })();</script><script>(function () { function initSeoHub3() { var wrap = document.querySelector(".seoHub3"); if (!wrap) return; var input = wrap.querySelector("#seoHub3Search"); var clearBtn = wrap.querySelector("#seoHub3Clear"); var filters = Array.from(wrap.querySelectorAll(".seoHub3__filter[data-filter]")); var cards = Array.from(wrap.querySelectorAll("[data-tool]")); var countEl = wrap.querySelector("#seoHub3Count"); var emptyEl = wrap.querySelector("#seoHub3Empty"); if (!input || !clearBtn || !filters.length || !cards.length || !countEl || !emptyEl) return; var activeFilter = "all"; function normalize(str) { return String(str || "").toLowerCase().replace(/\s+/g, " ").trim(); } function cardText(card) { var title = card.querySelector("h3"); var desc = card.querySelector(".seoHub3__main p"); var tags = Array.from(card.querySelectorAll(".seoHub3__tags span")).map(function (el) { return el.textContent || ""; }).join(" "); var cat = card.getAttribute("data-category") || ""; return normalize( (title ? title.textContent : "") + " " + (desc ? desc.textContent : "") + " " + tags + " " + cat ); } function update() { var q = normalize(input.value); var shown = 0; cards.forEach(function (card) { var cat = card.getAttribute("data-category") || ""; var matchesFilter = activeFilter === "all" || cat === activeFilter; var matchesSearch = !q || cardText(card).indexOf(q) !== -1; var show = matchesFilter && matchesSearch; card.classList.toggle("is-hidden", !show); if (show) shown++; }); countEl.textContent = "Showing " + shown + " tool" + (shown === 1 ? "" : "s"); emptyEl.hidden = shown !== 0; } filters.forEach(function (btn) { btn.addEventListener("click", function () { filters.forEach(function (b) { b.classList.remove("is-active"); }); btn.classList.add("is-active"); activeFilter = btn.getAttribute("data-filter") || "all"; update(); }); }); input.addEventListener("input", update); clearBtn.addEventListener("click", function () { input.value = ""; input.focus(); update(); }); update(); } document.addEventListener("DOMContentLoaded", initSeoHub3); window.addEventListener("load", initSeoHub3); })();</script><script>var nanoState = { ids: [], visibleLimit: 100 }; var nanoPresets = { "default": "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_-", "lowercase": "abcdefghijklmnopqrstuvwxyz", "uppercase": "ABCDEFGHIJKLMNOPQRSTUVWXYZ", "letters": "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ", "numbers": "0123456789", "alphanumeric": "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789", "hex": "0123456789abcdef", "urlsafe": "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_-" }; var nanoQuickPresetConfig = { "default": { alphabet:"default", length:21, quantity:10, custom:"" }, "short": { alphabet:"alphanumeric", length:8, quantity:20, custom:"" }, "urlsafe": { alphabet:"urlsafe", length:21, quantity:10, custom:"" }, "hex": { alphabet:"hex", length:32, quantity:10, custom:"" }, "numbers": { alphabet:"numbers", length:10, quantity:20, custom:"" } }; function nano$(id){ return document.getElementById(id); } function nanoSetStatus(msg, type) { var el = nano$("nid-status"); if (!el) return; if (!msg) { el.className = "atsStatus"; el.textContent = ""; return; } el.className = "atsStatus show atsStatus-" + (type || "info"); el.textContent = msg; } function nanoSetStep(n) { for (var i = 1; i <= 4; i++) { var el = nano$("step-" + i); if (!el) continue; el.classList.remove("active", "done"); if (i < n) el.classList.add("done"); if (i === n) el.classList.add("active"); } } function nanoHasCrypto() { return !!(window.crypto && window.crypto.getRandomValues); } function nanoUniqChars(str) { return Array.from(new Set(String(str || "").split(""))).join(""); } function nanoClamp(n, min, max) { return Math.max(min, Math.min(max, n)); } function nanoGetAlphabet() { var el = nano$("nid-alphabet"); if (!el) return nanoPresets.default; var type = el.value; if (type === "custom") { var custom = nano$("nid-custom"); return nanoUniqChars(custom ? custom.value : ""); } return nanoPresets[type] || nanoPresets.default; } function nanoEstimateLog10(alphaSize, length) { if (alphaSize < 2 || length < 1) return 0; return length * Math.log10(alphaSize); } function nanoFormatCombinations(alphaSize, length) { var log10 = nanoEstimateLog10(alphaSize, length); if (!log10) return "—"; if (log10 < 9) return Math.pow(alphaSize, length).toLocaleString(); var exp = Math.floor(log10); var mantissa = Math.pow(10, log10 - exp); return mantissa.toFixed(2) + "e+" + exp; } function nanoGetStrength(alphaSize, length) { var log10 = nanoEstimateLog10(alphaSize, length); if (log10 < 8) return { label:"Weak", color:"#b91c1c", pct:25 }; if (log10 < 14) return { label:"Fair", color:"#b45309", pct:50 }; if (log10 < 25) return { label:"Strong", color:"#1d4ed8", pct:78 }; return { label:"Very Strong", color:"#15803d", pct:100 }; } function nanoIsUrlSafe(alphabet) { return /^[A-Za-z0-9\-_]+$/.test(alphabet); } function nanoValidate() { var lengthEl = nano$("nid-length"); var quantityEl = nano$("nid-quantity"); var alphabetEl = nano$("nid-alphabet"); var prefixEl = nano$("nid-prefix"); var suffixEl = nano$("nid-suffix"); if (!lengthEl || !quantityEl || !alphabetEl) { return { ok:false, message:"Nano ID tool fields were not found on this page." }; } var length = nanoClamp(parseInt(lengthEl.value || "21", 10) || 21, 4, 128); var quantity = nanoClamp(parseInt(quantityEl.value || "10", 10) || 10, 1, 1000); lengthEl.value = length; quantityEl.value = quantity; var alphabet = nanoGetAlphabet(); if (alphabetEl.value === "custom" && alphabet.length < 2) { return { ok:false, message:"Custom alphabet must contain at least 2 unique characters." }; } if (!nanoHasCrypto()) { return { ok:false, message:"Secure random generation is not supported. Make sure your site uses HTTPS." }; } return { ok:true, length:length, quantity:quantity, alphabet:alphabet, prefix:prefixEl ? prefixEl.value || "" : "", suffix:suffixEl ? suffixEl.value || "" : "" }; } function nanoRefreshPreview() { var customWrap = nano$("nid-custom-wrap"); var alphabetEl = nano$("nid-alphabet"); if (!alphabetEl) return; if (customWrap) { customWrap.style.display = alphabetEl.value === "custom" ? "block" : "none"; } var v = nanoValidate(); var chipAlpha = nano$("nid-chip-alpha"); var chipCombo = nano$("nid-chip-combo"); var chipStrength = nano$("nid-chip-strength"); var chipReady = nano$("nid-chip-ready"); if (!chipAlpha || !chipCombo || !chipStrength || !chipReady) return; if (!v.ok) { chipAlpha.textContent = "Alphabet Size: —"; chipCombo.textContent = "Combinations: —"; chipStrength.textContent = "Strength: Invalid"; chipReady.textContent = v.message; return; } var strength = nanoGetStrength(v.alphabet.length, v.length); chipAlpha.textContent = "Alphabet Size: " + v.alphabet.length; chipCombo.textContent = "Combinations: " + nanoFormatCombinations(v.alphabet.length, v.length); chipStrength.textContent = "Strength: " + strength.label; chipReady.textContent = "Ready to generate"; } function nanoCreateId(length, alphabet) { var alphabetLen = alphabet.length; var mask = (2 << Math.floor(Math.log2(alphabetLen - 1))) - 1; var step = Math.ceil((1.6 * mask * length) / alphabetLen); var id = ""; while (id.length < length) { var bytes = new Uint8Array(step); window.crypto.getRandomValues(bytes); for (var i = 0; i < step && id.length < length; i++) { var byte = bytes[i] & mask; if (alphabet[byte]) id += alphabet[byte]; } } return id; } function nanoGenerateIds(cfg) { var out = []; for (var i = 0; i < cfg.quantity; i++) { out.push(cfg.prefix + nanoCreateId(cfg.length, cfg.alphabet) + cfg.suffix); } return out; } function nanoSetCheck(id, val) { var el = nano$(id); if (!el) return; if (typeof val === "boolean") { el.innerHTML = val ? '<span class="atsYes">✓</span>' : '<span class="atsNo">✗</span>'; } else { el.textContent = val; } } function nanoFillList(id, items) { var ul = nano$(id); if (!ul) return; ul.innerHTML = ""; var list = items && items.length ? items : ["None"]; for (var i = 0; i < list.length; i++) { var li = document.createElement("li"); li.textContent = list[i]; ul.appendChild(li); } } function nanoFillBreakdown(v) { var alphaStrength = Math.min(25, Math.round((v.alphabet.length / 64) * 25)); var lengthStrength = Math.min(25, Math.round((v.length / 21) * 25)); var collisionStrength = Math.round(nanoGetStrength(v.alphabet.length, v.length).pct / 4); var outputStrength = v.quantity <= 100 ? 25 : v.quantity <= 500 ? 20 : 16; if (nano$("bd-alpha")) nano$("bd-alpha").textContent = alphaStrength + "/25"; if (nano$("bd-length")) nano$("bd-length").textContent = lengthStrength + "/25"; if (nano$("bd-collision")) nano$("bd-collision").textContent = collisionStrength + "/25"; if (nano$("bd-output")) nano$("bd-output").textContent = outputStrength + "/25"; if (nano$("bdf-alpha")) nano$("bdf-alpha").style.width = (alphaStrength / 25 * 100) + "%"; if (nano$("bdf-length")) nano$("bdf-length").style.width = (lengthStrength / 25 * 100) + "%"; if (nano$("bdf-collision")) nano$("bdf-collision").style.width = (collisionStrength / 25 * 100) + "%"; if (nano$("bdf-output")) nano$("bdf-output").style.width = (outputStrength / 25 * 100) + "%"; var color = nanoGetStrength(v.alphabet.length, v.length).color; ["bdf-alpha","bdf-length","bdf-collision","bdf-output"].forEach(function(id){ var el = nano$(id); if (el) el.style.background = color; }); } function nanoEscapeHtml(str) { return String(str || "") .replace(/&/g,"&") .replace(/</g,"<") .replace(/>/g,">") .replace(/"/g,""") .replace(/'/g,"'"); } function nanoEscapeAttr(str) { return String(str || "") .replace(/&/g,"&") .replace(/"/g,""") .replace(/</g,"<") .replace(/>/g,">"); } function nanoRenderTable(ids) { var body = nano$("nid-table-body"); if (!body) return; body.innerHTML = ""; var limit = Math.min(nanoState.visibleLimit, ids.length); for (var i = 0; i < limit; i++) { var tr = document.createElement("tr"); tr.innerHTML = "<td>" + (i + 1) + "</td>" + "<td><span class='atsCode'>" + nanoEscapeHtml(ids[i]) + "</span></td>" + "<td><button type='button' class='atsCopyMini' onclick='nanoCopyOne(\"" + nanoEscapeAttr(ids[i]) + "\")'>Copy</button></td>"; body.appendChild(tr); } } function nanoBuildWarnings(cfg, allUnique) { var warnings = []; var suggestions = []; var alphabetEl = nano$("nid-alphabet"); var alphabetType = alphabetEl ? alphabetEl.value : "default"; if (cfg.length <= 6) warnings.push("Very short IDs may increase collision risk."); if (cfg.alphabet.length <= 10) warnings.push("Small alphabets reduce the total search space."); if (alphabetType === "numbers") warnings.push("Numbers-only IDs are easier to guess."); if (alphabetType === "custom" && cfg.alphabet.length < 8) warnings.push("A very small custom alphabet weakens uniqueness."); if (cfg.quantity >= 500) warnings.push("Large bulk output may be harder to review visually."); if (!allUnique) warnings.push("Duplicate IDs were detected in this batch."); if (!nanoIsUrlSafe(cfg.alphabet)) warnings.push("This alphabet may not be ideal for URLs."); if (cfg.length < 16) suggestions.push("Use 16+ characters for stronger production IDs."); if (!nanoIsUrlSafe(cfg.alphabet)) suggestions.push("Use a URL-safe alphabet for links and route parameters."); if (alphabetType === "hex") suggestions.push("Hex works well for technical identifiers and tokens."); if (alphabetType === "default" || alphabetType === "urlsafe") suggestions.push("Default Nano ID format is a strong general-purpose choice."); if (!cfg.prefix && !cfg.suffix) suggestions.push("Use optional prefixes like usr_, ord_, or inv_ to separate ID types."); if (cfg.quantity > 1) suggestions.push("Use Copy All or Download TXT to move full batches quickly."); return { warnings: warnings.length ? warnings : ["No major issues detected."], suggestions: suggestions.length ? suggestions : ["Your current settings are well balanced."] }; } function nanoRender(cfg, ids) { var unique = new Set(ids).size === ids.length; var strength = nanoGetStrength(cfg.alphabet.length, cfg.length); if (nano$("nid-main-id")) nano$("nid-main-id").textContent = ids[0] || "—"; var badge = nano$("nid-main-badge"); if (badge) { badge.textContent = strength.label; badge.style.color = strength.color; badge.style.background = strength.color === "#15803d" ? "rgba(22,163,74,0.12)" : strength.color === "#1d4ed8" ? "rgba(37,99,235,0.10)" : strength.color === "#b45309" ? "rgba(245,158,11,0.12)" : "rgba(185,28,28,0.09)"; badge.style.border = "1px solid rgba(15,23,42,0.14)"; } if (nano$("nid-meta-length")) nano$("nid-meta-length").textContent = cfg.length; if (nano$("nid-meta-quantity")) nano$("nid-meta-quantity").textContent = cfg.quantity; if (nano$("nid-meta-alpha")) nano$("nid-meta-alpha").textContent = cfg.alphabet.length; if (nano$("nid-meta-strength")) nano$("nid-meta-strength").textContent = strength.label; if (nano$("nid-bar")) { nano$("nid-bar").style.width = strength.pct + "%"; nano$("nid-bar").style.background = strength.color; } nanoFillBreakdown(cfg); nanoSetCheck("c-secure", nanoHasCrypto()); nanoSetCheck("c-urlsafe", nanoIsUrlSafe(cfg.alphabet)); nanoSetCheck("c-custom", nano$("nid-alphabet") && nano$("nid-alphabet").value === "custom"); nanoSetCheck("c-unique", unique); nanoSetCheck("c-visible", Math.min(nanoState.visibleLimit, ids.length)); nanoSetCheck("c-total", ids.length); nanoSetCheck("c-prefix", !!cfg.prefix); nanoSetCheck("c-suffix", !!cfg.suffix); nanoSetCheck("c-first", !!ids[0]); var lists = nanoBuildWarnings(cfg, unique); nanoFillList("nid-warnings", lists.warnings); nanoFillList("nid-suggestions", lists.suggestions); nanoRenderTable(ids); if (nano$("nid-copy-first")) nano$("nid-copy-first").disabled = !ids.length; if (nano$("nid-copy-all")) nano$("nid-copy-all").disabled = !ids.length; if (nano$("nid-download")) nano$("nid-download").disabled = !ids.length; if (nano$("nid-results")) nano$("nid-results").style.display = "block"; } function nanoCopyText(text, msg) { if (!navigator.clipboard || !navigator.clipboard.writeText) { nanoSetStatus("Clipboard API is not available in this browser.", "error"); return; } navigator.clipboard.writeText(text).then(function () { nanoSetStatus(msg || "Copied.", "success"); }).catch(function () { nanoSetStatus("Clipboard copy failed.", "error"); }); } function nanoDownloadText(name, content) { var blob = new Blob([content], { type:"text/plain;charset=utf-8" }); var url = URL.createObjectURL(blob); var a = document.createElement("a"); a.href = url; a.download = name; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } function nanoApplyPreset(key) { var cfg = nanoQuickPresetConfig[key]; if (!cfg) return; if (nano$("nid-alphabet")) nano$("nid-alphabet").value = cfg.alphabet; if (nano$("nid-length")) nano$("nid-length").value = cfg.length; if (nano$("nid-quantity")) nano$("nid-quantity").value = cfg.quantity; if (nano$("nid-custom")) nano$("nid-custom").value = cfg.custom || ""; nanoRefreshPreview(); nanoSetStatus("Preset applied: " + key, "info"); } function nanoHandleCustomInput() { var el = nano$("nid-custom"); if (!el) return; el.value = nanoUniqChars(el.value); nanoRefreshPreview(); } function nanoGenerate() { var v = nanoValidate(); if (!v.ok) { nanoSetStatus(v.message, "error"); nanoSetStep(1); return; } nanoSetStatus("Generating secure Nano IDs…", "info"); nanoSetStep(2); try { nanoState.ids = nanoGenerateIds(v); nanoRender(v, nanoState.ids); nanoSetStatus("Generation complete ✓", "success"); nanoSetStep(4); } catch (e) { nanoSetStatus("Error: " + (e && e.message ? e.message : "Failed to generate IDs."), "error"); } } function nanoCopyFirst() { if (!nanoState.ids.length) return; nanoCopyText(nanoState.ids[0], "First ID copied."); nanoSetStep(3); } function nanoCopyAll() { if (!nanoState.ids.length) return; nanoCopyText(nanoState.ids.join("\n"), nanoState.ids.length + " IDs copied."); nanoSetStep(3); } function nanoCopyOne(text) { nanoCopyText(text, "ID copied."); nanoSetStep(3); } function nanoDownload() { if (!nanoState.ids.length) return; nanoDownloadText("nano-ids.txt", nanoState.ids.join("\n")); nanoSetStatus("TXT file downloaded.", "success"); nanoSetStep(3); } function nanoClear() { nanoState.ids = []; if (nano$("nid-length")) nano$("nid-length").value = 21; if (nano$("nid-quantity")) nano$("nid-quantity").value = 10; if (nano$("nid-alphabet")) nano$("nid-alphabet").value = "default"; if (nano$("nid-custom")) nano$("nid-custom").value = ""; if (nano$("nid-prefix")) nano$("nid-prefix").value = ""; if (nano$("nid-suffix")) nano$("nid-suffix").value = ""; if (nano$("nid-results")) nano$("nid-results").style.display = "none"; if (nano$("nid-copy-first")) nano$("nid-copy-first").disabled = true; if (nano$("nid-copy-all")) nano$("nid-copy-all").disabled = true; if (nano$("nid-download")) nano$("nid-download").disabled = true; nanoSetStatus(""); nanoSetStep(1); nanoRefreshPreview(); } function nanoInit() { if (!nano$("nanoTool")) return; nanoSetStep(1); nanoRefreshPreview(); } document.addEventListener("DOMContentLoaded", nanoInit); window.addEventListener("load", nanoInit);</script><script>(function() { function el(id) { return document.getElementById(id); } var inputEl = el('jcv-input'); var outputEl = el('jcv-output'); var statusEl = el('jcv-status'); var charsEl = el('jcv-chars'); var linesEl = el('jcv-lines'); var rowsEl = el('jcv-rows'); var colsEl = el('jcv-cols'); var copyfbEl = el('jcv-copyfb'); var delimiterEl = el('jcv-delimiter'); var inputLabel = el('jcv-inputLabel'); var outputLabel = el('jcv-outputLabel'); var downloadBtn = el('jcv-downloadBtn'); var convertBtn = el('jcv-convertBtn'); var clearBtn = el('jcv-clearBtn'); var pasteBtn = el('jcv-pasteBtn'); var copyBtn = el('jcv-copyBtn'); var tabJson2csv = el('jcv-tab-json2csv'); var tabCsv2json = el('jcv-tab-csv2json'); if (!convertBtn) return; var mode = 'json2csv'; function showStatus(msg, type) { statusEl.textContent = msg; statusEl.className = 'jcvStatus show jcvStatus-' + type; clearTimeout(statusEl._t); statusEl._t = setTimeout(function() { statusEl.classList.remove('show'); }, 4500); } function getDelimiter() { return delimiterEl.value; } function setMode(m) { mode = m; tabJson2csv.classList.toggle('active', m === 'json2csv'); tabCsv2json.classList.toggle('active', m === 'csv2json'); if (m === 'json2csv') { inputEl.placeholder = '[{"name":"Alice","age":30},{"name":"Bob","age":25}]'; inputLabel.textContent = 'JSON Input'; outputLabel.textContent = 'CSV Output'; downloadBtn.download = 'output.csv'; } else { inputEl.placeholder = 'name,age\nAlice,30\nBob,25'; inputLabel.textContent = 'CSV Input'; outputLabel.textContent = 'JSON Output'; downloadBtn.download = 'output.json'; } resetOutput(); inputEl.value = ''; charsEl.textContent = '0'; linesEl.textContent = '0'; statusEl.classList.remove('show'); } function resetOutput() { outputEl.innerHTML = '<span style="font-style:italic;font-size:12px;color:rgba(15,23,42,0.45);">Output will appear here...</span>'; rowsEl.textContent = '-'; colsEl.textContent = '-'; downloadBtn.style.display = 'none'; downloadBtn.href = ''; } function setOutput(text) { outputEl.textContent = text; } function escapeCSVCell(val, delim) { var str = (val === null || val === undefined) ? '' : String(val); if (typeof val === 'object') str = JSON.stringify(val); if (str.indexOf(delim) !== -1 || str.indexOf('"') !== -1 || str.indexOf('\n') !== -1 || str.indexOf('\r') !== -1) { str = '"' + str.replace(/"/g, '""') + '"'; } return str; } function jsonToCSV(jsonStr, delim) { var data; try { data = JSON.parse(jsonStr); } catch(e) { throw new Error('Invalid JSON: ' + e.message); } if (!Array.isArray(data)) { if (typeof data === 'object' && data !== null) { data = [data]; } else { throw new Error('JSON must be an array of objects or a single object.'); } } if (data.length === 0) throw new Error('JSON array is empty.'); var headers = []; for (var i = 0; i < data.length; i++) { if (typeof data[i] === 'object' && data[i] !== null) { var keys = Object.keys(data[i]); for (var k = 0; k < keys.length; k++) { if (headers.indexOf(keys[k]) === -1) headers.push(keys[k]); } } } if (headers.length === 0) throw new Error('No object keys found to use as columns.'); var rows = [headers.map(function(h) { return escapeCSVCell(h, delim); }).join(delim)]; for (var r = 0; r < data.length; r++) { var row = data[r]; var cells = headers.map(function(h) { return escapeCSVCell(row[h] !== undefined ? row[h] : '', delim); }); rows.push(cells.join(delim)); } return { csv: rows.join('\n'), rows: data.length, cols: headers.length }; } function parseCSVLine(line, delim) { var cells = []; var inQuote = false; var cell = ''; for (var i = 0; i < line.length; i++) { var ch = line[i]; if (ch === '"') { if (inQuote && line[i+1] === '"') { cell += '"'; i++; } else { inQuote = !inQuote; } } else if (ch === delim && !inQuote) { cells.push(cell); cell = ''; } else { cell += ch; } } cells.push(cell); return cells; } function csvToJSON(csvStr, delim) { var lines = csvStr.split(/\r?\n/).filter(function(l) { return l.trim() !== ''; }); if (lines.length < 2) throw new Error('CSV must have a header row and at least one data row.'); var headers = parseCSVLine(lines[0], delim); var result = []; for (var i = 1; i < lines.length; i++) { var cells = parseCSVLine(lines[i], delim); var obj = {}; for (var j = 0; j < headers.length; j++) { var val = cells[j] !== undefined ? cells[j] : ''; if (val === '') { obj[headers[j]] = ''; continue; } if (val === 'true') { obj[headers[j]] = true; continue; } if (val === 'false') { obj[headers[j]] = false; continue; } if (val === 'null') { obj[headers[j]] = null; continue; } var num = Number(val); if (!isNaN(num) && val.trim() !== '') { obj[headers[j]] = num; continue; } try { var parsed = JSON.parse(val); obj[headers[j]] = parsed; } catch(e) { obj[headers[j]] = val; } } result.push(obj); } return { json: JSON.stringify(result, null, 2), rows: result.length, cols: headers.length }; } function makeDownload(text, mime) { var blob = new Blob([text], { type: mime }); var url = URL.createObjectURL(blob); downloadBtn.href = url; downloadBtn.style.display = 'inline-flex'; } inputEl.addEventListener('input', function() { charsEl.textContent = inputEl.value.length; linesEl.textContent = inputEl.value ? inputEl.value.split('\n').length : 0; }); tabJson2csv.addEventListener('click', function() { setMode('json2csv'); }); tabCsv2json.addEventListener('click', function() { setMode('csv2json'); }); convertBtn.addEventListener('click', function() { var v = inputEl.value.trim(); if (!v) { showStatus('Input is empty.', 'error'); return; } var delim = getDelimiter(); try { if (mode === 'json2csv') { var result = jsonToCSV(v, delim); setOutput(result.csv); rowsEl.textContent = result.rows; colsEl.textContent = result.cols; makeDownload(result.csv, 'text/csv'); showStatus('Converted successfully. ' + result.rows + ' rows, ' + result.cols + ' columns.', 'success'); } else { var result2 = csvToJSON(v, delim); setOutput(result2.json); rowsEl.textContent = result2.rows; colsEl.textContent = result2.cols; makeDownload(result2.json, 'application/json'); showStatus('Converted successfully. ' + result2.rows + ' rows, ' + result2.cols + ' columns.', 'success'); } } catch(e) { showStatus(e.message, 'error'); } }); clearBtn.addEventListener('click', function() { inputEl.value = ''; charsEl.textContent = '0'; linesEl.textContent = '0'; resetOutput(); statusEl.classList.remove('show'); }); pasteBtn.addEventListener('click', function() { if (navigator.clipboard && navigator.clipboard.readText) { navigator.clipboard.readText().then(function(text) { inputEl.value = text; inputEl.dispatchEvent(new Event('input')); showStatus('Pasted successfully.', 'success'); }).catch(function() { showStatus('Paste failed - use Ctrl+V.', 'error'); }); } else { showStatus('Paste failed - use Ctrl+V.', 'error'); } }); copyBtn.addEventListener('click', function() { var text = outputEl.textContent || ''; if (!text || text.indexOf('Output will appear') !== -1) { showStatus('Nothing to copy.', 'error'); return; } if (navigator.clipboard && navigator.clipboard.writeText) { navigator.clipboard.writeText(text).then(function() { copyfbEl.classList.add('show'); setTimeout(function() { copyfbEl.classList.remove('show'); }, 1800); }).catch(function() { showStatus('Copy failed - use Ctrl+C.', 'error'); }); } }); }()); ``` --- **Test inputs to verify it works:** JSON to CSV — paste and click Convert: ``` [{"name":"Alice","age":30,"city":"Paris"},{"name":"Bob","age":25,"city":"Lyon"}] ``` CSV to JSON — switch mode, paste and click Convert: ``` name,age,city Alice,30,Paris Bob,25,Lyon</script><script>(function() { function el(id) { return document.getElementById(id); } var inputEl = el('jfv-input'); var statusEl = el('jfv-status'); var charsEl = el('jfv-chars'); var linesEl = el('jfv-lines'); var outputEl = el('jfv-output'); var placeholderEl = el('jfv-placeholder'); var treeEl = el('jfv-tree-output'); var copyFbEl = el('jfv-copy-feedback'); var indentEl = el('jfv-indent'); var formatBtn = el('jfv-formatBtn'); var minifyBtn = el('jfv-minifyBtn'); var validateBtn = el('jfv-validateBtn'); var clearBtn = el('jfv-clearBtn'); var pasteBtn = el('jfv-pasteBtn'); var copyBtn = el('jfv-copyBtn'); var tabFormatted = el('jfv-tab-formatted'); var tabTree = el('jfv-tab-tree'); if (!formatBtn) return; function getIndent() { var v = indentEl.value; if (v === 'TAB') return '\t'; return parseInt(v, 10); } function showStatus(msg, type) { statusEl.textContent = msg; statusEl.className = 'jfvStatus show jfvStatus-' + type; clearTimeout(statusEl._t); statusEl._t = setTimeout(function() { statusEl.classList.remove('show'); }, 4500); } function showOutput(formatted, parsed) { outputEl.innerHTML = syntaxHighlight(formatted); outputEl.style.display = 'block'; placeholderEl.style.display = 'none'; treeEl.innerHTML = ''; treeEl.appendChild(buildTree(parsed, undefined)); } function syntaxHighlight(json) { return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?|[{}\[\],])/g, function(match) { var cls = 'jfvNumber'; if (/^"/.test(match)) { cls = /:$/.test(match) ? 'jfvKey' : 'jfvString'; } else if (/true|false/.test(match)) { cls = 'jfvBool'; } else if (/null/.test(match)) { cls = 'jfvNull'; } else if (/[{}\[\],]/.test(match)) { cls = 'jfvBracket'; } return '<span class="' + cls + '">' + match.replace(/</g, '<').replace(/>/g, '>') + '</span>'; }); } function buildTree(data, key) { var node = document.createElement('div'); node.className = 'jfvTreeNode'; if (data !== null && typeof data === 'object') { var isArr = Array.isArray(data); var keys = Object.keys(data); var toggle = document.createElement('span'); toggle.className = 'jfvTreeToggle'; toggle.textContent = '\u25BE'; toggle.addEventListener('click', function() { var p = this.parentNode; p.classList.toggle('jfvTreeCollapsed'); this.textContent = p.classList.contains('jfvTreeCollapsed') ? '\u25B8' : '\u25BE'; }); node.appendChild(toggle); var label = document.createElement('span'); var labelHTML = ''; if (key !== undefined) labelHTML += '<span class="jfvKey">"' + key + '"</span><span class="jfvBracket">: </span>'; labelHTML += '<span class="jfvBracket">' + (isArr ? '[' : '{') + '</span>'; labelHTML += '<span style="color:rgba(15,23,42,0.45);font-size:11px;margin-left:4px;">' + keys.length + (isArr ? ' items' : ' keys') + '</span>'; label.innerHTML = labelHTML; node.appendChild(label); var children = document.createElement('div'); children.className = 'jfvTreeChildren'; for (var i = 0; i < keys.length; i++) { children.appendChild(buildTree(data[keys[i]], isArr ? undefined : keys[i])); } node.appendChild(children); var close = document.createElement('div'); close.innerHTML = '<span class="jfvBracket">' + (isArr ? ']' : '}') + '</span>'; node.appendChild(close); } else { var leaf = document.createElement('span'); var cls = 'jfvNull', val = 'null'; if (data === null) { cls = 'jfvNull'; val = 'null'; } else if (typeof data === 'boolean') { cls = 'jfvBool'; val = String(data); } else if (typeof data === 'number') { cls = 'jfvNumber'; val = String(data); } else { cls = 'jfvString'; val = '"' + String(data).replace(/</g, '<').replace(/>/g, '>') + '"'; } var leafHTML = ''; if (key !== undefined) leafHTML += '<span class="jfvKey">"' + key + '"</span><span class="jfvBracket">: </span>'; leafHTML += '<span class="' + cls + '">' + val + '</span>'; leaf.innerHTML = leafHTML; node.appendChild(leaf); } return node; } function switchTab(tab) { var tabs = document.querySelectorAll('.jfvTab'); var views = document.querySelectorAll('.jfvView'); for (var i = 0; i < tabs.length; i++) tabs[i].classList.remove('active'); for (var j = 0; j < views.length; j++) views[j].classList.remove('active'); el('jfv-tab-' + tab).classList.add('active'); el('jfv-view-' + tab).classList.add('active'); } inputEl.addEventListener('input', function() { charsEl.textContent = inputEl.value.length; linesEl.textContent = inputEl.value ? inputEl.value.split('\n').length : 0; }); formatBtn.addEventListener('click', function() { var v = inputEl.value.trim(); if (!v) { showStatus('Nothing to format.', 'error'); return; } try { var parsed = JSON.parse(v); showOutput(JSON.stringify(parsed, null, getIndent()), parsed); showStatus('Formatted successfully.', 'success'); } catch(e) { showStatus(e.message, 'error'); } }); minifyBtn.addEventListener('click', function() { var v = inputEl.value.trim(); if (!v) { showStatus('Nothing to minify.', 'error'); return; } try { var parsed = JSON.parse(v); showOutput(JSON.stringify(parsed), parsed); showStatus('Minified successfully.', 'success'); } catch(e) { showStatus(e.message, 'error'); } }); validateBtn.addEventListener('click', function() { var v = inputEl.value.trim(); if (!v) { showStatus('Input is empty.', 'error'); return; } try { JSON.parse(v); showStatus('Valid JSON', 'success'); } catch(e) { showStatus(e.message, 'error'); } }); clearBtn.addEventListener('click', function() { inputEl.value = ''; charsEl.textContent = '0'; linesEl.textContent = '0'; outputEl.style.display = 'none'; outputEl.innerHTML = ''; placeholderEl.style.display = ''; treeEl.innerHTML = ''; statusEl.classList.remove('show'); }); pasteBtn.addEventListener('click', function() { if (navigator.clipboard && navigator.clipboard.readText) { navigator.clipboard.readText().then(function(text) { inputEl.value = text; inputEl.dispatchEvent(new Event('input')); showStatus('Pasted successfully.', 'success'); }).catch(function() { showStatus('Paste failed - use Ctrl+V.', 'error'); }); } else { showStatus('Paste failed - use Ctrl+V.', 'error'); } }); copyBtn.addEventListener('click', function() { var text = outputEl.textContent || ''; if (!text) { showStatus('Nothing to copy.', 'error'); return; } if (navigator.clipboard && navigator.clipboard.writeText) { navigator.clipboard.writeText(text).then(function() { copyFbEl.classList.add('show'); setTimeout(function() { copyFbEl.classList.remove('show'); }, 1800); }).catch(function() { showStatus('Copy failed - use Ctrl+C.', 'error'); }); } }); tabFormatted.addEventListener('click', function() { switchTab('formatted'); }); tabTree.addEventListener('click', function() { switchTab('tree'); }); }());</script><script>(function() { var mode = 'encode'; var b64file = null; function el(id) { return document.getElementById(id); } var statusEl = el('b64-status'); var inputEl = el('b64-input'); var outputEl = el('b64-output'); var charsEl = el('b64-chars'); var bytesEl = el('b64-bytes'); var outsizeEl = el('b64-outsize'); var imgPreview = el('b64-imgPreview'); var previewImg = el('b64-previewImg'); var imgMeta = el('b64-imgMeta'); var imgDl = el('b64-imgDownload'); var dropTitleEl = el('b64-dropTitle'); var dropMetaEl = el('b64-dropMeta'); var runBtn = el('b64-runBtn'); var clearBtn = el('b64-clearBtn'); var pasteBtn = el('b64-pasteBtn'); var copyBtn = el('b64-copyBtn'); var fileInput = el('b64-fileinput'); var dropzone = el('b64-dropzone'); var inputLabel = el('b64-inputLabel'); var outLabel = el('b64-outputLabel'); var tabEncode = el('b64-tab-encode'); var tabDecode = el('b64-tab-decode'); var copyfb = el('b64-copyfb'); if (!runBtn) return; function showStatus(msg, type) { statusEl.textContent = msg; statusEl.className = 'b64status show b64status-' + type; clearTimeout(statusEl._t); statusEl._t = setTimeout(function() { statusEl.classList.remove('show'); }, 4500); } function humanSize(n) { if (n < 1024) return n + ' B'; if (n < 1048576) return (n / 1024).toFixed(1) + ' KB'; return (n / 1048576).toFixed(2) + ' MB'; } function setOutput(text) { outputEl.textContent = text; outsizeEl.textContent = humanSize(text.length); imgPreview.classList.remove('show'); } function resetOutput() { outputEl.innerHTML = '<span style="font-style:italic;font-size:12px;">Output will appear here...</span>'; outsizeEl.textContent = '-'; imgPreview.classList.remove('show'); previewImg.src = ''; } function setMode(m) { mode = m; tabEncode.classList.toggle('active', m === 'encode'); tabDecode.classList.toggle('active', m === 'decode'); if (m === 'encode') { inputEl.placeholder = 'Type or paste text to encode...'; inputLabel.textContent = 'Input Text'; outLabel.textContent = 'Base64 Output'; runBtn.textContent = 'Encode to Base64'; dropTitleEl.textContent = 'Drop a file or image to encode'; dropMetaEl.textContent = 'Any file type - No size limit'; } else { inputEl.placeholder = 'Paste your Base64 string to decode...'; inputLabel.textContent = 'Base64 Input'; outLabel.textContent = 'Decoded Output'; runBtn.textContent = 'Decode from Base64'; dropTitleEl.textContent = 'Drop a Base64 text file to decode'; dropMetaEl.textContent = '.txt file containing Base64 string'; } resetOutput(); } function handleFile(f) { b64file = f; dropTitleEl.textContent = f.name; dropMetaEl.textContent = humanSize(f.size) + ' - ' + (f.type || 'unknown'); inputEl.value = ''; charsEl.textContent = '0'; bytesEl.textContent = '0'; showStatus('File ready: ' + f.name, 'success'); } function encodeText(text) { if (!text) { showStatus('Input is empty.', 'error'); return; } try { var bytes = new TextEncoder().encode(text); var binary = ''; for (var i = 0; i < bytes.length; i++) binary += String.fromCharCode(bytes[i]); setOutput(btoa(binary)); showStatus('Encoded successfully.', 'success'); } catch(e) { showStatus('Encoding failed: ' + e.message, 'error'); } } function encodeFile(file) { var r = new FileReader(); r.onload = function(e) { var dataUrl = e.target.result; outputEl.textContent = dataUrl; outsizeEl.textContent = humanSize(dataUrl.split(',')[1].length); imgPreview.classList.remove('show'); showStatus('File encoded to Base64 data URI.', 'success'); }; r.onerror = function() { showStatus('Failed to read file.', 'error'); }; r.readAsDataURL(file); } function b64ToString(b64) { var binary = atob(b64); var bytes = new Uint8Array(binary.length); for (var i = 0; i < binary.length; i++) bytes[i] = binary.charCodeAt(i); return new TextDecoder().decode(bytes); } function b64ToBytes(b64) { var binary = atob(b64); var bytes = new Uint8Array(binary.length); for (var i = 0; i < binary.length; i++) bytes[i] = binary.charCodeAt(i); return bytes; } function detectMime(b) { if (!b || b.length < 4) return null; if (b[0] === 0xFF && b[1] === 0xD8) return 'image/jpeg'; if (b[0] === 0x89 && b[1] === 0x50 && b[2] === 0x4E && b[3] === 0x47) return 'image/png'; if (b[0] === 0x47 && b[1] === 0x49 && b[2] === 0x46) return 'image/gif'; if (b[0] === 0x52 && b[1] === 0x49 && b[2] === 0x46 && b[3] === 0x46) return 'image/webp'; return null; } function showImgPreview(dataUrl, mime) { previewImg.src = dataUrl; imgMeta.textContent = 'Type: ' + mime + ' - ' + humanSize(dataUrl.length); imgDl.href = dataUrl; imgDl.download = 'decoded-image.' + (mime.split('/')[1] || 'img'); imgPreview.classList.add('show'); } function decodeB64(str) { if (!str) { showStatus('Input is empty.', 'error'); return; } try { if (str.indexOf('data:') === 0) { var mime = str.split(';')[0].split(':')[1]; if (mime && mime.indexOf('image/') === 0) { showImgPreview(str, mime); outputEl.textContent = '[Image - see preview below]'; outsizeEl.textContent = humanSize(str.length); showStatus('Image decoded - preview below.', 'success'); } else { setOutput(b64ToString(str.split(',')[1])); showStatus('Decoded successfully.', 'success'); } return; } var clean = str.replace(/\s/g, ''); var rawBytes = b64ToBytes(clean); var detectedMime = detectMime(rawBytes); if (detectedMime) { var dataUrl = 'data:' + detectedMime + ';base64,' + clean; showImgPreview(dataUrl, detectedMime); outputEl.textContent = '[Image - see preview below]'; outsizeEl.textContent = humanSize(clean.length); showStatus('Image decoded - preview below.', 'success'); return; } setOutput(b64ToString(clean)); showStatus('Decoded successfully.', 'success'); } catch(e) { showStatus('Invalid Base64: ' + e.message, 'error'); } } inputEl.addEventListener('input', function() { charsEl.textContent = inputEl.value.length; bytesEl.textContent = new TextEncoder().encode(inputEl.value).length; }); tabEncode.addEventListener('click', function() { setMode('encode'); }); tabDecode.addEventListener('click', function() { setMode('decode'); }); dropzone.addEventListener('click', function() { fileInput.click(); }); dropzone.addEventListener('dragover', function(e) { e.preventDefault(); e.stopPropagation(); }); dropzone.addEventListener('drop', function(e) { e.preventDefault(); e.stopPropagation(); var f = e.dataTransfer && e.dataTransfer.files && e.dataTransfer.files[0]; if (f) handleFile(f); }); fileInput.addEventListener('change', function() { if (fileInput.files && fileInput.files[0]) handleFile(fileInput.files[0]); }); runBtn.addEventListener('click', function() { if (mode === 'encode') { if (b64file) encodeFile(b64file); else encodeText(inputEl.value); } else { if (b64file) { var r = new FileReader(); r.onload = function(ev) { decodeB64(ev.target.result.trim()); }; r.readAsText(b64file); } else { decodeB64(inputEl.value.trim()); } } }); clearBtn.addEventListener('click', function() { inputEl.value = ''; charsEl.textContent = '0'; bytesEl.textContent = '0'; b64file = null; fileInput.value = ''; dropTitleEl.textContent = mode === 'encode' ? 'Drop a file or image to encode' : 'Drop a Base64 text file to decode'; dropMetaEl.textContent = mode === 'encode' ? 'Any file type - No size limit' : '.txt file containing Base64 string'; resetOutput(); statusEl.classList.remove('show'); }); pasteBtn.addEventListener('click', function() { if (navigator.clipboard && navigator.clipboard.readText) { navigator.clipboard.readText().then(function(text) { inputEl.value = text; charsEl.textContent = text.length; bytesEl.textContent = new TextEncoder().encode(text).length; showStatus('Pasted successfully.', 'success'); }).catch(function() { showStatus('Paste failed - use Ctrl+V.', 'error'); }); } else { showStatus('Paste failed - use Ctrl+V.', 'error'); } }); copyBtn.addEventListener('click', function() { var text = outputEl.textContent || ''; if (!text || text.indexOf('Output will appear') !== -1 || text.indexOf('see preview') !== -1) { showStatus('Nothing to copy.', 'error'); return; } if (navigator.clipboard && navigator.clipboard.writeText) { navigator.clipboard.writeText(text).then(function() { copyfb.classList.add('show'); setTimeout(function() { copyfb.classList.remove('show'); }, 1800); }).catch(function() { showStatus('Copy failed - use Ctrl+C.', 'error'); }); } }); }());</script> <script> /(trident|msie)/i.test(navigator.userAgent)&&document.getElementById&&window.addEventListener&&window.addEventListener("hashchange",function(){var t,e=location.hash.substring(1);/^[A-z0-9_-]+$/.test(e)&&(t=document.getElementById(e))&&(/^(?:a|select|input|button|textarea)$/i.test(t.tagName)||(t.tabIndex=-1),t.focus())},!1); </script> <script id="astra-theme-js-js-extra"> var astra = {"break_point":"921","isRtl":"","is_scroll_to_id":"1","is_scroll_to_top":"","is_header_footer_builder_active":"1","responsive_cart_click":"flyout","is_dark_palette":""}; //# sourceURL=astra-theme-js-js-extra </script> <script src="https://fair.darekdari.com/wp-content/themes/astra/assets/js/minified/frontend.min.js?ver=4.13.0" id="astra-theme-js-js"></script> <script id="hostinger-reach-subscription-block-view-js-extra"> var hostinger_reach_subscription_block_data = {"endpoint":"https://fair.darekdari.com/wp-json/hostinger-reach/v1/contact","nonce":"d71ec74dda","translations":{"thanks":"Thanks for subscribing.","error":"Something went wrong. Please try again."}}; //# sourceURL=hostinger-reach-subscription-block-view-js-extra </script> <script src="https://fair.darekdari.com/wp-content/plugins/hostinger-reach/frontend/dist/blocks/subscription-view.js?ver=1779099946" id="hostinger-reach-subscription-block-view-js"></script> <script id="fairtools-x2w-nonce-js-before"> window.FAIRTOOLS_WP_NONCE = "d71ec74dda"; //# sourceURL=fairtools-x2w-nonce-js-before </script> <script id="wp-emoji-settings" type="application/json"> {"baseUrl":"https://s.w.org/images/core/emoji/17.0.2/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/17.0.2/svg/","svgExt":".svg","source":{"concatemoji":"https://fair.darekdari.com/wp-includes/js/wp-emoji-release.min.js?ver=6.9.4"}} </script> <script type="module"> /*! This file is auto-generated */ const a=JSON.parse(document.getElementById("wp-emoji-settings").textContent),o=(window._wpemojiSettings=a,"wpEmojiSettingsSupports"),s=["flag","emoji"];function i(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function c(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0);const a=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);return t.every((e,t)=>e===a[t])}function p(e,t){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var n=e.getImageData(16,16,1,1);for(let e=0;e<n.data.length;e++)if(0!==n.data[e])return!1;return!0}function u(e,t,n,a){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\udde8\ud83c\uddf6","\ud83c\udde8\u200b\ud83c\uddf6")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!a(e,"\ud83e\u1fac8")}return!1}function f(e,t,n,a){let r;const o=(r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):document.createElement("canvas")).getContext("2d",{willReadFrequently:!0}),s=(o.textBaseline="top",o.font="600 32px Arial",{});return e.forEach(e=>{s[e]=t(o,e,n,a)}),s}function r(e){var t=document.createElement("script");t.src=e,t.defer=!0,document.head.appendChild(t)}a.supports={everything:!0,everythingExceptFlag:!0},new Promise(t=>{let n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),c.toString(),p.toString()].join(",")+"));",a=new Blob([e],{type:"text/javascript"});const r=new Worker(URL.createObjectURL(a),{name:"wpTestEmojiSupports"});return void(r.onmessage=e=>{i(n=e.data),r.terminate(),t(n)})}catch(e){}i(n=f(s,u,c,p))}t(n)}).then(e=>{for(const n in e)a.supports[n]=e[n],a.supports.everything=a.supports.everything&&a.supports[n],"flag"!==n&&(a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&a.supports[n]);var t;a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&!a.supports.flag,a.supports.everything||((t=a.source||{}).concatemoji?r(t.concatemoji):t.wpemoji&&t.twemoji&&(r(t.twemoji),r(t.wpemoji)))}); //# sourceURL=https://fair.darekdari.com/wp-includes/js/wp-emoji-loader.min.js </script> </body> </html> <!-- Page cached by LiteSpeed Cache 7.8.1 on 2026-05-26 13:48:20 -->
