Files
expose/resources/views/server/settings/index.twig
Marcel Pociot 645330f08f wip
2020-06-16 00:09:04 +02:00

161 lines
10 KiB
Twig

{% extends "app" %}
{% block title %}Settings{% endblock %}
{% block content %}
<div class="flex flex-col py-8">
<div class="-my-2 py-2 overflow-x-auto sm:-mx-6 sm:px-6 lg:-mx-8 lg:px-8">
<form action="" method="POST">
<div>
<div>
<div class="">
<div class="">
<div role="group" aria-labelledby="label-email">
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-baseline">
<div>
<div
class="text-base leading-6 font-medium text-gray-900 sm:text-sm sm:leading-5 sm:text-gray-700"
id="label-email">
Authentication
</div>
</div>
<div class="mt-4 sm:mt-0 sm:col-span-2">
<div class="max-w-lg">
<div class="relative flex items-start">
<div class="absolute flex items-center h-5">
<input id="authentication"
type="checkbox"
name="validate_auth_tokens"
value="1"
v-model="configuration.validate_auth_tokens"
class="form-checkbox h-4 w-4 text-indigo-600 transition duration-150 ease-in-out"/>
</div>
<div class="pl-7 text-sm leading-5">
<label for="authentication" class="font-medium text-gray-700">Require
authentication tokens</label>
<p class="text-gray-500">Only allow connection from clients with
valid authentication tokens</p>
</div>
</div>
</div>
</div>
</div>
<div
class="mt-6 sm:mt-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="motd"
class="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
Message of the day
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<div class="max-w-lg flex rounded-md shadow-sm">
<textarea id="motd" name="motd" rows="3"
v-model="configuration.messages.message_of_the_day"
class="form-textarea block w-full transition duration-150 ease-in-out sm:text-sm sm:leading-5"></textarea>
</div>
<p class="mt-2 text-sm text-gray-500">This message will be shown when a
successful connection can be established.</p>
</div>
</div>
<div
class="mt-6 sm:mt-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="maximum_connection_length"
class="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
Maximum connection length
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<div class="max-w-lg flex rounded-md shadow-sm">
<input type="number" id="maximum_connection_length" name="maximum_connection_length"
v-model="configuration.maximum_connection_length"
class="form-textarea block w-full transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
</div>
<p class="mt-2 text-sm text-gray-500">The amount of minutes that clients may be connected to this expose server. 0 means there is no limit.</p>
</div>
</div>
<div
class="mt-6 sm:mt-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="invalid_auth_token"
class="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
Authentication Failed
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<div class="max-w-lg flex rounded-md shadow-sm">
<textarea id="invalid_auth_token"
name="invalid_auth_token"
rows="3"
v-model="configuration.messages.invalid_auth_token"
class="form-textarea block w-full transition duration-150 ease-in-out sm:text-sm sm:leading-5"></textarea>
</div>
<p class="mt-2 text-sm text-gray-500">This message will be shown when a
user tries to connect with an invalid authentication token.</p>
</div>
</div>
<div
class="mt-6 sm:mt-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:border-t sm:border-gray-200 sm:pt-5">
<label for="subdomain_taken"
class="block text-sm font-medium leading-5 text-gray-700 sm:mt-px sm:pt-2">
Subdomain taken
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<div class="max-w-lg flex rounded-md shadow-sm">
<textarea id="subdomain_taken" name="subdomain_taken" rows="3"
v-model="configuration.messages.subdomain_taken"
class="form-textarea block w-full transition duration-150 ease-in-out sm:text-sm sm:leading-5"></textarea>
</div>
<p class="mt-2 text-sm text-gray-500">This message will be shown when a
user tries to connect with an already registered subdomain. You can use
<code class="font-mono bg-gray-500 text-white p-1">:subdomain</code> as
a placeholder.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="mt-8 border-t border-gray-200 pt-5">
<div class="flex justify-end">
<span class="ml-3 inline-flex rounded-md shadow-sm">
<button type="submit"
@click.prevent="saveSettings"
class="inline-flex justify-center py-2 px-4 border border-transparent text-sm leading-5 font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-500 focus:outline-none focus:border-indigo-700 focus:shadow-outline-indigo active:bg-indigo-700 transition duration-150 ease-in-out">
Save
</button>
</span>
</div>
</div>
</form>
</div>
</div>
{% endblock %}
{% block scripts %}
<script>
new Vue({
el: '#app',
delimiters: ['@{', '}'],
data: {
configuration: {{ configuration|json_encode|raw }}
},
methods: {
saveSettings() {
fetch('/api/settings', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(this.configuration)
}).then((response) => {
return response.json();
}).then((data) => {
this.configuration = data.configuration;
});
}
}
})
</script>
{% endblock %}