Some reformatting and reordering buttons

This commit is contained in:
ManeraKai 2022-11-13 17:48:07 +03:00
parent 544b69602e
commit 01a9a55f7d
No known key found for this signature in database
GPG Key ID: 5ABC31FFD562E337
3 changed files with 215 additions and 193 deletions

View File

@ -1,28 +1,37 @@
<section class="option-block" id="about_page">
<div class="some-block option-block">
<h1 data-localise="__MSG_about__">About</h1>
</div>
<hr>
<div class="about">
<section class="option-block" id="about_page">
<div class="some-block option-block">
<h4>Donate: ♥️</h4>
<h4><a href='https://libredirect.codeberg.page/donate'>https://libredirect.codeberg.page/donate</a> </h4>
<h1 data-localise="__MSG_about__">About</h1>
</div>
<div class="some-block option-block">
<h4>FAQ:</h4>
<h4><a href='https://libredirect.codeberg.page/faq'>https://libredirect.codeberg.page/faq</a></h4>
<hr>
<div class="about">
<div class="some-block option-block">
<h4>Donate: ♥️</h4>
<h4><a href='https://libredirect.codeberg.page/donate'>https://libredirect.codeberg.page/donate</a> </h4>
</div>
<div class="some-block option-block">
<h4>FAQ:</h4>
<h4><a href='https://libredirect.codeberg.page/faq'>https://libredirect.codeberg.page/faq</a></h4>
</div>
<div class="some-block option-block">
<h4>Docs:</h4>
<h4><a href='https://libredirect.codeberg.page/docs'>https://libredirect.codeberg.page/docs</a></h4>
</div>
<div class="some-block option-block">
<h4>Source Code:</h4>
<h4><a href='https://libredirect.codeberg.page/source_code'>https://libredirect.codeberg.page/source_code</a></h4>
</div>
<div class="some-block option-block">
<h4>Forked from:</h4>
<h4><a href="https://github.com/SimonBrazell/privacy-redirect">Privacy Redirect</a></h4>
</div>
</div>
<div class="some-block option-block">
<h4>Docs:</h4>
<h4><a href='https://libredirect.codeberg.page/docs'>https://libredirect.codeberg.page/docs</a></h4>
</div>
<div class="some-block option-block">
<h4>Source Code:</h4>
<h4><a href='https://libredirect.codeberg.page/source_code'>https://libredirect.codeberg.page/source_code</a></h4>
</div>
<div class="some-block option-block">
<h4>Forked from:</h4>
<h4><a href="https://github.com/SimonBrazell/privacy-redirect">Privacy Redirect</a></h4>
</div>
</div>
</section>
</section>

View File

