Add initial support for opening a file in the file manager, still needs more work
This commit is contained in:
parent
6606eb1b1b
commit
a8462bf109
10 changed files with 159 additions and 24 deletions
|
@ -21,11 +21,10 @@ interface FileRepositoryInterface extends BaseRepositoryInterface
|
||||||
* Return the contents of a given file if it can be edited in the Panel.
|
* Return the contents of a given file if it can be edited in the Panel.
|
||||||
*
|
*
|
||||||
* @param string $path
|
* @param string $path
|
||||||
|
* @param int|null $notLargerThan
|
||||||
* @return string
|
* @return string
|
||||||
*
|
|
||||||
* @throws \GuzzleHttp\Exception\TransferException
|
|
||||||
*/
|
*/
|
||||||
public function getContent(string $path): string;
|
public function getContent(string $path, int $notLargerThan = null): string;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Save new contents to a given file.
|
* Save new contents to a given file.
|
||||||
|
|
|
@ -8,6 +8,7 @@ use Illuminate\Http\Response;
|
||||||
use Pterodactyl\Models\Server;
|
use Pterodactyl\Models\Server;
|
||||||
use Illuminate\Http\JsonResponse;
|
use Illuminate\Http\JsonResponse;
|
||||||
use Illuminate\Contracts\Cache\Repository as CacheRepository;
|
use Illuminate\Contracts\Cache\Repository as CacheRepository;
|
||||||
|
use Illuminate\Contracts\Config\Repository as ConfigRepository;
|
||||||
use Pterodactyl\Http\Controllers\Api\Client\ClientApiController;
|
use Pterodactyl\Http\Controllers\Api\Client\ClientApiController;
|
||||||
use Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface;
|
use Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface;
|
||||||
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\CopyFileRequest;
|
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\CopyFileRequest;
|
||||||
|
@ -16,6 +17,7 @@ use Pterodactyl\Http\Requests\Api\Client\Servers\Files\DeleteFileRequest;
|
||||||
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\RenameFileRequest;
|
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\RenameFileRequest;
|
||||||
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\CreateFolderRequest;
|
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\CreateFolderRequest;
|
||||||
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\DownloadFileRequest;
|
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\DownloadFileRequest;
|
||||||
|
use Pterodactyl\Http\Requests\Api\Client\Servers\Files\GetFileContentsRequest;
|
||||||
|
|
||||||
class FileController extends ClientApiController
|
class FileController extends ClientApiController
|
||||||
{
|
{
|
||||||
|
@ -24,6 +26,11 @@ class FileController extends ClientApiController
|
||||||
*/
|
*/
|
||||||
private $cache;
|
private $cache;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @var \Illuminate\Contracts\Config\Repository
|
||||||
|
*/
|
||||||
|
private $config;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @var \Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface
|
* @var \Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface
|
||||||
*/
|
*/
|
||||||
|
@ -32,14 +39,16 @@ class FileController extends ClientApiController
|
||||||
/**
|
/**
|
||||||
* FileController constructor.
|
* FileController constructor.
|
||||||
*
|
*
|
||||||
|
* @param \Illuminate\Contracts\Config\Repository $config
|
||||||
* @param \Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface $fileRepository
|
* @param \Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface $fileRepository
|
||||||
* @param \Illuminate\Contracts\Cache\Repository $cache
|
* @param \Illuminate\Contracts\Cache\Repository $cache
|
||||||
*/
|
*/
|
||||||
public function __construct(FileRepositoryInterface $fileRepository, CacheRepository $cache)
|
public function __construct(ConfigRepository $config, FileRepositoryInterface $fileRepository, CacheRepository $cache)
|
||||||
{
|
{
|
||||||
parent::__construct();
|
parent::__construct();
|
||||||
|
|
||||||
$this->cache = $cache;
|
$this->cache = $cache;
|
||||||
|
$this->config = $config;
|
||||||
$this->fileRepository = $fileRepository;
|
$this->fileRepository = $fileRepository;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -55,9 +64,25 @@ class FileController extends ClientApiController
|
||||||
'contents' => $this->fileRepository->setServer($request->getModel(Server::class))->getDirectory(
|
'contents' => $this->fileRepository->setServer($request->getModel(Server::class))->getDirectory(
|
||||||
$request->get('directory') ?? '/'
|
$request->get('directory') ?? '/'
|
||||||
),
|
),
|
||||||
|
'editable' => $this->config->get('pterodactyl.files.editable', []),
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Return the contents of a specified file for the user.
|
||||||
|
*
|
||||||
|
* @param \Pterodactyl\Http\Requests\Api\Client\Servers\Files\GetFileContentsRequest $request
|
||||||
|
* @return \Illuminate\Http\Response
|
||||||
|
*/
|
||||||
|
public function getFileContents(GetFileContentsRequest $request): Response
|
||||||
|
{
|
||||||
|
return Response::create(
|
||||||
|
$this->fileRepository->setServer($request->getModel(Server::class))->getContent(
|
||||||
|
$request->get('file'), $this->config->get('pterodactyl.files.max_edit_size')
|
||||||
|
)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Creates a new folder on the server.
|
* Creates a new folder on the server.
|
||||||
*
|
*
|
||||||
|
|
|
@ -0,0 +1,31 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
namespace Pterodactyl\Http\Requests\Api\Client\Servers\Files;
|
||||||
|
|
||||||
|
use Pterodactyl\Contracts\Http\ClientPermissionsRequest;
|
||||||
|
use Pterodactyl\Http\Requests\Api\Client\ClientApiRequest;
|
||||||
|
|
||||||
|
class GetFileContentsRequest extends ClientApiRequest implements ClientPermissionsRequest
|
||||||
|
{
|
||||||
|
/**
|
||||||
|
* Returns the permissions string indicating which permission should be used to
|
||||||
|
* validate that the authenticated user has permission to perform this action aganist
|
||||||
|
* the given resource (server).
|
||||||
|
*
|
||||||
|
* @return string
|
||||||
|
*/
|
||||||
|
public function permission(): string
|
||||||
|
{
|
||||||
|
return 'edit-files';
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @return array
|
||||||
|
*/
|
||||||
|
public function rules(): array
|
||||||
|
{
|
||||||
|
return [
|
||||||
|
'file' => 'required|string',
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
|
@ -3,7 +3,9 @@
|
||||||
namespace Pterodactyl\Repositories\Wings;
|
namespace Pterodactyl\Repositories\Wings;
|
||||||
|
|
||||||
use stdClass;
|
use stdClass;
|
||||||
|
use Exception;
|
||||||
use Psr\Http\Message\ResponseInterface;
|
use Psr\Http\Message\ResponseInterface;
|
||||||
|
use Pterodactyl\Exceptions\Http\Server\FileSizeTooLargeException;
|
||||||
use Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface;
|
use Pterodactyl\Contracts\Repository\Daemon\FileRepositoryInterface;
|
||||||
|
|
||||||
class FileRepository extends BaseWingsRepository implements FileRepositoryInterface
|
class FileRepository extends BaseWingsRepository implements FileRepositoryInterface
|
||||||
|
@ -14,28 +16,47 @@ class FileRepository extends BaseWingsRepository implements FileRepositoryInterf
|
||||||
* @param string $path
|
* @param string $path
|
||||||
* @return \stdClass
|
* @return \stdClass
|
||||||
*
|
*
|
||||||
|
* @throws \Exception
|
||||||
* @throws \GuzzleHttp\Exception\TransferException
|
* @throws \GuzzleHttp\Exception\TransferException
|
||||||
*/
|
*/
|
||||||
public function getFileStat(string $path): stdClass
|
public function getFileStat(string $path): stdClass
|
||||||
{
|
{
|
||||||
// TODO: Implement getFileStat() method.
|
throw new Exception('Function not implemented.');
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Return the contents of a given file if it can be edited in the Panel.
|
* Return the contents of a given file.
|
||||||
*
|
*
|
||||||
* @param string $path
|
* @param string $path
|
||||||
|
* @param int|null $notLargerThan the maximum content length in bytes
|
||||||
* @return string
|
* @return string
|
||||||
*
|
*
|
||||||
* @throws \GuzzleHttp\Exception\TransferException
|
* @throws \GuzzleHttp\Exception\TransferException
|
||||||
|
* @throws \Pterodactyl\Exceptions\Http\Server\FileSizeTooLargeException
|
||||||
*/
|
*/
|
||||||
public function getContent(string $path): string
|
public function getContent(string $path, int $notLargerThan = null): string
|
||||||
{
|
{
|
||||||
// TODO: Implement getContent() method.
|
$response = $this->getHttpClient()->get(
|
||||||
|
sprintf('/api/servers/%s/files/contents', $this->getServer()->uuid),
|
||||||
|
[
|
||||||
|
'query' => ['file' => $path],
|
||||||
|
]
|
||||||
|
);
|
||||||
|
|
||||||
|
$length = (int) $response->getHeader('Content-Length')[0] ?? 0;
|
||||||
|
|
||||||
|
if ($notLargerThan && $length > $notLargerThan) {
|
||||||
|
throw new FileSizeTooLargeException(
|
||||||
|
trans('server.files.exceptions.max_size')
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
return $response->getBody()->__toString();
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Save new contents to a given file.
|
* Save new contents to a given file. This works for both creating and updating
|
||||||
|
* a file.
|
||||||
*
|
*
|
||||||
* @param string $path
|
* @param string $path
|
||||||
* @param string $content
|
* @param string $content
|
||||||
|
@ -45,7 +66,13 @@ class FileRepository extends BaseWingsRepository implements FileRepositoryInterf
|
||||||
*/
|
*/
|
||||||
public function putContent(string $path, string $content): ResponseInterface
|
public function putContent(string $path, string $content): ResponseInterface
|
||||||
{
|
{
|
||||||
// TODO: Implement putContent() method.
|
return $this->getHttpClient()->post(
|
||||||
|
sprintf('/api/servers/%s/files/write', $this->getServer()->uuid),
|
||||||
|
[
|
||||||
|
'query' => ['file' => $path],
|
||||||
|
'body' => $content,
|
||||||
|
]
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -59,9 +86,10 @@ class FileRepository extends BaseWingsRepository implements FileRepositoryInterf
|
||||||
public function getDirectory(string $path): array
|
public function getDirectory(string $path): array
|
||||||
{
|
{
|
||||||
$response = $this->getHttpClient()->get(
|
$response = $this->getHttpClient()->get(
|
||||||
// Reason for the path check is because it is unnecessary on the Daemon but we need
|
sprintf('/api/servers/%s/files/list-directory', $this->getServer()->uuid),
|
||||||
// to respect the interface.
|
[
|
||||||
sprintf('/api/servers/%s/files/list/%s', $this->getServer()->uuid, $path === '/' ? '' : $path)
|
'query' => ['directory' => $path],
|
||||||
|
]
|
||||||
);
|
);
|
||||||
|
|
||||||
return json_decode($response->getBody(), true);
|
return json_decode($response->getBody(), true);
|
||||||
|
|
11
resources/assets/scripts/api/server/files/getFileContents.ts
Normal file
11
resources/assets/scripts/api/server/files/getFileContents.ts
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
import http from "@/api/http";
|
||||||
|
|
||||||
|
export default (server: string, file: string): Promise<string> => {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
http.get(`/api/client/servers/${server}/files/contents`, {
|
||||||
|
params: { file }
|
||||||
|
})
|
||||||
|
.then(response => resolve(response.data))
|
||||||
|
.catch(reject);
|
||||||
|
});
|
||||||
|
}
|
|
@ -74,7 +74,7 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
openNewFileModal: function () {
|
openNewFileModal: function () {
|
||||||
window.events.$emit('server:files:open-new-file-modal');
|
window.events.$emit('server:files:open-edit-file-modal');
|
||||||
this.$emit('close');
|
this.$emit('close');
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,12 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div v-on:contextmenu="showContextMenu">
|
<div v-on:contextmenu="showContextMenu">
|
||||||
<div class="row" :class="{ 'cursor-pointer': canEdit(file), 'active-selection': contextMenuVisible }" v-if="!file.directory">
|
<div
|
||||||
|
class="row"
|
||||||
|
:class="{ 'cursor-pointer': canEdit(file), 'active-selection': contextMenuVisible }"
|
||||||
|
v-if="!file.directory"
|
||||||
|
v-on:click="openFileEditModal(file)"
|
||||||
|
>
|
||||||
<div class="flex-none icon">
|
<div class="flex-none icon">
|
||||||
<Icon name="file-text" v-if="!file.symlink"/>
|
<Icon name="file-text" v-if="!file.symlink"/>
|
||||||
<Icon name="link2" v-else/>
|
<Icon name="link2" v-else/>
|
||||||
|
@ -142,6 +147,12 @@
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
|
openFileEditModal: function (file: DirectoryContentObject) {
|
||||||
|
if (!file.directory && this.canEdit(file)) {
|
||||||
|
window.events.$emit('server:files:open-edit-file-modal', file);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Determine if a file can be edited on the Panel.
|
* Determine if a file can be edited on the Panel.
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -29,11 +29,17 @@
|
||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import Icon from "@/components/core/Icon.vue";
|
import Icon from "@/components/core/Icon.vue";
|
||||||
import MessageBox from "@/components/MessageBox.vue";
|
import MessageBox from "@/components/MessageBox.vue";
|
||||||
import {ApplicationState} from '@/store/types';
|
import {ApplicationState, FileManagerState} from '@/store/types';
|
||||||
import {mapState} from "vuex";
|
import {mapState} from "vuex";
|
||||||
import * as Ace from 'brace';
|
import * as Ace from 'brace';
|
||||||
|
import { join } from 'path';
|
||||||
|
import {DirectoryContentObject} from "@/api/server/types";
|
||||||
|
import getFileContents from '@/api/server/files/getFileContents';
|
||||||
|
|
||||||
interface Data {
|
interface Data {
|
||||||
|
file?: DirectoryContentObject,
|
||||||
|
serverUuid?: string,
|
||||||
|
fm?: FileManagerState,
|
||||||
error: string | null,
|
error: string | null,
|
||||||
editor: Ace.Editor | null,
|
editor: Ace.Editor | null,
|
||||||
isVisible: boolean,
|
isVisible: boolean,
|
||||||
|
@ -77,17 +83,20 @@
|
||||||
|
|
||||||
computed: mapState({
|
computed: mapState({
|
||||||
fm: (state: ApplicationState) => state.server.fm,
|
fm: (state: ApplicationState) => state.server.fm,
|
||||||
|
serverUuid: (state: ApplicationState) => state.server.server.uuid,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
mounted: function () {
|
mounted: function () {
|
||||||
window.events.$on('server:files:open-new-file-modal', () => {
|
window.events.$on('server:files:open-edit-file-modal', (file?: DirectoryContentObject) => {
|
||||||
|
this.file = file;
|
||||||
this.isVisible = true;
|
this.isVisible = true;
|
||||||
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.editor = Ace.edit('editor');
|
this.editor = Ace.edit('editor');
|
||||||
this.loadDependencies()
|
this.loadDependencies()
|
||||||
.then(() => this.loadLanguages())
|
.then(() => this.loadLanguages())
|
||||||
.then(() => this.configureEditor());
|
.then(() => this.configureEditor())
|
||||||
|
.then(() => this.loadFileContent())
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
@ -97,6 +106,18 @@
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
loadFileContent: function () {
|
||||||
|
if (!this.file || !this.editor || this.file.directory) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
getFileContents(this.serverUuid!, join(this.fm!.currentDirectory, this.file.name))
|
||||||
|
.then(contents => {
|
||||||
|
this.editor!.$blockScrolling = Infinity;
|
||||||
|
this.editor!.setValue(contents, 1);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
updateFileLanguage: function (e: MouseEvent) {
|
updateFileLanguage: function (e: MouseEvent) {
|
||||||
if (!this.editor) {
|
if (!this.editor) {
|
||||||
return;
|
return;
|
||||||
|
@ -154,6 +175,14 @@
|
||||||
<style>
|
<style>
|
||||||
#editor {
|
#editor {
|
||||||
@apply .h-full .relative;
|
@apply .h-full .relative;
|
||||||
|
|
||||||
|
& > .ace_gutter > .ace_layer, & > .ace_scroller {
|
||||||
|
@apply .py-1;
|
||||||
|
}
|
||||||
|
|
||||||
|
& .ace_gutter-active-line {
|
||||||
|
@apply .mt-1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.ace_editor {
|
.ace_editor {
|
|
@ -52,7 +52,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<CreateFolderModal v-on:created="directoryCreated"/>
|
<CreateFolderModal v-on:created="directoryCreated"/>
|
||||||
<NewFileModal/>
|
<EditFileModal/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -65,7 +65,7 @@
|
||||||
import CreateFolderModal from '../components/filemanager/modals/CreateFolderModal.vue';
|
import CreateFolderModal from '../components/filemanager/modals/CreateFolderModal.vue';
|
||||||
import DeleteFileModal from '../components/filemanager/modals/DeleteFileModal.vue';
|
import DeleteFileModal from '../components/filemanager/modals/DeleteFileModal.vue';
|
||||||
import {DirectoryContentObject} from "@/api/server/types";
|
import {DirectoryContentObject} from "@/api/server/types";
|
||||||
import NewFileModal from "@/components/server/components/filemanager/modals/NewFileModal.vue";
|
import EditFileModal from "@/components/server/components/filemanager/modals/EditFileModal.vue";
|
||||||
|
|
||||||
type DataStructure = {
|
type DataStructure = {
|
||||||
loading: boolean,
|
loading: boolean,
|
||||||
|
@ -78,7 +78,7 @@
|
||||||
|
|
||||||
export default Vue.extend({
|
export default Vue.extend({
|
||||||
name: 'FileManager',
|
name: 'FileManager',
|
||||||
components: {CreateFolderModal, DeleteFileModal, FileRow, NewFileModal},
|
components: {CreateFolderModal, DeleteFileModal, FileRow, EditFileModal},
|
||||||
|
|
||||||
computed: {
|
computed: {
|
||||||
/**
|
/**
|
||||||
|
@ -181,7 +181,7 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
openNewFileModal: function () {
|
openNewFileModal: function () {
|
||||||
window.events.$emit('server:files:open-new-file-modal');
|
window.events.$emit('server:files:open-edit-file-modal');
|
||||||
},
|
},
|
||||||
|
|
||||||
fileRowDeleted: function (file: DirectoryContentObject, directory: boolean) {
|
fileRowDeleted: function (file: DirectoryContentObject, directory: boolean) {
|
||||||
|
|
|
@ -43,6 +43,7 @@ Route::group(['prefix' => '/servers/{server}', 'middleware' => [AuthenticateServ
|
||||||
|
|
||||||
Route::group(['prefix' => '/files'], function () {
|
Route::group(['prefix' => '/files'], function () {
|
||||||
Route::get('/list', 'Servers\FileController@listDirectory')->name('api.client.servers.files.list');
|
Route::get('/list', 'Servers\FileController@listDirectory')->name('api.client.servers.files.list');
|
||||||
|
Route::get('/contents', 'Servers\FileController@getFileContents')->name('api.client.servers.files.contents');
|
||||||
Route::put('/rename', 'Servers\FileController@renameFile')->name('api.client.servers.files.rename');
|
Route::put('/rename', 'Servers\FileController@renameFile')->name('api.client.servers.files.rename');
|
||||||
Route::post('/copy', 'Servers\FileController@copyFile')->name('api.client.servers.files.copy');
|
Route::post('/copy', 'Servers\FileController@copyFile')->name('api.client.servers.files.copy');
|
||||||
Route::post('/delete', 'Servers\FileController@delete')->name('api.client.servers.files.delete');
|
Route::post('/delete', 'Servers\FileController@delete')->name('api.client.servers.files.delete');
|
||||||
|
|
Loading…
Reference in a new issue