18.48 [ability to edit multiple files at once, in side-by-side panels…

… in File Manager #629 (comment)]
webmin · May 14, 2017 · 04266d1 · 04266d1
1 parent 3177320
commit 04266d1
Show file tree

Hide file tree

Showing 25 changed files with 1,231 additions and 1,004 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,7 @@
 ## Changelog
 
-#### Version 18.48-patch6 (May 13, 2017)
+#### Version 18.48-patch7 (May 14, 2017)
+* Added ability to edit multiple files at once, in side-by-side panels in File Manager [#629](https://github.com/qooob/authentic-theme/issues/629#issuecomment-296484593)
 * Added image color correction to obsolete table graphs
 * Added ability to manage theme config by users without home directory
 * Added ability for automatic switching to user mode upon entering its home directory in File Manager [#759](https://github.com/qooob/authentic-theme/issues/759)

diff --git a/authentic-init.pm b/authentic-init.pm
@@ -135,10 +135,9 @@ sub embed_header
     if ( $args[3] eq '1' ) {
 
         my @css = ( 'bootstrap',      'bootstrap.tagsinput', 'datepicker', 'fontawesome-animation',
-                    'jquery.jspanel', 'jquery.datatables',   'fontbase',   'authentic' );
+                    'jquery.datatables',   'fontbase',   'authentic' );
 
         my @js = ( 'timeplot',                  'jquery',
-                   'jquery-ui',                 'jquery.jspanel',
                    'jquery.scrollintoview',     'bootbox',
                    'jquery.purl',               'bootstrap',
                    'bootstrap.tagsinput',       'datepicker',
@@ -198,7 +197,7 @@ sub embed_header
                     'nprogress', 'messenger',             'select2',          'fontbase',
                     'authentic' );
 
-        my @js = ( 'jquery',              'jquery-ui',        'bootstrap',  'jquery.scrollbar',
+        my @js = ( 'jquery',              'bootstrap',  'jquery.scrollbar',
                    'jquery.autocomplete', 'momentjs',         'favico',     'select2',
                    'jquery.purl',         'jquery.injectCSS', 'transition', 'nprogress',
                    'messenger',           'init' );

diff --git a/extensions/file-manager/file-manager.js b/extensions/file-manager/file-manager.js
diff --git a/extensions/file-manager/file-manager.min.js b/extensions/file-manager/file-manager.min.js
diff --git a/unauthenticated/css/authentic.css b/unauthenticated/css/authentic.css
@@ -6582,9 +6582,36 @@ td.ui_checked_checkbox {
     margin-right: -50px
 }
 
+nav.favorites-menu ul {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none
+}
+
 nav.favorites-menu li {
     list-style: none;
-    text-align: center
+    text-align: center;
+    padding: 5px 20px 5px 20px;
+    margin-top: 5px;
+    margin-bottom: 5px
+}
+
+.file-manager .tabs-top>ul.nav li.sortable-placeholder,
+nav.favorites-menu li.sortable-placeholder {
+    border: 1px dashed #ccc;
+    height: 54px
+}
+
+.file-manager .tabs-top>ul.nav li.sortable-placeholder {
+    width: 40px;
+    height: 28px
+}
+
+.file-manager .tabs-top>ul.nav li.sortable-dragging,
+nav.favorites-menu li.sortable-dragging {
+    background: 0;
+    border: 1px dashed #ccc
 }
 
 nav.favorites-menu li span.f__c {
@@ -6596,7 +6623,6 @@ nav.favorites-menu li a {
     font-size: 2em;
     display: block;
     margin: 0 auto;
-    padding: 8px 20px 5px 20px;
     color: rgba(255, 255, 255, .8)
 }
 
@@ -8207,6 +8233,10 @@ ul.messenger .messenger-message {
     color: #333
 }
 
+.file-manager #__f__c__m {
+    z-index: 10000
+}
+
 .file-manager #__f__c__m .file-manager-remove-bookmark {
     margin-top: 3px;
     margin-right: 1px
@@ -8283,12 +8313,18 @@ ul.messenger .messenger-message {
     z-index: 1000
 }
 
-.file-manager .jsPanel {
-    opacity: 0
+.file-manager .jsPanel:not(.jspShown) {
+    opacity: 0 !important
+}
+
+.file-manager .jsPanel-hdr {
+    height: 28px
 }
 
 .file-manager .jsPanel-hdr h3 {
-    font-variant: initial
+    font-variant: initial;
+    margin: 1px 5px 10px 8px;
+    text-overflow: inherit
 }
 
 .file-manager .jsPanel-hdr h3 i {
@@ -8298,37 +8334,86 @@ ul.messenger .messenger-message {
 .file-manager .jsPanel-hdr h3 strong {
     font-size: 80% !important;
     display: inline-block;
-    margin-top: 4px;
-    padding: 2px 4px 1px 4px
+    padding: 1px 4px 1px 4px
 }
 
 .file-manager ._filemanager_file_editor_save .cspinner {
-    top: -3px;
+    top: -1px;
     left: 2px;
-    margin-left: 1.5px
+    margin-left: 4px
 }
 
 @-moz-document url-prefix() {
     .file-manager .breadcrumb {
         padding: 7px 15px 6px 15px
     }
-    .file-manager ._filemanager_file_editor_save .cspinner {
-        top: -4px
-    }
 }
 
 .file-manager #jsPanel-min-container {
     bottom: 4px
 }
 
-.file-manager .jsPanel-state-minimized {
-    margin-right: 5px;
-    margin-left: 5px
+.jsPanel-controlbar .jsPanel-btn {
+    margin-top: -8px
+}
+
+.jsPanel-controlbar .jsPanel-btn .jsglyph-close {
+    margin-right: 5px
+}
+
+.jsPanel-controlbar .jsPanel-btn-minimize {
+    margin-top: -1px
+}
+
+.jsPanel-controlbar .jsPanel-btn-help,
+.jsPanel-controlbar .jsPanel-btn-save {
+    margin-top: -8px;
+    margin-right: 10px
+}
+
+.jsPanel-controlbar .jsPanel-btn-help {
+    margin-right: 4px
+}
+
+.jsPanel-controlbar .jsPanel-btn-help i:hover,
+.jsPanel-controlbar .jsPanel-btn-save i:hover {
+    color: #8a8a8a
+}
+
+.file-manager .jsPanel .jsPanel-hdr .fa-edit {
+    margin-right: 2px;
+    vertical-align: -9%
+}
+
+#jsPanel-replacement-container,
+.jsPanel-minimized-box {
+    z-index: 1000
 }
 
-.file-manager .jsPanel .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-small,
-.file-manager .jsPanel .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-norm,
-.file-manager .jsPanel-state-minimized .jsPanel-hdr .fa-pencil-square-o {
+.file-manager .jsPanel-replacement {
+    margin-right: -1px !important;
+    margin-left: 5px !important;
+    margin-bottom: 3px !important;
+    height: 28px !important;
+    box-shadow: 0 0 2px rgba(0, 33, 50, .1), 0 2px 25px rgba(17, 38, 60, .3)
+}
+
+.file-manager .jsPanel-replacement .jsPanel-controlbar {
+    -webkit-transform: scale(.82);
+    -moz-transform: scale(.82);
+    -ms-transform: scale(.82);
+    -o-transform: scale(.82);
+    transform: scale(.82);
+    margin-top: -6px;
+    margin-right: -6px
+}
+
+.file-manager .jsPanel-replacement .jsPanel-titlebar h3 {
+    font-size: 12px;
+    margin: 4px 2px 10px 2px
+}
+
+.file-manager .jsPanel-replacement .jsPanel-hdr .fa-edit {
     display: none !important
 }
 
@@ -8337,12 +8422,27 @@ ul.messenger .messenger-message {
     display: block !important
 }
 
-.file-manager .jsPanel-state-minimized .jsPanel-btn-help {
+.file-manager .jsPanel-replacement .jsPanel-btn-help {
     display: none !important;
     cursor: default !important
 }
 
-.file-manager .jsPanel-state-minimized div[data-encoding-label] {
+.jsPanel .jsPanel-content {
+    border-top-color: #f5f5f5 !important
+}
+
+.file-manager .jsPanel div[data-encoding-label] {
+    margin-right: 13px;
+    margin-top: -12px
+}
+
+@-moz-document url-prefix() {
+    .file-manager .jsPanel div[data-encoding-label] {
+        margin-top: -10px
+    }
+}
+
+.file-manager .jsPanel-replacement div[data-encoding-label] {
     display: none;
     overflow: hidden;
     max-width: 1px;
@@ -9873,10 +9973,6 @@ a.cke_button,
     font-family: 'Authentic'
 }
 
-.jsglyph-minimize {
-    margin-top: 3px
-}
-
 .jsglyph-minimize:before {
     content: '\f0b6'
 }
@@ -9885,7 +9981,11 @@ a.cke_button,
     content: '\f0b8'
 }
 
-.jsglyph-remove:before {
+.jsglyph-normalize:before {
+    content: '\f0d9'
+}
+
+.jsglyph-close:before {
     content: '\f044'
 }
 
@@ -10396,6 +10496,10 @@ screen and (max-height:600px) {
     border-color: rgba(200, 200, 200, 0.5)
 }
 
+[draggable=true] {
+    -khtml-user-drag: element
+}
+
 .modal-list-users hr {
     margin-bottom: 13px
 }

diff --git a/unauthenticated/css/authentic.min.css b/unauthenticated/css/authentic.min.css
diff --git a/unauthenticated/css/bundle.min.css b/unauthenticated/css/bundle.min.css
diff --git a/unauthenticated/css/content.bundle.min.css b/unauthenticated/css/content.bundle.min.css
diff --git a/unauthenticated/css/fontbase.css b/unauthenticated/css/fontbase.css
diff --git a/unauthenticated/css/fontbase.min.css b/unauthenticated/css/fontbase.min.css
diff --git a/unauthenticated/css/jquery.jspanel.min.css b/unauthenticated/css/jquery.jspanel.min.css
diff --git a/unauthenticated/css/palettes/gunmetal.min.css b/unauthenticated/css/palettes/gunmetal.min.css
diff --git a/unauthenticated/css/palettes/nightrider.css b/unauthenticated/css/palettes/nightrider.css
@@ -584,8 +584,18 @@ html[data-background-style='nightRider'] .file-manager .ui_checked_columns.direc
     background: #2f3238
 }
 
-html[data-background-style='nightRider'] .file-manager .jsPanel-hdr.jsPanel-theme-light {
-    color: rgba(255, 255, 255, .76);
+html[data-background-style='nightRider'] .jsPanel .jsPanel-content {
+    border-top-color: #292c32 !important
+}
+
+html[data-background-style='nightRider'] .file-manager .jsPanel-title,
+html[data-background-style='nightRider'] .file-manager .jsPanel-replacement .jsPanel-title,
+html[data-background-style='nightRider'] .file-manager .jsPanel-replacement .jsPanel-btn span {
+    color: rgba(255, 255, 255, .66) !important
+}
+
+html[data-background-style='nightRider'] .file-manager .jsPanel-hdr {
+    color: rgba(255, 255, 255, .66);
     border: 1px solid #393c41;
     border-bottom-color: 0;
     background: #292c32
@@ -597,23 +607,23 @@ html[data-background-style='nightRider'] .file-manager .table .cspinner .cspinne
     border-left-color: #777
 }
 
-html[data-background-style='nightRider'] .file-manager .jsPanel-hdr.jsPanel-theme-light ._filemanager_file_editor_save .cspinner .cspinner-icon {
+html[data-background-style='nightRider'] .file-manager .jsPanel-hdr ._filemanager_file_editor_save .cspinner .cspinner-icon {
     border-top-color: #aaa;
     border-left-color: #fff
 }
 
-html[data-background-style='nightRider'] .file-manager .jsPanel-hdr.jsPanel-theme-light i:hover,
-html[data-background-style='nightRider'] .file-manager .jsPanel-hdr.jsPanel-theme-light span:hover {
+html[data-background-style='nightRider'] .file-manager .jsPanel-hdr i:not(.fa-edit):hover,
+html[data-background-style='nightRider'] .file-manager .jsPanel-hdr span:hover {
     color: #69768d
 }
 
 html[data-background-style='nightRider'] .fa-question-circle.-helper:hover,
-html[data-background-style='nightRider'] .file-manager .jsPanel-hdr.jsPanel-theme-light h3 small,
-html[data-background-style='nightRider'] .file-manager .jsPanel-hdr.jsPanel-theme-light h3 {
+html[data-background-style='nightRider'] .file-manager .jsPanel-hdr h3 small,
+html[data-background-style='nightRider'] .file-manager .jsPanel-hdr h3 {
     color: #ddd
 }
 
-html[data-background-style='nightRider'] .file-manager .jsPanel-content.jsPanel-theme-light {
+html[data-background-style='nightRider'] .file-manager .jsPanel-content {
     outline: 1px solid #2a2c2e
 }
 
@@ -1974,4 +1984,9 @@ html[data-background-style='nightRider'] body[class*='server-manager'] img[src*=
 html[data-background-style='nightRider'] body[class*='server-manager'] img[src*="usage-"] {
     filter: saturate(0.6) brightness(0.6) contrast(0.5) hue-rotate(-29deg);
     -webkit-filter: saturate(0.6) brightness(0.6) contrast(0.5) hue-rotate(-29deg)
+}
+
+html[data-background-style='nightRider'] .file-manager .tabs-top>ul.nav li.sortable-dragging,
+html[data-background-style='nightRider'] .file-manager .tabs-top>ul.nav li.sortable-placeholder {
+    border-color: #666
 }
diff --git a/unauthenticated/css/palettes/nightrider.min.css b/unauthenticated/css/palettes/nightrider.min.css
diff --git a/unauthenticated/js/bundle.min.js b/unauthenticated/js/bundle.min.js
diff --git a/unauthenticated/js/content.bundle.min.js b/unauthenticated/js/content.bundle.min.js