mirror of
https://github.com/pelican-dev/panel.git
synced 2025-05-19 22:14:45 +02:00
Merge branch 'feature/filament' of github.com:pelican-dev/panel into feature/filament
# Conflicts: # composer.lock
This commit is contained in:
Lance Pioch
commit
65f59c446e
@ -3,6 +3,7 @@
|
||||
namespace App\Filament\Resources;
|
||||
|
||||
use App\Filament\Resources\EggResource\Pages;
|
||||
use AbdelhamidErrahmouni\FilamentMonacoEditor\MonacoEditor;
|
||||
use App\Models\Egg;
|
||||
use Filament\Forms;
|
||||
use Filament\Forms\Form;
|
||||
@ -98,7 +99,6 @@ class EggResource extends Resource
|
||||
Forms\Components\Tabs\Tab::make('Install Script')
|
||||
->columns(3)
|
||||
->schema([
|
||||
Forms\Components\Textarea::make('script_install')->rows(20)->columnSpanFull(),
|
||||
|
||||
Forms\Components\Select::make('copy_script_from')
|
||||
->placeholder('None')
|
||||
@ -113,9 +113,15 @@ class EggResource extends Resource
|
||||
->required()
|
||||
->maxLength(191)
|
||||
->default('ash'),
|
||||
|
||||
MonacoEditor::make('script_install')
|
||||
->columnSpanFull()
|
||||
->fontSize('16px')
|
||||
->language('shell')
|
||||
->view('filament.plugins.monaco-editor'),
|
||||
]),
|
||||
|
||||
])->columnSpanFull(),
|
||||
])->columnSpanFull()->persistTabInQueryString(),
|
||||
|
||||
// Forms\Components\TagsInput::make('features'),
|
||||
// Forms\Components\TagsInput::make('file_denylist')->placeholder('new-file.txt'),
|
||||
|
||||
@ -112,7 +112,7 @@ class Server extends Model
|
||||
* API representation using fractal.
|
||||
*/
|
||||
public const RESOURCE_NAME = 'server';
|
||||
|
||||
|
||||
/**
|
||||
* The table associated with the model.
|
||||
*/
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
"ext-pdo_mysql": "*",
|
||||
"ext-posix": "*",
|
||||
"ext-zip": "*",
|
||||
"abdelhamiderrahmouni/filament-monaco-editor": "^0.2.0",
|
||||
"aws/aws-sdk-php": "~3.288.1",
|
||||
"chillerlan/php-qrcode": "^5.0",
|
||||
"doctrine/dbal": "~3.6.0",
|
||||
|
||||
600
composer.lock
generated
600
composer.lock
generated
File diff suppressed because it is too large
Load Diff
270
config/filament-monaco-editor.php
Normal file
270
config/filament-monaco-editor.php
Normal file
@ -0,0 +1,270 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
'general' => [
|
||||
'enable-preview' => true,
|
||||
'show-full-screen-toggle' => true,
|
||||
'show-placeholder' => true,
|
||||
'placeholder-text' => 'Your code here...',
|
||||
'show-loader' => true,
|
||||
'font-size' => '15px',
|
||||
'line-numbers-min-chars' => true,
|
||||
'automatic-layout' => true,
|
||||
'default-theme' => 'iPlastic',
|
||||
],
|
||||
'themes' => [
|
||||
'blackboard' => [
|
||||
'base' => 'vs-dark',
|
||||
'inherit' => true,
|
||||
'rules' => [
|
||||
[
|
||||
'background' => '0C1021',
|
||||
'token' => '',
|
||||
],
|
||||
[
|
||||
'foreground' => 'aeaeae',
|
||||
'token' => 'comment',
|
||||
],
|
||||
[
|
||||
'foreground' => 'd8fa3c',
|
||||
'token' => 'constant',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ff6400',
|
||||
'token' => 'entity',
|
||||
],
|
||||
[
|
||||
'foreground' => 'fbde2d',
|
||||
'token' => 'keyword',
|
||||
],
|
||||
[
|
||||
'foreground' => 'fbde2d',
|
||||
'token' => 'storage',
|
||||
],
|
||||
[
|
||||
'foreground' => '61ce3c',
|
||||
'token' => 'string',
|
||||
],
|
||||
[
|
||||
'foreground' => '61ce3c',
|
||||
'token' => 'meta.verbatim',
|
||||
],
|
||||
[
|
||||
'foreground' => '8da6ce',
|
||||
'token' => 'support',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ab2a1d',
|
||||
'fontStyle' => 'italic',
|
||||
'token' => 'invalid.deprecated',
|
||||
],
|
||||
[
|
||||
'foreground' => 'f8f8f8',
|
||||
'background' => '9d1e15',
|
||||
'token' => 'invalid.illegal',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ff6400',
|
||||
'fontStyle' => 'italic',
|
||||
'token' => 'entity.other.inherited-class',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ff6400',
|
||||
'token' => 'string constant.other.placeholder',
|
||||
],
|
||||
[
|
||||
'foreground' => 'becde6',
|
||||
'token' => 'meta.function-call.py',
|
||||
],
|
||||
[
|
||||
'foreground' => '7f90aa',
|
||||
'token' => 'meta.tag',
|
||||
],
|
||||
[
|
||||
'foreground' => '7f90aa',
|
||||
'token' => 'meta.tag entity',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ffffff',
|
||||
'token' => 'entity.name.section',
|
||||
],
|
||||
[
|
||||
'foreground' => 'd5e0f3',
|
||||
'token' => 'keyword.type.variant',
|
||||
],
|
||||
[
|
||||
'foreground' => 'f8f8f8',
|
||||
'token' => 'source.ocaml keyword.operator.symbol',
|
||||
],
|
||||
[
|
||||
'foreground' => '8da6ce',
|
||||
'token' => 'source.ocaml keyword.operator.symbol.infix',
|
||||
],
|
||||
[
|
||||
'foreground' => '8da6ce',
|
||||
'token' => 'source.ocaml keyword.operator.symbol.prefix',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'underline',
|
||||
'token' => 'source.ocaml keyword.operator.symbol.infix.floating-point',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'underline',
|
||||
'token' => 'source.ocaml keyword.operator.symbol.prefix.floating-point',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'underline',
|
||||
'token' => 'source.ocaml constant.numeric.floating-point',
|
||||
],
|
||||
[
|
||||
'background' => 'ffffff08',
|
||||
'token' => 'text.tex.latex meta.function.environment',
|
||||
],
|
||||
[
|
||||
'background' => '7a96fa08',
|
||||
'token' => 'text.tex.latex meta.function.environment meta.function.environment',
|
||||
],
|
||||
[
|
||||
'foreground' => 'fbde2d',
|
||||
'token' => 'text.tex.latex support.function',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ffffff',
|
||||
'token' => 'source.plist string.unquoted',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ffffff',
|
||||
'token' => 'source.plist keyword.operator',
|
||||
],
|
||||
],
|
||||
'colors' => [
|
||||
'editor.foreground' => '#F8F8F8',
|
||||
'editor.background' => '#0C1021',
|
||||
'editor.selectionBackground' => '#253B76',
|
||||
'editor.lineHighlightBackground' => '#FFFFFF0F',
|
||||
'editorCursor.foreground' => '#FFFFFFA6',
|
||||
'editorWhitespace.foreground' => '#FFFFFF40',
|
||||
],
|
||||
],
|
||||
'iPlastic' => [
|
||||
'base' => 'vs',
|
||||
'inherit' => true,
|
||||
'rules' => [
|
||||
[
|
||||
'background' => 'EEEEEEEB',
|
||||
'token' => '',
|
||||
],
|
||||
[
|
||||
'foreground' => '009933',
|
||||
'token' => 'string',
|
||||
],
|
||||
[
|
||||
'foreground' => '0066ff',
|
||||
'token' => 'constant.numeric',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ff0080',
|
||||
'token' => 'string.regexp',
|
||||
],
|
||||
[
|
||||
'foreground' => '0000ff',
|
||||
'token' => 'keyword',
|
||||
],
|
||||
[
|
||||
'foreground' => '9700cc',
|
||||
'token' => 'constant.language',
|
||||
],
|
||||
[
|
||||
'foreground' => '990000',
|
||||
'token' => 'support.class.exception',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ff8000',
|
||||
'token' => 'entity.name.function',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'bold underline',
|
||||
'token' => 'entity.name.type',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'italic',
|
||||
'token' => 'variable.parameter',
|
||||
],
|
||||
[
|
||||
'foreground' => '0066ff',
|
||||
'fontStyle' => 'italic',
|
||||
'token' => 'comment',
|
||||
],
|
||||
[
|
||||
'foreground' => 'ff0000',
|
||||
'background' => 'e71a114d',
|
||||
'token' => 'invalid',
|
||||
],
|
||||
[
|
||||
'background' => 'e71a1100',
|
||||
'token' => 'invalid.deprecated.trailing-whitespace',
|
||||
],
|
||||
[
|
||||
'foreground' => '000000',
|
||||
'background' => 'fafafafc',
|
||||
'token' => 'text source',
|
||||
],
|
||||
[
|
||||
'foreground' => '0033cc',
|
||||
'token' => 'meta.tag',
|
||||
],
|
||||
[
|
||||
'foreground' => '0033cc',
|
||||
'token' => 'declaration.tag',
|
||||
],
|
||||
[
|
||||
'foreground' => '6782d3',
|
||||
'token' => 'constant',
|
||||
],
|
||||
[
|
||||
'foreground' => '6782d3',
|
||||
'token' => 'support.constant',
|
||||
],
|
||||
[
|
||||
'foreground' => '3333ff',
|
||||
'fontStyle' => 'bold',
|
||||
'token' => 'support',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'bold',
|
||||
'token' => 'storage',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'bold underline',
|
||||
'token' => 'entity.name.section',
|
||||
],
|
||||
[
|
||||
'foreground' => '000000',
|
||||
'fontStyle' => 'bold',
|
||||
'token' => 'entity.name.function.frame',
|
||||
],
|
||||
[
|
||||
'foreground' => '333333',
|
||||
'token' => 'meta.tag.preprocessor.xml',
|
||||
],
|
||||
[
|
||||
'foreground' => '3366cc',
|
||||
'fontStyle' => 'italic',
|
||||
'token' => 'entity.other.attribute-name',
|
||||
],
|
||||
[
|
||||
'fontStyle' => 'bold',
|
||||
'token' => 'entity.name.tag',
|
||||
],
|
||||
],
|
||||
'colors' => [
|
||||
'editor.foreground' => '#000000',
|
||||
'editor.background' => '#EEEEEEEB',
|
||||
'editor.selectionBackground' => '#BAD6FD',
|
||||
'editor.lineHighlightBackground' => '#0000001A',
|
||||
'editorCursor.foreground' => '#000000',
|
||||
'editorWhitespace.foreground' => '#B3B3B3F4',
|
||||
],
|
||||
],
|
||||
],
|
||||
];
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
114
resources/views/filament/plugins/monaco-editor.blade.php
Normal file
114
resources/views/filament/plugins/monaco-editor.blade.php
Normal file
@ -0,0 +1,114 @@
|
||||
<x-dynamic-component :component="$getFieldWrapperView()" :field="$field" class="overflow-hidden">
|
||||
|
||||
<div x-data="{
|
||||
monacoContent: $wire.$entangle('{{ $getStatePath() }}'),
|
||||
previewContent: '',
|
||||
fullScreenModeEnabled: false,
|
||||
showPreview: false,
|
||||
monacoLanguage: '{{ $getLanguage() }}',
|
||||
monacoPlaceholder: {{ (int) $getShowPlaceholder() }},
|
||||
monacoPlaceholderText: '{{ $getPlaceholderText() }}',
|
||||
monacoLoader: {{ (int) $getShowLoader() }},
|
||||
monacoFontSize: '{{ $getFontSize() }}',
|
||||
lineNumbersMinChars: {{ $getLineNumbersMinChars() }},
|
||||
automaticLayout: {{ (int) $getAutomaticLayout() }},
|
||||
monacoId: $id('monaco-editor'),
|
||||
|
||||
monacoEditor(editor){
|
||||
editor.onDidChangeModelContent((e) => {
|
||||
this.monacoContent = editor.getValue();
|
||||
this.updatePlaceholder(editor.getValue());
|
||||
});
|
||||
|
||||
editor.onDidBlurEditorWidget(() => {
|
||||
this.updatePlaceholder(editor.getValue());
|
||||
});
|
||||
|
||||
editor.onDidFocusEditorWidget(() => {
|
||||
this.updatePlaceholder(editor.getValue());
|
||||
});
|
||||
},
|
||||
|
||||
updatePlaceholder: function(value) {
|
||||
if (value == '') {
|
||||
this.monacoPlaceholder = true;
|
||||
return;
|
||||
}
|
||||
this.monacoPlaceholder = false;
|
||||
},
|
||||
|
||||
monacoEditorFocus(){
|
||||
document.getElementById(this.monacoId).dispatchEvent(
|
||||
new CustomEvent('monaco-editor-focused', { monacoId: this.monacoId })
|
||||
);
|
||||
},
|
||||
|
||||
monacoEditorAddLoaderScriptToHead() {
|
||||
script = document.createElement('script');
|
||||
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.39.0/min/vs/loader.min.js';
|
||||
document.head.appendChild(script);
|
||||
},
|
||||
|
||||
}" x-init="
|
||||
$el.style.height = '500px';
|
||||
$watch('fullScreenModeEnabled', value => {
|
||||
if (value) {
|
||||
$el.style.height = '100vh';
|
||||
} else {
|
||||
$el.style.height = '500px';
|
||||
}
|
||||
});
|
||||
|
||||
if(typeof _amdLoaderGlobal == 'undefined'){
|
||||
monacoEditorAddLoaderScriptToHead();
|
||||
}
|
||||
|
||||
monacoLoaderInterval = setInterval(() => {
|
||||
if(typeof _amdLoaderGlobal !== 'undefined'){
|
||||
|
||||
// Based on https://jsfiddle.net/developit/bwgkr6uq/ which works without needing service worker. Provided by loader.min.js.
|
||||
require.config({ paths: { 'vs': 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.39.0/min/vs' }});
|
||||
let proxy = URL.createObjectURL(new Blob([` self.MonacoEnvironment = { baseUrl: 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.39.0/min' }; importScripts('https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.39.0/min/vs/base/worker/workerMain.min.js');`], { type: 'text/javascript' }));
|
||||
window.MonacoEnvironment = { getWorkerUrl: () => proxy };
|
||||
|
||||
require(['vs/editor/editor.main'], () => {
|
||||
|
||||
monaco.editor.defineTheme('custom', {{ $editorTheme() }});
|
||||
document.getElementById(monacoId).editor = monaco.editor.create($refs.monacoEditorElement, {
|
||||
value: monacoContent,
|
||||
theme: localStorage.getItem('theme') === 'light' ? 'iPlastic' : 'custom',
|
||||
fontSize: monacoFontSize,
|
||||
lineNumbersMinChars: lineNumbersMinChars,
|
||||
automaticLayout: automaticLayout,
|
||||
language: monacoLanguage,
|
||||
scrollbar: {
|
||||
horizontal: 'auto',
|
||||
horizontalScrollbarSize: 15
|
||||
},
|
||||
|
||||
});
|
||||
monacoEditor(document.getElementById(monacoId).editor);
|
||||
document.getElementById(monacoId).addEventListener('monaco-editor-focused', (event) => {
|
||||
document.getElementById(monacoId).editor.focus();
|
||||
});
|
||||
updatePlaceholder(document.getElementById(monacoId).editor.getValue());
|
||||
});
|
||||
|
||||
clearInterval(monacoLoaderInterval);
|
||||
monacoLoader = false;
|
||||
}
|
||||
}, 5); " :id="monacoId"
|
||||
class="fme-wrapper"
|
||||
:class="{ 'fme-full-screen': fullScreenModeEnabled }" x-cloak>
|
||||
<div class="h-full w-full">
|
||||
<div class="fme-container" style="padding-top: 0">
|
||||
<!-- Editor -->
|
||||
<div x-show="!monacoLoader" class="fme-element-wrapper">
|
||||
<div x-ref="monacoEditorElement" class="fme-element"></div>
|
||||
<div x-ref="monacoPlaceholderElement" x-show="monacoPlaceholder" @click="monacoEditorFocus()" :style="'font-size: ' + monacoFontSize" class="fme-placeholder" x-text="monacoPlaceholderText"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</x-dynamic-component>
|
||||
Loading…
x
Reference in New Issue
Block a user