Changeset bbf9d1a in Klonkt for src/views/pages/admin-settings.ejs
- Timestamp:
- 06/21/2026 02:32:39 PM (3 months ago)
- Branches:
- main
- Children:
- 4885eab
- Parents:
- 929d98d
- File:
-
- 1 edited
-
src/views/pages/admin-settings.ejs (modified) (13 diffs)
Legend:
- Unmodified
- Added
- Removed
-
src/views/pages/admin-settings.ejs
r929d98d rbbf9d1a 1 1 <div class="container admin-page"> 2 <h1> Instellingen</h1>3 <p><a href="/admin" class="btn">← Beheer</a></p>2 <h1><%= t('aset.title') %></h1> 3 <p><a href="/admin" class="btn">← <%= t('aset.back_admin') %></a></p> 4 4 5 5 <% if (success) { %><div class="alert alert-success"><%= success %></div><% } %> … … 7 7 8 8 <section class="set-card"> 9 <h2> Modus</h2>9 <h2><%= t('aset.mode') %></h2> 10 10 <p class="set-help"> 11 Bepaalt hoe deze installatie werkt. Wisselen is veilig: er wordt niets verwijderd — 12 Solo verbergt alleen de multi-onderdelen en toont je primaire site. 11 <%= t('aset.mode_help') %> 13 12 </p> 14 13 … … 17 16 <input type="radio" name="tenancy" value="solo" <%= tenancy === 'solo' ? 'checked' : '' %>> 18 17 <span> 19 <strong> Solo</strong> — één site (de jouwe).20 <small> Geen gebruikers-directory, geen site-wissel. Bezoekers kunnen wel met Google inloggen om te reageren.</small>18 <strong><%= t('aset.solo') %></strong> — <%= t('aset.solo_title') %> 19 <small><%= t('aset.solo_desc') %></small> 21 20 </span> 22 21 </label> … … 25 24 <input type="radio" name="tenancy" value="hub" <%= tenancy === 'hub' ? 'checked' : '' %> <%= _hubLocked ? 'disabled' : '' %>> 26 25 <span> 27 <strong> Hub</strong> — bedrijfssite met<code>/user/</code>.28 <% if (_hubLocked) { %><span style="display:inline-block;font-size:.7rem;font-weight:700;color:var(--accent);border:1px solid var(--accent);border-radius:999px;padding:.05rem .45rem;margin-left:.3rem;vertical-align:1px;">🔒 premium</span><% } %>29 <small> Jij (admin) wijst gebruikers een eigen Klonkt Hub toe. Gesloten cirkel: geen open registratie.<% if (_hubLocked) { %> <em>Vereist premium — koppel Patreon in deze pagina.</em><% } %></small>26 <strong><%= t('aset.hub') %></strong> — <%= t('aset.hub_title') %> <code>/user/</code>. 27 <% if (_hubLocked) { %><span style="display:inline-block;font-size:.7rem;font-weight:700;color:var(--accent);border:1px solid var(--accent);border-radius:999px;padding:.05rem .45rem;margin-left:.3rem;vertical-align:1px;">🔒 <%= t('aset.premium_badge') %></span><% } %> 28 <small><%= t('aset.hub_desc') %><% if (_hubLocked) { %> <em><%= t('aset.hub_locked_note') %></em><% } %></small> 30 29 </span> 31 30 </label> … … 33 32 <input type="radio" name="tenancy" value="circle" <%= tenancy === 'circle' ? 'checked' : '' %>> 34 33 <span> 35 <strong> Cirkels</strong> — solo + federatie.36 <small> Eén eigen site die de publieke posts van andere Klonkt-sites toont. Asymmetrisch: jij bepaalt wie in jouw cirkel zit.</small>37 </span> 38 </label> 39 <button type="submit" class="btn btn-primary"> Opslaan</button>34 <strong><%= t('aset.circle') %></strong> — <%= t('aset.circle_title') %> 35 <small><%= t('aset.circle_desc') %></small> 36 </span> 37 </label> 38 <button type="submit" class="btn btn-primary"><%= t('aset.save') %></button> 40 39 </form> 41 40 </section> … … 45 44 <% if (tenancy === 'hub') { %> 46 45 <section class="set-card set-card--mode" style="margin-top:1rem"> 47 <h2> Hub-hoofdpagina</h2>46 <h2><%= t('aset.hub_home') %></h2> 48 47 <p class="set-help"> 49 De openbare hub-pagina (<code>/</code>) is generiek — van geen enkele gebruiker. 50 Hier stel je de naam en intro in. Jouw eigen Klonkt Hub blijft los bestaan onder <code>/user/</code>. 48 <%= t('aset.hub_home_help_1') %> (<code>/</code>) <%= t('aset.hub_home_help_2') %> <code>/user/</code>. 51 49 </p> 52 50 <form method="post" action="/admin/settings" class="set-form" enctype="multipart/form-data"> 53 51 <label class="set-field"> 54 <span> Naam</span>55 <input type="text" name="hub_title" maxlength="80" value="<%= hubTitle %>" placeholder=" bijv. Studio Noord">56 </label> 57 <label class="set-field"> 58 <span> Tagline</span>59 <input type="text" name="hub_tagline" maxlength="120" value="<%= hubTagline %>" placeholder=" bijv. Onafhankelijk muzieklabel">60 </label> 61 <label class="set-field"> 62 <span> Intro</span>63 <textarea name="hub_intro" maxlength="400" rows="3" placeholder=" Korte introtekst onder de titel."><%= hubIntro %></textarea>64 </label> 65 <label class="set-field"> 66 <span> Hero-afbeelding (URL) <small style="font-weight:400;color:var(--ink-muted)">— optioneel; achtergrond van de hero</small></span>52 <span><%= t('aset.name') %></span> 53 <input type="text" name="hub_title" maxlength="80" value="<%= hubTitle %>" placeholder="<%= t('aset.name_ph') %>"> 54 </label> 55 <label class="set-field"> 56 <span><%= t('aset.tagline') %></span> 57 <input type="text" name="hub_tagline" maxlength="120" value="<%= hubTagline %>" placeholder="<%= t('aset.tagline_ph') %>"> 58 </label> 59 <label class="set-field"> 60 <span><%= t('aset.intro') %></span> 61 <textarea name="hub_intro" maxlength="400" rows="3" placeholder="<%= t('aset.intro_ph') %>"><%= hubIntro %></textarea> 62 </label> 63 <label class="set-field"> 64 <span><%= t('aset.hero_image') %> <small style="font-weight:400;color:var(--ink-muted)">— <%= t('aset.hero_image_hint') %></small></span> 67 65 <input type="text" name="hub_hero_image" maxlength="300" value="<%= hubHeroImage %>" placeholder="/media/... of https://..."> 68 66 </label> 69 67 <label class="set-field"> 70 <span> …of upload een afbeelding <small style="font-weight:400;color:var(--ink-muted)">— jpg/png/webp/gif, max 5 MB; vervangt de URL hierboven</small></span>68 <span><%= t('aset.hero_upload') %> <small style="font-weight:400;color:var(--ink-muted)">— <%= t('aset.hero_upload_hint') %></small></span> 71 69 <input type="file" name="hub_hero_file" accept="image/png,image/jpeg,image/webp,image/gif"> 72 70 </label> 73 71 <label class="set-field"> 74 <span> Donkere overlay <small style="font-weight:400;color:var(--ink-muted)">— maakt de hero donkerder zodat de tekst leesbaar blijft</small></span>72 <span><%= t('aset.hero_overlay') %> <small style="font-weight:400;color:var(--ink-muted)">— <%= t('aset.hero_overlay_hint') %></small></span> 75 73 <span style="display:flex;align-items:center;gap:0.75rem"> 76 74 <input type="range" name="hub_hero_overlay" min="0" max="100" step="5" value="<%= hubHeroOverlay %>" style="flex:1" … … 81 79 <% if (hubHeroImage) { %> 82 80 <div class="set-field"> 83 <span style="font-weight:400;color:var(--ink-muted);font-size:0.9rem"> Voorbeeld (met overlay):</span>81 <span style="font-weight:400;color:var(--ink-muted);font-size:0.9rem"><%= t('aset.preview_overlay') %></span> 84 82 <div style="position:relative;width:100%;aspect-ratio:16/7;margin-top:0.4rem;border-radius:8px;overflow:hidden;border:1px solid var(--rule);background:var(--paper-2)"> 85 <img src="<%= hubHeroImage %>" alt=" Hero-voorbeeld" style="display:block;width:100%;height:100%;object-fit:cover">83 <img src="<%= hubHeroImage %>" alt="<%= t('aset.hero_preview_alt') %>" style="display:block;width:100%;height:100%;object-fit:cover"> 86 84 <div id="hero-ov-preview" style="position:absolute;inset:0;background:#000;opacity:<%= (hubHeroOverlay/100).toFixed(2) %>;pointer-events:none"></div> 87 85 </div> 88 86 </div> 89 87 <% } %> 90 <button type="submit" class="btn btn-primary"> Opslaan</button>88 <button type="submit" class="btn btn-primary"><%= t('aset.save') %></button> 91 89 </form> 92 90 </section> … … 95 93 <% if (tenancy === 'circle') { %> 96 94 <section class="set-card set-card--mode" style="margin-top:1rem"> 97 <h2>🔗 Je cirkel</h2>95 <h2>🔗 <%= t('aset.your_circle') %></h2> 98 96 <p class="set-help"> 99 Beheer welke andere Klonkt-sites je in je cirkel toont, en of jouw site in 100 cirkels van anderen mag verschijnen. Asymmetrisch: jij bepaalt wie je volgt. 97 <%= t('aset.your_circle_help') %> 101 98 </p> 102 99 <div class="set-actions"> 103 <a href="/admin/circle" class="btn btn-primary"> Beheer je cirkel→</a>100 <a href="/admin/circle" class="btn btn-primary"><%= t('aset.manage_circle') %> →</a> 104 101 </div> 105 102 </section> … … 110 107 <% if (premium && premium.enabled) { %> 111 108 <section class="set-card" style="margin-top:1rem"> 112 <h2>Premium (Patreon)</h2> 113 <p class="set-help">Ontgrendel de premium-modules (Hub-modus, Statistieken, Fan-login, 114 Prutter-DMs) met je <strong>$10-lifetime</strong> Patreon-steun. De app en alle updates 115 blijven gratis.</p> 109 <h2><%= t('aset.premium') %></h2> 110 <p class="set-help"><%= t('aset.premium_help_1') %> <strong><%= t('aset.premium_lifetime') %></strong> <%= t('aset.premium_help_2') %></p> 116 111 <% if (premium.premium) { %> 117 <p class="set-help"><strong>✓ Premium actief.</strong>118 <% if (premium.supportCents) { %> Lifetime-steun:$<%= (premium.supportCents/100).toFixed(2) %>.<% } %></p>119 <a href="/admin/patreon/disconnect" class="btn"> Patreon ontkoppelen</a>112 <p class="set-help"><strong>✓ <%= t('aset.premium_active') %></strong> 113 <% if (premium.supportCents) { %><%= t('aset.lifetime_support') %> $<%= (premium.supportCents/100).toFixed(2) %>.<% } %></p> 114 <a href="/admin/patreon/disconnect" class="btn"><%= t('aset.patreon_disconnect') %></a> 120 115 <% } else if (premium.connected) { %> 121 <p class="set-help"> Patreon gekoppeld, maar nog geen $10 lifetime<% if (premium.supportCents) { %>122 ( nu $<%= (premium.supportCents/100).toFixed(2) %>)<% } %>. Steun de campagne en koppel opnieuw.</p>123 <a href="/admin/patreon/connect" class="btn btn-primary"> Opnieuw koppelen</a>116 <p class="set-help"><%= t('aset.patreon_no_lifetime') %><% if (premium.supportCents) { %> 117 (<%= t('aset.now') %> $<%= (premium.supportCents/100).toFixed(2) %>)<% } %>. <%= t('aset.patreon_support_again') %></p> 118 <a href="/admin/patreon/connect" class="btn btn-primary"><%= t('aset.patreon_reconnect') %></a> 124 119 <% } else { %> 125 <p class="set-help"> Nog niet gekoppeld.</p>126 <a href="/admin/patreon/connect" class="btn btn-primary"> Koppel Patreon</a>120 <p class="set-help"><%= t('aset.patreon_not_connected') %></p> 121 <a href="/admin/patreon/connect" class="btn btn-primary"><%= t('aset.patreon_connect') %></a> 127 122 <% } %> 128 123 </section> … … 131 126 <%# Google-login staat op een eigen Beheer-pagina (compacte link hier). %> 132 127 <section class="set-card" style="margin-top:1rem"> 133 <h2> Google-login (bezoekers)</h2>134 <p class="set-help"> Laat bezoekers met Google inloggen om te reageren — met je eigen Google Cloud-client.135 <% if (google && google.configured) { %><strong> Status: ingesteld ✓</strong><% } else { %>Nog niet ingesteld.<% } %></p>136 <div class="set-actions"><a href="/admin/settings/google" class="btn btn-primary"> Google-login instellen→</a></div>128 <h2><%= t('aset.google_login') %></h2> 129 <p class="set-help"><%= t('aset.google_login_help') %> 130 <% if (google && google.configured) { %><strong><%= t('aset.status_set') %> ✓</strong><% } else { %><%= t('aset.not_set_yet') %><% } %></p> 131 <div class="set-actions"><a href="/admin/settings/google" class="btn btn-primary"><%= t('aset.google_login_setup') %> →</a></div> 137 132 </section> 138 133 … … 140 135 <% if (typeof premiumUnlocked === 'undefined' || premiumUnlocked) { %> 141 136 <section class="set-card" style="margin-top:1rem"> 142 <h2> Nieuwsbrief</h2>143 <p class="set-help"> Toon een <strong>aanmeldveld in de footer</strong> van je site zodat bezoekers zich op elke pagina kunnen inschrijven. (De volledige aanmeldpagina blijft op<code><%= (typeof siteUrlBase !== 'undefined' && siteUrlBase) ? siteUrlBase : '' %>/nieuwsbrief</code>.)</p>137 <h2><%= t('aset.newsletter') %></h2> 138 <p class="set-help"><%= t('aset.newsletter_help_1') %> <strong><%= t('aset.newsletter_footer_field') %></strong> <%= t('aset.newsletter_help_2') %> <code><%= (typeof siteUrlBase !== 'undefined' && siteUrlBase) ? siteUrlBase : '' %>/nieuwsbrief</code>.)</p> 144 139 <form method="post" action="/admin/settings/footer" class="set-form"> 145 140 <label class="set-toggle" style="display:flex;align-items:center;gap:.6rem;cursor:pointer"> 146 141 <input type="checkbox" name="footer_newsletter" value="1" <%= footerNewsletter ? 'checked' : '' %>> 147 <span> Aanmeldveld in de footer tonen</span>148 </label> 149 <div class="set-actions"><button type="submit" class="btn btn-primary"> Opslaan</button></div>142 <span><%= t('aset.newsletter_show_footer') %></span> 143 </label> 144 <div class="set-actions"><button type="submit" class="btn btn-primary"><%= t('aset.save') %></button></div> 150 145 </form> 151 146 </section> … … 154 149 <%# E-mail / SMTP — nodig voor nieuwsbrief versturen, notify-mails en wachtwoord-reset. %> 155 150 <section class="set-card" style="margin-top:1rem"> 156 <h2> E-mail (SMTP)</h2>157 <p class="set-help"> Nodig om de <strong>nieuwsbrief te versturen</strong>, <strong>show-notify</strong>-mails te sturen en wachtwoord-reset per mail te laten werken. Vul de gegevens van je mailprovider in (bv. je hostingmail, Gmail-app-wachtwoord, Brevo, Mailgun…).158 <% if (smtp && smtp.configured) { %><br><strong> Status: ingesteld ✓</strong><% if (smtp.fromEnv) { %> <small>(via .env)</small><% } %><% } else { %><br>Nog niet ingesteld — versturen werkt nog niet.<% } %></p>151 <h2><%= t('aset.email_smtp') %></h2> 152 <p class="set-help"><%= t('aset.smtp_help_1') %> <strong><%= t('aset.smtp_help_newsletter') %></strong><%= t('aset.smtp_help_2') %> <strong><%= t('aset.smtp_help_notify') %></strong><%= t('aset.smtp_help_3') %> 153 <% if (smtp && smtp.configured) { %><br><strong><%= t('aset.status_set') %> ✓</strong><% if (smtp.fromEnv) { %> <small>(<%= t('aset.via_env') %>)</small><% } %><% } else { %><br><%= t('aset.smtp_not_set') %><% } %></p> 159 154 160 155 <form method="post" action="/admin/settings/smtp" class="set-form"> 161 <label><span> SMTP-host</span>156 <label><span><%= t('aset.smtp_host') %></span> 162 157 <input type="text" name="smtp_host" value="<%= smtp ? smtp.host : '' %>" placeholder="smtp.jouwprovider.nl" autocomplete="off"> 163 158 </label> 164 <label><span> Poort <small style="font-weight:400">— 587 (STARTTLS) of 465 (SSL)</small></span>159 <label><span><%= t('aset.smtp_port') %> <small style="font-weight:400">— <%= t('aset.smtp_port_hint') %></small></span> 165 160 <input type="text" name="smtp_port" value="<%= (smtp && smtp.port) ? smtp.port : '' %>" placeholder="587" autocomplete="off" inputmode="numeric"> 166 161 </label> 167 <label><span> Gebruikersnaam</span>162 <label><span><%= t('aset.smtp_user') %></span> 168 163 <input type="text" name="smtp_user" value="<%= smtp ? smtp.user : '' %>" placeholder="jij@jouwprovider.nl" autocomplete="off"> 169 164 </label> 170 <label><span> Wachtwoord <% if (smtp && smtp.passSet) { %><small style="font-weight:400">— ingesteld; leeg laten = ongewijzigd</small><% } %></span>171 <input type="password" name="smtp_pass" placeholder="<%= (smtp && smtp.passSet) ? '•••••••• (ingesteld)' : 'app-wachtwoord'%>" autocomplete="off">172 </label> 173 <label><span> Afzender <small style="font-weight:400">— optioneel; standaard = gebruikersnaam</small></span>174 <input type="text" name="smtp_from" value="<%= smtp ? smtp.from : '' %>" placeholder=" Jouw Naam <jij@jouwprovider.nl>" autocomplete="off">165 <label><span><%= t('aset.smtp_pass') %> <% if (smtp && smtp.passSet) { %><small style="font-weight:400">— <%= t('aset.smtp_pass_set_hint') %></small><% } %></span> 166 <input type="password" name="smtp_pass" placeholder="<%= (smtp && smtp.passSet) ? t('aset.smtp_pass_ph_set') : t('aset.smtp_pass_ph') %>" autocomplete="off"> 167 </label> 168 <label><span><%= t('aset.smtp_from') %> <small style="font-weight:400">— <%= t('aset.smtp_from_hint') %></small></span> 169 <input type="text" name="smtp_from" value="<%= smtp ? smtp.from : '' %>" placeholder="<%= t('aset.smtp_from_ph') %>" autocomplete="off"> 175 170 </label> 176 171 <div class="set-actions"> 177 <button type="submit" class="btn btn-primary"> SMTP opslaan</button>172 <button type="submit" class="btn btn-primary"><%= t('aset.smtp_save') %></button> 178 173 <% if (smtp && (smtp.host || smtp.passSet)) { %> 179 <button type="submit" name="clear" value="1" class="btn" formnovalidate> Wissen</button>174 <button type="submit" name="clear" value="1" class="btn" formnovalidate><%= t('aset.clear') %></button> 180 175 <% } %> 181 176 </div> … … 184 179 <% if (smtp && smtp.configured) { %> 185 180 <form method="post" action="/admin/settings/smtp/test" class="set-form" style="margin-top:.8rem"> 186 <label><span> Testmail sturen naar</span>181 <label><span><%= t('aset.test_mail_to') %></span> 187 182 <input type="email" name="to" placeholder="jij@email.nl" autocomplete="off"> 188 183 </label> 189 <div class="set-actions"><button type="submit" class="btn">✉ Testmail sturen</button></div>184 <div class="set-actions"><button type="submit" class="btn">✉ <%= t('aset.send_test_mail') %></button></div> 190 185 </form> 191 186 <% } %>
Note:
See TracChangeset
for help on using the changeset viewer.
![(please configure the [header_logo] section in trac.ini)](/chrome/site/your_project_logo.png)