✅ Created/Updated: $filename";
} else {
echo "❌ Failed to write: $filename
";
}
}
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
// ==================== index.html ====================
$indexHTML = <<
Tings Dashboard
HTML;
// ==================== style.css ====================
$styleCSS = << {
const bg = sec.bgImage ? `background-image:url('\${sec.bgImage}');background-size:cover;` : '';
gridEl.innerHTML += `
`;
});
grid = GridStack.init({
cellHeight: 100,
margin: 12,
draggable: { handle: '.section-header' },
resizable: isEditMode,
disableDrag: !isEditMode,
disableResize: !isEditMode,
column: 12,
animate: true
});
config.sections.forEach(s => renderTings(s.id));
setupSortable();
}
function renderTings(sectionId) {
const container = document.getElementById(`tings-\${sectionId}`);
if (!container) return;
container.innerHTML = '';
const section = config.sections.find(s => s.id === sectionId);
if (!section) return;
section.tings.forEach((ting) => {
const div = document.createElement('div');
div.className = 'ting';
div.innerHTML = `\${ting.icon || '🔗'}
\${ting.name}`;
div.onclick = () => { if (!isEditMode) handleTingClick(ting); };
container.appendChild(div);
});
if (isEditMode) {
const add = document.createElement('div');
add.className = 'ting';
add.innerHTML = `+
Add Ting`;
add.onclick = () => addNewTing(sectionId);
container.appendChild(add);
}
}
function setupSortable() {
document.querySelectorAll('.tings-grid').forEach(el => {
new Sortable(el, {
group: 'tings',
animation: 150,
onEnd: (evt) => {
const from = evt.from.id.replace('tings-', '');
const to = evt.to.id.replace('tings-', '');
const secFrom = config.sections.find(s => s.id === from);
const secTo = config.sections.find(s => s.id === to);
if (!secFrom || !secTo) return;
const [moved] = secFrom.tings.splice(evt.oldIndex, 1);
secTo.tings.splice(evt.newIndex, 0, moved);
saveConfig();
renderTings(from);
if (from !== to) renderTings(to);
}
});
});
}
function handleTingClick(ting) {
window.open(ting.url, ting.target || '_blank');
}
function addNewTing(sectionId) {
const name = prompt("Ting Name:");
if (!name) return;
const url = prompt("URL:", "https://");
if (!url) return;
const section = config.sections.find(s => s.id === sectionId);
if (section) {
section.tings.push({name, url, icon: "🔗", tint: "", target: "_blank"});
renderTings(sectionId);
saveConfig();
}
}
// Attach all button listeners safely
function attachListeners() {
const editBtn = document.getElementById('edit-btn');
if (editBtn) {
editBtn.onclick = () => {
isEditMode = !isEditMode;
editBtn.textContent = `Edit Mode: \${isEditMode ? 'ON' : 'OFF'}`;
console.log('Edit mode toggled to:', isEditMode);
initGrid();
};
}
const addSectionBtn = document.getElementById('add-section-btn');
if (addSectionBtn) {
addSectionBtn.onclick = () => {
config.sections.push({id: 'sec-' + Date.now(), title: 'New Section', color: '#ff8800', bgImage: '', customCSS: '', x:0, y:999, w:5, h:3, tings:[]});
initGrid();
saveConfig();
console.log('New section added');
};
}
const exportBtn = document.getElementById('export-btn');
if (exportBtn) {
exportBtn.onclick = () => {
const dataStr = JSON.stringify(config, null, 2);
const blob = new Blob([dataStr], {type: "application/json"});
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = "tings-config.json";
a.click();
console.log('Config exported');
};
}
const importBtn = document.getElementById('import-btn');
if (importBtn) {
importBtn.onclick = () => document.getElementById('import-file').click();
}
const importFile = document.getElementById('import-file');
if (importFile) {
importFile.onchange = (e) => {
const file = e.target.files[0];
if (!file) return;
const reader = new FileReader();
reader.onload = ev => {
try {
config = JSON.parse(ev.target.result);
saveConfig();
initGrid();
alert('Config imported successfully!');
} catch(err) {
alert('Invalid config file');
}
};
reader.readAsText(file);
};
}
const resetBtn = document.getElementById('reset-btn');
if (resetBtn) {
resetBtn.onclick = () => {
if (confirm('Reset to default clean dashboard?')) {
localStorage.removeItem('tingsConfig');
location.reload();
}
};
}
const closeOverlay = document.getElementById('close-overlay');
if (closeOverlay) {
closeOverlay.onclick = () => document.getElementById('overlay').classList.add('hidden');
}
}
window.addEventListener('load', () => {
console.log('%cTings Dashboard loading...', 'color:#00ffcc');
loadConfig();
initGrid();
attachListeners();
console.log('%cTings Dashboard ready - Try clicking Edit Mode', 'color:#00ffcc');
});
JS;
// ==================== fix.html ====================
$fixHTML = <<
Tings Fix Tool
Tings Dashboard Fix Tool
If buttons still don't work, click below to reset:
→ Open Tings Dashboard
HTML;
writeFile('index.html', $indexHTML);
writeFile('style.css', $styleCSS);
writeFile('script.js', $scriptJS);
writeFile('fix.html', $fixHTML);
echo "All files updated!
";
echo "→ Open Tings Dashboard
";
echo "→ Open Fix Tool
";
exit;
}
?>
Tings dev.php
Tings Dashboard Setup Tool
Click the button below to create/update all files with fixes.