381 lines
15 KiB
HTML
381 lines
15 KiB
HTML
{{define "app_info"}}
|
|
{{template "layout_start" .}}
|
|
|
|
<div class="page-header">
|
|
<div style="display:flex;align-items:center;gap:1rem">
|
|
<a href="/stacks" class="btn btn-sm btn-outline">← Alkalmazások</a>
|
|
<h2>{{.Meta.DisplayName}}</h2>
|
|
</div>
|
|
<div style="display:flex;align-items:center;gap:.5rem">
|
|
{{if .Stack.Deployed}}
|
|
<span class="stack-state-badge state-{{stateColor .Stack.State}}">{{stateLabel .Stack.State}}</span>
|
|
{{if .Stack.Orphaned}}<span class="badge badge-orphaned">Elavult</span>{{end}}
|
|
{{if .EffectiveSubdomain}}<a href="https://{{.EffectiveSubdomain}}.{{.Domain}}" target="_blank" class="btn btn-sm btn-outline">Megnyitás ↗</a>{{end}}
|
|
<a href="/stacks/{{.Stack.Name}}/logs" class="btn btn-sm btn-outline">Napló</a>
|
|
{{if .Stack.Orphaned}}
|
|
<button class="btn btn-sm btn-danger" onclick="deleteOrphanStack('{{.Stack.Name}}')">Törlés</button>
|
|
{{else}}
|
|
<a href="/stacks/{{.Stack.Name}}/deploy" class="btn btn-sm btn-outline">Beállítások</a>
|
|
{{end}}
|
|
{{else}}
|
|
<a href="/stacks/{{.Stack.Name}}/deploy" class="btn btn-sm btn-primary" onclick="return checkBeforeDeploy(event, '{{.Stack.Name}}')">Telepítés</a>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Hero section -->
|
|
<div class="app-info-hero">
|
|
<img class="app-info-logo" src="{{logoURL .Meta.Slug}}"
|
|
alt="{{.Meta.DisplayName}}"
|
|
onerror="this.onerror=function(){this.style.display='none'};this.src='{{logoPNGURL .Meta.Slug}}'">
|
|
<div class="app-info-hero-text">
|
|
{{if .AppInfo.Tagline}}
|
|
<p class="app-info-tagline">{{.AppInfo.Tagline}}</p>
|
|
{{else}}
|
|
<p class="app-info-tagline">{{.Meta.Description}}</p>
|
|
{{end}}
|
|
<div class="stack-meta-badges">
|
|
<span class="meta-badge">~{{.Meta.Resources.MemRequest}} RAM</span>
|
|
<span class="meta-badge">{{.Meta.Category}}</span>
|
|
{{if .Meta.Resources.NeedsHDD}}<span class="meta-badge meta-badge-warn">HDD szükséges</span>{{end}}
|
|
{{if .Meta.Resources.PiCompatible}}<span class="meta-badge meta-badge-ok">Pi kompatibilis</span>{{else}}<span class="meta-badge meta-badge-warn">Csak x86</span>{{end}}
|
|
{{if .Meta.Resources.HungarianUI}}<span class="meta-badge meta-badge-ok">Magyar felület</span>{{end}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Screenshots (graceful — hidden if assets don't exist) -->
|
|
<div class="app-screenshots" id="screenshots">
|
|
<img src="{{screenshotURL .Meta.Slug 1}}" alt="" class="app-screenshot"
|
|
onerror="this.style.display='none'">
|
|
<img src="{{screenshotURL .Meta.Slug 2}}" alt="" class="app-screenshot"
|
|
onerror="this.style.display='none'">
|
|
<img src="{{screenshotURL .Meta.Slug 3}}" alt="" class="app-screenshot"
|
|
onerror="this.style.display='none'">
|
|
</div>
|
|
|
|
{{if .HasAppInfo}}
|
|
<div class="app-info-grid">
|
|
{{if .AppInfo.UseCases}}
|
|
<div class="app-info-card">
|
|
<h3>Mire használható?</h3>
|
|
<ul class="app-info-list">
|
|
{{range .AppInfo.UseCases}}<li>{{.}}</li>{{end}}
|
|
</ul>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .AppInfo.FirstSteps}}
|
|
<div class="app-info-card">
|
|
<h3>Első lépések</h3>
|
|
<ol class="app-info-list">
|
|
{{range .AppInfo.FirstSteps}}<li>{{.}}</li>{{end}}
|
|
</ol>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .AppInfo.Prerequisites}}
|
|
<div class="app-info-card">
|
|
<h3>Előfeltételek</h3>
|
|
<ul class="app-info-list">
|
|
{{range .AppInfo.Prerequisites}}<li>{{.}}</li>{{end}}
|
|
</ul>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .AppInfo.DefaultCreds}}
|
|
<div class="app-info-card">
|
|
<h3>Alapértelmezett belépés</h3>
|
|
<p class="app-info-creds">{{.AppInfo.DefaultCreds}}</p>
|
|
<p class="app-info-creds-warn">Az első bejelentkezés után azonnal változtasd meg!</p>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .AppInfo.DocsURL}}
|
|
<div class="app-info-card">
|
|
<h3>Dokumentáció</h3>
|
|
<p><a href="{{.AppInfo.DocsURL}}" target="_blank" class="app-info-link">Hivatalos dokumentáció ↗</a></p>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .HasOptionalConfig}}
|
|
<div class="app-optional-config">
|
|
<h3>Opcionális beállítások</h3>
|
|
{{range .OptionalConfig}}
|
|
<div class="config-group">
|
|
<h4>{{.Group}}</h4>
|
|
{{if .Description}}<p class="config-group-desc">{{.Description}}</p>{{end}}
|
|
|
|
<div class="config-fields">
|
|
{{range .Fields}}
|
|
<div class="config-field">
|
|
<label for="opt-{{.EnvVar}}">{{.Label}}</label>
|
|
{{if .HelpText}}<p class="config-field-help">{{.HelpText}}</p>{{end}}
|
|
{{if .HelpURL}}<p class="config-field-help"><a href="{{.HelpURL}}" target="_blank">Regisztrációs útmutató ↗</a></p>{{end}}
|
|
<input type="{{if eq .Type "secret_input"}}password{{else}}text{{end}}"
|
|
id="opt-{{.EnvVar}}"
|
|
name="{{.EnvVar}}"
|
|
class="config-input"
|
|
value="{{index $.CurrentValues .EnvVar}}"
|
|
placeholder="{{.Label}}"
|
|
autocomplete="off">
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
<div class="config-actions">
|
|
<button class="btn btn-primary" id="save-optional-config" onclick="saveOptionalConfig('{{.Stack.Name}}')">
|
|
Mentés
|
|
</button>
|
|
<span id="config-save-status" class="config-save-status"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
async function saveOptionalConfig(stackName) {
|
|
const btn = document.getElementById('save-optional-config');
|
|
const status = document.getElementById('config-save-status');
|
|
const inputs = document.querySelectorAll('.config-input');
|
|
|
|
const values = {};
|
|
inputs.forEach(function(input) {
|
|
values[input.name] = input.value;
|
|
});
|
|
|
|
btn.disabled = true;
|
|
btn.textContent = 'Mentés...';
|
|
status.textContent = '';
|
|
status.className = 'config-save-status';
|
|
|
|
try {
|
|
const resp = await fetch('/api/stacks/' + stackName + '/optional-config', {
|
|
method: 'POST',
|
|
headers: Object.assign({'Content-Type': 'application/json'}, csrfHeaders()),
|
|
body: JSON.stringify({values: values})
|
|
});
|
|
const data = await resp.json();
|
|
|
|
if (data.ok) {
|
|
status.textContent = (data.message || 'Mentve');
|
|
status.className = 'config-save-status config-save-ok';
|
|
} else {
|
|
status.textContent = (data.error || 'Hiba');
|
|
status.className = 'config-save-status config-save-err';
|
|
}
|
|
} catch(err) {
|
|
status.textContent = 'Hálózati hiba';
|
|
status.className = 'config-save-status config-save-err';
|
|
}
|
|
|
|
btn.disabled = false;
|
|
btn.textContent = 'Mentés';
|
|
|
|
setTimeout(function() { status.textContent = ''; }, 5000);
|
|
}
|
|
</script>
|
|
{{end}}
|
|
|
|
{{if .HasIntegrations}}
|
|
<div class="app-optional-config">
|
|
<h3>Integrációk</h3>
|
|
<p class="config-group-desc">
|
|
Más telepített alkalmazásokkal való összekapcsolás. Az integráció automatikusan felfüggesztődik, ha bármelyik alkalmazás leáll, és újraaktiválódik indításkor.
|
|
</p>
|
|
|
|
{{range .Integrations}}
|
|
<div class="config-field" style="display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--border)">
|
|
<div style="flex:1">
|
|
<strong>{{.Label}}</strong>
|
|
<p class="config-field-help" style="margin:0">{{.Description}}</p>
|
|
{{if not .TargetDeployed}}
|
|
<span class="badge badge-muted" style="margin-top:.25rem;display:inline-block">Nincs telepítve</span>
|
|
{{else if not .TargetRunning}}
|
|
<span class="badge badge-orphaned" style="margin-top:.25rem;display:inline-block">Célalkalmazás leállítva</span>
|
|
{{else if eq .Status "error"}}
|
|
<span class="badge badge-orphaned" style="margin-top:.25rem;display:inline-block">Hiba</span>
|
|
{{else if .Enabled}}
|
|
<span class="badge badge-ok" style="margin-top:.25rem;display:inline-block">Aktív</span>
|
|
{{end}}
|
|
</div>
|
|
<label class="toggle">
|
|
<input type="checkbox"
|
|
{{if .Enabled}}checked{{end}}
|
|
{{if not .TargetDeployed}}disabled title="A célalkalmazás nincs telepítve"{{end}}
|
|
{{if and .TargetDeployed (not .TargetRunning)}}disabled title="A célalkalmazás nem fut"{{end}}
|
|
onchange="toggleIntegration('{{$.Stack.Name}}', '{{.Target}}', this.checked, this)">
|
|
<span class="toggle-label"></span>
|
|
</label>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
|
|
<script>
|
|
async function toggleIntegration(provider, target, enable, checkbox) {
|
|
checkbox.disabled = true;
|
|
try {
|
|
var resp = await fetch('/api/integrations/' + provider + '/' + target, {
|
|
method: 'POST',
|
|
headers: Object.assign({'Content-Type': 'application/json'}, csrfHeaders()),
|
|
body: JSON.stringify({enabled: enable})
|
|
});
|
|
var data = await resp.json();
|
|
if (!data.ok) {
|
|
checkbox.checked = !enable;
|
|
alert(data.error || 'Hiba történt');
|
|
} else {
|
|
// Reload to update status badges
|
|
setTimeout(function(){ location.reload(); }, 500);
|
|
return;
|
|
}
|
|
} catch(err) {
|
|
checkbox.checked = !enable;
|
|
alert('Hálózati hiba');
|
|
}
|
|
checkbox.disabled = false;
|
|
}
|
|
</script>
|
|
{{end}}
|
|
|
|
{{if .GeoGlobalEnabled}}
|
|
<div class="app-optional-config">
|
|
<h3>Földrajzi korlátozás</h3>
|
|
<p class="config-group-desc">
|
|
Az alkalmazás egyéni országkorlátozás nélkül a globális beállítást követi.
|
|
</p>
|
|
|
|
<label class="toggle" style="margin-bottom:1rem">
|
|
<input type="checkbox" id="app-geo-override-toggle"
|
|
{{if .GeoAppOverride}}checked{{end}}
|
|
onchange="toggleAppGeoOverride(this.checked)">
|
|
<span class="toggle-label">Egyéni országkorlátozás</span>
|
|
</label>
|
|
|
|
<div id="app-geo-override-details" {{if not .GeoAppOverride}}style="display:none"{{end}}>
|
|
<div class="form-group">
|
|
<label>Engedélyezett országok ehhez az alkalmazáshoz</label>
|
|
<div class="geo-country-selector">
|
|
<input type="text" id="app-geo-search" class="form-control config-input"
|
|
placeholder="Ország keresése..." autocomplete="off"
|
|
oninput="filterAppGeoCountries(this.value)"
|
|
onfocus="showAppGeoList()"
|
|
onblur="setTimeout(function(){hideAppGeoList()},200)">
|
|
<div class="geo-country-list" id="app-geo-country-list"></div>
|
|
</div>
|
|
<div class="geo-selected-tags" id="app-geo-tags"></div>
|
|
</div>
|
|
<div class="config-actions">
|
|
<button class="btn btn-primary" onclick="saveAppGeoOverride()">Mentés</button>
|
|
<span id="app-geo-status" class="config-save-status"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
(function(){
|
|
var allCountries = [];
|
|
var appGeoCountries = {{json .GeoAppOverrideCountries}};
|
|
var stackName = '{{.Stack.Name}}';
|
|
|
|
function loadCountries(cb) {
|
|
if (allCountries.length > 0) { cb(); return; }
|
|
fetch('/api/geo/countries', {headers: csrfHeaders()})
|
|
.then(function(r){return r.json()})
|
|
.then(function(d){ if(d.ok) allCountries = d.data; cb(); })
|
|
.catch(function(){ cb(); });
|
|
}
|
|
|
|
window.toggleAppGeoOverride = function(enabled) {
|
|
document.getElementById('app-geo-override-details').style.display = enabled ? '' : 'none';
|
|
if (enabled) {
|
|
if (!appGeoCountries || appGeoCountries.length === 0) {
|
|
appGeoCountries = {{json .GeoGlobalCountries}};
|
|
}
|
|
loadCountries(renderAppGeoTags);
|
|
} else {
|
|
// Remove override
|
|
fetch('/api/stacks/' + stackName + '/geo/override', {method:'DELETE', headers:csrfHeaders()});
|
|
}
|
|
};
|
|
|
|
window.showAppGeoList = function() { loadCountries(function(){ filterAppGeoCountries(''); }); };
|
|
window.hideAppGeoList = function() { document.getElementById('app-geo-country-list').style.display='none'; };
|
|
|
|
window.filterAppGeoCountries = function(q) {
|
|
var list = document.getElementById('app-geo-country-list');
|
|
q = q.toLowerCase();
|
|
var html = ''; var count = 0;
|
|
for (var i = 0; i < allCountries.length && count < 15; i++) {
|
|
var c = allCountries[i];
|
|
if (appGeoCountries.indexOf(c.code) >= 0) continue;
|
|
if (q && c.name.toLowerCase().indexOf(q) < 0 && c.code.toLowerCase().indexOf(q) < 0) continue;
|
|
html += '<div class="geo-country-option" onmousedown="addAppGeoCountry(\'' + c.code + '\')">'
|
|
+ esc(c.name) + ' <small>(' + c.code + ')</small></div>';
|
|
count++;
|
|
}
|
|
list.innerHTML = html || '<div class="geo-country-option" style="opacity:.5">Nincs találat</div>';
|
|
list.style.display = (count > 0 || q) ? '' : 'none';
|
|
};
|
|
|
|
window.addAppGeoCountry = function(code) {
|
|
if (appGeoCountries.indexOf(code) >= 0) return;
|
|
appGeoCountries.push(code);
|
|
renderAppGeoTags();
|
|
document.getElementById('app-geo-search').value = '';
|
|
hideAppGeoList();
|
|
};
|
|
|
|
window.removeAppGeoCountry = function(code) {
|
|
appGeoCountries = appGeoCountries.filter(function(c){return c !== code});
|
|
renderAppGeoTags();
|
|
};
|
|
|
|
function renderAppGeoTags() {
|
|
var el = document.getElementById('app-geo-tags');
|
|
var html = '';
|
|
for (var i = 0; i < appGeoCountries.length; i++) {
|
|
var code = appGeoCountries[i];
|
|
var name = code;
|
|
for (var j = 0; j < allCountries.length; j++) {
|
|
if (allCountries[j].code === code) { name = allCountries[j].name; break; }
|
|
}
|
|
html += '<span class="geo-tag">' + esc(name) + ' (' + code + ') '
|
|
+ '<span class="geo-tag-remove" onclick="removeAppGeoCountry(\'' + code + '\')">×</span></span>';
|
|
}
|
|
el.innerHTML = html;
|
|
}
|
|
|
|
window.saveAppGeoOverride = function() {
|
|
var status = document.getElementById('app-geo-status');
|
|
fetch('/api/stacks/' + stackName + '/geo/override', {
|
|
method: 'POST',
|
|
headers: Object.assign({'Content-Type':'application/json'}, csrfHeaders()),
|
|
body: JSON.stringify({allowed_countries: appGeoCountries})
|
|
})
|
|
.then(function(r){return r.json()})
|
|
.then(function(d){
|
|
status.textContent = d.ok ? (d.message || 'Mentve') : (d.error || 'Hiba');
|
|
status.className = 'config-save-status ' + (d.ok ? 'config-save-ok' : 'config-save-err');
|
|
setTimeout(function(){ status.textContent=''; }, 5000);
|
|
})
|
|
.catch(function(){
|
|
status.textContent = 'Hálózati hiba';
|
|
status.className = 'config-save-status config-save-err';
|
|
});
|
|
};
|
|
|
|
function esc(s) { var d = document.createElement('div'); d.textContent = s; return d.innerHTML; }
|
|
|
|
if (document.getElementById('app-geo-override-toggle') && document.getElementById('app-geo-override-toggle').checked) {
|
|
loadCountries(renderAppGeoTags);
|
|
}
|
|
})();
|
|
</script>
|
|
{{end}}
|
|
|
|
{{template "layout_end" .}}
|
|
{{end}}
|