redesign parts of the file manager

ignore yarn.lock file

Author: schrej

.gitignore

@@ -9,4 +9,5 @@ Homestead.yaml
 Vagrantfile
 Vagrantfile
 
-node_modules
+node_modules
+yarn.lock

public/themes/pterodactyl/js/frontend/files/filemanager.min.js

@@ -29,15 +29,22 @@ class ActionsClass {
         this.element = undefined;
     }
 
-    folder() {
-        const nameBlock = $(this.element).find('td[data-identifier="name"]');
-        const currentName = decodeURIComponent(nameBlock.attr('data-name'));
-        const currentPath = decodeURIComponent(nameBlock.data('path'));
+    folder(path) {
+        let inputValue
+        if (path) {
+            inputValue = path
+        } else {
+            const nameBlock = $(this.element).find('td[data-identifier="name"]');
+            const currentName = decodeURIComponent(nameBlock.data('name'));
+            const currentPath = decodeURIComponent(nameBlock.data('path'));
 
-        let inputValue = `${currentPath}${currentName}/`;
-        if ($(this.element).data('type') === 'file') {
-            inputValue = currentPath;
+            if ($(this.element).data('type') === 'file') {
+                inputValue = currentPath;
+            } else {
+                inputValue = `${currentPath}${currentName}/`;
+            }
         }
+
         swal({
             type: 'input',
             title: 'Create Folder',

public/themes/pterodactyl/js/frontend/files/filemanager.min.js.map

@@ -33,7 +33,7 @@ class ContextMenuClass {
         $(document).find('#fileOptionMenu').remove();
         if (!_.isNull(this.activeLine)) this.activeLine.removeClass('active');
 
-        let newFilePath = $('#headerTableRow').attr('data-currentDir');
+        let newFilePath = $('#file_listing').data('current-dir');
         if (parent.data('type') === 'folder') {
             const nameBlock = parent.find('td[data-identifier="name"]');
             const currentName = decodeURIComponent(nameBlock.attr('data-name'));

public/themes/pterodactyl/js/frontend/files/src/actions.js

@@ -44,6 +44,7 @@ class FileManager {
             $('#load_files').slideUp(10).html(data).slideDown(10, () => {
                 ContextMenu.run();
                 this.reloadFilesButton();
+                this.addFolderButton();
                 if (_.isFunction(next)) {
                     return next();
                 }
@@ -82,6 +83,12 @@ class FileManager {
         });
     }
 
+    addFolderButton() {
+        $('i[data-action="add-folder"]').unbind().on('click', () => {
+            new ActionsClass().folder($('#file_listing').data('current-dir') || '/');
+        })
+    }
+
     decodeHash() {
         return decodeURIComponent(window.location.hash.substring(1));
     }

public/themes/pterodactyl/js/frontend/files/src/contextmenu.js

@@ -84,7 +84,7 @@
         window.onbeforeunload = function () {
             return 'A file upload in in progress, are you sure you want to continue?';
         };
-        event.file.meta.path = $('#headerTableRow').attr('data-currentdir');
+        event.file.meta.path = $('#file_listing').data('current-dir');
         event.file.meta.identifier = Math.random().toString(36).slice(2);
 
         $('#append_files_to').append('<tr id="file-upload-' + event.file.meta.identifier +'"> \

public/themes/pterodactyl/js/frontend/files/src/index.js

@@ -212,6 +212,7 @@
         'size' => 'Size',
         'last_modified' => 'Last Modified',
         'add_new' => 'Add New File',
+        'add_folder' => 'Add New Folder',
         'edit' => [
             'header' => 'Edit File',
             'header_sub' => 'Make modifications to a file from the web.',

public/themes/pterodactyl/js/frontend/files/upload.js

@@ -38,8 +38,10 @@
     <div class="col-xs-12">
         <div class="box box-primary">
             <div class="overlay file-overlay"><i class="fa fa-refresh fa-spin"></i></div>
-            <div class="box-body table-responsive no-padding" id="load_files">
-                <div class="callout callout-info" style="margin:10px;">@lang('server.files.loading')</div>
+            <div id="load_files">
+                <div class="box-body table-responsive no-padding">
+                    <div class="callout callout-info" style="margin:10px;">@lang('server.files.loading')</div>
+                </div>
             </div>
             <div class="box-footer with-border">
                 <p class="text-muted small" style="margin: 0 0 2px;">@lang('server.files.path', ['path' => '<code>/home/container</code>', 'size' => '<code>' . $node->upload_size . ' MB</code>'])</p>