1 files changed, 22 insertions, 4 deletions
diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js
index 6ab1fe732..f12827e84 100644
--- a/ishtar_common/static/js/ishtar.js
+++ b/ishtar_common/static/js/ishtar.js
@@ -70,7 +70,11 @@ var datatables_static_default = {
 };
 
 var show_msg = "Show";
+var info_show_msg = "Showing"
 var entries_msg = "entries";
+var info_entries_msg = "entries";
+var table_to_msg = "to";
+var table_of_msg = "of";
 var activate_all_search_msg = "Searches in the shortcut menu deals with all items.";
 var activate_own_search_msg = "Searches in the shortcut menu deals with only your items.";
 var added_message = " items added.";
@@ -1028,10 +1032,15 @@ var dt_multi_enable_disable_submit_button = function(e, dt, type, indexes){
     }
 };
 
+var number_with_commas = function(number) {
+    return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+}
+
 var render_gallery = function(data_table, table_name, nb_select, gallery_id){
-    var html = '<label>' + show_msg;
+    var html = '<div class="ishtar-gallery-wrapper container-fluid">';
+    html += '<label>' + show_msg;
     var id_select = table_name + '-length_image';
-    html += ' <select name="' + id_select + '" id="id_' + id_select + '">';
+    html += ' <select class="form-control form-control-sm" name="' + id_select + '" id="id_' + id_select + '">';
     var nb_rows = [5, 10, 25, 50, 100];
     for (idx in nb_rows){
         var nb = nb_rows[idx];
@@ -1040,6 +1049,17 @@ var render_gallery = function(data_table, table_name, nb_select, gallery_id){
         html += '>' + nb + '</option>';
     }
     html += '</select> ' + entries_msg + '</label>';
+
+    var page_total = data_table['total'];
+    var page_current = data_table['page'];
+    html += "<span class='ishtar-gallery-info'>";
+    html += info_show_msg + " " + ((page_current - 1) * nb_select + 1) + " "
+    html += table_to_msg + " " + page_current * nb_select;
+
+    var recordsTotal = number_with_commas(data_table['recordsTotal']);
+    html += " " + table_of_msg + " " + recordsTotal + " ";
+    html += info_entries_msg + "</span>";
+
     html += "<div class='ishtar-gallery d-flex flex-wrap' id='" + gallery_id + "'>";
     var captions = '<div class="lightgallery-captions">';
     var table_cols = data_table["table-cols"];
@@ -1094,8 +1114,6 @@ var render_gallery = function(data_table, table_name, nb_select, gallery_id){
     captions += '</div >';
 
     /* pagination */
-    var page_total = data_table['total'];
-    var page_current = data_table['page'];
     html += "<div class='dataTables_wrapper'><div class='dataTables_paginate'>";
     html += '<ul class="image-pagination">';