Be more logical in file naming...

This commit is contained in:
Dane Everitt 2016-10-03 15:15:06 -04:00
parent cff59a2f88
commit 72a57604df
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
4 changed files with 158 additions and 158 deletions

View file

@ -58,8 +58,8 @@
</div> </div>
</div> </div>
<script src="{{ route('server.js', [$server->uuidShort, 'filemanager', 'index.js']) }}"></script> <script src="{{ route('server.js', [$server->uuidShort, 'filemanager', 'index.js']) }}"></script>
<script src="{{ route('server.js', [$server->uuidShort, 'filemanager', 'actions.js']) }}"></script>
<script src="{{ route('server.js', [$server->uuidShort, 'filemanager', 'contextmenu.js']) }}"></script> <script src="{{ route('server.js', [$server->uuidShort, 'filemanager', 'contextmenu.js']) }}"></script>
<script src="{{ route('server.js', [$server->uuidShort, 'filemanager', 'actions.js']) }}"></script>
<script> <script>
$(window).load(function () { $(window).load(function () {
$('.server-files').addClass('active'); $('.server-files').addClass('active');

View file

@ -19,95 +19,101 @@
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
// SOFTWARE. // SOFTWARE.
class FileActions { class ActionsClass {
constructor() { constructor(element, menu) {
this.activeLine = null; this.element = element;
this.menu = menu;
} }
run() { destroy() {
this.directoryClick(); this.element = undefined;
this.rightClick();
} }
makeMenu() { move() {
$(document).find('#fileOptionMenu').remove(); alert($(this.element).data('path'));
if (!_.isNull(this.activeLine)) this.activeLine.removeClass('active');
return '<ul id="fileOptionMenu" class="dropdown-menu" role="menu" style="display:none" > \
<li data-action="move"><a tabindex="-1" href="#"><i class="fa fa-arrow-right"></i> Move</a></li> \
<li data-action="rename"><a tabindex="-1" href="#"><i class="fa fa-pencil-square-o"></i> Rename</a></li> \
<li data-action="compress" class="hidden"><a tabindex="-1" href="#"><i class="fa fa-file-archive-o"></i> Compress</a></li> \
<li data-action="decompress" class="hidden"><a tabindex="-1" href="#"><i class="fa fa-expand"></i> Decompress</a></li> \
<li class="divider"></li> \
<li data-action="download" class="hidden"><a tabindex="-1" href="/server/{{ $server->uuidShort }}/files/download/"><i class="fa fa-download"></i> Download</a></li> \
<li data-action="delete" class="bg-danger"><a tabindex="-1" href="#"><i class="fa fa-trash-o"></i> Delete</a></li> \
</ul>';
} }
rightClick() { download() {
$('#file_listing > tbody td').on('contextmenu', event => { var baseURL = $(this.menu).find('li[data-action="download"] a').attr('href');
var toURL = baseURL + $(this.element).find('td[data-identifier="name"]').data('name');
const parent = $(event.target).parent(); window.location = toURL;
const menu = $(this.makeMenu()); }
if (parent.data('type') === 'disabled') return; rename() {
event.preventDefault(); const nameBlock = $(this.element).find('td[data-identifier="name"]');
const currentLink = nameBlock.find('a');
const currentName = decodeURIComponent(nameBlock.attr('data-name'));
const attachEditor = `
<input class="form-control input-sm" type="text" value="${currentName}" />
<span class="input-loader"><i class="fa fa-refresh fa-spin fa-fw"></i></span>
`;
$(menu).appendTo('body'); nameBlock.html(attachEditor);
$(menu).data('invokedOn', $(event.target)).show().css({ const inputField = nameBlock.find('input');
position: 'absolute', const inputLoader = nameBlock.find('.input-loader');
left: event.pageX,
top: event.pageY,
});
this.activeLine = parent; inputField.focus();
this.activeLine.addClass('active'); inputField.on('blur keypress', e => {
// Save Field
if (parent.data('type') === 'file') { if (e.type === 'blur' || (e.type === 'keypress' && e.which !== 13)) {
$(menu).find('li[data-action="download"]').removeClass('hidden'); // Escape Key Pressed, don't save.
if (e.which === 27 || e.type === 'blur') {
if (!_.isEmpty(currentLink)) {
nameBlock.html(currentLink);
} else {
nameBlock.html(currentName);
}
inputField.remove();
ContextMenu.run();
}
return;
} }
if (parent.data('type') === 'folder') { inputLoader.show();
$(menu).find('li[data-action="compress"]').removeClass('hidden'); const currentPath = decodeURIComponent(nameBlock.data('path'));
}
if (_.without(['application/zip', 'application/gzip', 'application/x-gzip'], parent.data('mime')).length < 3) { $.ajax({
$(menu).find('li[data-action="decompress"]').removeClass('hidden'); type: 'POST',
} headers: {
'X-Access-Token': '{{ $server->daemonSecret }}',
// Handle Events 'X-Access-Server': '{{ $server->uuid }}'
var Context = new ContextMenuActions(parent, menu); },
$(menu).find('li[data-action="move"]').unbind().on('click', e => { contentType: 'application/json; charset=utf-8',
Context.move(); url: '{{ $node->scheme }}://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/files/rename',
timeout: 10000,
data: JSON.stringify({
from: `${currentPath}${currentName}`,
to: `${currentPath}${inputField.val()}`,
}),
}).done(data => {
nameBlock.attr('data-name', inputField.val());
if (!_.isEmpty(currentLink)) {
const newLink = currentLink.attr('href').substr(0, currentLink.attr('href').lastIndexOf('/')) + '/' + inputField.val();
currentLink.attr('href', newLink);
nameBlock.html(
currentLink.html(inputField.val())
);
} else {
nameBlock.html(inputField.val());
}
inputField.remove();
}).fail(jqXHR => {
nameBlock.addClass('has-error');
inputLoader.remove();
console.error(jqXHR);
var error = 'An error occured while trying to process this request.';
if (typeof jqXHR.responseJSON !== 'undefined' && typeof jqXHR.responseJSON.error !== 'undefined') {
error = jqXHR.responseJSON.error;
}
swal({
type: 'error',
title: '',
text: error,
});
}).always(() => {
inputLoader.remove();
}); });
$(menu).find('li[data-action="rename"]').unbind().on('click', e => {
Context.rename();
});
$(menu).find('li[data-action="download"]').unbind().on('click', e => {
e.preventDefault();
Context.download();
});
$(window).on('click', () => {
$(menu).remove();
if(!_.isNull(this.activeLine)) this.activeLine.removeClass('active');
});
});
}
directoryClick() {
$('a[data-action="directory-view"]').on('click', function (event) {
event.preventDefault();
const path = $(this).parent().data('path') || '';
const name = $(this).parent().data('name') || '';
console.log('changing hash');
window.location.hash = encodeURIComponent(path + name);
Files.list();
}); });
} }
} }
window.Actions = new FileActions;

View file

@ -19,101 +19,95 @@
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
// SOFTWARE. // SOFTWARE.
class ContextMenuActions { class ContextMenuClass {
constructor(element, menu) { constructor() {
this.element = element; this.activeLine = null;
this.menu = menu;
} }
destroy() { run() {
this.element = undefined; this.directoryClick();
this.rightClick();
} }
move() { makeMenu() {
alert($(this.element).data('path')); $(document).find('#fileOptionMenu').remove();
if (!_.isNull(this.activeLine)) this.activeLine.removeClass('active');
return '<ul id="fileOptionMenu" class="dropdown-menu" role="menu" style="display:none" > \
<li data-action="move"><a tabindex="-1" href="#"><i class="fa fa-arrow-right"></i> Move</a></li> \
<li data-action="rename"><a tabindex="-1" href="#"><i class="fa fa-pencil-square-o"></i> Rename</a></li> \
<li data-action="compress" class="hidden"><a tabindex="-1" href="#"><i class="fa fa-file-archive-o"></i> Compress</a></li> \
<li data-action="decompress" class="hidden"><a tabindex="-1" href="#"><i class="fa fa-expand"></i> Decompress</a></li> \
<li class="divider"></li> \
<li data-action="download" class="hidden"><a tabindex="-1" href="/server/{{ $server->uuidShort }}/files/download/"><i class="fa fa-download"></i> Download</a></li> \
<li data-action="delete" class="bg-danger"><a tabindex="-1" href="#"><i class="fa fa-trash-o"></i> Delete</a></li> \
</ul>';
} }
download() { rightClick() {
var baseURL = $(this.menu).find('li[data-action="download"] a').attr('href'); $('#file_listing > tbody td').on('contextmenu', event => {
var toURL = baseURL + $(this.element).find('td[data-identifier="name"]').data('name');
window.location = toURL; const parent = $(event.target).parent();
} const menu = $(this.makeMenu());
rename() { if (parent.data('type') === 'disabled') return;
const nameBlock = $(this.element).find('td[data-identifier="name"]'); event.preventDefault();
const currentLink = nameBlock.find('a');
const currentName = decodeURIComponent(nameBlock.attr('data-name'));
const attachEditor = `
<input class="form-control input-sm" type="text" value="${currentName}" />
<span class="input-loader"><i class="fa fa-refresh fa-spin fa-fw"></i></span>
`;
nameBlock.html(attachEditor); $(menu).appendTo('body');
const inputField = nameBlock.find('input'); $(menu).data('invokedOn', $(event.target)).show().css({
const inputLoader = nameBlock.find('.input-loader'); position: 'absolute',
left: event.pageX,
top: event.pageY,
});
inputField.focus(); this.activeLine = parent;
inputField.on('blur keypress', e => { this.activeLine.addClass('active');
// Save Field
if (e.type === 'blur' || (e.type === 'keypress' && e.which !== 13)) { if (parent.data('type') === 'file') {
// Escape Key Pressed, don't save. $(menu).find('li[data-action="download"]').removeClass('hidden');
if (e.which === 27 || e.type === 'blur') {
if (!_.isEmpty(currentLink)) {
nameBlock.html(currentLink);
} else {
nameBlock.html(currentName);
}
inputField.remove();
Actions.run();
}
return;
} }
inputLoader.show(); if (parent.data('type') === 'folder') {
const currentPath = decodeURIComponent(nameBlock.data('path')); $(menu).find('li[data-action="compress"]').removeClass('hidden');
}
$.ajax({ if (_.without(['application/zip', 'application/gzip', 'application/x-gzip'], parent.data('mime')).length < 3) {
type: 'POST', $(menu).find('li[data-action="decompress"]').removeClass('hidden');
headers: { }
'X-Access-Token': '{{ $server->daemonSecret }}',
'X-Access-Server': '{{ $server->uuid }}' // Handle Events
}, const Actions = new ActionsClass(parent, menu);
contentType: 'application/json; charset=utf-8', $(menu).find('li[data-action="move"]').unbind().on('click', e => {
url: '{{ $node->scheme }}://{{ $node->fqdn }}:{{ $node->daemonListen }}/server/files/rename', Actions.move();
timeout: 10000, });
data: JSON.stringify({
from: `${currentPath}${currentName}`, $(menu).find('li[data-action="rename"]').unbind().on('click', e => {
to: `${currentPath}${inputField.val()}`, Actions.rename();
}), });
}).done(data => {
nameBlock.attr('data-name', inputField.val()); $(menu).find('li[data-action="download"]').unbind().on('click', e => {
if (!_.isEmpty(currentLink)) { e.preventDefault();
const newLink = currentLink.attr('href').substr(0, currentLink.attr('href').lastIndexOf('/')) + '/' + inputField.val(); Actions.download();
currentLink.attr('href', newLink); });
nameBlock.html(
currentLink.html(inputField.val()) $(window).on('click', () => {
); $(menu).remove();
} else { if(!_.isNull(this.activeLine)) this.activeLine.removeClass('active');
nameBlock.html(inputField.val());
}
inputField.remove();
}).fail(jqXHR => {
nameBlock.addClass('has-error');
inputLoader.remove();
console.error(jqXHR);
var error = 'An error occured while trying to process this request.';
if (typeof jqXHR.responseJSON !== 'undefined' && typeof jqXHR.responseJSON.error !== 'undefined') {
error = jqXHR.responseJSON.error;
}
swal({
type: 'error',
title: '',
text: error,
});
}).always(() => {
inputLoader.remove();
}); });
}); });
} }
directoryClick() {
$('a[data-action="directory-view"]').on('click', function (event) {
event.preventDefault();
const path = $(this).parent().data('path') || '';
const name = $(this).parent().data('name') || '';
console.log('changing hash');
window.location.hash = encodeURIComponent(path + name);
Files.list();
});
}
} }
window.ContextMenu = new ContextMenuClass;

View file

@ -46,7 +46,7 @@ class FileManager {
}).done(data => { }).done(data => {
this.loader(false); this.loader(false);
$('#load_files').slideUp().html(data).slideDown(100, () => { $('#load_files').slideUp().html(data).slideDown(100, () => {
Actions.run(); ContextMenu.run();
}); });
$('#internal_alert').slideUp(); $('#internal_alert').slideUp();
}).fail(jqXHR => { }).fail(jqXHR => {