codemirror: save file changes

This commit is contained in:
Usman Nasir
2020-10-22 10:00:54 +05:00
parent 9d53554772
commit 2275e69971
4 changed files with 74 additions and 46 deletions

View File

@@ -11,7 +11,7 @@ from filemanager.models import Trash
class FileManager: class FileManager:
modes = {'php': 'application/x-httpd-php', 'javascript': 'javascript', 'python': 'text/x-python', modes = {'php': 'application/x-httpd-php', 'javascript': 'javascript', 'python': 'text/x-python',
'html': 'text/html', 'go': 'text/x-go', 'css': 'text/css'} 'html': 'text/html', 'go': 'text/x-go', 'css': 'text/css', 'java': 'text/x-java'}
def __init__(self, request, data): def __init__(self, request, data):
self.request = request self.request = request
@@ -31,6 +31,8 @@ class FileManager:
return FileManager.modes['go'] return FileManager.modes['go']
elif fileName.endswith('.css') or fileName.endswith('.scss'): elif fileName.endswith('.css') or fileName.endswith('.scss'):
return FileManager.modes['css'] return FileManager.modes['css']
elif fileName.endswith('.java'):
return FileManager.modes['java']
@staticmethod @staticmethod
@@ -111,6 +113,10 @@ class FileManager:
return """ return """
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.1/mode/css/css.min.js" integrity="sha512-DG+5u//fVN9kpDgTGe78IJhJW8e5+tlrPaMgNqcrzyPXsn+GPaF2T62+X3ds7SuhFR9Qeb7XZ6kMD8X09FeJhA==" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.1/mode/css/css.min.js" integrity="sha512-DG+5u//fVN9kpDgTGe78IJhJW8e5+tlrPaMgNqcrzyPXsn+GPaF2T62+X3ds7SuhFR9Qeb7XZ6kMD8X09FeJhA==" crossorigin="anonymous"></script>
""" """
elif mode == FileManager.modes['java']:
return """
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.58.1/mode/clike/clike.min.js" integrity="sha512-HT3t3u7HfQ7USbSZa0Tk5caEnUfO8s58OWqMBwm96xaZAbA17rpnXXHDefR8ixVmSSVssbOv3W3OMh6mNX/XuQ==" crossorigin="anonymous"></script>
"""
@staticmethod @staticmethod
def findThemeFile(theme): def findThemeFile(theme):

View File

@@ -30,11 +30,9 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
var domainName = $("#domainNameInitial").text(); var domainName = $("#domainNameInitial").text();
$scope.editDisable = true;
// html editor // html editor
$scope.errorMessageEditor = true; $scope.cyberPanelLoading = true;
$scope.htmlEditorLoading = true; var globalCM;
$scope.saveSuccess = true;
var url = '/filemanager/controller'; var url = '/filemanager/controller';
@@ -67,15 +65,16 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
let params = new URLSearchParams(url.search); let params = new URLSearchParams(url.search);
let python = params.get('python'); let python = params.get('python');
if(python == null) { if (python == null) {
var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), { var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), {
lineNumbers: true, lineNumbers: true,
mode: $("#mode").text(), mode: $("#mode").text(),
lineWrapping: false, lineWrapping: false,
theme: $("#theme").text() theme: $("#theme").text()
}); });
}else{ globalCM = cm;
var mode = {name: $("#mode").text(), version:python}; } else {
var mode = {name: $("#mode").text(), version: python};
var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), { var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), {
lineNumbers: true, lineNumbers: true,
@@ -83,6 +82,7 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
lineWrapping: false, lineWrapping: false,
theme: $("#theme").text() theme: $("#theme").text()
}); });
globalCM = cm;
} }
cm.setValue(response.data.fileContents); cm.setValue(response.data.fileContents);
@@ -151,17 +151,12 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
$scope.putFileContents = function () { $scope.putFileContents = function () {
$scope.htmlEditorLoading = false; $scope.cyberPanelLoading = false;
$scope.saveSuccess = true;
$scope.errorMessageEditor = true;
var completePathForFile = $scope.currentPath;
var data = { var data = {
fileName: completePathForFile, fileName: $("#completeFilePath").text(),
method: "writeFileContents", method: "writeFileContents",
fileContent: editor.getValue(), fileContent: globalCM.getValue(),
domainRandomSeed: domainRandomSeed,
domainName: domainName domainName: domainName
}; };
@@ -176,20 +171,30 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
$http.post(url, data, config).then(ListInitialDatas, cantLoadInitialDatas); $http.post(url, data, config).then(ListInitialDatas, cantLoadInitialDatas);
function ListInitialDatas(response) { function ListInitialDatas(response) {
$scope.cyberPanelLoading = true;
$scope.htmlEditorLoading = true;
if (response.data.status === 1) { if (response.data.status === 1) {
$scope.htmlEditorLoading = true; new PNotify({
$scope.saveSuccess = false; title: 'Success!',
text: 'File saved successfully.',
type: 'success'
});
} else { } else {
$scope.errorMessageEditor = false; new PNotify({
$scope.error_message = response.data.error_message; title: 'Operation Failed!',
text: response.data.error_message,
type: 'error'
});
} }
} }
function cantLoadInitialDatas(response) { function cantLoadInitialDatas(response) {
$scope.cyberPanelLoading = true;
new PNotify({
title: 'Operation Failed!',
text: 'Could not connect to server, please refresh this page',
type: 'error'
});
} }
}; };

