Skip to content

Instantly share code, notes, and snippets.

@mode-mercury
Created June 5, 2025 17:38
Show Gist options
  • Select an option

  • Save mode-mercury/4d0ec689b6d854a811261339f1b4e1ea to your computer and use it in GitHub Desktop.

Select an option

Save mode-mercury/4d0ec689b6d854a811261339f1b4e1ea to your computer and use it in GitHub Desktop.
Untitled
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mobile Gematria Analyzer with Full Concordance</title>
<style>
* {
box-sizing: border-box;
}
body {
background-color: #ffffff;
color: #333;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
margin: 0;
padding: 10px;
line-height: 1.4;
}
.container {
max-width: 100%;
margin: 0 auto;
padding: 10px;
}
h1 {
color: #333;
font-size: 1.5rem;
margin: 10px 0;
text-align: center;
}
h2, h3, h4 {
color: #333;
font-size: 1.2rem;
margin: 15px 0 10px 0;
}
/* Mobile-first responsive design */
.input-group {
margin-bottom: 15px;
}
input[type="search"], input[type="number"], select, textarea {
width: 100%;
padding: 12px;
margin: 8px 0;
border: 2px solid #ddd;
border-radius: 8px;
font-size: 16px; /* Prevents zoom on iOS */
background-color: #fafafa;
touch-action: manipulation;
}
input:focus, select:focus, textarea:focus {
outline: none;
border-color: #5D5CDE;
box-shadow: 0 0 0 3px rgba(93, 92, 222, 0.1);
}
textarea {
min-height: 120px;
resize: vertical;
}
button {
padding: 12px 16px;
background: #4CAF50;
border: none;
border-radius: 8px;
color: white;
cursor: pointer;
font-size: 16px;
margin: 5px;
min-height: 44px; /* iOS touch target minimum */
touch-action: manipulation;
transition: all 0.2s ease;
}
button:hover, button:focus {
background: #45a049;
transform: translateY(-1px);
}
button:active {
transform: translateY(0);
}
.full-width-btn {
width: 100%;
margin: 10px 0;
}
.debug-btn {
background: #FF9800;
}
.debug-btn:hover {
background: #F57C00;
}
/* Enhanced data table for mobile */
.data-table {
width: 100%;
border-collapse: collapse;
margin-top: 15px;
font-size: 13px;
overflow-x: auto;
display: block;
white-space: nowrap;
}
.data-table thead,
.data-table tbody,
.data-table tr {
display: block;
}
.data-table thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
.data-table tr {
border: 2px solid #ddd;
border-radius: 8px;
margin-bottom: 15px;
padding: 10px;
background-color: #fafafa;
position: relative;
display: flex;
flex-direction: column;
}
.data-table td {
border: none;
position: relative;
padding: 8px 0;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.data-table td:before {
content: attr(data-label);
font-weight: bold;
color: #666;
font-size: 11px;
text-transform: uppercase;
margin-right: 10px;
min-width: 60px;
letter-spacing: 0.5px;
}
/* Gematria type labels */
.gematria-type {
font-size: 10px;
background: #5D5CDE;
color: white;
padding: 2px 6px;
border-radius: 4px;
font-weight: bold;
margin-right: 5px;
}
.type-jg { background: #E91E63; } /* Jewish Gematria */
.type-eg { background: #9C27B0; } /* English Gematria */
.type-sg { background: #3F51B5; } /* Simple Gematria */
.type-alw { background: #009688; } /* ALW Cipher */
.type-prime { background: #FF5722; } /* Prime Cipher */
/* Enhanced cosmic symbols for mobile */
.cosmic-symbols {
display: flex;
gap: 3px;
font-size: 14px;
margin: 5px 0;
flex-wrap: wrap;
}
.cosmic-symbol {
padding: 2px 4px;
border-radius: 4px;
font-size: 12px;
font-weight: bold;
}
.planet-symbol {
background: rgba(103, 58, 183, 0.2);
color: #673AB7;
}
.element-symbol {
padding: 2px 4px;
border-radius: 4px;
font-weight: bold;
}
.element-symbol.fire {
background: rgba(229, 57, 53, 0.2);
color: #e53935;
}
.element-symbol.water {
background: rgba(30, 136, 229, 0.2);
color: #1e88e5;
}
.element-symbol.air {
background: rgba(255, 193, 7, 0.2);
color: #ffc107;
}
.element-symbol.earth {
background: rgba(76, 175, 80, 0.2);
color: #4caf50;
}
.zodiac-symbol {
background: rgba(0, 150, 136, 0.2);
color: #009688;
}
.rune-symbol {
background: rgba(123, 79, 79, 0.2);
color: #7b4f4f;
font-family: 'Arial Unicode MS', sans-serif;
}
/* Concordance analysis line */
.concordance-line {
background: linear-gradient(90deg, #f8f9fa 0%, #e9ecef 100%);
border-left: 4px solid #5D5CDE;
padding: 8px;
margin: 5px 0;
border-radius: 0 6px 6px 0;
font-size: 11px;
line-height: 1.3;
}
.concordance-item {
display: inline-block;
margin: 2px 4px;
padding: 2px 6px;
background: rgba(93, 92, 222, 0.1);
border-radius: 4px;
font-weight: 500;
}
.biblical-ref {
background: rgba(233, 30, 99, 0.1);
color: #ad1457;
}
.prime-factor {
background: rgba(255, 87, 34, 0.1);
color: #d84315;
}
.digital-root {
background: rgba(76, 175, 80, 0.1);
color: #388e3c;
}
/* Special number highlighting */
.angel-number {
background: linear-gradient(45deg, #ffd700, #ffed4e) !important;
box-shadow: 0 2px 8px rgba(255, 215, 0, 0.4);
border: 2px solid #ffd700;
}
.mirror-number {
background: linear-gradient(45deg, #9370db, #ba68c8) !important;
box-shadow: 0 2px 8px rgba(147, 112, 219, 0.4);
border: 2px solid #9370db;
}
.special-phrase {
background: linear-gradient(45deg, #fff3e0, #ffe0b2);
border-left: 4px solid #ff9800;
padding: 4px 8px;
border-radius: 0 6px 6px 0;
font-weight: bold;
}
/* Charts container - mobile optimized */
.chart-container {
margin-top: 20px;
padding: 15px;
border: 2px solid #ddd;
border-radius: 8px;
display: flex;
flex-direction: column;
gap: 20px;
}
.chart-item {
width: 100%;
height: 250px;
background: #fafafa;
border-radius: 8px;
padding: 10px;
}
/* Tabs - mobile optimized */
.tabs {
display: flex;
margin-bottom: 20px;
border-bottom: 2px solid #ddd;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.tab-btn {
padding: 12px 16px;
background: none;
border: none;
border-bottom: 3px solid transparent;
cursor: pointer;
font-size: 14px;
color: #666;
white-space: nowrap;
min-width: 120px;
touch-action: manipulation;
}
.tab-btn.active {
border-bottom: 3px solid #4CAF50;
color: #333;
font-weight: bold;
background: rgba(76, 175, 80, 0.1);
}
.tab-content {
display: none;
}
.tab-content.active {
display: block;
}
/* Progress bar */
.progress-container {
width: 100%;
background-color: #f1f1f1;
border-radius: 8px;
margin: 15px 0;
overflow: hidden;
}
.progress-bar {
height: 25px;
background: linear-gradient(90deg, #4CAF50, #8BC34A);
border-radius: 8px;
width: 0%;
transition: width 0.3s ease;
color: white;
text-align: center;
line-height: 25px;
font-size: 13px;
font-weight: bold;
}
/* Value boxes */
.value-box {
border: 2px solid #ddd;
border-radius: 8px;
padding: 15px;
margin-bottom: 20px;
background: #fafafa;
}
.value-header {
font-weight: bold;
margin-bottom: 15px;
padding-bottom: 8px;
border-bottom: 2px solid #ddd;
font-size: 16px;
}
/* Status indicators */
.loading {
text-align: center;
padding: 30px;
font-size: 16px;
}
.error {
color: #d32f2f;
padding: 15px;
margin: 15px 0;
background-color: #ffebee;
border-radius: 8px;
border-left: 4px solid #d32f2f;
}
.success {
color: #2e7d32;
padding: 15px;
margin: 15px 0;
background-color: #e8f5e9;
border-radius: 8px;
border-left: 4px solid #2e7d32;
}
/* Anagram results - mobile optimized */
.anagram-result {
background: linear-gradient(135deg, #e3f2fd, #f3e5f5);
border: 2px solid #5D5CDE;
border-radius: 8px;
padding: 15px;
margin: 15px 0;
}
.anagram-original {
font-weight: bold;
color: #5D5CDE;
margin-bottom: 10px;
font-size: 14px;
}
.anagram-list {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 10px;
}
.anagram-word {
background: #4CAF50;
color: white;
padding: 6px 10px;
border-radius: 6px;
font-size: 13px;
font-weight: bold;
cursor: pointer;
transition: all 0.2s ease;
touch-action: manipulation;
}
.anagram-word:hover, .anagram-word:focus {
background: #45a049;
transform: scale(1.05);
}
/* Frequency analysis - mobile optimized */
.frequency-box {
background: linear-gradient(135deg, #f8f9fa, #e9ecef);
border: 2px solid #dee2e6;
border-radius: 8px;
padding: 15px;
margin: 15px 0;
}
.frequency-title {
font-weight: bold;
margin-bottom: 10px;
color: #495057;
font-size: 14px;
}
.frequency-item {
display: inline-block;
margin: 3px;
padding: 4px 8px;
border-radius: 6px;
font-size: 11px;
font-weight: bold;
touch-action: manipulation;
}
.freq-high {
background: #dc3545;
color: white;
box-shadow: 0 2px 4px rgba(220, 53, 69, 0.3);
}
.freq-medium {
background: #ffc107;
color: black;
box-shadow: 0 2px 4px rgba(255, 193, 7, 0.3);
}
.freq-low {
background: #28a745;
color: white;
box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}
/* Dark mode */
@media (prefers-color-scheme: dark) {
body {
background-color: #121212;
color: #e0e0e0;
}
h1, h2, h3, h4 {
color: #f0f0f0;
}
input[type="search"], input[type="number"], select, textarea {
background-color: #1e1e1e;
color: #e0e0e0;
border-color: #444;
}
.data-table tr {
background-color: #1e1e1e;
border-color: #444;
}
.value-box, .frequency-box, .chart-container {
background-color: #1e1e1e;
border-color: #444;
}
.tab-btn.active {
background: rgba(76, 175, 80, 0.2);
}
.concordance-line {
background: linear-gradient(90deg, #1e1e1e 0%, #2e2e2e 100%);
}
.anagram-result {
background: linear-gradient(135deg, #1a237e, #4a148c);
}
}
/* Responsive breakpoints */
@media (min-width: 768px) {
.container {
max-width: 1200px;
padding: 20px;
}
h1 {
font-size: 2rem;
}
.data-table {
display: table;
font-size: 14px;
}
.data-table thead tr {
position: static;
display: table-row;
}
.data-table tr {
display: table-row;
border: 1px solid #ddd;
margin-bottom: 0;
padding: 0;
flex-direction: row;
}
.data-table td {
display: table-cell;
padding: 8px;
border: 1px solid #ddd;
}
.data-table td:before {
display: none;
}
.chart-container {
flex-direction: row;
flex-wrap: wrap;
}
.chart-item {
flex: 1 1 300px;
min-width: 280px;
max-width: 45%;
height: 350px;
}
}
</style>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
<div class="container">
<h1>🔮📱 Mobile Gematria Analyzer</h1>
<div class="tabs">
<button type="button" id="btn-search-tab" class="tab-btn active">🔍 Analysis</button>
<button type="button" id="btn-anagrams-tab" class="tab-btn">🎯 Word Games</button>
<button type="button" id="btn-debug-tab" class="tab-btn">🛠️ Debug</button>
</div>
<div id="search-tab" class="tab-content active">
<div class="input-group">
<label for="proxySelect">Data Source:</label>
<select id="proxySelect">
<option value="allOrigins">🌐 AllOrigins Proxy</option>
<option value="corsProxy">🔗 CorsProxy.io</option>
<option value="thingproxy">⚡ ThingProxy</option>
</select>
<label for="word">Phrase to Analyze:</label>
<input type="search"
id="word"
placeholder="Enter phrase (e.g., 'divine light')"
maxlength="200"
value="divine light">
<button type="button" id="analyze-btn" class="full-width-btn">🔮 Analyze with Full Concordance</button>
</div>
<div id="progress-container" class="progress-container" style="display: none;">
<div id="progress-bar" class="progress-bar">0%</div>
</div>
<div id="charts" class="chart-container" style="display: none;"></div>
<div id="frequency-analysis"></div>
<div id="results"></div>
</div>
<div id="anagrams-tab" class="tab-content">
<div class="value-box">
<div class="value-header">🎯 Smart Word Transformer</div>
<p>Transform the actual phrases from your analysis results!</p>
<button type="button" id="load-results-btn" class="full-width-btn">📥 Load Phrases from Results</button>
<label for="anagram-input">Current Phrases:</label>
<textarea id="anagram-input" placeholder="Phrases will appear here from your analysis results"></textarea>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 15px 0;">
<button type="button" id="generate-anagrams-btn">🔀 Anagrams</button>
<button type="button" id="caesar-cipher-btn">🏛️ Caesar</button>
<button type="button" id="reverse-words-btn">↩️ Reverse</button>
<button type="button" id="pig-latin-btn">🐷 Pig Latin</button>
</div>
<div id="anagram-results"></div>
</div>
</div>
<div id="debug-tab" class="tab-content">
<div class="value-box">
<div class="value-header">🛠️ System Diagnostics</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 15px 0;">
<button type="button" id="test-proxies-btn">🔍 Test Proxies</button>
<button type="button" id="clear-debug-btn">🗑️ Clear Log</button>
</div>
<div id="debug-output" style="background: #1e1e1e; color: #0f0; padding: 15px; border-radius: 8px; font-family: monospace; font-size: 12px; max-height: 300px; overflow-y: auto;">
System ready for diagnostics...
</div>
</div>
</div>
</div>
<script>
// Proxy configuration
const PROXY_CONFIGS = {
allOrigins: { url: 'https://api.allorigins.win/raw?url=', headers: {} },
corsProxy: { url: 'https://corsproxy.io/?', headers: {} },
thingproxy: { url: 'https://thingproxy.freeboard.io/fetch/', headers: {} },
bypass: { url: 'bypass', headers: {} }
};
let debugOutput = null;
let charts = [];
let analysisResults = []; // Store results for anagram processing
// Enhanced cosmic symbols with more associations
const COSMIC_SYMBOLS = {
planets: [
{ symbol: '☿', name: 'Mercury', minValue: 1, maxValue: 260, element: '🜁', zodiac: '♊' },
{ symbol: '♀', name: 'Venus', minValue: 261, maxValue: 520, element: '🜃', zodiac: '♉' },
{ symbol: '⊕', name: 'Earth', minValue: 521, maxValue: 780, element: '🜃', zodiac: '♍' },
{ symbol: '♂', name: 'Mars', minValue: 781, maxValue: 1040, element: '🜂', zodiac: '♈' },
{ symbol: '♃', name: 'Jupiter', minValue: 1041, maxValue: 1300, element: '🜂', zodiac: '♐' },
{ symbol: '♄', name: 'Saturn', minValue: 1301, maxValue: 1560, element: '🜃', zodiac: '♑' },
{ symbol: '♅', name: 'Uranus', minValue: 1561, maxValue: 1820, element: '🜁', zodiac: '♒' },
{ symbol: '♆', name: 'Neptune', minValue: 1821, maxValue: 2080, element: '🜄', zodiac: '♓' },
{ symbol: '♇', name: 'Pluto', minValue: 2081, maxValue: 2340, element: '🜂', zodiac: '♏' },
{ symbol: '☉', name: 'Sun', minValue: 0, maxValue: 120, element: '🜂', zodiac: '♌' },
{ symbol: '☽', name: 'Moon', minValue: 121, maxValue: 240, element: '🜄', zodiac: '♋' }
],
elements: [
{ symbol: '🜂', name: 'Fire' }, { symbol: '🜄', name: 'Water' },
{ symbol: '🜁', name: 'Air' }, { symbol: '🜃', name: 'Earth' }
],
zodiac: [
{ symbol: '♈', name: 'Aries', range: [1, 30] }, { symbol: '♉', name: 'Taurus', range: [31, 60] },
{ symbol: '♊', name: 'Gemini', range: [61, 90] }, { symbol: '♋', name: 'Cancer', range: [91, 120] },
{ symbol: '♌', name: 'Leo', range: [121, 150] }, { symbol: '♍', name: 'Virgo', range: [151, 180] },
{ symbol: '♎', name: 'Libra', range: [181, 210] }, { symbol: '♏', name: 'Scorpio', range: [211, 240] },
{ symbol: '♐', name: 'Sagittarius', range: [241, 270] }, { symbol: '♑', name: 'Capricorn', range: [271, 300] },
{ symbol: '♒', name: 'Aquarius', range: [301, 330] }, { symbol: '♓', name: 'Pisces', range: [331, 360] }
]
};
const EXTENDED_SYMBOLS = {
runes: ['ᚠ', 'ᚢ', 'ᚦ', 'ᚨ', 'ᚱ', 'ᚲ', 'ᚷ', 'ᚹ', 'ᚺ', 'ᚾ', 'ᛁ', 'ᛃ', 'ᛇ', 'ᛈ', 'ᛉ', 'ᛊ', 'ᛏ', 'ᛒ', 'ᛖ', 'ᛗ']
};
// Biblical number significance database
const BIBLICAL_NUMBERS = {
3: "Trinity, Divine Completeness",
7: "Spiritual Perfection, God's Number",
12: "Divine Government, Israel",
40: "Testing, Trial, Probation",
144: "God's Ultimate in Creation",
666: "Number of the Beast",
777: "God's Perfect Number",
888: "Jesus (Greek Gematria)",
153: "Sons of God, Resurrection"
};
// Prime factorization function
function getPrimeFactors(n) {
const factors = [];
let d = 2;
while (d * d <= n) {
while (n % d === 0) {
factors.push(d);
n /= d;
}
d++;
}
if (n > 1) factors.push(n);
return factors;
}
// Digital root calculation
function getDigitalRoot(num) {
while (num >= 10) {
num = num.toString().split('').reduce((sum, digit) => sum + parseInt(digit), 0);
}
return num;
}
// Check for special number patterns
function getSpecialPatterns(num) {
const patterns = [];
const str = num.toString();
// Angel numbers
if (/^(\d)\1+$/.test(str)) patterns.push(`👼 Angel Number (${str[0]} repeated)`);
// Palindromes
if (str === str.split('').reverse().join('') && str.length > 1) {
patterns.push(`🪞 Mirror Number`);
}
// Sequential
if (str.length >= 3) {
let sequential = true;
for (let i = 1; i < str.length; i++) {
if (parseInt(str[i]) !== parseInt(str[i-1]) + 1) {
sequential = false;
break;
}
}
if (sequential) patterns.push(`📈 Sequential Number`);
}
return patterns;
}
// Enhanced concordance analysis
function generateConcordance(phrase, value, type) {
const concordanceItems = [];
// Digital root
const digitalRoot = getDigitalRoot(value);
concordanceItems.push(`<span class="digital-root">Root: ${digitalRoot}</span>`);
// Prime factors
if (value > 1) {
const primes = getPrimeFactors(value);
if (primes.length > 1) {
concordanceItems.push(`<span class="prime-factor">Primes: ${primes.join('×')}</span>`);
}
}
// Biblical significance
if (BIBLICAL_NUMBERS[value]) {
concordanceItems.push(`<span class="biblical-ref">📖 ${BIBLICAL_NUMBERS[value]}</span>`);
}
// Special patterns
const patterns = getSpecialPatterns(value);
patterns.forEach(pattern => {
concordanceItems.push(`<span class="concordance-item">${pattern}</span>`);
});
// Word analysis
if (phrase && typeof phrase === 'string') {
const wordCount = phrase.split(/\s+/).length;
const charCount = phrase.replace(/\s/g, '').length;
concordanceItems.push(`<span class="concordance-item">📝 ${wordCount}W ${charCount}C</span>`);
// Vowel/consonant ratio
const vowels = (phrase.match(/[aeiouAEIOU]/g) || []).length;
const consonants = charCount - vowels;
if (vowels > 0 && consonants > 0) {
const ratio = (vowels / consonants).toFixed(2);
concordanceItems.push(`<span class="concordance-item">🗣️ V/C: ${ratio}</span>`);
}
}
// Numerological meanings
const meanings = {
1: "Leadership, Independence", 2: "Partnership, Balance", 3: "Creativity, Expression",
4: "Stability, Foundation", 5: "Freedom, Adventure", 6: "Love, Responsibility",
7: "Spirituality, Wisdom", 8: "Material Success", 9: "Completion, Service"
};
if (meanings[digitalRoot]) {
concordanceItems.push(`<span class="concordance-item">✨ ${meanings[digitalRoot]}</span>`);
}
return concordanceItems.join(' ');
}
// Utility functions
function reduceNumber(num) {
if (num === 0) return 0;
return ((num - 1) % 9) + 1;
}
function getCosmicSymbols(value) {
const numValue = parseInt(value) || 0;
let planetSymbol = COSMIC_SYMBOLS.planets[9].symbol;
COSMIC_SYMBOLS.planets.forEach(planet => {
if (numValue >= planet.minValue && numValue <= planet.maxValue) {
planetSymbol = planet.symbol;
}
});
let elementSymbol = COSMIC_SYMBOLS.elements[numValue % 4].symbol;
const zodiacValue = (numValue % 360) || 360;
let zodiacSymbol = COSMIC_SYMBOLS.zodiac[0].symbol;
COSMIC_SYMBOLS.zodiac.forEach(sign => {
if (zodiacValue >= sign.range[0] && zodiacValue <= sign.range[1]) {
zodiacSymbol = sign.symbol;
}
});
return { planet: planetSymbol, element: elementSymbol, zodiac: zodiacSymbol };
}
function getExtendedSymbols(value) {
const num = parseInt(value) || 0;
const reduced = reduceNumber(num);
return { rune: EXTENDED_SYMBOLS.runes[reduced] || EXTENDED_SYMBOLS.runes[0] };
}
function isAngelNumber(number) {
const numStr = number.toString();
if (/^(\d)\1+$/.test(numStr)) return true;
const angelNumbers = [111, 222, 333, 444, 555, 666, 777, 888, 999, 1111, 2222, 3333, 4444, 5555];
return angelNumbers.includes(parseInt(numStr));
}
function isMirrorNumber(number) {
const numStr = number.toString();
return numStr === numStr.split('').reverse().join('') && numStr.length > 1;
}
// Debug functions
function debugLog(message) {
console.log(message);
if (debugOutput) {
debugOutput.innerHTML += `<div>${new Date().toLocaleTimeString()}: ${message}</div>`;
debugOutput.scrollTop = debugOutput.scrollHeight;
}
}
async function testProxy(proxyKey) {
if (proxyKey === 'bypass') return true;
try {
const response = await fetch(PROXY_CONFIGS[proxyKey].url + encodeURIComponent('https://httpbin.org/get'), {
signal: AbortSignal.timeout(5000)
});
return response.ok;
} catch {
return false;
}
}
// Enhanced demo data generation
function generateDemoData(searchTerm) {
debugLog(`Generating enhanced demo data for: ${searchTerm}`);
function simpleGematria(text) {
return text.toLowerCase().split('').reduce((sum, char) => {
const code = char.charCodeAt(0);
return code >= 97 && code <= 122 ? sum + (code - 96) : sum;
}, 0);
}
function englishGematria(text) { return simpleGematria(text) * 6; }
function jewishGematria(text) {
const values = {
'a': 1, 'b': 2, 'c': 3, 'd': 4, 'e': 5, 'f': 6, 'g': 7, 'h': 8, 'i': 9,
'j': 10, 'k': 20, 'l': 30, 'm': 40, 'n': 50, 'o': 60, 'p': 70, 'q': 80, 'r': 90,
's': 100, 't': 200, 'u': 300, 'v': 400, 'w': 500, 'x': 600, 'y': 700, 'z': 800
};
return text.toLowerCase().split('').reduce((sum, char) => sum + (values[char] || 0), 0);
}
const words = searchTerm.split(' ');
const variations = [
searchTerm,
...words,
`holy ${searchTerm}`,
`sacred ${searchTerm}`,
`divine power`,
`cosmic energy`,
`angelic light`,
`spiritual wisdom`,
`ancient knowledge`,
`mystical truth`,
...words.map(w => `${w} of God`),
...words.map(w => `eternal ${w}`)
];
const demoData = variations.map((phrase, index) => [
String(1000 + index),
String(jewishGematria(phrase)),
phrase,
String(englishGematria(phrase)),
String(simpleGematria(phrase))
]);
const tableRows = demoData.map(row =>
`<tr>${row.map(cell => `<td>${cell}</td>`).join('')}</tr>`
).join('');
return `<html><body><table><tbody>${tableRows}</tbody></table></body></html>`;
}
// Enhanced data processing with mobile-optimized table
function processAndDisplayData(html, searchTerm) {
debugLog('Processing data for mobile display...');
const parser = new DOMParser();
const doc = parser.parseFromString(html, 'text/html');
let tableData = [];
doc.querySelectorAll('table').forEach(table => {
table.querySelectorAll('tr').forEach(row => {
const cells = row.querySelectorAll('td');
if (cells.length > 0) {
const rowData = Array.from(cells).map(cell => cell.textContent.trim());
if (rowData.some(text => text.length > 0)) {
tableData.push(rowData);
}
}
});
});
if (tableData.length === 0) {
return '<div class="error">📱 No data found in response</div>';
}
// Store for anagram processing
analysisResults = tableData.map(row => row[2]).filter(phrase => phrase && phrase.length > 0);
createAnalysisCharts(tableData, searchTerm);
createFrequencyAnalysis(tableData, searchTerm);
let html_result = `<h3>📊 Analysis: "${searchTerm}"</h3>`;
html_result += `<div class="success">📱 Found ${tableData.length} entries • Optimized for mobile</div>`;
// Mobile-optimized table
html_result += `<div class="data-table">`;
tableData.forEach(row => {
while (row.length < 5) row.push('0');
if (row.length > 5) row.length = 5;
const [id, jewish, phrase, english, simple] = row;
// Generate cosmic symbols and concordance
const jewishSymbols = getCosmicSymbols(jewish);
const englishSymbols = getCosmicSymbols(english);
const simpleSymbols = getCosmicSymbols(simple);
const extendedSymbols = getExtendedSymbols(jewish);
const isSpecialPhrase = phrase && ['angel', 'mirror', 'divine', 'sacred', 'holy', 'cosmic'].some(word =>
phrase.toLowerCase().includes(word)
);
const isAngel = isAngelNumber(jewish);
const isMirror = isMirrorNumber(jewish);
const specialClass = isAngel ? 'angel-number' : isMirror ? 'mirror-number' : '';
const phraseClass = isSpecialPhrase ? 'special-phrase' : '';
html_result += `
<div class="data-table tr ${specialClass}">
<div class="data-table td" data-label="ID">${id}</div>
<div class="data-table td" data-label="JG">
<span class="gematria-type type-jg">JG</span>
<strong>${jewish}</strong>
<div class="cosmic-symbols">
<span class="cosmic-symbol planet-symbol">${jewishSymbols.planet}</span>
<span class="cosmic-symbol element-symbol ${getElementClass(jewishSymbols.element)}">${jewishSymbols.element}</span>
<span class="cosmic-symbol zodiac-symbol">${jewishSymbols.zodiac}</span>
<span class="cosmic-symbol rune-symbol">${extendedSymbols.rune}</span>
</div>
</div>
<div class="data-table td" data-label="Phrase">
<strong class="${phraseClass}">${phrase}</strong>
</div>
<div class="data-table td" data-label="EG">
<span class="gematria-type type-eg">EG</span>
<strong>${english}</strong>
<div class="cosmic-symbols">
<span class="cosmic-symbol planet-symbol">${englishSymbols.planet}</span>
<span class="cosmic-symbol element-symbol ${getElementClass(englishSymbols.element)}">${englishSymbols.element}</span>
<span class="cosmic-symbol zodiac-symbol">${englishSymbols.zodiac}</span>
</div>
</div>
<div class="data-table td" data-label="SG">
<span class="gematria-type type-sg">SG</span>
<strong>${simple}</strong>
<div class="cosmic-symbols">
<span class="cosmic-symbol planet-symbol">${simpleSymbols.planet}</span>
<span class="cosmic-symbol element-symbol ${getElementClass(simpleSymbols.element)}">${simpleSymbols.element}</span>
<span class="cosmic-symbol zodiac-symbol">${simpleSymbols.zodiac}</span>
</div>
</div>
<div class="concordance-line">
${generateConcordance(phrase, parseInt(jewish), 'jewish')}
</div>
</div>
`;
});
html_result += `</div>`;
return html_result;
}
function getElementClass(elementSymbol) {
const elementMap = {
'🜂': 'fire',
'🜄': 'water',
'🜁': 'air',
'🜃': 'earth'
};
return elementMap[elementSymbol] || '';
}
// Charts and frequency analysis (simplified for mobile)
function createAnalysisCharts(data, searchTerm) {
const chartsContainer = document.getElementById('charts');
if (!chartsContainer) return;
chartsContainer.style.display = 'flex';
chartsContainer.innerHTML = '';
// Value distribution chart
const chartDiv = document.createElement('div');
chartDiv.className = 'chart-item';
chartsContainer.appendChild(chartDiv);
const valueCountMap = {};
data.forEach(row => {
if (row.length >= 2 && !isNaN(parseInt(row[1]))) {
const value = parseInt(row[1]);
valueCountMap[value] = (valueCountMap[value] || 0) + 1;
}
});
const sortedValues = Object.keys(valueCountMap).sort((a, b) => parseInt(a) - parseInt(b));
const canvas = document.createElement('canvas');
chartDiv.appendChild(canvas);
new Chart(canvas, {
type: 'bar',
data: {
labels: sortedValues,
datasets: [{
label: 'Frequency',
data: sortedValues.map(val => valueCountMap[val]),
backgroundColor: 'rgba(76, 175, 80, 0.8)',
borderColor: 'rgba(76, 175, 80, 1)',
borderWidth: 2
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
title: {
display: true,
text: `📊 Values for "${searchTerm}"`
}
}
}
});
}
function createFrequencyAnalysis(data, searchTerm) {
const container = document.getElementById('frequency-analysis');
if (!container) return;
const wordFreq = {};
data.forEach(row => {
if (row[2]) {
row[2].toLowerCase().replace(/[^\w\s]/g, '').split(/\s+/).forEach(word => {
if (word.length > 2) {
wordFreq[word] = (wordFreq[word] || 0) + 1;
}
});
}
});
const topWords = Object.entries(wordFreq)
.sort((a, b) => b[1] - a[1])
.slice(0, 10);
container.innerHTML = `
<div class="frequency-box">
<div class="frequency-title">📱 Top Words in "${searchTerm}"</div>
<div>
${topWords.map(([word, count]) => {
const freqClass = count >= 3 ? 'freq-high' : count >= 2 ? 'freq-medium' : 'freq-low';
return `<span class="frequency-item ${freqClass}">${word} (${count})</span>`;
}).join('')}
</div>
</div>
`;
}
// Main analysis function
async function analyzePhrase() {
const phrase = document.getElementById('word').value.trim();
const resultsDiv = document.getElementById('results');
if (!phrase) {
resultsDiv.innerHTML = '<div class="error">📱 Please enter a phrase</div>';
return;
}
debugLog(`📱 Starting mobile analysis: "${phrase}"`);
resultsDiv.innerHTML = '<div class="loading">🔮📱 Analyzing with full concordance...</div>';
updateProgress(50);
try {
let html;
const selectedProxy = document.getElementById('proxySelect').value;
if (selectedProxy === 'bypass') {
html = generateDemoData(phrase);
} else {
const url = `https://www.gematrix.org/?word=${encodeURIComponent(phrase)}`;
const proxyConfig = PROXY_CONFIGS[selectedProxy];
const response = await fetch(proxyConfig.url + encodeURIComponent(url), {
signal: AbortSignal.timeout(15000)
});
if (!response.ok) throw new Error(`HTTP ${response.status}`);
html = await response.text();
}
updateProgress(80);
const results = processAndDisplayData(html, phrase);
resultsDiv.innerHTML = results;
updateProgress(100);
debugLog('📱 Mobile analysis complete');
} catch (error) {
debugLog(`❌ Error: ${error.message}`);
resultsDiv.innerHTML = `<div class="error">📱 ${error.message}<br>Using demo data...</div>`;
const demoResults = processAndDisplayData(generateDemoData(phrase), phrase);
resultsDiv.innerHTML += demoResults;
}
setTimeout(() => {
document.getElementById('progress-container').style.display = 'none';
}, 1000);
}
function updateProgress(percentage) {
const container = document.getElementById('progress-container');
const bar = document.getElementById('progress-bar');
if (container && bar) {
container.style.display = 'block';
bar.style.width = `${percentage}%`;
bar.textContent = `${percentage}%`;
}
}
// Enhanced anagram functions that work with actual phrases
function loadResultsToAnagrams() {
const anagramInput = document.getElementById('anagram-input');
if (analysisResults.length === 0) {
anagramInput.value = 'Please run an analysis first to get phrases!';
return;
}
// Use the actual phrases from results
anagramInput.value = analysisResults.slice(0, 10).join('\n');
debugLog(`📱 Loaded ${analysisResults.length} phrases for word games`);
}
function generateAnagrams(word, maxResults = 8) {
if (!word || word.length < 3) return [];
const cleanWord = word.toLowerCase().replace(/[^a-z]/g, '');
if (cleanWord.length < 3) return [];
const anagrams = new Set();
const chars = cleanWord.split('');
for (let i = 0; i < maxResults * 15; i++) {
const shuffled = [...chars];
for (let j = shuffled.length - 1; j > 0; j--) {
const k = Math.floor(Math.random() * (j + 1));
[shuffled[j], shuffled[k]] = [shuffled[k], shuffled[j]];
}
const anagram = shuffled.join('');
if (anagram !== cleanWord) anagrams.add(anagram);
if (anagrams.size >= maxResults) break;
}
return Array.from(anagrams);
}
function applyCaesarCipher(text, shift = 3) {
return text.replace(/[a-zA-Z]/g, char => {
const isUpperCase = char === char.toUpperCase();
const code = char.toLowerCase().charCodeAt(0);
const shifted = ((code - 97 + shift) % 26) + 97;
const result = String.fromCharCode(shifted);
return isUpperCase ? result.toUpperCase() : result;
});
}
function reverseWords(text) {
return text.split(/\s+/).map(word => word.split('').reverse().join('')).join(' ');
}
function toPigLatin(text) {
return text.replace(/\b[a-zA-Z]+\b/g, word => {
const vowelIndex = word.search(/[aeiouAEIOU]/);
if (vowelIndex === 0) return word + 'way';
if (vowelIndex > 0) return word.slice(vowelIndex) + word.slice(0, vowelIndex) + 'ay';
return word + 'ay';
});
}
// Tab functions
function openTab(tabId) {
document.querySelectorAll('.tab-content').forEach(tab => tab.classList.remove('active'));
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
document.getElementById(tabId)?.classList.add('active');
document.querySelector(`#btn-${tabId}`)?.classList.add('active');
}
// Initialize
document.addEventListener('DOMContentLoaded', function() {
debugOutput = document.getElementById('debug-output');
debugLog('📱 Mobile Gematria Analyzer initialized');
// Tab listeners
document.getElementById('btn-search-tab')?.addEventListener('click', () => openTab('search-tab'));
document.getElementById('btn-anagrams-tab')?.addEventListener('click', () => openTab('anagrams-tab'));
document.getElementById('btn-debug-tab')?.addEventListener('click', () => openTab('debug-tab'));
// Main functionality
document.getElementById('analyze-btn')?.addEventListener('click', analyzePhrase);
// Anagram functionality
document.getElementById('load-results-btn')?.addEventListener('click', loadResultsToAnagrams);
document.getElementById('generate-anagrams-btn')?.addEventListener('click', () => {
const text = document.getElementById('anagram-input')?.value || '';
const resultsDiv = document.getElementById('anagram-results');
if (!text.trim()) {
resultsDiv.innerHTML = '<div class="error">📱 Load phrases first!</div>';
return;
}
const phrases = text.split('\n').filter(p => p.trim()).slice(0, 5);
let html = '<h4>🔀 Anagrams from Your Results:</h4>';
phrases.forEach(phrase => {
const words = phrase.trim().split(/\s+/).filter(w => w.length >= 3);
if (words.length > 0) {
const word = words[0]; // Use first significant word
const anagrams = generateAnagrams(word, 6);
html += `
<div class="anagram-result">
<div class="anagram-original">📝 "${phrase}"</div>
<div class="anagram-list">
${anagrams.map(anagram =>
`<span class="anagram-word" onclick="navigator.clipboard?.writeText('${anagram}')">${anagram}</span>`
).join('')}
</div>
</div>
`;
}
});
resultsDiv.innerHTML = html;
});
document.getElementById('caesar-cipher-btn')?.addEventListener('click', () => {
const text = document.getElementById('anagram-input')?.value || '';
if (!text.trim()) return;
const encoded = applyCaesarCipher(text, 3);
document.getElementById('anagram-results').innerHTML = `
<div class="anagram-result">
<div class="anagram-original">🏛️ Caesar Cipher (shift 3)</div>
<div style="padding: 10px; background: rgba(156,39,176,0.1); border-radius: 6px; margin-top: 10px;">
<strong>Original:</strong><br>${text}<br><br>
<strong>Encoded:</strong><br>${encoded}
</div>
</div>
`;
});
document.getElementById('reverse-words-btn')?.addEventListener('click', () => {
const text = document.getElementById('anagram-input')?.value || '';
if (!text.trim()) return;
const reversed = reverseWords(text);
document.getElementById('anagram-results').innerHTML = `
<div class="anagram-result">
<div class="anagram-original">↩️ Reversed Words</div>
<div style="padding: 10px; background: rgba(33,150,243,0.1); border-radius: 6px; margin-top: 10px;">
<strong>Original:</strong><br>${text}<br><br>
<strong>Reversed:</strong><br>${reversed}
</div>
</div>
`;
});
document.getElementById('pig-latin-btn')?.addEventListener('click', () => {
const text = document.getElementById('anagram-input')?.value || '';
if (!text.trim()) return;
const pigLatin = toPigLatin(text);
document.getElementById('anagram-results').innerHTML = `
<div class="anagram-result">
<div class="anagram-original">🐷 Pig Latin Translation</div>
<div style="padding: 10px; background: rgba(76,175,80,0.1); border-radius: 6px; margin-top: 10px;">
<strong>Original:</strong><br>${text}<br><br>
<strong>Pig Latin:</strong><br>${pigLatin}
</div>
</div>
`;
});
// Debug functionality
document.getElementById('test-proxies-btn')?.addEventListener('click', async () => {
debugLog('📱 Testing all proxies...');
for (const proxyKey of Object.keys(PROXY_CONFIGS)) {
const working = await testProxy(proxyKey);
debugLog(`${proxyKey}: ${working ? '✅ Working' : '❌ Failed'}`);
}
debugLog('📱 Proxy testing complete');
});
document.getElementById('clear-debug-btn')?.addEventListener('click', () => {
if (debugOutput) debugOutput.innerHTML = '📱 Debug log cleared...';
});
// Auto-load demo data for immediate results
// setTimeout(() => {
// document.getElementById('proxySelect').value = 'bypass';
// analyzePhrase();
// }, 500);
debugLog('📱 All systems ready!');
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment