blackicedbear/FHC-Core
1
0
Fork 0
mirror of https://github.com/FH-Complete/FHC-Core.git synced 2026-07-23 18:02:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

adds bootstrapVersion flag to the tableWidget options to render bootstrap3 classes or bootstrap5 classes

Browse Source
This commit is contained in:
SimonGschnell
2024-03-19 15:29:28 +01:00
parent acac5dfc65
commit de15d43bb7
5 changed files with 67 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/js/TableWidget.js
+51 -20
View File
@@ -20,6 +20,7 @@ var FHC_TableWidget = {
_datasetRepresentation: null, // contains the current data representation
_bootstrapVersion:3,
//------------------------------------------------------------------------------------------------------------------
// Public methods
@@ -152,6 +153,8 @@ var FHC_TableWidget = {
FHC_TableWidget._setDatasetRepresentation(data); // set what type of dataset representation was choosen
FHC_TableWidget._setBootstrapVersion(data); // set the bootstrap version used for the tableWidget
var tableWidgetDiv = $('div[tableUniqueId="' + data.tableUniqueId + '"]');
FHC_TableWidget._turnOffEvents(tableWidgetDiv); // turns all the events off
@@ -163,6 +166,7 @@ var FHC_TableWidget = {
FHC_TableWidget._turnOnEvents(tableWidgetDiv); // turns all the events off
FHC_TableWidget._onTableBuilt(tableWidgetDiv, data);
},
@@ -766,6 +770,11 @@ var FHC_TableWidget = {
}
},
_setBootstrapVersion: function(data) {
_bootstrapVersion = data.bootstrapVersion
},
_getTableWidgetUniqueIdArray: function() {
var tableWidgetUniqueIdArray = [];
@@ -817,17 +826,17 @@ function _renderTabulatorHeaderHTML(tableWidgetDiv){
tabulatorHeaderHTML += '<div class="btn-toolbar pull-right" role="toolbar">';
tabulatorHeaderHTML += '<div class="btn-group" role="group">';
tabulatorHeaderHTML += '' +
'<button id="download-csv" class="btn btn-default" type="button" ' +
`<button id="download-csv" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'}" type="button" ` +
'data-toggle="tooltip" data-placement="left" title="Download CSV">' +
'<small>CSV&nbsp;&nbsp;</small><i class="fa fa-arrow-down"></i>' +
'</button>';
tabulatorHeaderHTML += '' +
'<button id="help" class="btn btn-default" type="button" ' +
`<button id="help" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'}" type="button" ` +
'data-toggle="collapse tooltip" data-target="tabulatorHelp-'+ tableUniqueId + '" data-placement="left" ' +
'title="' + FHC_PhrasesLib.t("ui", "hilfe") + '"><i class="fa fa-question"></i>' +
'</button>';
tabulatorHeaderHTML += '' +
'<button id="settings" class="btn btn-default" type="button" ' +
`<button id="settings" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'}" type="button" ` +
'data-toggle="collapse tooltip" data-target="tabulatorSettings-'+ tableUniqueId + '" data-placement="left" ' +
'title="' + FHC_PhrasesLib.t("ui", "tabelleneinstellungen") + '" ' +
'aria-expanded="false" aria-controls="tabulatorSettings-'+ tableUniqueId + '">' +
@@ -848,15 +857,15 @@ function _renderTabulatorHeaderCollapseHTML(tableWidgetDiv,arrayTabulatorColumns
var tabulatorHeaderCollapseHTML = '';
// CollapseHTML 'Settings'
if(_bootstrapVersion==3){
tabulatorHeaderCollapseHTML += '<div class="row">';
tabulatorHeaderCollapseHTML += '<div class="col-lg-12 collapse" id="tabulatorSettings-'+ tableUniqueId + '">';
tabulatorHeaderCollapseHTML += '<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">';
tabulatorHeaderCollapseHTML += '<div class="panel panel-default">';
tabulatorHeaderCollapseHTML += '<div class="panel-heading" role="tab" id="headingOne">';
tabulatorHeaderCollapseHTML += `<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">`;
tabulatorHeaderCollapseHTML += `<div class="panel panel-default">`;
tabulatorHeaderCollapseHTML += `<div class="panel-heading" role="tab" id="headingOne">`;
tabulatorHeaderCollapseHTML += '<h5 class="panel-title">';
tabulatorHeaderCollapseHTML += '' +
'<a role="button" data-bs-toggle="collapse" data-bs-parent="#accordion" ' +
'<a role="button" data-toggle="collapse" data-parent="#accordion" ' +
'href="#selectColumns-' + tableUniqueId + '" ' +
'aria-expanded="false" aria-controls="selectColumns">' +
FHC_PhrasesLib.t("ui", "spaltenEinstellen") +
@@ -867,7 +876,24 @@ function _renderTabulatorHeaderCollapseHTML(tableWidgetDiv,arrayTabulatorColumns
'role="tabpanel" aria-labelledby="headingOne">';
tabulatorHeaderCollapseHTML += '<div class="panel-body">';
tabulatorHeaderCollapseHTML += '<div class="btn-group" role="group">';
}else{
tabulatorHeaderCollapseHTML += '<div class="row">';
tabulatorHeaderCollapseHTML += '<div class="col-12 collapse" id="tabulatorSettings-'+ tableUniqueId + '">';
tabulatorHeaderCollapseHTML += `<div class="accordion" id="accordion" role="tablist" aria-multiselectable="true">`;
tabulatorHeaderCollapseHTML += `<div class="accordion-item">`;
tabulatorHeaderCollapseHTML += `<h5 class="accordion-header" role="tab" id="headingOne">`;
tabulatorHeaderCollapseHTML += '' +
'<a role="button" data-bs-toggle="collapse" data-bs-parent="#accordion" ' +
'href="#selectColumns-' + tableUniqueId + '" ' +
'aria-expanded="false" aria-controls="selectColumns">' +
FHC_PhrasesLib.t("ui", "spaltenEinstellen") +
'</a>';
tabulatorHeaderCollapseHTML += '</h5>';
tabulatorHeaderCollapseHTML += '<div id="selectColumns-' + tableUniqueId + '" class="accordion-collapse collapse show" ' +
'role="tabpanel" aria-labelledby="headingOne" data-bs-parent="#accordion">';
tabulatorHeaderCollapseHTML += '<div class="accordion-body">';
tabulatorHeaderCollapseHTML += '<div class="btn-group" role="group">';
}
// Create column picker (Spalten einstellen)
tableWidgetDiv.find('#tableWidgetTabulator').tabulator('getColumns').forEach(function(column)
{
@@ -882,25 +908,28 @@ function _renderTabulatorHeaderCollapseHTML(tableWidgetDiv,arrayTabulatorColumns
{
if ($.inArray(field, tableWidgetBlacklistArray_columnUnselectable) < 0)
{
tabulatorHeaderCollapseHTML += '<button type="button" class="btn btn-default btn-sm btn-select-col ' + btn_select_col_selected +'" aria-pressed="true" id="btn-' + field + '" value="' + field + '">' + title + '</button>';
tabulatorHeaderCollapseHTML += `<button type="button" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'} btn-sm btn-select-col ` + btn_select_col_selected +'" aria-pressed="true" id="btn-' + field + '" value="' + field + '">' + title + '</button>';
}
}
// Else provide all tabulator fields as pickable columns
else
{
tabulatorHeaderCollapseHTML += '<button type="button" class="btn btn-default btn-sm btn-select-col ' + btn_select_col_selected +'" aria-pressed="true" id="btn-' + field + '" value="' + field + '">' + title + '</button>';
tabulatorHeaderCollapseHTML += `<button type="button" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'} btn-sm btn-select-col ` + btn_select_col_selected +'" aria-pressed="true" id="btn-' + field + '" value="' + field + '">' + title + '</button>';
}
});
tabulatorHeaderCollapseHTML += '</div>'; // end btn-group
tabulatorHeaderCollapseHTML += '</div>'; // end panel-body
tabulatorHeaderCollapseHTML += '</div>'; // end panel-collapse
tabulatorHeaderCollapseHTML += '</div>'; // end panel
tabulatorHeaderCollapseHTML += '</div>'; // end btn-group
tabulatorHeaderCollapseHTML += '</div>'; // end panel-body / accordion-body
tabulatorHeaderCollapseHTML += '</div>'; // end panel-collapse / accordion-collapse
tabulatorHeaderCollapseHTML += '</div>'; // end panel / accordion-item
tabulatorHeaderCollapseHTML += '</div>'; // end panel-group
tabulatorHeaderCollapseHTML += ' </div>'; // end col
tabulatorHeaderCollapseHTML += ' </div>'; // end row
tabulatorHeaderCollapseHTML += '</div>'; // end panel-group / accordion
tabulatorHeaderCollapseHTML += ' </div>'; // end col
tabulatorHeaderCollapseHTML += ' </div>'; // end row
return tabulatorHeaderCollapseHTML;
}
@@ -916,11 +945,13 @@ function _renderTabulatorFooterHTML(tableWidgetFooterOptions){
tabulatorFooterHTML += '<div class="btn-toolbar" role="toolbar">';
tabulatorFooterHTML += '<div class="btn-group" role="group">';
tabulatorFooterHTML += '' +
'<button id="select-all" class="btn btn-default pull-left" type="button">'
// pull-right is a fontawesome class that adds float right style
`<button id="select-all" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'} pull-right" type="button">`
+ FHC_PhrasesLib.t("ui", "alleAuswaehlen") + '' +
'</button>';
tabulatorFooterHTML += '' +
'<button id="deselect-all" class="btn btn-default pull-left" type="button">'
// pull-right is a fontawesome class that adds float right style
`<button id="deselect-all" class="btn ${_bootstrapVersion==3?'btn-default':'btn-outline-secondary'} pull-right" type="button">`
+ FHC_PhrasesLib.t("ui", "alleAbwaehlen") + '' +
'</button>';
tabulatorFooterHTML += '' +
public/js/navbar.js
-32
View File
@@ -1,32 +0,0 @@
function(t) {
var e = a(this);
if (!e.is(".disabled, :disabled")) {
var i = l(e),
o = i.hasClass("open");
if (s(), !o) {
"ontouchstart" in document.documentElement && !i.closest(".navbar-nav").length && a(document.createElement("div")).addClass("dropdown-backdrop").insertAfter(a(this)).on("click", s);
var n = {
relatedTarget: this
};
if (i.trigger(t = a.Event("show.bs.dropdown", n)), t.isDefaultPrevented()) return;
e.trigger("focus").attr("aria-expanded", "true"), i.toggleClass("open").trigger(a.Event("shown.bs.dropdown", n))
}
return !1
}
},
function(t) {
if (/(38|40|27|32)/.test(t.which) && !/input|textarea/i.test(t.target.tagName)) {
var e = a(this);
if (t.preventDefault(), t.stopPropagation(), !e.is(".disabled, :disabled")) {
var i = l(e),
o = i.hasClass("open");
if (!o && 27 != t.which || o && 27 == t.which) return 27 == t.which && i.find(r).trigger("focus"), e.trigger("click");
var n = i.find(".dropdown-menu li:not(.disabled):visible a");
if (n.length) {
var s = n.index(t.target);
38 == t.which && 0 < s && s--, 40 == t.which && s < n.length - 1 && s++, ~s || (s = 0), n.eq(s).trigger("focus")
}
}
}
}