d #8a6a1c;border-radius:8px;font-family:serif;font-size:14px;padding:12px;box-sizing:border-box;resize:vertical;line-height:1.6;">'
+ ''
+ ''
+ ''
+ '
'
+ '';
document.body.appendChild(ee);
document.getElementById('epistleEngrave').onclick = function(){ engraveEpistle(); };
document.getElementById('epistleClose').onclick = function(){ toggleEpistleEditor(); };
ee.onclick = function(e){ if(e.target===ee) toggleEpistleEditor(); };
}else{
ee.style.display = 'flex';
}
}else if(ee){
ee.style.display = 'none';
}
}
function engraveEpistle(){
try{
var title = document.getElementById('epistleTitle').value || 'Untitled';
var body = document.getElementById('epistleBody').value || '';
if(!body){ codeStatus('write something first'); return; }
// create stone tablet
var tablet = new THREE.Group();
var stoneMat = new THREE.MeshStandardMaterial({color:0x3a3a3a, roughness:0.9});
var slab = new THREE.Mesh(new THREE.BoxGeometry(4, 5, 0.4), stoneMat);
slab.name = 'epistle-slab';
tablet.add(slab);
// gold frame
var frameMat = new THREE.MeshStandardMaterial({color:0xffd700, metalness:0.8, roughness:0.2});
var frame = new THREE.Mesh(new THREE.BoxGeometry(4.3, 5.3, 0.2), frameMat);
frame.position.z = -0.15;
frame.name = 'epistle-frame';
tablet.add(frame);
// render text on canvas
var canvas = document.createElement('canvas');
canvas.width = 512; canvas.height = 640;
var ctx = canvas.getContext('2d');
ctx.fillStyle = '#2a2a2a';
ctx.fillRect(0,0,512,640);
ctx.fillStyle = '#ffd700';
ctx.font = 'bold 36px serif';
ctx.textAlign = 'center';
ctx.fillText(title.substring(0,24), 256, 60);
ctx.strokeStyle = '#ffd700';
ctx.lineWidth = 2;
ctx.beginPath(); ctx.moveTo(60,90); ctx.lineTo(452,90); ctx.stroke();
ctx.fillStyle = '#e8e8e8';
ctx.font = '24px serif';
ctx.textAlign = 'left';
var words = body.split(' ');
var lines = [], line = '';
for(var i=0; i 440){ lines.push(line); line = words[i] + ' '; }
else line = test;
}
lines.push(line);
for(var l=0; l