@ -1,89 +1,101 @@
<section class="option-block" id="general_page">
<div class="some-block option-block">
<h1 data-localise="__MSG_general__">General</h1>
</div>
<hr />
<div class="some-block option-block">
<h4 data-localise="__MSG_theme__">Theme</h4>
<select id="theme">
<option value="detect" data-localise="__MSG_detect__">Detect</option>
<option value="light" data-localise="__MSG_light__">Light</option>
<option value="dark" data-localise="__MSG_dark__">Dark</option>
</select>
</div>
<div class="some-block option-block">
<h4 data-localise="__MSG_network__">Network</h4>
<select id="network">
<% for (const network in config.networks) { -%>
<option value="<%= network %>"><%= config.networks[network].name %></option>
<% }; %>
</select>
</div>
<div id="network-fallback">
<div class="some-block option-block">
<h4 data-localise="__MSG_networkFallback__">Fallback to clearnet if no instances are available for the current network</h4>
<input id="network-fallback-checkbox" type="checkbox" />
</div>
</div>
<div class="some-block option-block">
<h4 data-localise="__MSG_autoRedirect__"></h4>
<input id="auto-redirect" type="checkbox" />
</div>
<form>
<div class="some-block option-block">
<h4 data-localise="__MSG_latencyThreshold">Latency Threshold</h4>
<output id="latency-output" for="latencyInput" name="latencyOutput"></output>
<input id="latency-input" type="range" min="50" max="5000" value="1000" name="latencyInput" step="50" />
</div>
</form>
<hr>
<div class="some-block option-block">
<h4 data-localise="__MSG_exclude_from_redirecting_">Excluded from redirecting</h4>
</div>
<form id="custom-exceptions-instance-form">
<div class="some-block option-block">
<div class="some-block" style="padding: 0">
<input id="exceptions-custom-instance" placeholder="https://www.google.com" type="url" />&nbsp;
<select id="exceptions-custom-instance-type">
<option value="url">URL</option>
<option value="regex">Regex</option></select
>&nbsp;
</div>
<button class="add" id="exceptions-add-instance" type="submit">
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path>
</svg>
</button>
</div>
</form>
<hr>
<div class="checklist" id="exceptions-custom-checklist"></div>
<div class="buttons buttons-inline">
<a class="button button-inline" id="update-instances">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"></path>
</svg>
<x data-localise="__MSG_updateInstances__">Update Instances</x></a
>&nbsp; &nbsp;
</div>
<div class="buttons buttons-inline">
<label class="button button-inline" id="import_settings_text" for="import-settings">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path></svg
>&nbsp;
<x data-localise="__MSG_importSettings__">Import Settings</x>
</label>
<input class="button button-inline" id="import-settings" type="file" style="display: none" />&nbsp; &nbsp;<a class="button button-inline" id="export-settings">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M10.09 15.59L11.5 17l5-5-5-5-1.41 1.41L12.67 11H3v2h9.67l-2.58 2.59zM19 3H5c-1.11 0-2 .9-2 2v4h2V5h14v14H5v-4H3v4c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path></svg
>&nbsp; <x data-localise="__MSG_exportSettings__">Export Settings</x></a
>&nbsp; &nbsp;<a class="button button-inline" id="reset-settings">
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M12,5V2L8,6l4,4V7c3.31,0,6,2.69,6,6c0,2.97-2.17,5.43-5,5.91v2.02c3.95-0.49,7-3.85,7-7.93C20,8.58,16.42,5,12,5z"></path>
<path d="M6,13c0-1.65,0.67-3.15,1.76-4.24L6.34,7.34C4.9,8.79,4,10.79,4,13c0,4.08,3.05,7.44,7,7.93v-2.02 C8.17,18.43,6,15.97,6,13z"></path>
</svg>
<x data-localise="__MSG_resetSettings__">Reset Settings</x></a
>
</div>
<script type="module" src="./widgets/general.js"></script>
</section>
<div class="some-block option-block">
<h1 data-localise="__MSG_general__">General</h1>
</div>
<hr />
<div class="some-block option-block">
<h4 data-localise="__MSG_theme__">Theme</h4>
<select id="theme">
<option value="detect" data-localise="__MSG_detect__">Detect</option>
<option value="light" data-localise="__MSG_light__">Light</option>
<option value="dark" data-localise="__MSG_dark__">Dark</option>
</select>
</div>
<div class="some-block option-block">
<h4 data-localise="__MSG_network__">Network</h4>
<select id="network">
<% for (const network in config.networks) { -%>
<option value="<%= network %>"><%= config.networks[network].name %></option>
<% }; %>
</select>
</div>
<div id="network-fallback">
<div class="some-block option-block">
<h4 data-localise="__MSG_networkFallback__">Fallback to clearnet if no instances are available for the current network</h4>
<input id="network-fallback-checkbox" type="checkbox" />
</div>
</div>
<div class="some-block option-block">
<h4 data-localise="__MSG_autoRedirect__"></h4>
<input id="auto-redirect" type="checkbox" />
</div>
<form>
<div class="some-block option-block">
<h4 data-localise="__MSG_latencyThreshold">Latency Threshold</h4>
<output id="latency-output" for="latencyInput" name="latencyOutput"></output>
<input id="latency-input" type="range" min="50" max="5000" value="1000" name="latencyInput" step="50" />
</div>
</form>
<hr>
<div class="some-block option-block">
<h4 data-localise="__MSG_exclude_from_redirecting_">Excluded from redirecting</h4>
</div>
<form id="custom-exceptions-instance-form">
<div class="some-block option-block">
<div class="some-block" style="padding: 0">
<input id="exceptions-custom-instance" placeholder="https://www.google.com" type="url" />&nbsp;
<select id="exceptions-custom-instance-type">
<option value="url">URL</option>
<option value="regex">Regex</option>
</select>&nbsp;
</div>
<button class="add" id="exceptions-add-instance" type="submit">
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path>
</svg>
</button>
</div>
</form>
<hr>
<div class="checklist" id="exceptions-custom-checklist"></div>
<div class="buttons buttons-inline">
<a class="button button-inline" id="update-instances">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z"></path>
</svg>
<x data-localise="__MSG_updateInstances__">Update Instances</x>
</a>&nbsp; &nbsp;
</div>
<div class="buttons buttons-inline">
<label class="button button-inline" id="import_settings_text" for="import-settings">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
</svg>&nbsp;
<x data-localise="__MSG_importSettings__">Import Settings</x>
</label>
<input class="button button-inline" id="import-settings" type="file" style="display: none" />&nbsp; &nbsp;<a class="button button-inline" id="export-settings">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M10.09 15.59L11.5 17l5-5-5-5-1.41 1.41L12.67 11H3v2h9.67l-2.58 2.59zM19 3H5c-1.11 0-2 .9-2 2v4h2V5h14v14H5v-4H3v4c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
</svg>&nbsp; <x data-localise="__MSG_exportSettings__">Export Settings</x></a>&nbsp; &nbsp;<a class="button button-inline" id="reset-settings">
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M12,5V2L8,6l4,4V7c3.31,0,6,2.69,6,6c0,2.97-2.17,5.43-5,5.91v2.02c3.95-0.49,7-3.85,7-7.93C20,8.58,16.42,5,12,5z"></path>
<path d="M6,13c0-1.65,0.67-3.15,1.76-4.24L6.34,7.34C4.9,8.79,4,10.79,4,13c0,4.08,3.05,7.44,7,7.93v-2.02 C8.17,18.43,6,15.97,6,13z"></path>
</svg>
<x data-localise="__MSG_resetSettings__">Reset Settings</x>
</a>
</div>
<script type="module" src="./widgets/general.js"></script>
</section>

