{% extends "base.html" %}{% block title %}App Store{% endblock %}{% block body %}
<div class="head"><div><small>SERVER / SOFTWARE</small><h1>App Store</h1><p>Discover, verify and install real OS packages without fake installed states.</p></div><div class="action-row"><a class="soft" href="/admin/services">Service Manager</a><a class="btn" href="/admin/tasks">Task Center</a></div></div>
<div class="card"><div class="cardhead"><div class="store-tabs"><button class="active" data-store-cat="all">All Apps</button><button data-store-cat="Web Server">Web</button><button data-store-cat="Runtime">Runtime</button><button data-store-cat="Database">Database</button><button data-store-cat="Mail">Mail</button><button data-store-cat="DNS">DNS</button><button data-store-cat="Firewall">Firewall</button><button data-store-cat="Containers">Containers</button></div><input class="search" id="store-search" placeholder="Search apps…"></div></div>
<section class="store-grid" id="store-grid">{% for a in apps %}<article class="card store-card" data-cat="{{a.category}}" data-name="{{a.name|lower}}"><span class="store-icon">{{a.name[:1]}}</span><div class="store-main"><div class="store-title"><h3>{{a.name}}</h3><span class="tag">{{a.category}}</span>{% if a.dynamic %}<span class="tag">Dynamic</span>{% endif %}</div><p>{{a.description}}</p><div class="store-meta"><span class="{{'ok' if a.installed else 'muted'}}">● {{'Installed' if a.installed else 'Not installed'}}</span>{% if a.version %}<span>{{a.version}}</span>{% endif %}{% if a.running %}<span class="ok">Running</span>{% elif a.service %}<span class="muted">Stopped</span>{% endif %}</div></div><div class="store-actions"><button class="btn" data-install-app="{{a.key}}" data-installed="{{'1' if a.installed else '0'}}" data-app-name="{{a.name}}">{{'Version / Reinstall' if a.installed else 'Install'}}</button>{% if a.installed and a.service %}{% if a.running %}<button class="soft" data-app-action="stop" data-app-key="{{a.key}}">Stop</button>{% else %}<button class="soft" data-app-action="start" data-app-key="{{a.key}}">Start</button>{% endif %}<button class="soft" data-app-action="restart" data-app-key="{{a.key}}">Restart</button>{% endif %}{% if a.installed %}{% if a.key=='phpmyadmin' %}<a class="btn" href="/admin/databases/phpmyadmin" target="_blank" rel="noopener">Open phpMyAdmin ↗</a>{% endif %}<button class="danger" data-app-action="uninstall" data-app-key="{{a.key}}">Uninstall</button><a class="soft" href="/admin/store/{{a.key}}/logs" target="_blank">Logs</a>{% endif %}</div></article>{% endfor %}</section>
<div class="modal-backdrop" id="install-modal" hidden><div class="modal-card"><button class="modal-close" type="button" data-close-install aria-label="Close" onclick="closeModal('install-modal')">×</button><small>VERIFIED PACKAGE SELECTOR</small><h2>Install <span id="install-app-name"></span></h2><p class="sub">Only versions confirmed by the current OS repository are selectable.</p><label>Version<select id="install-version" required></select></label><div class="form-help muted" id="install-note" style="margin:10px 0 14px"></div><button type="button" class="soft" id="prepare-php" hidden>Prepare PHP repository & verify</button><form id="install-form" method="post"><input type="hidden" name="csrf_token" value="{{csrf_token}}"><input type="hidden" name="version" id="install-version-value"><button class="btn" id="install-submit">Queue Installation</button></form></div></div>
<script>
const I={modal:document.getElementById('install-modal'),select:document.getElementById('install-version'),value:document.getElementById('install-version-value'),form:document.getElementById('install-form'),submit:document.getElementById('install-submit'),name:document.getElementById('install-app-name'),note:document.getElementById('install-note'),prepare:document.getElementById('prepare-php')};let currentApp='';
document.addEventListener('change',e=>{if(e.target===I.select)I.value.value=I.select.value});
async function fillVersions(vs){I.select.innerHTML=vs.length?vs.map(v=>`<option value="${v.value}">${v.channel||'Repository'} · ${v.label}${v.installed?' · Installed':''}</option>`).join(''):'<option value="">No verified versions</option>';I.submit.disabled=!vs.length;I.value.value=vs[0]?.value||'';I.prepare.hidden=!!vs.length||!currentApp.match(/^php-/);I.note.textContent=vs.length?'Repository verified. Stable/latest/older candidates are shown only when the OS can discover them.':'Repository unavailable: install is disabled.'}
I.prepare.onclick=async()=>{I.prepare.disabled=true;I.note.textContent='Preparing repository and verifying package index…';try{const j=await fetch('/api/store/'+currentApp+'/prepare',{method:'POST',headers:{'X-CSRFToken':'{{csrf_token}}'}}).then(r=>r.json());if(!j.ok)throw new Error(j.error||'Repository preparation failed');await fillVersions(j.versions||[])}catch(err){I.note.textContent=err.message}finally{I.prepare.disabled=false}};
document.addEventListener('click',async e=>{
 const b=e.target.closest('[data-install-app]');
 if(b){currentApp=b.dataset.installApp;I.name.textContent=b.dataset.appName;I.prepare.hidden=!currentApp.match(/^php-/);I.select.innerHTML='<option>Checking OS repository…</option>';I.submit.disabled=true;openModal('install-modal');const op=b.dataset.installed==='1'?'reinstall':'install';I.form.action='/admin/store/'+currentApp+'/'+op;try{const j=await fetch('/api/store/'+currentApp+'/versions',{cache:'no-store'}).then(r=>r.json());await fillVersions(j.versions||[])}catch(err){I.select.innerHTML='<option value="">Repository check failed</option>';I.note.textContent='No verified package source is available.'}}
 if(e.target.closest('[data-close-install]'))closeModal('install-modal');
 const a=e.target.closest('[data-app-action]');if(a){if(a.dataset.appAction==='uninstall'&&!confirm('Uninstall '+a.dataset.appKey+' from this server?'))return;a.disabled=true;const r=await fetch('/api/store/'+a.dataset.appKey+'/'+a.dataset.appAction,{method:'POST',headers:{'X-CSRFToken':'{{csrf_token}}'}});const j=await r.json();a.disabled=false;if(!j.ok)toast(j.error,'error');else{toast('Task queued');setTimeout(()=>location.href='/admin/tasks',500)}}
});
let cat='all';const search=document.getElementById('store-search');document.querySelectorAll('[data-store-cat]').forEach(b=>b.addEventListener('click',()=>{cat=b.dataset.storeCat;document.querySelectorAll('[data-store-cat]').forEach(x=>x.classList.remove('active'));b.classList.add('active');filter()}));search.addEventListener('input',filter);function filter(){const q=search.value.toLowerCase();document.querySelectorAll('#store-grid [data-cat]').forEach(x=>x.hidden=!((cat==='all'||x.dataset.cat===cat)&&x.dataset.name.includes(q)))}
</script>{% endblock %}