Andus/MCPanel
1
1
Fork 0
Code Issues 2 Pull requests Projects 1 Releases 3 Packages Wiki Activity

Edytor plików

Browse source 
Dodaje edytor plików z #17
This commit is contained in:
Andus 2025-06-23 16:44:29 +02:00
parent a661f8222d
commit b01a6b5034
4 changed files with 232 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
app/api.py
View file

@ -204,6 +204,51 @@ def delete_file_or_folder():
return jsonify({"error": str(e)}), 500
@api.route('/files/content', methods=['GET'])
@oidc.require_login
def get_file_content():
username = oidc.user_getfield('preferred_username')
path = request.args.get('path')
base_path = os.path.abspath(f'./servers/mc-{username}')
file_path = os.path.abspath(os.path.join(base_path, path))
if not file_path.startswith(base_path) or not os.path.isfile(file_path):
return abort(403)
try:
with open(file_path, 'r', encoding='utf-8') as f:
content = f.read()
return jsonify({"success": True, "content": content})
except Exception as e:
return jsonify({"success": False, "error": str(e)}), 500
@api.route('/files/content', methods=['POST'])
@oidc.require_login
def save_file_content():
data = request.get_json()
username = data.get('username')
if username != oidc.user_getfield('preferred_username'):
return jsonify({"error": "Unauthorized request."}), 403
path = data.get('path')
content = data.get('content')
base_path = os.path.abspath(f'./servers/mc-{username}')
file_path = os.path.abspath(os.path.join(base_path, path))
if not file_path.startswith(base_path) or not os.path.isfile(file_path):
return abort(403)
try:
with open(file_path, 'w', encoding='utf-8') as f:
f.write(content)
return jsonify({"success": True})
except Exception as e:
return jsonify({"success": False, "error": str(e)}), 500
# Server config
@api.route('/config')
@oidc.require_login

134
app/static/js/file_editor.js Normal file
View file

@ -0,0 +1,134 @@
let codeMirrorEditor = null;
let currentEditingFilePath = null;
function getFileExtension(filename) {
const lastDot = filename.lastIndexOf('.');
if (lastDot === -1) return '';
return filename.slice(lastDot + 1);
}
function getCodeMirrorMode(filename) {
const ext = getFileExtension(filename).toLowerCase();
switch (ext) {
case 'js':
return 'javascript';
case 'json':
return {
name: "javascript",
json: true
};
case 'html':
case 'htm':
return 'htmlmixed';
case 'css':
return 'css';
case 'xml':
return 'xml';
case 'yml':
case 'yaml':
return 'yaml';
case 'properties':
return 'properties';
case 'log':
case 'txt':
return 'text/plain';
default:
return null;
}
}
async function openFileEditor(filePath) {
const fileExtension = getFileExtension(filePath);
const textFileExtensions = ['txt', 'log', 'json', 'yml', 'yaml', 'properties', 'html', 'css', 'js', 'xml', 'py'];
if (!textFileExtensions.includes(fileExtension.toLowerCase())) {
alert('Ten typ pliku nie może być edytowany bezpośrednio. Możesz go pobrać.');
return;
}
try {
const response = await fetch(`/api/files/content?username=${username}&path=${encodeURIComponent(filePath)}`);
if (!response.ok) {
const errorText = await response.text();
throw new Error(`Server responded with status ${response.status}: ${errorText}`);
}
const data = await response.json();
if (data.success) {
document.getElementById('file-list').style.display = 'none';
document.getElementById('drop-zone').style.display = 'none';
document.getElementById('file-editor-container').style.display = 'block';
document.getElementById('editing-filename').textContent = filePath.split('/').pop();
currentEditingFilePath = filePath;
if (!codeMirrorEditor) {
codeMirrorEditor = CodeMirror.fromTextArea(document.getElementById('file-editor'), {
lineNumbers: true,
theme: 'material-darker',
mode: getCodeMirrorMode(filePath),
indentUnit: 4,
tabSize: 4,
indentWithTabs: false,
lineWrapping: true
});
} else {
codeMirrorEditor.setValue(data.content);
codeMirrorEditor.setOption('mode', getCodeMirrorMode(filePath));
}
codeMirrorEditor.refresh();
} else {
alert('Błąd podczas ładowania pliku: ' + (data.error || 'Nieznany błąd.'));
}
} catch (error) {
console.error('Błąd:', error);
alert('Wystąpił błąd podczas ładowania pliku: ' + error.message);
}
}
async function saveFileContent() {
if (!codeMirrorEditor || !currentEditingFilePath) {
alert('Brak pliku do zapisania.');
return;
}
const content = codeMirrorEditor.getValue();
try {
const response = await fetch('/api/files/content', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
username: username,
path: currentEditingFilePath,
content: content
})
});
if (!response.ok) {
const errorText = await response.text();
throw new Error(`Server responded with status ${response.status}: ${errorText}`);
}
const data = await response.json();
if (data.success) {
alert('Plik został pomyślnie zapisany!');
} else {
alert('Błąd podczas zapisywania pliku: ' + (data.error || 'Nieznany błąd.'));
}
} catch (error) {
console.error('Błąd:', error);
alert('Wystąpił błąd podczas zapisywania pliku: ' + error.message);
}
}
function closeFileEditor() {
document.getElementById('file-editor-container').style.display = 'none';
document.getElementById('file-list').style.display = 'block';
document.getElementById('drop-zone').style.display = 'block';
currentEditingFilePath = null;
if (codeMirrorEditor) {
codeMirrorEditor.setValue('');
}
}

