Commit e9f3f28a authored by Gradl, Tobias's avatar Gradl, Tobias
Browse files

1251: Migrate sidebar navigation

Task-Url: https://pm.winseda.de/issues/1251
parent 998949ba
......@@ -179,3 +179,49 @@
border-right: 1px solid #dee2e6;
border-bottom: 1px solid #dee2e6;
border-left: 1px solid #dee2e6; }
#search-available-collections {
margin-bottom: 0; }
#search-available-collections li {
display: block; }
#search-available-collections li::before {
display: none; }
.slider {
width: 95%; }
.slider > .dragger {
background: #7a80b2;
background: -webkit-linear-gradient(top, #9b9fc4, #494e7d);
background: -moz-linear-gradient(top, #9b9fc4, #494e7d);
background: linear-gradient(top, #9b9fc4, #494e7d);
-webkit-box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
-moz-box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
box-shadow: inset 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: 1px solid #213365;
width: 16px;
height: 16px; }
.slider > .dragger:hover {
background: -webkit-linear-gradient(top, #dbdcea, #7a80b2); }
.slider > .track,
.slider > .highlight-track {
background: #ccc;
background: -webkit-linear-gradient(top, #bbb, #ddd);
background: -moz-linear-gradient(top, #bbb, #ddd);
background: linear-gradient(top, #bbb, #ddd);
-webkit-box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
-moz-box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
-webkit-border-radius: 0.25rem;
-moz-border-radius: 0.25rem;
border-radius: 0.25rem;
border: 1px solid #aaa;
height: 6px; }
.slider > .highlight-track {
background: #7a80b2;
background: -webkit-linear-gradient(top, #9b9fc4, #494e7d);
background: -moz-linear-gradient(top, #9b9fc4, #494e7d);
background: linear-gradient(top, #9b9fc4, #494e7d);
border-color: #213365; }
......@@ -100,9 +100,9 @@ dt {
color: #707070; }
.hide {
display: none;
visibility: hidden;
height: 0; }
display: none !important;
visibility: hidden !important;
height: 0 !important; }
.navbar a {
border: none; }
......
.slider {
width: 300px;
}
.slider > .dragger {
background: #8DCA09;
background: -webkit-linear-gradient(top, #8DCA09, #72A307);
background: -moz-linear-gradient(top, #8DCA09, #72A307);
background: linear-gradient(top, #8DCA09, #72A307);
-webkit-box-shadow: inset 0 2px 2px rgba(255,255,255,0.5), 0 2px 8px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0 2px 2px rgba(255,255,255,0.5), 0 2px 8px rgba(0,0,0,0.2);
box-shadow: inset 0 2px 2px rgba(255,255,255,0.5), 0 2px 8px rgba(0,0,0,0.2);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: 1px solid #496805;
width: 16px;
height: 16px;
}
.slider > .dragger:hover {
background: -webkit-linear-gradient(top, #8DCA09, #8DCA09);
}
.slider > .track, .slider > .highlight-track {
background: #ccc;
background: -webkit-linear-gradient(top, #bbb, #ddd);
background: -moz-linear-gradient(top, #bbb, #ddd);
background: linear-gradient(top, #bbb, #ddd);
-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
-moz-box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border: 1px solid #aaa;
height: 4px;
}
.slider > .highlight-track {
background-color: #8DCA09;
background: -webkit-linear-gradient(top, #8DCA09, #72A307);
background: -moz-linear-gradient(top, #8DCA09, #72A307);
background: linear-gradient(top, #8DCA09, #72A307);
border-color: #496805;
}
......@@ -27,6 +27,7 @@ var modalFormHandler = null;
var ModalFormHandler = function(options) {
this.options = {
method: "GET",
backdropClose : false,
data: undefined,
contentType: undefined
};
......@@ -44,23 +45,26 @@ var ModalFormHandler = function(options) {
*/
//this.translations = [];
this.translations = [{placeholder: "~*servererror.head", key: "~eu.dariah.de.minfba.common.view.forms.servererror.head"},
{placeholder: "~*servererror.body", key: "~eu.dariah.de.minfba.common.view.forms.servererror.body"},
{placeholder: "~*uploadsuccessful.head", key: "~eu.dariah.de.minfba.common.view.forms.uploadsuccessful.head"},
{placeholder: "~*uploadsuccessful.body", key: "~eu.dariah.de.minfba.common.view.forms.uploadsuccessful.body"},
{placeholder: "~*validationerrors.head", key: "~eu.dariah.de.minfba.common.view.forms.validationerrors.head"},
{placeholder: "~*validationerrors.body", key: "~eu.dariah.de.minfba.common.view.forms.validationerrors.body"},
{placeholder: "~*file.validationsucceeded.head", key: "~eu.dariah.de.minfba.common.view.forms.file.validationsucceeded.head"},
{placeholder: "~*file.validationsucceeded.body", key: "~eu.dariah.de.minfba.common.view.forms.file.validationsucceeded.body"},
{placeholder: "~*file.servererror.head", key: "~eu.dariah.de.minfba.common.view.forms.file.servererror.head", defaultText: "Problem interacting with server"},
{placeholder: "~*file.servererror.body", key: "~eu.dariah.de.minfba.common.view.forms.file.servererror.body", defaultText: "Could not interact with server. Please check the internet connectivity of your computer, try again or inform the administrator if this problem pertains."},
{placeholder: "~*file.generalerror.head", key: "~eu.dariah.de.minfba.common.view.forms.file.generalerror.head"},
{placeholder: "~*file.generalerror.body", key: "~eu.dariah.de.minfba.common.view.forms.file.generalerror.body"},
{placeholder: "~*file.uploaderror.head", key: "~eu.dariah.de.minfba.common.view.forms.file.uploaderror.head"},
{placeholder: "~*file.uploaderror.body", key: "~eu.dariah.de.minfba.common.view.forms.file.uploaderror.body"},
{placeholder: "~*file.deletesucceeded.head", key: "~eu.dariah.de.minfba.common.view.forms.file.deletesucceeded.head"},
{placeholder: "~*file.deletesucceeded.body", key: "~eu.dariah.de.minfba.common.view.forms.file.deletesucceeded.body"},
{placeholder: "~*file.uploadcomplete.head", key: "~eu.dariah.de.minfba.common.view.forms.file.uploadcomplete.head"},
{placeholder: "~*file.uploadcomplete.body", key: "~eu.dariah.de.minfba.common.view.forms.file.uploadcomplete.body"}];
{placeholder: "~*servererror.body", key: "~eu.dariah.de.minfba.common.view.forms.servererror.body"},
{placeholder: "~*uploadsuccessful.head", key: "~eu.dariah.de.minfba.common.view.forms.uploadsuccessful.head"},
{placeholder: "~*uploadsuccessful.body", key: "~eu.dariah.de.minfba.common.view.forms.uploadsuccessful.body"},
{placeholder: "~*validationerrors.head", key: "~eu.dariah.de.minfba.common.view.forms.validationerrors.head"},
{placeholder: "~*validationerrors.body", key: "~eu.dariah.de.minfba.common.view.forms.validationerrors.body"},
{placeholder: "~*file.validationsucceeded.head", key: "~eu.dariah.de.minfba.common.view.forms.file.validationsucceeded.head"},
{placeholder: "~*file.validationsucceeded.body", key: "~eu.dariah.de.minfba.common.view.forms.file.validationsucceeded.body"},
{placeholder: "~*file.servererror.head", key: "~eu.dariah.de.minfba.common.view.forms.file.servererror.head", defaultText: "Problem interacting with server"},
{placeholder: "~*file.servererror.body", key: "~eu.dariah.de.minfba.common.view.forms.file.servererror.body", defaultText: "Could not interact with server. Please check the internet connectivity of your computer, try again or inform the administrator if this problem pertains."},
{placeholder: "~*file.generalerror.head", key: "~eu.dariah.de.minfba.common.view.forms.file.generalerror.head"},
{placeholder: "~*file.generalerror.body", key: "~eu.dariah.de.minfba.common.view.forms.file.generalerror.body"},
{placeholder: "~*file.uploaderror.head", key: "~eu.dariah.de.minfba.common.view.forms.file.uploaderror.head"},
{placeholder: "~*file.uploaderror.body", key: "~eu.dariah.de.minfba.common.view.forms.file.uploaderror.body"},
{placeholder: "~*file.filetoobig.head", key: "~de.unibamberg.minf.common.view.forms.file.filetoobig.head"},
{placeholder: "~*file.filetoobig.body", key: "~de.unibamberg.minf.common.view.forms.file.filetoobig.body"},
{placeholder: "~*file.deletesucceeded.head", key: "~eu.dariah.de.minfba.common.view.forms.file.deletesucceeded.head"},
{placeholder: "~*file.deletesucceeded.body", key: "~eu.dariah.de.minfba.common.view.forms.file.deletesucceeded.body"},
{placeholder: "~*file.uploadcomplete.head", key: "~eu.dariah.de.minfba.common.view.forms.file.uploadcomplete.head"},
{placeholder: "~*file.uploadcomplete.body", key: "~eu.dariah.de.minfba.common.view.forms.file.uploadcomplete.body"}];
this.displayCallback = null;
this.setupCallback = null;
......@@ -90,7 +94,7 @@ ModalFormHandler.prototype.show = function(identifier) {
ModalFormHandler.prototype.init = function() {
var _this = this;
$('body').modalmanager('loading');
//$('body').modalmanager('loading');
// Prepare required translations for the dialog and retrieve them
if (this.translations!=null && this.translations instanceof Array) {
......@@ -132,15 +136,26 @@ ModalFormHandler.prototype.init = function() {
ModalFormHandler.prototype.setUpForm = function() {
var _this = this;
this.container = $("<div class='modal fade'>");
this.container = $("<div class='modal fade' tabindex='-1' role='dialog'>");
var dialog = $("<div class='modal-dialog' role='document'>");
if (this.options.additionalModalClasses!==null) {
$(this.container).addClass(this.options.additionalModalClasses);
$(dialog).addClass(this.options.additionalModalClasses);
}
$(this.container).html($(this.form));
$(this.container).html(dialog);
var content = $("<div class='modal-content'>");
$(dialog).html(content);
$(content).html($(this.form));
$(this.form).find(".form-header").addClass("modal-header");
$(this.form).find(".form-header").prepend('<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>');
$(this.form).find(".form-header").append('<button type="button" class="close" data-dismiss="modal" aria-label="Close">' +
'<span aria-hidden="true"><i class="fas fa-lg fa-times"></i></span>' +
'</button>');
$(this.form).find("#form-header-title").addClass("modal-title");
$(this.form).find(".form-content").addClass("modal-body");
$(this.form).find(".form-footer").addClass("modal-footer");
$(this.form).find(".form-btn-cancel").attr("data-dismiss", "modal");
......@@ -158,7 +173,7 @@ ModalFormHandler.prototype.setUpForm = function() {
$(this.form).find(".form-btn-cancel").on("click", function() {
_this.formResetted = true;
});
$(this.container).on('hidden', function () {
$(this.container).on('hidden.bs.modal', function () {
if (_this.formResetted==true) {
$(_this.container).remove();
_this.container = null;
......@@ -195,7 +210,9 @@ ModalFormHandler.prototype.setUpForm = function() {
}
});
$(this.container).modal();
$(this.container).modal({
backdrop: this.options.backdropClose ? true : "static"
});
};
......@@ -233,6 +250,7 @@ ModalFormHandler.prototype.addMessage = function(type, header, message) {
ModalFormHandler.prototype.close = function() {
this.formResetted = true;
$(this.container).modal('hide');
$(this.container).modal('dispose')
};
ModalFormHandler.prototype.submit = function(data) {
......@@ -294,8 +312,9 @@ ModalFormHandler.prototype.processSubmitResponse = function(data) {
this.formResetted = true;
$(this.container).modal('hide');
__notifications.showMessage(NOTIFICATION_TYPES.SUCCESS, _this.translate("~*uploadsuccessful.head"), _this.translate("~*uploadsuccessful.body"));
/*if (__notifications!==undefined) {
__notifications.showMessage(NOTIFICATION_TYPES.SUCCESS, _this.translate("~*uploadsuccessful.head"), _this.translate("~*uploadsuccessful.body"));
}*/
if (_this.options.completeCallback != undefined && typeof _this.options.completeCallback == 'function') {
_this.options.completeCallback(data);
......@@ -376,7 +395,15 @@ SchemaSourceSelector.prototype.displayForm = function(data) {
$(this.content).find(".fileinput-button").fileupload({
url: window.location.pathname + _this.options.uploadTarget,
dataType: 'json',
add: function (e, data) { $(_this.owner.form).find(".form-btn-submit").attr("disabled", "true"); _this.handleAdd(e, data); },
add: function (e, data) {
$(_this.owner.form).find(".form-btn-submit").attr("disabled", "true");
if (_this.options.maxFileUploadSize!==undefined && data.originalFiles[0]['size']!==undefined && data.originalFiles[0]['size'] > _this.options.maxFileUploadSize) {
_this.owner.addMessage("danger", _this.owner.translate("~*file.filetoobig.head"),
String.format(_this.owner.translate("~*file.filetoobig.body"), __util.toHumanFileSize(_this.options.maxFileUploadSize)));
return false;
}
_this.handleAdd(e, data);
},
progressall: function (e, data) { _this.handleProgressAll(e, data); },
done: function (e, data) { _this.handleDone(e, data); },
fail: function (e, data) { _this.handleFail(e, data); }
......@@ -385,7 +412,11 @@ SchemaSourceSelector.prototype.displayForm = function(data) {
SchemaSourceSelector.prototype.handleAdd = function(e, data) {
// Show the progress bar
$(this.container).find('.progress .progress-bar').css('width', '0');
$(this.container).find(".progress .progress-bar").removeClass("bg-success");
$(this.container).find('.progress-extended').text("");
$(this.container).find(".fileupload-progress").removeClass("hide");
$(this.container).find(".fileupload-progress").show();
// Hide the upload-file button if only one file allowed
if (this.options.multiFiles == false) {
......@@ -396,23 +427,24 @@ SchemaSourceSelector.prototype.handleAdd = function(e, data) {
};
SchemaSourceSelector.prototype.handleProgressAll = function(e, data) {
var progress = parseInt(data.loaded / data.total / 2 * 100, 10);
$(this.container).find('.progress .bar').css('width', progress + '%');
$(this.container).find('.progress-extended').text(data.loaded + " of " + data.total + "B");
// Progress up to 75%, the remaining 25% for validation
var progress = parseInt(data.loaded / data.total * 75, 10);
$(this.container).find('.progress .progress-bar').css('width', progress + '%');
$(this.container).find('.progress-extended').text(progress + "%");
};
SchemaSourceSelector.prototype.handleDone = function(e, data) {
$(this.container).find('.progress .bar').css('width', '75%');
$(this.container).find('.progress-extended').text("");
$(this.container).find('.progress .progress-bar').css('width', '75%');
$(this.container).find('.progress-extended').text("75%");
/* saved, id, fileType, fileSize, created, delete */
/*$(this.container).find(".fileupload-progress").hide(0);*/
//$(this.container).find(".fileupload-progress").hide(0);
var _this = this;
$(_this.container).find('.fileupload-files').each(function() {
var fileTable = $("<table>");
var fileTable = $("<table class='w-100'>");
$(this).append(fileTable);
if (data.result.success == true) {
......@@ -420,42 +452,35 @@ SchemaSourceSelector.prototype.handleDone = function(e, data) {
_this.owner.translate("~*file.uploadcomplete.body"));
$.each(data.result.files, function (result, object) {
// Do the validation
$.ajax({
url: window.location.pathname + object.validateLink,
type: "GET",
dataType: "json",
success: function(data) {
$(_this.container).find('.progress .bar').css('width', '75%');
$(_this.container).find(".fileupload-progress").hide(0);
_this.owner.addMessage(data.message.messageType, data.message.messageHead, data.message.messageBody);
if (data.success==true) {
$(_this.owner.form).find(".form-btn-submit").removeAttr("disabled");
}
$(_this.container).find("input#file\\.id").attr("value", object.id);
if (_this.options.elementChangeCallback != undefined && typeof _this.options.elementChangeCallback == 'function') {
_this.options.elementChangeCallback(data);
}
},
error: function(jqXHR, textStatus, errorThrown) {
__util.processServerError(jqXHR, textStatus, errorThrown);
}
});
// Do the validation
if (object.validateLink!==undefined && object.validateLink!==null) {
$.ajax({
url: window.location.pathname + object.validateLink,
type: "GET",
dataType: "json",
success: function(data) {
_this.owner.addMessage(data.message.messageType, data.message.messageHead, data.message.messageBody);
_this.handleLoaded(data, object.id);
},
error: function(jqXHR, textStatus, errorThrown) {
__util.processServerError(jqXHR, textStatus, errorThrown);
}
});
} else {
_this.handleLoaded({ success: true }, object.id);
}
// General containers
var contentRow = $("<tr>");
// Buttons
var btnDelete = $('<span class="btn"> <span class="glyphicon glyphicon-trash"></span></button>');
var btnDelete = $('<span class="btn"> <i class="fas fa-trash"></i></button>');
$(btnDelete).on('click', function() { _this.handleDelete(object.deleteLink, fileTable); });
$("<td class='file-actions'>").append(btnDelete).appendTo($(contentRow));
$("<td>").append(btnDelete).appendTo($(contentRow));
// File informational area
$(contentRow).append("<td class='file-name'>" + object.fileName + "</td>");
$(contentRow).append("<td class='file-size'>(" + object.fileSize + ")</td>");
$(contentRow).append("<td class='w-100' style='word-wrap:break-word;'>" + object.fileName + "</td>");
$(contentRow).append("<td class='text-nowrap'>" + object.fileSize + "</td>");
$(contentRow).appendTo($(fileTable));
......@@ -468,6 +493,22 @@ SchemaSourceSelector.prototype.handleDone = function(e, data) {
});
};
SchemaSourceSelector.prototype.handleLoaded = function(data, objectId) {
$(this.container).find('.progress .progress-bar').css('width', '100%');
$(this.container).find('.progress .progress-bar').addClass('bg-success');
$(this.container).find('.progress-extended').text("100%");
if (data.success==true) {
$(this.owner.form).find(".form-btn-submit").removeAttr("disabled");
}
$(this.container).find("input#file\\.id").attr("value", objectId);
if (this.options.elementChangeCallback != undefined && typeof this.options.elementChangeCallback == 'function') {
this.options.elementChangeCallback(data);
}
};
SchemaSourceSelector.prototype.handleFail = function(e, data) {
var _this = this;
......@@ -496,7 +537,9 @@ SchemaSourceSelector.prototype.handleDelete = function(deleteLink, fileContainer
$(_this.container).find("input#file\\.id").attr("value", "");
fileContainer.remove();
$(_this.owner.form).find(".form-btn-submit").removeAttr("disabled");
$(_this.owner.form).find(".form-btn-submit").attr("disabled", "disabled");
$(_this.container).find(".fileupload-progress").hide(0);
if (_this.options.multiFiles == false) {
$(_this.tmpButton).show();
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment