mirror of
https://gitlab.com/crafty-controller/crafty-4.git
synced 2025-01-19 01:35:28 +01:00
Add dark mode. Refactor code to accept themes
This commit is contained in:
Andrew
parent
d7de340807
commit
e6121b06a6
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ data['lang_page'] }}" class="default">
|
||||
<html lang="{{ data['lang_page'] }}" class="dark">
|
||||
|
||||
<head>
|
||||
<!-- Required meta tags -->
|
||||
|
||||
@ -9,22 +9,22 @@
|
||||
|
||||
<div class="content-wrapper">
|
||||
|
||||
<!-- Page Title Header Starts-->
|
||||
<!-- Page Title Header Starts-->
|
||||
<div class="row page-title-header">
|
||||
<div class="col-12">
|
||||
<div class="page-header">
|
||||
{% if data['new_role'] %}
|
||||
<h4 class="page-title">
|
||||
{{ translate('rolesConfig', 'pageTitleNew', data['lang']) }}
|
||||
<br />
|
||||
<small>RID: N/A</small>
|
||||
</h4>
|
||||
<h4 class="page-title">
|
||||
{{ translate('rolesConfig', 'pageTitleNew', data['lang']) }}
|
||||
<br />
|
||||
<small>RID: N/A</small>
|
||||
</h4>
|
||||
{% else %}
|
||||
<h4 class="page-title">
|
||||
{{ translate('rolesConfig', 'pageTitle', data['lang']) }} - {{ data['role']['role_name'] }}
|
||||
<br />
|
||||
<small>RID: {{ data['role']['role_id'] }}</small>
|
||||
</h4>
|
||||
<h4 class="page-title">
|
||||
{{ translate('rolesConfig', 'pageTitle', data['lang']) }} - {{ data['role']['role_name'] }}
|
||||
<br />
|
||||
<small>RID: {{ data['role']['role_id'] }}</small>
|
||||
</h4>
|
||||
{% end %}
|
||||
</div>
|
||||
</div>
|
||||
@ -49,19 +49,24 @@
|
||||
</ul>
|
||||
<div class="">
|
||||
<div class="">
|
||||
<form id="role_form" class="forms-sample" method="post" action="{{ '/panel/add_role' if data['new_role'] else '/panel/edit_role' }}">
|
||||
<form id="role_form" class="forms-sample" method="post"
|
||||
action="{{ '/panel/add_role' if data['new_role'] else '/panel/edit_role' }}">
|
||||
{% raw xsrf_form_html() %}
|
||||
<input type="hidden" name="id" value="{{ data['role']['role_id'] }}">
|
||||
<input type="hidden" name="subpage" value="config">
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header header-sm d-flex justify-content-between align-items-center">
|
||||
<h4 class="card-title"><i class="fas fa-user-tag"></i> {{ translate('rolesConfig', 'roleTitle', data['lang']) }}</h4>
|
||||
<h4 class="card-title"><i class="fas fa-user-tag"></i> {{ translate('rolesConfig', 'roleTitle',
|
||||
data['lang']) }}</h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="form-group">
|
||||
<label for="role_name">{{ translate('rolesConfig', 'roleName', data['lang']) }} <small class="text-muted ml-1"> - {{ translate('rolesConfig', 'roleDesc', data['lang']) }}</small> </label>
|
||||
<input type="text" class="form-control" name="role_name" id="role_name" value="{{ data['role']['role_name'] }}" placeholder="Role Name" >
|
||||
<label for="role_name">{{ translate('rolesConfig', 'roleName', data['lang']) }} <small
|
||||
class="text-muted ml-1"> - {{ translate('rolesConfig', 'roleDesc', data['lang']) }}</small>
|
||||
</label>
|
||||
<input type="text" class="form-control" name="role_name" id="role_name"
|
||||
value="{{ data['role']['role_name'] }}" placeholder="Role Name">
|
||||
</div>
|
||||
|
||||
<br />
|
||||
@ -91,7 +96,9 @@
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header header-sm d-flex justify-content-between align-items-center">
|
||||
<h4 class="card-title"><i class="fas fa-server"></i> {{ translate('rolesConfig', 'roleServers', data['lang']) }} <small class="text-muted ml-1"> {{ translate('rolesConfig', 'serversDesc', data['lang']) }}</small> </h4>
|
||||
<h4 class="card-title"><i class="fas fa-server"></i> {{ translate('rolesConfig', 'roleServers',
|
||||
data['lang']) }} <small class="text-muted ml-1"> {{ translate('rolesConfig', 'serversDesc',
|
||||
data['lang']) }}</small> </h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="form-group">
|
||||
@ -109,13 +116,14 @@
|
||||
--table-border-width: 1px;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
th.rotate-column-header {
|
||||
/* Something you can count on */
|
||||
height: 140px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
th.rotate-column-header > div {
|
||||
th.rotate-column-header>div {
|
||||
transform:
|
||||
/* Magic Numbers */
|
||||
translate(0px, 51px)
|
||||
@ -123,15 +131,18 @@
|
||||
rotate(315deg);
|
||||
width: 30px;
|
||||
}
|
||||
th.rotate-column-header > div > span {
|
||||
|
||||
th.rotate-column-header>div>span {
|
||||
border-bottom: 1px solid #ccc;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
th.rotate {
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
}
|
||||
th.rotate > div {
|
||||
|
||||
th.rotate>div {
|
||||
/* place div at bottom left of the th parent */
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@ -141,24 +152,25 @@
|
||||
/* Move the top left corner of the span's bottom-border to line up with the top left corner of the td's border-right border so that the border corners are matched
|
||||
* Rotate 315 (-45) degrees about matched border corners */
|
||||
transform:
|
||||
translate(calc(100% - var(--table-border-width) / 2), var(--table-border-width))
|
||||
rotate(-45deg);
|
||||
translate(calc(100% - var(--table-border-width) / 2), var(--table-border-width)) rotate(-45deg);
|
||||
transform-origin: 0% calc(100% - var(--table-border-width));
|
||||
transition: transform 500ms;
|
||||
width: 100%;
|
||||
}
|
||||
th.rotate > div > span {
|
||||
|
||||
th.rotate>div>span {
|
||||
/* make sure the bottom of the span is matched up with the bottom of the parent div */
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
border-bottom: var(--table-border-width) solid #383e5d;
|
||||
border-bottom: var(--table-border-width) solid var(--outline);
|
||||
transition: border-bottom-color 500ms;
|
||||
padding-bottom: 5px;
|
||||
user-select: none;
|
||||
}
|
||||
table.rotate-table > tbody td {
|
||||
border-right: var(--table-border-width) solid #383e5d;
|
||||
|
||||
table.rotate-table>tbody td {
|
||||
border-right: var(--table-border-width) solid var(--outline);
|
||||
/* make sure this is at least as wide as sqrt(2) * height of the tallest letter in your font or the headers will overlap each other*/
|
||||
min-width: 30px;
|
||||
padding-top: 2px;
|
||||
@ -167,53 +179,57 @@
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1650px) {
|
||||
th.rotate > div {
|
||||
th.rotate>div {
|
||||
transform: translate(15px, 0px) rotate(0deg);
|
||||
}
|
||||
th.rotate > div > span {
|
||||
|
||||
th.rotate>div>span {
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<tr class="rounded">
|
||||
<th>{{ translate('rolesConfig', 'serverName', data['lang']) }}</th>
|
||||
<th class="rotate"><div><span>{{ translate('rolesConfig', 'serverAccess', data['lang']) }}</span></div></th>
|
||||
<th class="rotate">
|
||||
<div><span>{{ translate('rolesConfig', 'serverAccess', data['lang']) }}</span></div>
|
||||
</th>
|
||||
{% for permission in data['permissions_all'] %}
|
||||
<th class="rotate"><div><span>{{ permission.name }}</span></div></th>
|
||||
<th class="rotate">
|
||||
<div><span>{{ permission.name }}</span></div>
|
||||
</th>
|
||||
{% end %}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for server in data['servers_all'] %}
|
||||
{% for server in data['servers_all'] %}
|
||||
<tr>
|
||||
<td>{{ server['server_name'] }}</td>
|
||||
<td>
|
||||
<input type="checkbox" class="" onclick="enable_disable(event)" data-id="{{server['server_id']}}"
|
||||
id="server_{{ server['server_id'] }}_access"
|
||||
name="server_{{ server['server_id'] }}_access"
|
||||
{{ 'checked' if server['server_id'] in data['role']['servers'] else '' }}
|
||||
autocomplete="off" value="1">
|
||||
<input type="checkbox" class="" onclick="enable_disable(event)"
|
||||
data-id="{{server['server_id']}}" id="server_{{ server['server_id'] }}_access"
|
||||
name="server_{{ server['server_id'] }}_access" {{ 'checked' if server['server_id'] in
|
||||
data['role']['servers'] else '' }} autocomplete="off" value="1">
|
||||
</td>
|
||||
{% for permission in data['permissions_all'] %}
|
||||
{% if server['server_id'] in data['role']['servers'] %}
|
||||
<td>
|
||||
<input type="checkbox" class="{{server['server_id']}}_perms"
|
||||
<td>
|
||||
<input type="checkbox" class="{{server['server_id']}}_perms"
|
||||
id="permission_{{ server['server_id'] }}_{{ permission.name }}"
|
||||
name="permission_{{ server['server_id'] }}_{{ permission.name }}"
|
||||
{{ 'checked' if permission in data['permissions_dict'].get(server['server_id'], []) else '' }}
|
||||
name="permission_{{ server['server_id'] }}_{{ permission.name }}" {{ 'checked' if
|
||||
permission in data['permissions_dict'].get(server['server_id'], []) else '' }}
|
||||
autocomplete="off" value="1">
|
||||
</td>
|
||||
</td>
|
||||
{% else %}
|
||||
<td>
|
||||
<input type="checkbox" class="{{server['server_id']}}_perms"
|
||||
id="permission_{{ server['server_id'] }}_{{ permission.name }}"
|
||||
name="permission_{{ server['server_id'] }}_{{ permission.name }}"
|
||||
autocomplete="off" value="1" disabled>
|
||||
id="permission_{{ server['server_id'] }}_{{ permission.name }}"
|
||||
name="permission_{{ server['server_id'] }}_{{ permission.name }}" autocomplete="off"
|
||||
value="1" disabled>
|
||||
</td>
|
||||
{% end %}
|
||||
{% end %}
|
||||
</tr>
|
||||
{% end %}
|
||||
{% end %}
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
@ -224,18 +240,22 @@
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header header-sm d-flex justify-content-between align-items-center">
|
||||
<h4 class="card-title"><i class="fas fa-settings"></i> {{ translate('panelConfig', 'save', data['lang']) }}</h4>
|
||||
<h4 class="card-title"><i class="fas fa-settings"></i> {{ translate('panelConfig', 'save',
|
||||
data['lang']) }}</h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<button type="submit" class="btn btn-success mr-2"><i class="fas fa-save"></i> {{ translate('panelConfig', 'save', data['lang']) }}</button>
|
||||
<button type="reset" onclick="location.href='/panel/panel_config'" class="btn btn-light"><i class="fas fa-undo-alt"></i> {{ translate('panelConfig', 'cancel', data['lang']) }}</button>
|
||||
<button type="submit" class="btn btn-success mr-2"><i class="fas fa-save"></i> {{
|
||||
translate('panelConfig', 'save', data['lang']) }}</button>
|
||||
<button type="reset" onclick="location.href='/panel/panel_config'" class="btn btn-light"><i
|
||||
class="fas fa-undo-alt"></i> {{ translate('panelConfig', 'cancel', data['lang']) }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-header header-sm d-flex justify-content-between align-items-center">
|
||||
<h4 class="card-title"><i class="fas fa-users"></i> {{ translate('rolesConfig', 'roleUsers', data['lang']) }}</h4>
|
||||
<h4 class="card-title"><i class="fas fa-users"></i> {{ translate('rolesConfig', 'roleUsers',
|
||||
data['lang']) }}</h4>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="table-responsive">
|
||||
@ -247,18 +267,18 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for user in data['users'] %}
|
||||
{% for user in data['users'] %}
|
||||
{% for ruser in data['user-roles'][user.user_id] %}
|
||||
{% if ruser == data['role']['role_name'] %}
|
||||
<tr>
|
||||
<td>{{ user.username }}</td>
|
||||
<td>
|
||||
<a href="/panel/edit_user?id={{user.user_id}}"><i class="fas fa-user-edit"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
{% end %}
|
||||
{% if ruser == data['role']['role_name'] %}
|
||||
<tr>
|
||||
<td>{{ user.username }}</td>
|
||||
<td>
|
||||
<a href="/panel/edit_user?id={{user.user_id}}"><i class="fas fa-user-edit"></i></a>
|
||||
</td>
|
||||
</tr>
|
||||
{% end %}
|
||||
{% end %}
|
||||
{% end %}
|
||||
{% end %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@ -272,20 +292,24 @@
|
||||
<blockquote class="blockquote">
|
||||
<p class="mb-0">
|
||||
{{ translate('rolesConfig', 'created', data['lang']) }} {{ str(data['role']['created']) }}
|
||||
<br />
|
||||
{{ translate('rolesConfig', 'configUpdate', data['lang']) }} {{ str(data['role']['last_update']) }}
|
||||
<br />
|
||||
{{ translate('userConfig', 'manager', data['lang']) }}: {{ data['role_manager']['username'] }}
|
||||
<br />
|
||||
<br />
|
||||
{{ translate('rolesConfig', 'configUpdate', data['lang']) }} {{ str(data['role']['last_update'])
|
||||
}}
|
||||
<br />
|
||||
{{ translate('userConfig', 'manager', data['lang']) }}: {{ data['role_manager']['username'] }}
|
||||
<br />
|
||||
</p>
|
||||
</blockquote>
|
||||
<div class="text-center">
|
||||
{% if data['new_role'] %}
|
||||
<a class="btn btn-sm btn-danger disabled"><i class="fas fa-trash"></i>{{ translate('rolesConfig', 'delRole', data['lang']) }}</a><br />
|
||||
<small>{{ translate('rolesConfig', 'doesNotExist', data['lang']) }}</small>
|
||||
<a class="btn btn-sm btn-danger disabled"><i class="fas fa-trash"></i>{{ translate('rolesConfig',
|
||||
'delRole', data['lang']) }}</a><br />
|
||||
<small>{{ translate('rolesConfig', 'doesNotExist', data['lang']) }}</small>
|
||||
{% else %}
|
||||
<a href="/panel/remove_role?id={{ data['role']['role_id'] }}" class="btn btn-sm btn-danger"><i class="fas fa-trash"></i>{{ translate('rolesConfig', 'delRole', data['lang']) }}</a>
|
||||
<a href="/panel/remove_role?id={{ data['role']['role_id'] }}" class="btn btn-sm btn-danger"><i
|
||||
class="fas fa-trash"></i>{{ translate('rolesConfig', 'delRole', data['lang']) }}</a>
|
||||
{% end %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -294,38 +318,37 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- content-wrapper ends -->
|
||||
<!-- content-wrapper ends -->
|
||||
|
||||
{% end %}
|
||||
{% end %}
|
||||
|
||||
{% block js %}
|
||||
<script>
|
||||
{% block js %}
|
||||
<script>
|
||||
|
||||
function enable_disable(event) {
|
||||
function enable_disable(event) {
|
||||
let server_id = event.target.getAttribute('data-id');
|
||||
console.log(server_id);
|
||||
if (document.getElementById("server_" + server_id + "_access").checked) {
|
||||
$('.'+server_id+'_perms').attr('disabled', false);
|
||||
$('.'+server_id+'_perms').attr('enabled', true);
|
||||
}else{
|
||||
$('.'+server_id+'_perms').prop('checked', false);
|
||||
$('.'+server_id+'_perms').attr('disabled', true);
|
||||
$('.'+server_id+'_perms').attr('enabled', false);
|
||||
$('.' + server_id + '_perms').attr('disabled', false);
|
||||
$('.' + server_id + '_perms').attr('enabled', true);
|
||||
} else {
|
||||
$('.' + server_id + '_perms').prop('checked', false);
|
||||
$('.' + server_id + '_perms').attr('disabled', true);
|
||||
$('.' + server_id + '_perms').attr('enabled', false);
|
||||
}
|
||||
|
||||
}
|
||||
//used to get cookies from browser - this is part of tornados xsrf protection - it's for extra security
|
||||
function getCookie(name) {
|
||||
var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
|
||||
return r ? r[1] : undefined;
|
||||
var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
|
||||
return r ? r[1] : undefined;
|
||||
}
|
||||
|
||||
$( document ).ready(function() {
|
||||
console.log( "ready!" );
|
||||
$(document).ready(function () {
|
||||
console.log("ready!");
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
</script>
|
||||
|
||||
{% end %}
|
||||
{% end %}
|
||||
@ -42,7 +42,6 @@
|
||||
<div class="col-md-6 col-sm-12">
|
||||
<style>
|
||||
.playerItem {
|
||||
background: #1c1e2f;
|
||||
padding: 1rem;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
|
||||
@ -42,7 +42,7 @@
|
||||
<div class="col-md-12">
|
||||
<div class="input-group">
|
||||
<div id="virt_console" class=""
|
||||
style="font-size: .8em; padding: 5px 10px; border: 1px solid #383e5d; background-color:#2a2c44;height:500px; overflow: scroll;">
|
||||
style="font-size: .8em; padding: 5px 10px; border: 1px solid var(--outline); background-color:var(--card-banner-bg);height:500px; overflow: scroll;">
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
@ -14,7 +14,8 @@
|
||||
<div class="col-12">
|
||||
<div class="page-header">
|
||||
<h4 class="page-title">
|
||||
{{ translate('serverDetails', 'serverDetails', data['lang']) }} - {{ data['server_stats']['server_id']['server_name'] }}
|
||||
{{ translate('serverDetails', 'serverDetails', data['lang']) }} - {{
|
||||
data['server_stats']['server_id']['server_name'] }}
|
||||
<br />
|
||||
<small>UUID: {{ data['server_stats']['server_id']['server_uuid'] }}</small>
|
||||
</h4>
|
||||
@ -40,16 +41,21 @@
|
||||
</span>
|
||||
|
||||
<div class="col-md-12">
|
||||
<button id="to-bottom" style="visibility: hidden; float: right;" class="btn btn-outline-success">{{ translate('serverDetails', 'reset', data['lang']) }}</button>
|
||||
<button id="to-bottom" style="visibility: hidden; float: right;" class="btn btn-outline-success">{{
|
||||
translate('serverDetails', 'reset', data['lang']) }}</button>
|
||||
<br />
|
||||
<br />
|
||||
<div class="input-group">
|
||||
<div id="virt_console" class="" style="width: 100%; font-size: .8em; padding: 5px 10px; border: 1px solid #383e5d; background-color:#2a2c44;height:500px; overflow: scroll;"></div>
|
||||
<div id="virt_console" class=""
|
||||
style="width: 100%; font-size: .8em; padding: 5px 10px; border: 1px solid var(--outline); background-color:var(--card-banner-bg);height:500px; overflow: scroll;">
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
<div style="gap: 0.5rem;" class="input-group flex-wrap">
|
||||
<input style="min-width: 10rem;" type="text" class="form-control" id="server_command" name="server_command" placeholder="{{ translate('serverTerm', 'commandInput', data['lang']) }}" autofocus="">
|
||||
<input style="min-width: 10rem;" type="text" class="form-control" id="server_command"
|
||||
name="server_command" placeholder="{{ translate('serverTerm', 'commandInput', data['lang']) }}"
|
||||
autofocus="">
|
||||
<span class="input-group-btn ml-5">
|
||||
<button id="submit" class="btn btn-sm btn-info" type="button">{{ translate('serverTerm', 'sendCommand',
|
||||
data['lang']) }}</button>
|
||||
@ -57,30 +63,60 @@
|
||||
</div>
|
||||
{% if data['permissions']['Commands'] in data['user_permissions'] %}
|
||||
{% if data['server_stats']['updating']%}
|
||||
<div id="update_control_buttons" class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0" style="visibility: visible">
|
||||
<button onclick="" id="start-btn" style="max-width: 7rem;" class="btn btn-warning m-1 flex-grow-1 disabled"><i
|
||||
class="fa fa-spinner fa-spin"></i> {{ translate('serverTerm', 'updating', data['lang']) }}</button>
|
||||
<button onclick="" id="restart-btn" style="max-width: 7rem;" class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart', data['lang']) %}</button>
|
||||
<button onclick="" id="stop-btn" style="max-width: 7rem;" class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
|
||||
<div id="update_control_buttons"
|
||||
class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
|
||||
style="visibility: visible">
|
||||
<button onclick="" id="start-btn" style="max-width: 7rem;"
|
||||
class="btn btn-warning m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i> {{
|
||||
translate('serverTerm', 'updating', data['lang']) }}</button>
|
||||
<button onclick="" id="restart-btn" style="max-width: 7rem;"
|
||||
class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
|
||||
data['lang']) %}</button>
|
||||
<button onclick="" id="stop-btn" style="max-width: 7rem;"
|
||||
class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
|
||||
}}</button>
|
||||
</div>
|
||||
{% elif data['waiting_start'] %}
|
||||
<div id="control_buttons" class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0" style="visibility: visible">
|
||||
<button onclick="" id="start-btn" style="max-width: 7rem; white-space: nowrap;" class="btn btn-secondary m-1 flex-grow-1 disabled" data-toggle="tooltip" title="{{ translate('serverTerm', 'delay-explained', data['lang'])}}">{{ translate('serverTerm', 'starting', data['lang']) }}</button>
|
||||
<button onclick="" id="restart-btn" style="max-width: 7rem;" class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart', data['lang']) %}</button>
|
||||
<button onclick="" id="stop-btn" style="max-width: 7rem;" class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
|
||||
<div id="control_buttons"
|
||||
class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
|
||||
style="visibility: visible">
|
||||
<button onclick="" id="start-btn" style="max-width: 7rem; white-space: nowrap;"
|
||||
class="btn btn-secondary m-1 flex-grow-1 disabled" data-toggle="tooltip"
|
||||
title="{{ translate('serverTerm', 'delay-explained', data['lang'])}}">{{ translate('serverTerm',
|
||||
'starting', data['lang']) }}</button>
|
||||
<button onclick="" id="restart-btn" style="max-width: 7rem;"
|
||||
class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
|
||||
data['lang']) %}</button>
|
||||
<button onclick="" id="stop-btn" style="max-width: 7rem;"
|
||||
class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
|
||||
}}</button>
|
||||
</div>
|
||||
{% elif data['importing'] %}
|
||||
<div id="control_buttons" class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0" style="visibility: visible">
|
||||
<button onclick="" id="start-btn" style="max-width: 12rem; white-space: nowrap;" class="btn btn-secondary m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i> {{ translate('serverTerm', 'importing',
|
||||
<div id="control_buttons"
|
||||
class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
|
||||
style="visibility: visible">
|
||||
<button onclick="" id="start-btn" style="max-width: 12rem; white-space: nowrap;"
|
||||
class="btn btn-secondary m-1 flex-grow-1 disabled"><i class="fa fa-spinner fa-spin"></i> {{
|
||||
translate('serverTerm', 'importing',
|
||||
data['lang']) }}</button>
|
||||
<button onclick="" id="restart-btn" style="max-width: 7rem;" class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart', data['lang']) %}</button>
|
||||
<button onclick="" id="stop-btn" style="max-width: 7rem;" class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
|
||||
<button onclick="" id="restart-btn" style="max-width: 7rem;"
|
||||
class="btn btn-outline-primary m-1 flex-grow-1 disabled">{% raw translate('serverTerm', 'restart',
|
||||
data['lang']) %}</button>
|
||||
<button onclick="" id="stop-btn" style="max-width: 7rem;"
|
||||
class="btn btn-danger m-1 flex-grow-1 disabled">{{ translate('serverTerm', 'stop', data['lang'])
|
||||
}}</button>
|
||||
</div>
|
||||
{% else %}
|
||||
<div id="control_buttons" class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0" style="visibility: visible">
|
||||
<button onclick="send_command(serverId, 'start_server');" id="start-btn" style="max-width: 7rem;" class="btn btn-primary m-1 flex-grow-1">{{ translate('serverTerm', 'start', data['lang']) }}</button>
|
||||
<button onclick="send_command(serverId, 'restart_server');" id="restart-btn" style="max-width: 7rem;" class="btn btn-outline-primary m-1 flex-grow-1">{% raw translate('serverTerm', 'restart', data['lang']) %}</button>
|
||||
<button onclick="send_command(serverId, 'stop_server');" id="stop-btn" style="max-width: 7rem;" class="btn btn-danger m-1 flex-grow-1">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
|
||||
<div id="control_buttons"
|
||||
class="mt-4 flex-wrap d-flex justify-content-between justify-content-md-center align-items-center px-5 px-md-0"
|
||||
style="visibility: visible">
|
||||
<button onclick="send_command(serverId, 'start_server');" id="start-btn" style="max-width: 7rem;"
|
||||
class="btn btn-primary m-1 flex-grow-1">{{ translate('serverTerm', 'start', data['lang']) }}</button>
|
||||
<button onclick="send_command(serverId, 'restart_server');" id="restart-btn" style="max-width: 7rem;"
|
||||
class="btn btn-outline-primary m-1 flex-grow-1">{% raw translate('serverTerm', 'restart', data['lang'])
|
||||
%}</button>
|
||||
<button onclick="send_command(serverId, 'stop_server');" id="stop-btn" style="max-width: 7rem;"
|
||||
class="btn btn-danger m-1 flex-grow-1">{{ translate('serverTerm', 'stop', data['lang']) }}</button>
|
||||
</div>
|
||||
{% end %}
|
||||
{% end %}
|
||||
@ -196,11 +232,11 @@
|
||||
function new_line_handler(data) {
|
||||
$('#virt_console').append(data.line)
|
||||
const elem = document.getElementById('virt_console');
|
||||
try{
|
||||
try {
|
||||
if (!scrolled) {
|
||||
scrollConsole();
|
||||
}
|
||||
}catch{
|
||||
} catch {
|
||||
scrollConsole();
|
||||
}
|
||||
}
|
||||
@ -305,18 +341,18 @@
|
||||
if (Math.round(elem[0].scrollHeight - elem.scrollTop()) <= elem.outerHeight()) {
|
||||
document.getElementById("to-bottom").style.visibility = "hidden";
|
||||
scrolled = false;
|
||||
}else{
|
||||
} else {
|
||||
document.getElementById("to-bottom").style.visibility = "visible";
|
||||
scrolled = true;
|
||||
}
|
||||
}
|
||||
|
||||
const scrollToBottom = (id) => {
|
||||
const element = $(`#virt_console`);
|
||||
element.animate({
|
||||
const element = $(`#virt_console`);
|
||||
element.animate({
|
||||
scrollTop: element.prop("scrollHeight")
|
||||
}, 500);
|
||||
}
|
||||
}, 500);
|
||||
}
|
||||
|
||||
$(document).ready(() => {
|
||||
var scrolled = false;
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
{% block content %}
|
||||
<!-- View for Large screen -->
|
||||
<div class="row justify-content-center">
|
||||
<div class="content-wrapper col-md login-modal d-none d-sm-block" style="background-color: #222437;">
|
||||
<div class="content-wrapper col-md login-modal d-none d-sm-block" style="background-color: var(--dropdown-bg);">
|
||||
<img src="/static/assets/images/logo_long.png" style='width: 25%; margin-left: 38%;'>
|
||||
<hr />
|
||||
<div class="table-responsive">
|
||||
@ -40,7 +40,8 @@
|
||||
</td>
|
||||
<td id="server_motd_{{ server['stats']['server_id']['server_id'] }}">
|
||||
{% if server['stats']['desc'] != 'False' %}
|
||||
<img src="/static/assets/images/pack.png" alt="icon" style="-webkit-filter:grayscale(100%); filter:grayscale(100%)" />
|
||||
<img src="/static/assets/images/pack.png" alt="icon"
|
||||
style="-webkit-filter:grayscale(100%); filter:grayscale(100%)" />
|
||||
<span id="input_motd_{{ server['stats']['server_id']['server_id'] }}" class="input_motd">{{
|
||||
server['stats']['desc'] }}</span> <br />
|
||||
{% end %}
|
||||
@ -94,21 +95,25 @@
|
||||
<h2 class="mb-0 container overflow-hidden">
|
||||
<div class="row">
|
||||
<div class="col-8 mx-0 px-0">
|
||||
<a id="m_server_name_{{ server['stats']['server_id']['server_id'] }}" class="btn btn-link d-flex justify-content-center" type="button" data-toggle="collapse"
|
||||
data-target="#collapse-{{server['server_data']['server_id']}}" aria-expanded="false"
|
||||
aria-controls="collapse-{{server['server_data']['server_id']}}">
|
||||
<a id="m_server_name_{{ server['stats']['server_id']['server_id'] }}"
|
||||
class="btn btn-link d-flex justify-content-center" type="button" data-toggle="collapse"
|
||||
data-target="#collapse-{{server['server_data']['server_id']}}" aria-expanded="false"
|
||||
aria-controls="collapse-{{server['server_data']['server_id']}}">
|
||||
<i class="fas fa-server"></i>
|
||||
{{ server['server_data']['server_name'] }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-4 mx-0 px-0">
|
||||
<a id="m_server_online_status_{{ server['stats']['server_id']['server_id'] }}" class="btn btn-link d-flex justify-content-center" type="button">
|
||||
<a id="m_server_online_status_{{ server['stats']['server_id']['server_id'] }}"
|
||||
class="btn btn-link d-flex justify-content-center" type="button">
|
||||
{% if server['stats']['running'] %}
|
||||
<div id="m_server_players_{{ server['stats']['server_id']['server_id'] }}">
|
||||
<span class="text-success"><i class="fas fa-signal"></i> {{ server['stats']['online'] }} / {{ server['stats']['max'] }}</span>
|
||||
<span class="text-success"><i class="fas fa-signal"></i> {{ server['stats']['online'] }} / {{
|
||||
server['stats']['max'] }}</span>
|
||||
</div>
|
||||
{% else %}
|
||||
<span class="text-danger"><i class="fas fa-ban"></i> {{ translate('dashboard', 'offline', data['lang']) }}</span>
|
||||
<span class="text-danger"><i class="fas fa-ban"></i> {{ translate('dashboard', 'offline',
|
||||
data['lang']) }}</span>
|
||||
{% end %}
|
||||
</a>
|
||||
</div>
|
||||
@ -117,12 +122,13 @@
|
||||
</div>
|
||||
|
||||
<div id="collapse-{{server['server_data']['server_id']}}" class="collapse"
|
||||
aria-labelledby="heading-{{server['server_data']['server_id']}}" data-parent="#accordionServers">
|
||||
aria-labelledby="heading-{{server['server_data']['server_id']}}" data-parent="#accordionServers">
|
||||
<div class="card-body">
|
||||
{% if server['stats']['int_ping_results'] != 'False' %}
|
||||
<div id="m_server_motd_{{ server['stats']['server_id']['server_id'] }}" class="media">
|
||||
{% if server['stats']['desc'] != 'False' %}
|
||||
<img src="/static/assets/images/pack.png" class="w-25 mr-3" alt="icon" style="-webkit-filter:grayscale(100%); filter:grayscale(100%);" />
|
||||
<img src="/static/assets/images/pack.png" class="w-25 mr-3" alt="icon"
|
||||
style="-webkit-filter:grayscale(100%); filter:grayscale(100%);" />
|
||||
{% end %}
|
||||
<div class="media-body">
|
||||
{% if server['stats']['desc'] != 'False' %}
|
||||
@ -143,7 +149,8 @@
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div id="m_server_motd_{{ server['stats']['server_id']['server_id'] }}">
|
||||
<span class="text-warning"><i class="fas fa-exclamation-triangle"></i> Crafty can't get infos from this Server </span>
|
||||
<span class="text-warning"><i class="fas fa-exclamation-triangle"></i> Crafty can't get infos from
|
||||
this Server </span>
|
||||
</div>
|
||||
<div id="m_server_version_{{ server['stats']['server_id']['server_id'] }}"></div>
|
||||
</div>
|
||||
|
||||
@ -343,7 +343,7 @@
|
||||
z-index: 200;
|
||||
margin-top: 4px;
|
||||
position: absolute;
|
||||
background-color: #2a2c44;
|
||||
background-color: var(--card-banner-bg);
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
|
||||
@ -457,7 +457,7 @@
|
||||
z-index: 200;
|
||||
margin-top: 4px;
|
||||
position: absolute;
|
||||
background-color: #2a2c44;
|
||||
background-color: var(--card-banner-bg);
|
||||
}
|
||||
|
||||
.menu-option {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user