Glyphs

Encoder / Decoder

let glyphMap = loadMap() || {...defaultMap} let selectedGlyph = null const glyphList = document.getElementById('glyphList') const newGlyph = document.getElementById('newGlyph') const addGlyphBtn = document.getElementById('addGlyphBtn') const editorArea = document.getElementById('editorArea') const editorTitle = document.getElementById('editorTitle') const altsInput = document.getElementById('altsInput') const saveAlts = document.getElementById('saveAlts') const currentAlts = document.getElementById('currentAlts') const inputText = document.getElementById('inputText') const encodeBtn = document.getElementById('encodeBtn') const decodeBtn = document.getElementById('decodeBtn') const output = document.getElementById('output') function saveMap(){ localStorage.setItem(STORAGE_KEY, JSON.stringify(glyphMap)) } function loadMap(){ const raw = localStorage.getItem(STORAGE_KEY) return raw ? JSON.parse(raw) : null } function renderList(){ glyphList.innerHTML = '' Object.keys(glyphMap).sort().forEach(k=>{ const item = document.createElement('div') item.className = 'glyph-item' item.innerHTML = `${k}${glyphMap[k].join(' ')}` item.onclick = ()=>openEditor(k) glyphList.appendChild(item) }) } function openEditor(glyph){ selectedGlyph = glyph editorArea.style.display = 'block' editorTitle.textContent = `Editing "${glyph}"` altsInput.value = '' renderAlts() } function renderAlts(){ currentAlts.innerHTML = '' glyphMap[selectedGlyph].forEach(a=>{ const pill = document.createElement('span') pill.className = 'alt-pill' pill.textContent = a currentAlts.appendChild(pill) }) } saveAlts.onclick = () => { if(!selectedGlyph) return let raw = altsInput.value.trim() // split by characters, ignore spaces let chars = Array.from(raw.replace(/\s+/g,'')) glyphMap[selectedGlyph] = [...new Set(chars)] saveMap() renderList() renderAlts() } addGlyphBtn.onclick = () => { let g = newGlyph.value.trim() if(g && !glyphMap[g]){ glyphMap[g] = [] saveMap() renderList() openEditor(g) } newGlyph.value = '' } function encode(text){ return Array.from(text).map(ch=>{ if(glyphMap[ch] && glyphMap[ch].length){ let alts = glyphMap[ch] return alts[Math.floor(Math.random()*alts.length)] } return ch }).join('') } function decode(text){ let reversed = {} for(let g in glyphMap){ glyphMap[g].forEach(a=>reversed[a]=g) } return Array.from(text).map(ch=>reversed[ch]||ch).join('') } encodeBtn.onclick = ()=> output.textContent = encode(inputText.value) decodeBtn.onclick = ()=> output.textContent = decode(inputText.value) renderList()