View File

@@ -15,6 +15,7 @@
integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"> integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'filemanager/images/fonts/css/font-awesome.min.css' %}"> <link rel="stylesheet" href="{% static 'filemanager/images/fonts/css/font-awesome.min.css' %}">
<link rel="stylesheet" href="{% static 'filemanager/css/fileManager.css' %}"> <link rel="stylesheet" href="{% static 'filemanager/css/fileManager.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'baseTemplate/custom-js/pnotify.custom.min.css' %}">
<!-- Angular JS --> <!-- Angular JS -->
@@ -43,7 +44,7 @@
crossorigin="anonymous"/> crossorigin="anonymous"/>
{{ modeFiles | safe }} {{ modeFiles | safe }}
<script src="{% static 'baseTemplate/custom-js/pnotify.custom.min.js' %}"></script>
<script src="{% static 'filemanager/js/codeMirror.js' %}"></script> <script src="{% static 'filemanager/js/codeMirror.js' %}"></script>
<!-- HTML Editor Include --> <!-- HTML Editor Include -->
@@ -165,6 +166,17 @@
</div> </div>
</div> </div>
<div class="fixed-bottom">
<div class="card" style="margin-left: 15%; margin-right: 15%; margin-bottom: -1%">
<div class="card-body">
<p><span>Editing {{ fileName }}</span>
<button style="float:right" ng-click="putFileContents()" type="button"
class="btn btn-outline-success">{% trans "Save Changes" %} <img ng-hide="cyberPanelLoading" src="{% static 'filemanager/images/loadingSmall.gif' %}"></button>
</p>
</div>
</div>
</div>
</div> </div>
<!--- File Manager body ends ----> <!--- File Manager body ends ---->

View File

@@ -30,11 +30,9 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
var domainName = $("#domainNameInitial").text(); var domainName = $("#domainNameInitial").text();
$scope.editDisable = true;
// html editor // html editor
$scope.errorMessageEditor = true; $scope.cyberPanelLoading = true;
$scope.htmlEditorLoading = true; var globalCM;
$scope.saveSuccess = true;
var url = '/filemanager/controller'; var url = '/filemanager/controller';
@@ -67,15 +65,16 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
let params = new URLSearchParams(url.search); let params = new URLSearchParams(url.search);
let python = params.get('python'); let python = params.get('python');
if(python == null) { if (python == null) {
var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), { var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), {
lineNumbers: true, lineNumbers: true,
mode: $("#mode").text(), mode: $("#mode").text(),
lineWrapping: false, lineWrapping: false,
theme: $("#theme").text() theme: $("#theme").text()
}); });
}else{ globalCM = cm;
var mode = {name: $("#mode").text(), version:python}; } else {
var mode = {name: $("#mode").text(), version: python};
var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), { var cm = new CodeMirror.fromTextArea(document.getElementById("fileContent"), {
lineNumbers: true, lineNumbers: true,
@@ -83,6 +82,7 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
lineWrapping: false, lineWrapping: false,
theme: $("#theme").text() theme: $("#theme").text()
}); });
globalCM = cm;
} }
cm.setValue(response.data.fileContents); cm.setValue(response.data.fileContents);
@@ -151,17 +151,12 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
$scope.putFileContents = function () { $scope.putFileContents = function () {
$scope.htmlEditorLoading = false; $scope.cyberPanelLoading = false;
$scope.saveSuccess = true;
$scope.errorMessageEditor = true;
var completePathForFile = $scope.currentPath;
var data = { var data = {
fileName: completePathForFile, fileName: $("#completeFilePath").text(),
method: "writeFileContents", method: "writeFileContents",
fileContent: editor.getValue(), fileContent: globalCM.getValue(),
domainRandomSeed: domainRandomSeed,
domainName: domainName domainName: domainName
}; };
@@ -176,20 +171,30 @@ fileManager.controller('editFileCtrl', function ($scope, $http, $window) {
$http.post(url, data, config).then(ListInitialDatas, cantLoadInitialDatas); $http.post(url, data, config).then(ListInitialDatas, cantLoadInitialDatas);
function ListInitialDatas(response) { function ListInitialDatas(response) {
$scope.cyberPanelLoading = true;
$scope.htmlEditorLoading = true;
if (response.data.status === 1) { if (response.data.status === 1) {
$scope.htmlEditorLoading = true; new PNotify({
$scope.saveSuccess = false; title: 'Success!',
text: 'File saved successfully.',
type: 'success'
});
} else { } else {
$scope.errorMessageEditor = false; new PNotify({
$scope.error_message = response.data.error_message; title: 'Operation Failed!',
text: response.data.error_message,
type: 'error'
});
} }
} }
function cantLoadInitialDatas(response) { function cantLoadInitialDatas(response) {
$scope.cyberPanelLoading = true;
new PNotify({
title: 'Operation Failed!',
text: 'Could not connect to server, please refresh this page',
type: 'error'
});
} }
}; };