💄 better display of error message on ajax call

1 files changed, 84 insertions, 60 deletions

diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js
index 1ef2e4c1d..d78cc3b12 100644
--- a/ishtar_common/static/js/ishtar.js
+++ b/ishtar_common/static/js/ishtar.js
@@ -117,6 +117,9 @@ var added_message = " items added.";
 var select_only_one_msg = "Select only one item.";
 var search_pinned_msg = "";
 var form_changed_msg = "The form has changed. If you don't validate it, all your changes will be lost.";
+var permission_denied_msg = "Permission denied.";
+var page_not_found_msg = "Page not found.";
+var server_error_msg = "Server error.";
 
 var advanced_menu = false;
 var shortcut_menu_hide = false;
@@ -291,17 +294,28 @@ function init_advanced_shortcut_fields(){
     });
 }
 
-function display_info(msg){
-    $('#message .information .content').html(msg);
+function display_message(msg, klass){
+    let base_id = '#message .' + klass;
+    $(base_id + ' .content').html(msg);
+    $("#message").removeClass();
+    $("#message").addClass(klass);
     $('#message').fadeIn('slow');
-    $('#message .information').fadeIn('slow');
+    $(base_id).fadeIn('slow');
     setTimeout(
         function(){
-            $('#message .information').fadeOut('slow');
+            $(base_id).fadeOut('slow');
             $('#message').fadeOut('slow');
         }, 5000);
 }
 
+function display_info(msg){
+    display_message(msg, "information");
+}
+
+function display_error(msg){
+    display_message(msg, "error");
+}
+
 function add_message(message, message_type, target, clear, dismiss){
     if (!message_type) message_type = 'info';
     if (!target) target = "#message_list";
@@ -707,25 +721,25 @@ function save_and_close_window_data(main_page, name_label,
         id_item = $("#id_" + name_label);
     }
     if (name_label != name_pk){  // custom
-		cur_item.val(item_name);
-		cur_item.change();
-		cur_item_pk.val(item_pk);
-		cur_item_pk.change();
-		id_item.change();
+        cur_item.val(item_name);
+        cur_item.change();
+        cur_item_pk.val(item_pk);
+        cur_item_pk.change();
+        id_item.change();
     } else {  // select2
-    	var data = [{
-    		"id": item_pk, "value": item_name
-    	}];
+        var data = [{
+            "id": item_pk, "value": item_name
+        }];
 
-		var new_option = new Option(item_name, item_pk, true, true);
-		$('#' + name_pk).append(new_option).trigger('change');
+        var new_option = new Option(item_name, item_pk, true, true);
+        $('#' + name_pk).append(new_option).trigger('change');
 
-		$('#' + name_pk).trigger({
-        	type: 'select2:select',
-	        params: {
-    	        data: data
-	        }
-	    });
+        $('#' + name_pk).trigger({
+            type: 'select2:select',
+            params: {
+                data: data
+            }
+        });
     }
 }
 
@@ -1047,7 +1061,7 @@ var dt_generate_qa_url = function (table, url){
 };
 
 var dt_qa_open = function (url, modal_id){
-	if (!modal_id) modal_id = "modal-dynamic-form";
+    if (!modal_id) modal_id = "modal-dynamic-form";
     short_wait();
     $.ajax({
         url: url,
@@ -1177,7 +1191,7 @@ var dt_multi_enable_disable_submit_button = function(e, dt, type, indexes){
 };
 
 var dt_update_badge = function(source_id, number){
-	$("#source_badge_" + source_id).html(number);
+    $("#source_badge_" + source_id).html(number);
 };
 
 var number_with_commas = function(number) {
@@ -1218,7 +1232,7 @@ var get_hover_div = function(table_cols, data){
 };
 
 var _gallery_submit_search = function(image_page, query_vars, name, source, extra){
-	if (!extra) extra = "";
+    if (!extra) extra = "";
     if (image_page) {
         current_image_page = image_page;
     } else {
@@ -1615,9 +1629,9 @@ var register_stats = function(query_vars, name){
     if (registered_stats) return;
     registered_stats = true;
     $("#stats-form-" + name + " select").on('change',
-    	function() {
+        function() {
             for (idx in extra_list){
-            	_stats_submit_search(query_vars, name, sources[idx], extra_list[idx]);
+                _stats_submit_search(query_vars, name, sources[idx], extra_list[idx]);
             }
         }
     );
@@ -1639,7 +1653,7 @@ var register_stats_img = function(query_vars, name, extra){
 };
 
 var _stats_submit_search = function(query_vars, name, source, extra){
-	if (!extra) extra = "";
+    if (!extra) extra = "";
     $('.modal-progress').modal('show');
 
     var data = search_get_query_data(query_vars, name);
@@ -1746,7 +1760,7 @@ var _render_stats_table = function(stats_values, name, extra){
     }
 
     html += "</tbody></table>";
-	if (!extra) extra = "default";
+    if (!extra) extra = "default";
     $("#charts-" + name + "-" + extra).hide();
     $("#stats-empty-" + name + "-" + extra).hide();
     $("#stats-error-" + name + "-" + extra).hide();
@@ -1772,7 +1786,7 @@ var render_stats = function(stats_values, name, extra){
 
     stats_values = stats_values['data'];
 
-	if (!extra) extra = "default";
+    if (!extra) extra = "default";
     if (stats_current_graph[extra]){
         stats_current_graph[extra].destroy();
     }
@@ -1780,16 +1794,16 @@ var render_stats = function(stats_values, name, extra){
         return _render_stats_table(stats_values, name, extra);
     }
 
-	if (stats_values.length > MAX_STATS_GRAPH_VALUES){
-		_render_stats_too_many_values(name);
-		return;
-	}
-	for (idx in stats_values){
-		if (stats_values[idx][1].length > MAX_STATS_GRAPH_MODALITY_VALUES){
-			_render_stats_too_many_values(name);
-			return;
-		}
-	}
+    if (stats_values.length > MAX_STATS_GRAPH_VALUES){
+        _render_stats_too_many_values(name);
+        return;
+    }
+    for (idx in stats_values){
+        if (stats_values[idx][1].length > MAX_STATS_GRAPH_MODALITY_VALUES){
+            _render_stats_too_many_values(name);
+            return;
+        }
+    }
 
     $("#stats-table-" + name + "-" + extra).hide();
     $("#stats-empty-" + name + "-" + extra).hide();
@@ -1915,13 +1929,13 @@ var render_stats = function(stats_values, name, extra){
     };
     if (stats_type != "pie"){
         stats_options["cursor"] = {
-			show: true,
-			zoom: true,
-			showTooltip: false
+            show: true,
+            zoom: true,
+            showTooltip: false
         }
     }
     stats_current_graph[extra] = $.jqplot(
-    	'chart-' + name + "-" + extra,
+        'chart-' + name + "-" + extra,
         jqvalues[extra], stats_options
     );
 };
@@ -1974,16 +1988,16 @@ var is_valid_issn = function(str) {
         return false;
     }
 
-	sum = 0;
-	for (i = 0; i < 7; i++) {
-		digit = parseInt(str[i]);
-		sum += digit * (8 - i)
-	}
-	check = 11 - sum % 11;
-	if (check == 10) {
-		check = 'X';
-	}
-	return (check == str[str.length-1].toUpperCase());
+    sum = 0;
+    for (i = 0; i < 7; i++) {
+        digit = parseInt(str[i]);
+        sum += digit * (8 - i)
+    }
+    check = 11 - sum % 11;
+    if (check == 10) {
+        check = 'X';
+    }
+    return (check == str[str.length-1].toUpperCase());
 }
 
 var update_select_widget = function(input_name, values, only_values, excluded_values){
@@ -2000,9 +2014,9 @@ var update_select_widget = function(input_name, values, only_values, excluded_va
             if (option[0] == cvalue) selected = " selected";
             options += "<option value='" + option[0] + "'" + selected + ">";
             options += option[1] + "</option>";
-		}
-	}
-	$("#id_" + input_name).html(options);
+        }
+    }
+    $("#id_" + input_name).html(options);
 };
 
 var inline_register_add_button = function(slug){
@@ -2028,11 +2042,11 @@ var inline_register_add_button = function(slug){
 };
 
 var redraw_plots = function(name, key){
-	if (stats_current_graph && stats_current_graph[key]){
-	 	$('#chart-' + name + "-" + key).height($('#charts-' + name + "-" + key).height()*0.96 - 100);
-	 	$('#chart-' + name + "-" + key).width($('#charts-' + name + "-" + key).width()* 0.96);
-		stats_current_graph[key].replot({resetAxes: true});
-	}
+    if (stats_current_graph && stats_current_graph[key]){
+         $('#chart-' + name + "-" + key).height($('#charts-' + name + "-" + key).height()*0.96 - 100);
+         $('#chart-' + name + "-" + key).width($('#charts-' + name + "-" + key).width()* 0.96);
+        stats_current_graph[key].replot({resetAxes: true});
+    }
 };
 
 var mobile_check = function() {
@@ -2225,6 +2239,16 @@ function load_window(url, speed, on_success, no_jump){
         },
         error:function(XMLHttpRequest, textStatus, errorThrows){
             close_wait();
+            let error_code = XMLHttpRequest.status;
+            if (error_code == 403){
+                display_error(permission_denied_msg);
+            }
+            if (error_code == 404){
+                display_error(page_not_found_msg);
+            }
+            if (error_code == 500){
+                display_error(server_error_msg);
+            }
         }
     });
 }