45
app/static/js/files.js
View file

@ -9,25 +9,42 @@ function loadFileList(path = '') {
if (path) {
list.innerHTML += `<li><a class="non-link" href="#" onclick="loadFileList('${path.split('/').slice(0, -1).join('/')}')">⬅️ ..</a></li>`;
}
data.sort((a, b) => a.name.localeCompare(b.name));
data.sort((a, b) => {
if (a.is_dir === b.is_dir) {
return a.name.localeCompare(b.name);
}
return a.is_dir ? -1 : 1;
});
data.forEach(entry => {
const itemPath = path ? `${path}/${entry.name}` : entry.name;
const html = entry.is_dir
? `<li>📁 <a class="non-link" href="#" onclick="loadFileList('${itemPath}')">${entry.name}</a>
<a class="non-link" onclick="deleteItem('${itemPath}')">
<i class="fa-solid fa-trash"></i>
</a>
</li>`
: `<li>📄 ${entry.name}
<a class="non-link" href="/api/files/download?username=${username}&path=${encodeURIComponent(itemPath)}" target="_blank">
<i class="fa-solid fa-download"></i>
</a>
<a class="non-link" onclick="deleteItem('${itemPath}')">
let html = '';
if (entry.is_dir) {
html = `<li>📁 <a class="non-link" href="#" onclick="loadFileList('${itemPath}')">${entry.name}</a>
<a class="non-link action-icon" onclick="deleteItem('${itemPath}')" title="Usuń folder">
<i class="fa-solid fa-trash"></i>
</a>
</li>`;
} else {
const fileExtension = getFileExtension(entry.name);
const editableExtensions = ['txt', 'log', 'json', 'yml', 'yaml', 'properties', 'html', 'css', 'js', 'xml', 'py'];
const isEditable = editableExtensions.includes(fileExtension.toLowerCase());
html = `<li>📄 ${entry.name}
${isEditable ? `
<a class="non-link action-icon" onclick="openFileEditor('${itemPath}')" title="Edytuj plik">
<i class="fa-solid fa-edit"></i>
</a>` : ''}
<a class="non-link action-icon" href="/api/files/download?username=${username}&path=${encodeURIComponent(itemPath)}" target="_blank" title="Pobierz plik">
<i class="fa-solid fa-download"></i>
</a>
<a class="non-link action-icon" onclick="deleteItem('${itemPath}')" title="Usuń plik">
<i class="fa-solid fa-trash"></i>
</a>
</li>`;
}
list.innerHTML += html;
});
closeFileEditor();
});
}
@ -53,7 +70,9 @@ function deleteItem(path) {
});
}
document.querySelector('[onclick="showTab(\'files\')"]').addEventListener('click', () => loadFileList());
document.querySelector('[onclick="showTab(\'files\')"]').addEventListener('click', () => {
loadFileList(); // Load root directory when the tab is opened
});
const dropZone = document.getElementById('drop-zone');
const fileInput = document.getElementById('file-input');

21
app/templates/dashboard.html
View file

@ -58,6 +58,13 @@
<br>
<h4>Lista plików:</h4>
<ul id="file-list"></ul>
<div id="file-editor-container" style="display: none;">
<h3>Edytuj plik: <span id="editing-filename"></span></h3>
<textarea id="file-editor" style="width: 100%; height: 400px;"></textarea>
<button class="btn btn-primary" onclick="saveFileContent()">Zapisz zmiany</button>
<button class="btn btn-secondary" onclick="closeFileEditor()">Zamknij</button>
</div>
</div>
<div class="tab-panel" id="config">
@ -135,6 +142,8 @@
</div>
</div>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/codemirror.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/theme/material-darker.min.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script src="/static/js/controls.js"></script>
<script src="/static/js/console.js"></script>
@ -284,4 +293,16 @@
setInterval(checkServerStatus, 5000);
</script>
<!-- CSS do Edytora Plików -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/codemirror.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/javascript/javascript.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/xml/xml.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/css/css.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/htmlmixed/htmlmixed.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/clike/clike.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/python/python.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/yaml/yaml.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/properties/properties.min.js"></script>
<script src="/static/js/file_editor.js"></script>
{% endblock %}