View File

@ -1,84 +1,85 @@
<% for (const service in config.services) { -%>
<section class="option-block" id="<%= service %>_page">
<div class="some-block option-block">
<h1 data-localise="__MSG_<%= service %>__"><%= config.services[service].name %></h1>
</div>
<hr />
<div class="some-block option-block">
<h4 data-localise="__MSG_enable__">Enable</h4>
<input id="<%= service %>-enabled" type="checkbox" />
</div>
<div class="some-block option-block">
<h4 data-localise="__MSG_show_in_popup__">Show in Popup</h4>
<input id="<%= service %>" type="checkbox" />
</div>
<% if (Object.keys(config.services[service].frontends).length> 1) { %>
<div class="some-block option-block">
<h4 data-localise="__MSG_frontend__">Frontend</h4>
<select id="<%= service %>-frontend">
<% for (const frontend in config.services[service].frontends) { -%>
<option value="<%= frontend %>"><%= config.services[service].frontends[frontend].name %></option>
<% } %>
</select>
</div>
<% if (config.services[service].embeddable) { _%>
<div class="some-block option-block">
<h4 data-localise="__MSG_embed_frontend__">Embed Frontend</h4>
<select id="<%= service %>-embedFrontend">
<% for (const frontend in config.services[service].frontends) { -%> <% if (config.services[service].frontends[frontend].embeddable) { _%>
<option value="<%= frontend %>"><%= config.services[service].frontends[frontend].name %></option>
<% } _%> <% } %>
</select>
</div>
<% } _%> <% } _%> <% if (config.services[service].embeddable) { _%>
<div class="some-block option-block">
<h4 data-localise="__MSG_redirectType__">Redirect Type</h4>
<select id="<%= service %>-redirectType">
<option value="both" data-localise="__MSG_both__">both</option>
<option value="sub_frame" data-localise="__MSG_onlyEmbedded__">Only Embedded</option>
<option value="main_frame" data-localise="__MSG_onlyNotEmbedded__">Only Not Embedded</option>
</select>
</div>
<% } _%>
<hr />
<% for (const frontend in config.services[service].frontends) { -%> <% if (config.services[service].frontends[frontend].instanceList) { _%>
<div id="<%= frontend %>">
<% for (const network in config.networks) { -%>
<div class="<%= network %>">
<div class="some-block option-block">
<h4 data-localise="__MSG_defaultInstances__">Default Instances</h4>
</div>
<div class="checklist"></div>
<hr />
<div class="some-block option-block">
<h4 data-localise="__MSG_customInstances__">Custom Instances</h4>
</div>
<form class="custom-instance-form">
<div class="some-block option-block">
<input class="custom-instance" placeholder="http://<%= frontend %>.<%= config.networks[network].tld %>" type="url" />
<button class="add add-instance" type="submit">
<svg xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path>
</svg>
</button>
</div>
</form>
<div class="checklist custom-checklist"></div>
<% if (network=="clearnet" ) { _%>
<div class="buttons buttons-inline">
<label class="button button-inline" id="latency-<%= frontend %>-label" for="latency-<%= frontend %>">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path></svg
>&nbsp;
<x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
</label>
<input class="button button-inline" id="latency-<%= frontend %>" style="display: none" />
</div>
<% } _%>
</div>
<% } %>
</div>
<% } _%> <% } %>
<div class="some-block option-block">
<h1 data-localise="__MSG_<%= service %>__"><%= config.services[service].name %></h1>
</div>
<hr />
<div class="some-block option-block">
<h4 data-localise="__MSG_enable__">Enable</h4>
<input id="<%= service %>-enabled" type="checkbox" />
</div>
<div class="some-block option-block">
<h4 data-localise="__MSG_show_in_popup__">Show in Popup</h4>
<input id="<%= service %>" type="checkbox" />
</div>
<% if (Object.keys(config.services[service].frontends).length> 1) { %>
<div class="some-block option-block">
<h4 data-localise="__MSG_frontend__">Frontend</h4>
<select id="<%= service %>-frontend">
<% for (const frontend in config.services[service].frontends) { -%>
<option value="<%= frontend %>"><%= config.services[service].frontends[frontend].name %></option>
<% } %>
</select>
</div>
<% if (config.services[service].embeddable) { _%>
<div class="some-block option-block">
<h4 data-localise="__MSG_embed_frontend__">Embed Frontend</h4>
<select id="<%= service %>-embedFrontend">
<% for (const frontend in config.services[service].frontends) { -%> <% if (config.services[service].frontends[frontend].embeddable) { _%>
<option value="<%= frontend %>"><%= config.services[service].frontends[frontend].name %></option>
<% } _%> <% } %>
</select>
</div>
<% } _%> <% } _%> <% if (config.services[service].embeddable) { _%>
<div class="some-block option-block">
<h4 data-localise="__MSG_redirectType__">Redirect Type</h4>
<select id="<%= service %>-redirectType">
<option value="both" data-localise="__MSG_both__">both</option>
<option value="sub_frame" data-localise="__MSG_onlyEmbedded__">Only Embedded</option>
<option value="main_frame" data-localise="__MSG_onlyNotEmbedded__">Only Not Embedded</option>
</select>
</div>
<% } _%>
<hr />
<% for (const frontend in config.services[service].frontends) { -%> <% if (config.services[service].frontends[frontend].instanceList) { _%>
<div id="<%= frontend %>">
<% for (const network in config.networks) { -%>
<div class="buttons buttons-inline">
<label class="button button-inline" id="latency-<%= frontend %>-label" for="latency-<%= frontend %>">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="currentColor">
<path d="M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z"></path>
</svg>
&nbsp;
<x data-localise="__MSG_testInstancesLatency__">Test Instances Latency</x>
</label>
<input class="button button-inline" id="latency-<%= frontend %>" style="display: none" />
</div>
<div class="<%= network %>">
<div class="some-block option-block">
<h4 data-localise="__MSG_defaultInstances__">Default Instances</h4>
</div>
<div class="checklist"></div>
<hr />
<div class="some-block option-block">
<h4 data-localise="__MSG_customInstances__">Custom Instances</h4>
</div>
<form class="custom-instance-form">
<div class="some-block option-block">
<input class="custom-instance" placeholder="http://<%= frontend %>.<%= config.networks[network].tld %>" type="url" />
<button class="add add-instance" type="submit">
<svg xmlns="https://www.w3.org/2000/svg" height="20px" viewBox="0 0 24 24" width="20px" fill="currentColor">
<path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"></path>
</svg>
</button>
</div>
</form>
<div class="checklist custom-checklist"></div>
<% if (network=="clearnet" ) { _%>
<% } _%>
</div>
<% } %>
</div>
<% } _%> <% } %>
</section>
<% } %>
<script type="module" src="./widgets/services.js"></script>
<script type="module" src="./widgets/services.js"></script>