Initial Commit of Files
PufferPanel v0.9 (Laravel) is now Pterodactyl 1.0
This commit is contained in:
commit
1489f7a694
154 changed files with 10159 additions and 0 deletions
194
resources/views/server/files/add.blade.php
Normal file
194
resources/views/server/files/add.blade.php
Normal file
|
@ -0,0 +1,194 @@
|
|||
@extends('layouts.master')
|
||||
|
||||
@section('title')
|
||||
Add File to: {{ $server->name }}
|
||||
@endsection
|
||||
|
||||
@section('scripts')
|
||||
@parent
|
||||
<script src="{{ asset('js/binaryjs.js') }}"></script>
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="col-md-9">
|
||||
@foreach (Alert::getMessages() as $type => $messages)
|
||||
@foreach ($messages as $message)
|
||||
<div class="alert alert-{{ $type }} alert-dismissable" role="alert">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
{{ $message }}
|
||||
</div>
|
||||
@endforeach
|
||||
@endforeach
|
||||
<ul class="nav nav-tabs" id="config_tabs">
|
||||
<li class="active"><a href="#create" data-toggle="tab">Create File</a></li>
|
||||
@can('upload-files', $server)<li><a href="#upload" data-toggle="tab">Upload Files</a></li>@endcan
|
||||
</ul>
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="create">
|
||||
<div id="write_status" style="display:none;width: 100%; margin: 10px 0 5px;"></div>
|
||||
<form method="post" id="new_file">
|
||||
<h4>/home/container/{{ $directory }} <input type="text" id="file_name" class="filename" value="newfile.txt" /></h4>
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<textarea name="file_contents" id="fileContents" style="border: 1px solid #dddddd;" class="form-control console"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<button class="btn btn-primary btn-sm" id="create_file">{{ trans('strings.save') }}</button>
|
||||
<button class="btn btn-default btn-sm" onclick="window.location='/server/{{ $server->uuidShort }}/files?dir=/{{ $directory }}';return false;">{{ trans('server.files.back') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
@can('upload-files', $server)
|
||||
<div class="tab-pane" id="upload">
|
||||
<h4>/home/container/ <input type="text" id="u_file_name" value="{{ $directory }}" style='outline: none;width:450px;background: transparent;margin-left:-5px;padding:0;border: 0px;font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight: 250;line-height: 1.1;color: inherit;font-size: 19px;'/></h4>
|
||||
<div class="alert alert-warning">Please edit the path location above <strong>before you upload files</strong>. They will automatically be placed in the directory you specify above. Simply click next to <code>/home/container/</code> and begin typing. You can change this each time you upload a new file without having to press anything else.</div>
|
||||
<div class="alert alert-danger" id="upload_error" style="display: none;"></div>
|
||||
<input type="file" id="fileinput" name="fileUpload[]" multiple="" style="display:none;"/>
|
||||
<div id="uploader_box" class="well well-sm" style="cursor:pointer;">
|
||||
<center><h2 style="margin-bottom: 25px;">Connecting...</h2></center>
|
||||
</div>
|
||||
<span id="file_progress"></span>
|
||||
</div>
|
||||
@endcan
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$(window).load(function () {
|
||||
|
||||
$('.server-files').addClass('active');
|
||||
|
||||
var newFilePath;
|
||||
var newFileContents;
|
||||
|
||||
@can('upload-files', $server)
|
||||
var client = new BinaryClient('wss://{{ $node->fqdn }}:{{ $node->daemonListen }}/upload/', {
|
||||
chunkSize: 40960
|
||||
});
|
||||
// Wait for connection to BinaryJS server
|
||||
client.on('open', function() {
|
||||
|
||||
var box = $('#uploader_box');
|
||||
box.on('dragenter', doNothing);
|
||||
box.on('dragover', doNothing);
|
||||
box.html('<center><h2 style="margin-bottom:25px;">Drag or Click to Upload</h2></center>');
|
||||
box.on('click', function () {
|
||||
$('#fileinput').click();
|
||||
});
|
||||
box.on('drop', function (e, files) {
|
||||
|
||||
if (typeof files !== 'undefined') {
|
||||
e.originalEvent = {
|
||||
dataTransfer: {
|
||||
files: files.currentTarget.files
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
e.preventDefault();
|
||||
$.each(e.originalEvent.dataTransfer.files, function(index, value) {
|
||||
|
||||
var file = e.originalEvent.dataTransfer.files[index];
|
||||
var identifier = Math.random().toString(36).slice(2);
|
||||
|
||||
$('#file_progress').append('<div class="well well-sm" id="file-upload-' + identifier +'"> \
|
||||
<div class="row"> \
|
||||
<div class="col-md-12"> \
|
||||
<h6>Uploading ' + file.name + '</h6> \
|
||||
<span class="prog-bar-text-' + identifier +'" style="font-size: 10px;position: absolute;margin: 3px 0 0 15px;">Waiting...</span> \
|
||||
<div class="progress progress-striped active"> \
|
||||
<div class="progress-bar progress-bar-info prog-bar-' + identifier +'" style="width: 0%"></div> \
|
||||
</div> \
|
||||
</div> \
|
||||
</div> \
|
||||
</div>');
|
||||
|
||||
// Add to list of uploaded files
|
||||
var stream = client.send(file, {
|
||||
token: "{{ $server->daemonSecret }}",
|
||||
server: "{{ $server->uuid }}",
|
||||
path: $("#u_file_name").val(),
|
||||
name: file.name,
|
||||
size: file.size
|
||||
});
|
||||
|
||||
var tx = 0;
|
||||
stream.on('data', function(data) {
|
||||
if(data.error) {
|
||||
$("#upload_error").html(data.error).show();
|
||||
$("#file-upload-" + identifier).hide();
|
||||
} else {
|
||||
tx += data.rx;
|
||||
|
||||
if(tx >= 0.999) {
|
||||
$('.prog-bar-text-' + identifier).text('Upload Complete');
|
||||
$('.prog-bar-' + identifier).css('width', '100%').parent().removeClass('active').removeClass('progress-striped');
|
||||
} else {
|
||||
$('.prog-bar-text-' + identifier).text(Math.round(tx * 100) + '%');
|
||||
$('.prog-bar-' + identifier).css('width', tx * 100 + '%');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
stream.on('close', function(data) {
|
||||
$("#upload_error").html("The BinaryJS data stream was closed by the server. Please refresh the page and try again.").show();
|
||||
$("#file-upload-" + identifier).hide();
|
||||
});
|
||||
|
||||
stream.on('error', function(data) {
|
||||
console.error("An error was encountered with the BinaryJS upload stream.");
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
// listen for a file being chosen
|
||||
$('#fileinput').change(function (event) {
|
||||
$('#uploader_box').trigger('drop', [event, event.currentTarget]);
|
||||
$('#fileinput').val('');
|
||||
});
|
||||
|
||||
// Deal with DOM quirks
|
||||
function doNothing (e){
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}
|
||||
@endcan
|
||||
|
||||
$('textarea').keydown(function (e) {
|
||||
if (e.keyCode === 9) {
|
||||
var start = this.selectionStart;
|
||||
var end = this.selectionEnd;
|
||||
var value = $(this).val();
|
||||
$(this).val(value.substring(0, start) + '\t' + value.substring(end));
|
||||
this.selectionStart = this.selectionEnd = start + 1;
|
||||
e.preventDefault();
|
||||
}
|
||||
});
|
||||
|
||||
$("#create_file").click(function(e) {
|
||||
e.preventDefault();
|
||||
$("#create_file").append(' <i class="fa fa-spinner fa fa-spin"></i>').addClass("disabled");
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/server/{{ $server->uuidShort }}/ajax/files/save',
|
||||
headers: { 'X-CSRF-Token': '{{ csrf_token() }}' },
|
||||
data: {
|
||||
file: '{{ $directory }}' + $('#file_name').val(),
|
||||
contents: $('#fileContents').val()
|
||||
}
|
||||
}).done(function (data) {
|
||||
window.location.replace('/server/{{ $server->uuidShort }}/files/edit/{{ $directory }}' + $('#file_name').val());
|
||||
}).fail(function (jqXHR) {
|
||||
$('#write_status').html('<div class="alert alert-danger">' + jqXHR.responseText + '</div>').show();
|
||||
$('#create_file').html('{{ trans('strings.save') }}').removeClass('disabled');
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
@endsection
|
99
resources/views/server/files/edit.blade.php
Normal file
99
resources/views/server/files/edit.blade.php
Normal file
|
@ -0,0 +1,99 @@
|
|||
@extends('layouts.master')
|
||||
|
||||
@section('title')
|
||||
Managing Files for: {{ $server->name }}
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="col-md-9">
|
||||
<span id="save_status" style="display:none;width: 100%;"></span>
|
||||
@foreach (Alert::getMessages() as $type => $messages)
|
||||
@foreach ($messages as $message)
|
||||
<div class="alert alert-{{ $type }} alert-dismissable" role="alert">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
{{ $message }}
|
||||
</div>
|
||||
@endforeach
|
||||
@endforeach
|
||||
<h3 class="nopad"><small>Editing File: /home/container/{{ $file }}</small></h3>
|
||||
<form method="post" id="editing_file">
|
||||
<div class="form-group">
|
||||
<div>
|
||||
@if (in_array($extension, ['yaml', 'yml']))
|
||||
<div class="alert alert-info">
|
||||
{!! trans('server.files.yaml_notice', [
|
||||
'dropdown' => '<select id="space_yaml">
|
||||
<option value="2">2</option>
|
||||
<option value="4" selected="selected">4</option>
|
||||
<option value="8">8</option>
|
||||
</select>'
|
||||
]) !!}
|
||||
</div>
|
||||
@endif
|
||||
<textarea name="file_contents" id="fileContent" style="border: 1px solid #dddddd;height:500px;" class="form-control console">{{ $contents }}</textarea>
|
||||
</div>
|
||||
</div>
|
||||
@can('save-files', $server)
|
||||
<div class="form-group">
|
||||
<div>
|
||||
<input type="hidden" name="file" value="{{ $file }}" />
|
||||
{!! csrf_field() !!}
|
||||
<button class="btn btn-primary btn-sm" id="save_file">{{ trans('strings.save') }}</button>
|
||||
<button class="btn btn-default btn-sm" onclick="window.location='/server/{{ $server->uuidShort }}/files?dir={{ urlencode($directory) }}';return false;">{{ trans('server.files.back') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
@endcan
|
||||
</form>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('.server-files').addClass('active');
|
||||
$('textarea').keydown(function (e) {
|
||||
if (e.keyCode === 9) {
|
||||
|
||||
var start = this.selectionStart;
|
||||
var end = this.selectionEnd;
|
||||
var value = $(this).val();
|
||||
var joinYML = '\t';
|
||||
var yamlSpaces = 1;
|
||||
|
||||
@if (in_array($extension, ['yaml', 'yml']))
|
||||
yamlSpaces = parseInt($("#space_yaml").val());
|
||||
joinYML = Array(yamlSpaces + 1).join(" ");
|
||||
@endif
|
||||
|
||||
$(this).val(value.substring(0, start) + joinYML + value.substring(end));
|
||||
this.selectionStart = this.selectionEnd = start + yamlSpaces;
|
||||
e.preventDefault();
|
||||
|
||||
}
|
||||
});
|
||||
@can('save-files', $server)
|
||||
$('#save_file').click(function (e) {
|
||||
e.preventDefault();
|
||||
|
||||
var fileName = $('input[name="file"]').val();
|
||||
var fileContents = $('#fileContent').val();
|
||||
|
||||
$('#save_file').append(' <i class="fa fa-spinner fa fa-spin"></i>').addClass('disabled');
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/server/{{ $server->uuidShort }}/ajax/files/save',
|
||||
headers: { 'X-CSRF-Token': '{{ csrf_token() }}' },
|
||||
data: {
|
||||
file: fileName,
|
||||
contents: fileContents
|
||||
}
|
||||
}).done(function (data) {
|
||||
$('#save_status').html('<div class="alert alert-success">{{ trans('server.files.saved') }}</div>').slideDown();
|
||||
}).fail(function (jqXHR) {
|
||||
$('#save_status').html('<div class="alert alert-danger">' + jqXHR.responseText + '</div>').slideDown();
|
||||
}).always(function () {
|
||||
$('#save_file').html('{{ trans('strings.save') }}').removeClass('disabled');
|
||||
});
|
||||
|
||||
});
|
||||
@endcan
|
||||
});
|
||||
</script>
|
||||
@endsection
|
150
resources/views/server/files/index.blade.php
Normal file
150
resources/views/server/files/index.blade.php
Normal file
|
@ -0,0 +1,150 @@
|
|||
@extends('layouts.master')
|
||||
|
||||
@section('title')
|
||||
Managing Files for: {{ $server->name }}
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="col-md-9">
|
||||
<div class="row" id="internal_alert">
|
||||
<div class="col-md-12">
|
||||
<div class="alert alert-info">
|
||||
<i class="fa fa-spinner fa-spin"></i> {{ trans('server.files.loading') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
@foreach (Alert::getMessages() as $type => $messages)
|
||||
@foreach ($messages as $message)
|
||||
<div class="alert alert-{{ $type }} alert-dismissable" role="alert">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
{{ $message }}
|
||||
</div>
|
||||
@endforeach
|
||||
@endforeach
|
||||
<div class="files_loading_box"><i class="fa fa-refresh fa-spin" id="position_me"></i></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12" id="load_files"></div>
|
||||
<div class="col-md-12">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<h3 class="panel-title">File Path Information</h3>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
When configuring any file paths in your server plugins or settings you should use <code>/home/container</code> as your base path. While your SFTP client sees the files as <code>/public</code> this is not true for the server process.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('.server-files').addClass('active');
|
||||
});
|
||||
$(window).load(function(){
|
||||
var doneLoad = false;
|
||||
|
||||
// Show Loading Animation
|
||||
function handleLoader (show) {
|
||||
|
||||
// Hide animation if no files displayed.
|
||||
if ($('#load_files').height() < 5) { return; }
|
||||
|
||||
// Show Animation
|
||||
if (show === true){
|
||||
var height = $('#load_files').height();
|
||||
var width = $('.files_loading_box').width();
|
||||
var center_height = (height / 2) - 30;
|
||||
var center_width = (width / 2) - 30;
|
||||
$('#position_me').css({
|
||||
'top': center_height,
|
||||
'left': center_width,
|
||||
'font-size': '60px'
|
||||
});
|
||||
$(".files_loading_box").css('height', (height + 5)).fadeIn();
|
||||
} else {
|
||||
$('.files_loading_box').fadeOut(100);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function reloadActions () {
|
||||
reloadActionClick();
|
||||
reloadActionDelete();
|
||||
}
|
||||
|
||||
// Handle folder clicking to load new contents
|
||||
function reloadActionClick () {
|
||||
$('a.load_new').click(function (e) {
|
||||
e.preventDefault();
|
||||
window.history.pushState(null, null, $(this).attr('href'));
|
||||
loadDirectoryContents($.urlParam('dir', $(this).attr('href')));
|
||||
});
|
||||
}
|
||||
|
||||
// Handle Deleting Files
|
||||
function reloadActionDelete () {
|
||||
$('a.delete_file').click(function (e) {
|
||||
e.preventDefault();
|
||||
var clicked = $(this);
|
||||
var deleteItemPath = $(this).attr('href');
|
||||
|
||||
if (!confirm('Are you sure you want to delete /home/container/' + deleteItemPath + '? There is no reversing this action.')) {
|
||||
return;
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type: 'DELETE',
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/file/' + deleteItemPath,
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
}
|
||||
}).done(function (data) {
|
||||
clicked.parent().parent().parent().parent().fadeOut();
|
||||
}).fail(function (jqXHR) {
|
||||
$("#internal_alert").html('<div class="alert alert-danger">An error occured while attempting to delete <code>/home/container/' + deleteItemPath + '</code>. Please try again.</div>').show();
|
||||
console.log(jqXHR);
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
// Handle Loading Contents
|
||||
function loadDirectoryContents (dir) {
|
||||
|
||||
handleLoader(true);
|
||||
var outputContent;
|
||||
var urlDirectory = (dir === null) ? '/' : dir;
|
||||
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: '/server/{{ $server->uuidShort }}/ajax/files/directory-list',
|
||||
headers: { 'X-CSRF-Token': '{{ csrf_token() }}' },
|
||||
data: { directory: urlDirectory }
|
||||
}).done(function (data) {
|
||||
handleLoader(false);
|
||||
$("#load_files").slideUp(function () {
|
||||
$("#load_files").html(data).slideDown();
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
$('#internal_alert').slideUp();
|
||||
|
||||
// Run Actions Again
|
||||
reloadActions();
|
||||
});
|
||||
}).fail(function (jqXHR) {
|
||||
$("#internal_alert").html('<div class="alert alert-danger">An error occured while attempting to process this request. Please try again.</div>').show();
|
||||
console.log(jqXHR);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// Load on Initial Page Load
|
||||
loadDirectoryContents($.urlParam('dir'));
|
||||
|
||||
});
|
||||
</script>
|
||||
@endsection
|
86
resources/views/server/files/list.blade.php
Normal file
86
resources/views/server/files/list.blade.php
Normal file
|
@ -0,0 +1,86 @@
|
|||
<h4 class="nopad">/home/container{{ $directory['header'] }} <small><a href="/server/{{ $server->uuidShort }}/files/add/@if($directory['header'] !== '')?dir={{ $directory['header'] }}@endif" class="text-muted"><i class="fa fa-plus" data-toggle="tooltip" data-placement="top" title="Add New File(s)"></i></a></small></h4>
|
||||
<table class="table table-striped table-bordered table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th style="width:2%;text-align:center;"></th>
|
||||
<th style="width:45%">File Name</th>
|
||||
<th style="width:15%">Size</th>
|
||||
<th style="width:20%">Last Modified</th>
|
||||
<th style="width:20%;text-align:center;">Options</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if (isset($directory['first']) && $directory['first'] === true)
|
||||
<tr>
|
||||
<td><i class="fa fa-folder-open" style="margin-left: 0.859px;"></i></td>
|
||||
<td><a href="/server/{{ $server->uuidShort }}/files" class="load_new">←</a></a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
@endif
|
||||
@if (isset($directory['show']) && $directory['show'] === true)
|
||||
<tr>
|
||||
<td><i class="fa fa-folder-open" style="margin-left: 0.859px;"></i></td>
|
||||
<td><a href="/server/{{ $server->uuidShort }}/files?dir={{ $directory['link'] }}" class="load_new">← {{ $directory['link_show'] }}</a></a></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
@endif
|
||||
@foreach ($folders as $folder)
|
||||
<tr>
|
||||
<td><i class="fa fa-folder-open" style="margin-left: 0.859px;"></i></td>
|
||||
<td><a href="/server/{{ $server->uuidShort }}/files?dir=/@if($folder['directory'] !== ''){{ $folder['directory'] }}/@endif{{ $folder['entry'] }}" class="load_new">{{ $folder['entry'] }}</a></td>
|
||||
<td>{{ $folder['size'] }}</td>
|
||||
<td>{{ date('m/d/y H:i:s', $folder['date']) }}</td>
|
||||
<td style="text-align:center;">
|
||||
<div class="row" style="text-align:center;">
|
||||
<div class="col-md-3 hidden-xs hidden-sm"></div>
|
||||
<div class="col-md-3 hidden-xs hidden-sm">
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
@can('delete-file', $server)
|
||||
<a href="@if($folder['directory'] !== ''){{ $folder['directory'] }}/@endif{{ $folder['entry'] }}" class="delete_file"><span class="badge label-danger"><i class="fa fa-trash-o"></i></span></a>
|
||||
@endcan
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
@foreach ($files as $file)
|
||||
<tr>
|
||||
<td><i class="fa fa-file-text" style="margin-left: 2px;"></i></td>
|
||||
<td>
|
||||
@if(in_array($file['extension'], $extensions))
|
||||
@can('edit-file', $server)
|
||||
<a href="/server/{{ $server->uuidShort }}/files/edit/@if($file['directory'] !== ''){{ $file['directory'] }}/@endif{{ $file['entry'] }}" class="edit_file">{{ $file['entry'] }}</a>
|
||||
@else
|
||||
{{ $file['entry'] }}
|
||||
@endcan
|
||||
@else
|
||||
{{ $file['entry'] }}
|
||||
@endif
|
||||
</td>
|
||||
<td>{{ $file['size'] }}</td>
|
||||
<td>{{ date('m/d/y H:i:s', $file['date']) }}</td>
|
||||
<td style="text-align:center;">
|
||||
<div class="row" style="text-align:center;">
|
||||
<div class="col-md-3 hidden-xs hidden-sm">
|
||||
</div>
|
||||
<div class="col-md-3 hidden-xs hidden-sm">
|
||||
@can('download-file', $server)
|
||||
<a href="/server/{{ $server->uuidShort }}/files/download/@if($file['directory'] !== ''){{ $file['directory'] }}/@endif{{ $file['entry'] }}"><span class="badge"><i class="fa fa-download"></i></span></a>
|
||||
@endcan
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
@can('delete-file', $server)
|
||||
<a href="@if($file['directory'] !== ''){{ $file['directory'] }}/@endif{{ $file['entry'] }}" class="delete_file"><span class="badge label-danger"><i class="fa fa-trash-o"></i></span>
|
||||
@endcan
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
395
resources/views/server/index.blade.php
Normal file
395
resources/views/server/index.blade.php
Normal file
|
@ -0,0 +1,395 @@
|
|||
@extends('layouts.master')
|
||||
|
||||
@section('title')
|
||||
Viewing Server: {{ $server->name }}
|
||||
@endsection
|
||||
|
||||
@section('scripts')
|
||||
@parent
|
||||
<script src="{{ asset('js/chartjs/chart.core.js') }}"></script>
|
||||
<script src="{{ asset('js/chartjs/chart.bar.js') }}"></script>
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="col-md-9">
|
||||
@foreach (Alert::getMessages() as $type => $messages)
|
||||
@foreach ($messages as $message)
|
||||
<div class="alert alert-{{ $type }} alert-dismissable" role="alert">
|
||||
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
{{ $message }}
|
||||
</div>
|
||||
@endforeach
|
||||
@endforeach
|
||||
<ul class="nav nav-tabs" id="config_tabs">
|
||||
<li class="active"><a href="#stats" data-toggle="tab">{{ trans('server.index.info_use') }}</a></li>
|
||||
<li id="triggerConsoleView"><a href="#console" data-toggle="tab">{{ trans('server.index.control') }}</a></li>
|
||||
</ul><br />
|
||||
<div class="tab-content">
|
||||
<div class="tab-pane active" id="stats">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<h3 class="nopad">{{ trans('server.index.memory_use') }}</h3><hr />
|
||||
<div class="row centered">
|
||||
<canvas id="memoryChart" width="280" height="150" style="margin-left:20px;"></canvas>
|
||||
<p style="text-align:center;margin-top:-15px;" class="text-muted"><small>{{ trans('server.index.xaxis') }}</small></p>
|
||||
<p class="graph-yaxis hidden-xs hidden-sm text-muted" style="margin-top:-50px !important;"><small>{{ trans('server.index.memory_use') }} (Mb)</small></p>
|
||||
<p class="graph-yaxis hidden-lg hidden-md text-muted" style="margin-top:-65px !important;margin-left: 100px !important;"><small>{{ trans('server.index.memory_use') }} (Mb)</small></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<h3 class="nopad">{{ trans('server.index.cpu_use') }}</h3><hr />
|
||||
<div class="row centered">
|
||||
<canvas id="cpuChart" width="280" height="150" style="margin-left:20px;"></canvas>
|
||||
<p style="text-align:center;margin-top:-15px;" class="text-muted"><small>{{ trans('server.index.xaxis') }}</small></p>
|
||||
<p class="graph-yaxis hidden-sm hidden-xs text-muted" style="margin-top:-65px !important;"><small>{{ trans('server.index.cpu_use') }} (%)</small></p>
|
||||
<p class="graph-yaxis hidden-lg hidden-md text-muted" style="margin-top:-65px !important;margin-left: 100px !important;"><small>{{ trans('server.index.cpu_use') }} (%)</small></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12" id="stats_players">
|
||||
<h3 class="nopad">Active Players</h3><hr />
|
||||
<div id="players_notice" class="alert alert-info">
|
||||
<i class="fa fa-spinner fa-spin"></i> Waiting for response from server...
|
||||
</div>
|
||||
<span id="toggle_players" style="display:none;">
|
||||
<p class="text-muted">No players are online.</p>
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<h3>{{ trans('server.index.server_info') }}</h3><hr />
|
||||
<table class="table table-striped table-bordered table-hover">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>{{ trans('server.index.connection') }}</strong></td>
|
||||
<td><code>{{ $server->ip }}:{{ $server->port }}</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>{{ trans('strings.node') }}</strong></td>
|
||||
<td>{{ $node->name }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>{{ trans('server.index.mem_limit') }}</strong></td>
|
||||
<td>{{ $server->memory }} MB</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>{{ trans('server.index.disk_space') }}</strong></td>
|
||||
<td>{{ $server->disk }} MB</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-pane" id="console">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<textarea id="live_console" class="form-control console" readonly="readonly">Loading Previous Content...</textarea>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<hr />
|
||||
<form action="#" method="post" id="console_command">
|
||||
<fieldset>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" name="command" id="ccmd" placeholder="{{ trans('server.index.command') }}" />
|
||||
<span class="input-group-btn">
|
||||
<button id="sending_command" class="btn btn-primary btn-sm">→</button>
|
||||
</span>
|
||||
</div>
|
||||
</fieldset>
|
||||
</form>
|
||||
<div class="alert alert-danger" id="sc_resp" style="display:none;margin-top: 15px;"></div>
|
||||
</div>
|
||||
<div class="col-md-6" style="text-align:center;">
|
||||
<hr />
|
||||
<button class="btn btn-success btn-sm start disabled" id="server_start">Start</button>
|
||||
<button class="btn btn-primary btn-sm restart disabled" id="server_restart">Restart</button>
|
||||
<button class="btn btn-danger btn-sm stop disabled" id="server_stop">Stop</button>
|
||||
<button class="btn btn-danger btn-sm stop disabled" id="kill_proc"><i class="fa fa-ban" data-toggle="tooltip" data-placement="top" title="Kill Running Process"></i></button>
|
||||
<button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#pauseConsole" id="pause_console"><small><i class="fa fa-pause fa-fw"></i></small></button>
|
||||
<div id="pw_resp" style="display:none;margin-top: 15px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal fade" id="pauseConsole" tabindex="-1" role="dialog" aria-labelledby="PauseConsole" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||||
<h4 class="modal-title" id="PauseConsole">{{ trans('server.index.scrollstop') }}</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<textarea id="paused_console" class="form-control console" readonly="readonly"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{{ trans('strings.close') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$(window).load(function () {
|
||||
$('[data-toggle="tooltip"]').tooltip();
|
||||
|
||||
// Socket Recieves New Server Stats
|
||||
socket.on('stats', function (data) {
|
||||
var currentTime = new Date();
|
||||
memoryChart.addData([parseInt(data.data.memory / (1024 * 1024))], '');
|
||||
memoryChart.removeData();
|
||||
if({{ $server->cpu }} > 0) { cpuChart.addData([(data.data.cpu / {{ $server->cpu }}) * 100], ''); }else{ cpuChart.addData([data.data.cpu], ''); }
|
||||
cpuChart.removeData();
|
||||
});
|
||||
|
||||
// Socket Recieves New Query
|
||||
socket.on('query', function (data){
|
||||
if($('#players_notice').is(':visible')){
|
||||
$('#players_notice').hide();
|
||||
$('#toggle_players').show();
|
||||
}
|
||||
if(data['data'].players != undefined && data['data'].players.length !== 0){
|
||||
$('#toggle_players').html('');
|
||||
$.each(data['data'].players, function(id, d) {
|
||||
$('#toggle_players').append('<code>' + d.name + '</code>,');
|
||||
});
|
||||
}else{
|
||||
$('#toggle_players').html('<p class=\'text-muted\'>No players are currently online.</p>');
|
||||
}
|
||||
});
|
||||
|
||||
// New Console Data Recieved
|
||||
socket.on('console', function (data) {
|
||||
$('#live_console').val($('#live_console').val() + data.line);
|
||||
$('#live_console').scrollTop($('#live_console')[0].scrollHeight);
|
||||
});
|
||||
|
||||
// Update Listings on Initial Status
|
||||
socket.on('initial_status', function (data) {
|
||||
if (data.status !== 0) {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
},
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/log/750',
|
||||
timeout: 10000
|
||||
}).done(function(data) {
|
||||
$('#live_console').val(data);
|
||||
$('#live_console').scrollTop($('#live_console')[0].scrollHeight);
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
$('#pw_resp').attr('class', 'alert alert-danger').html('Unable to load initial server log.').fadeIn().delay(5000).fadeOut();
|
||||
});
|
||||
} else {
|
||||
$('#live_console').val('');
|
||||
}
|
||||
updateServerPowerControls(data.status);
|
||||
updatePlayerListVisibility(data.status);
|
||||
});
|
||||
|
||||
// Update Listings on Status
|
||||
socket.on('status', function (data) {
|
||||
updateServerPowerControls(data.status);
|
||||
updatePlayerListVisibility(data.status);
|
||||
});
|
||||
|
||||
// Scroll to the top of the Console when switching to that tab.
|
||||
$('#triggerConsoleView').click(function () {
|
||||
$('#live_console').scrollTop($('#live_console')[0].scrollHeight);
|
||||
});
|
||||
if($('triggerConsoleView').is(':visible')) {
|
||||
$('#live_console').scrollTop($('#live_console')[0].scrollHeight);
|
||||
}
|
||||
$('a[data-toggle=\'tab\']').on('shown.bs.tab', function (e) {
|
||||
$('#live_console').scrollTop($('#live_console')[0].scrollHeight);
|
||||
});
|
||||
|
||||
// Load Paused Console with Live Console Data
|
||||
$('#pause_console').click(function(){
|
||||
$('#paused_console').val($('#live_console').val());
|
||||
});
|
||||
|
||||
// -----------------+
|
||||
// Charting Methods |
|
||||
// -----------------+
|
||||
var ctx = $('#memoryChart').get(0).getContext('2d');
|
||||
var cty = $('#cpuChart').get(0).getContext('2d');
|
||||
var memoryChartData = {labels:["","","","","","","","","","","","","","","","","","","",""],datasets:[{fillColor:"#ccc",strokeColor:"rgba(0,0,0,0)",highlightFill:"#666",data:[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]}]};
|
||||
var cpuChartData = {labels:["","","","","","","","","","","","","","","","","","","",""],datasets:[{fillColor:"#ccc",strokeColor:"rgba(0,0,0,0)",highlightFill:"#666",data:[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]}]};
|
||||
var memoryChart= new Chart(ctx).Bar(memoryChartData,{animation:!1,showScale:!0,barShowStroke:!1,scaleOverride:!1,tooltipTemplate:"<%= value %> Mb",barValueSpacing:1,barStrokeWidth:1,scaleShowGridLines:!1});
|
||||
var cpuChart = new Chart(cty).Bar(cpuChartData,{animation:!1,showScale:!0,barShowStroke:!1,scaleOverride:!1,tooltipTemplate:"<%= value %> %",barValueSpacing:1,barStrokeWidth:1,scaleShowGridLines:!1});
|
||||
function updatePlayerListVisibility(data) {
|
||||
// Server is On or Starting
|
||||
if(data == 1 || data == 3) {
|
||||
$('#stats_players').show();
|
||||
} else {
|
||||
$('#stats_players').hide();
|
||||
}
|
||||
}
|
||||
@can('command', $server)
|
||||
// Send Command to Server
|
||||
$('#console_command').submit(function (event) {
|
||||
|
||||
event.preventDefault();
|
||||
var ccmd = $('#ccmd').val();
|
||||
if (ccmd == '') {
|
||||
return;
|
||||
}
|
||||
|
||||
$('#sending_command').html('<i class=\'fa fa-refresh fa-spin\'></i>').addClass('disabled');
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
},
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/console',
|
||||
timeout: 10000,
|
||||
data: { command: ccmd }
|
||||
}).fail(function (jqXHR) {
|
||||
$('#sc_resp').html('Unable to process your request. Please try again.').fadeIn().delay(5000).fadeOut();
|
||||
}).always(function () {
|
||||
$('#sending_command').html('→').removeClass('disabled');
|
||||
$('#ccmd').val('');
|
||||
});
|
||||
});
|
||||
@endcan
|
||||
@can('power', $server)
|
||||
var can_run = true;
|
||||
function updateServerPowerControls (data) {
|
||||
|
||||
// Server is On or Starting
|
||||
if(data == 1 || data == 3) {
|
||||
$('#server_start').addClass('disabled');
|
||||
$('#server_stop, #server_restart').removeClass('disabled');
|
||||
} else {
|
||||
$('#server_start').removeClass('disabled');
|
||||
$('#server_stop, #server_restart').addClass('disabled');
|
||||
}
|
||||
|
||||
if(data !== 0) {
|
||||
$('#kill_proc').removeClass('disabled');
|
||||
} else {
|
||||
$('#kill_proc').addClass('disabled');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Kill Server Process Button
|
||||
$('#kill_proc').click(function (e){
|
||||
|
||||
e.preventDefault();
|
||||
var killConfirm = confirm('WARNING: This operation will not save your server data gracefully. You should only use this if your server is failing to respond to stops.');
|
||||
|
||||
if(killConfirm) {
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
},
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/power/kill',
|
||||
timeout: 10000
|
||||
}).done(function(data) {
|
||||
$('#pw_resp').attr('class', 'alert alert-success').html('Server has been killed successfully.').fadeIn().delay(5000).fadeOut();
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
$('#pw_resp').attr('class', 'alert alert-danger').html('Unable to process your request. Please try again. ('+ errorThrown +')').fadeIn().delay(5000).fadeOut();
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$('#server_stop').click(function (e){
|
||||
e.preventDefault();
|
||||
if(can_run) {
|
||||
can_run = false;
|
||||
$(this).append(' <i class=\'fa fa-refresh fa-spin\'></i>').toggleClass('disabled');
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
},
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/power/off',
|
||||
timeout: 10000
|
||||
}).done(function(data) {
|
||||
$('#pw_resp').attr('class', 'alert alert-success').html('Server is now stopping...').fadeIn().delay(5000).fadeOut();
|
||||
$('#server_stop').removeClass('disabled').html('Stop');
|
||||
can_run = true;
|
||||
return false;
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
$('#pw_resp').attr('class', 'alert alert-danger').html('Unable to process your request. Please try again. ('+ errorThrown +')').fadeIn().delay(5000).fadeOut();
|
||||
$('#server_stop').removeClass('disabled').html('Stop');
|
||||
can_run = true;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$('#server_restart').click(function(e){
|
||||
e.preventDefault();
|
||||
if(can_run) {
|
||||
can_run = false;
|
||||
$(this).append(' <i class=\'fa fa-refresh fa-spin\'></i>').toggleClass('disabled');
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
},
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/power/restart',
|
||||
timeout: 10000
|
||||
}).done(function(data) {
|
||||
$('#pw_resp').attr('class', 'alert alert-success').html('Server is now restarting...').fadeIn().delay(5000).fadeOut();
|
||||
$('#server_restart').removeClass('disabled').html('Restart');
|
||||
can_run = true;
|
||||
return false;
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
$('#pw_resp').attr('class', 'alert alert-danger').html('Unable to process your request. Please try again. ('+ errorThrown +')').fadeIn().delay(5000).fadeOut();
|
||||
$('#server_restart').removeClass('disabled').html('Restart');
|
||||
can_run = true;
|
||||
});
|
||||
}
|
||||
});
|
||||
$('#server_start').click(function(e){
|
||||
e.preventDefault();
|
||||
start_server();
|
||||
});
|
||||
function start_server() {
|
||||
if(can_run === true){
|
||||
can_run = false;
|
||||
$('#server_start').append(' <i class=\'fa fa-refresh fa-spin\'></i>').toggleClass('disabled');
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
headers: {
|
||||
'X-Access-Token': '{{ $server->daemonSecret }}',
|
||||
'X-Access-Server': '{{ $server->uuid }}'
|
||||
},
|
||||
url: 'https://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/power/on',
|
||||
timeout: 10000
|
||||
}).done(function(data) {
|
||||
$('#live_console').val('Server is starting...\n');
|
||||
$('#pw_resp').attr('class', 'alert alert-success').html('Server is now starting...').fadeIn().delay(5000).fadeOut();
|
||||
$('#server_start').toggleClass('disabled');
|
||||
$('#server_start').html('Start');
|
||||
can_run = true;
|
||||
}).fail(function(jqXHR, textStatus, errorThrown) {
|
||||
$('#pw_resp').attr('class', 'alert alert-danger').html('Unable to process your request. Please try again. ('+ errorThrown +')').fadeIn().delay(5000).fadeOut();
|
||||
$('#server_start').removeClass('disabled');
|
||||
$('#server_start').html('Start');
|
||||
can_run = true;
|
||||
});
|
||||
}
|
||||
}
|
||||
@endcan
|
||||
});
|
||||
|
||||
$(document).ready(function () {
|
||||
$('.server-index').addClass('active');
|
||||
});
|
||||
</script>
|
||||
@endsection
|
Loading…
Add table
Add a link
Reference in a new issue