- Created Javascript DialogLib in public/js for showing JQuery UI succes, error and info messages

- Used created DialogLib in infocenterDetails

application/views/system/infocenter/infocenterDetails.php

@@ -7,6 +7,7 @@
 			'bootstrap' => true,
 			'fontawesome' => true,
 			'jqueryui' => true,
+			'dialoglib' => true,
 			'ajaxlib' => true,
 			'tablesorter' => true,
 			'tinymce' => true,

application/views/templates/FHC-Header.php

@@ -16,6 +16,7 @@
 
 	// By default set the parameters to false
 	$addons = isset($addons) ? $addons : false;
+	$dialoglib = isset($dialoglib) ? $dialoglib : false;
 	$ajaxlib = isset($ajaxlib) ? $ajaxlib : false;
 	$bootstrap = isset($bootstrap) ? $bootstrap : false;
 	$filterwidget = isset($filterwidget) ? $filterwidget : false;
@@ -73,6 +74,9 @@
 			// --------------------------------------------------------------------------------------------------------
 			// From public folder
 
+			// DialogLib CSS
+			if ($dialoglib === true) generateCSSsInclude('public/css/DialogLib.css');
+
 			// AjaxLib CSS
 			if ($ajaxlib === true) generateCSSsInclude('public/css/AjaxLib.css');
 
@@ -139,6 +143,9 @@
 			// --------------------------------------------------------------------------------------------------------
 			// From public folder
 
+			// DialogLib JS
+			if ($dialoglib === true) generateJSsInclude('public/js/DialogLib.js');
+
 			// AjaxLib JS
 			// NOTE: must be called before including others JS libraries that use it
 			if ($ajaxlib === true) generateJSsInclude('public/js/AjaxLib.js');

public/css/DialogLib.css

@@ -0,0 +1,11 @@
+.dialogmessage
+{
+    text-align: center;
+    font-size: 1.1em;
+    margin: 12px 0 10px 0;
+}
+
+.dialogmessage .glyphicon
+{
+    top: 3px;
+}

public/js/DialogLib.js

@@ -0,0 +1,95 @@
+/**
+ * FH-Complete
+ *
+ * @package
+ * @author
+ * @copyright   Copyright (c) 2016 fhcomplete.org
+ * @license GPLv3
+ * @link    https://fhcomplete.org
+ * @since	Version 1.0.0
+ */
+
+var FHC_DialogLib = {
+
+	/**
+	 * Show success message as jQueryUI alert. Works only with bootstrap.
+	 * @param message
+	 */
+	alertSuccess: function(message)
+	{
+		var html = "<p class='dialogmessage'><i class='glyphicon glyphicon-ok-sign'></i>&nbsp;&nbsp;"+message+"</p>";
+		FHC_DialogLib.alertDefault('Success', html);
+		$(".ui-dialog-titlebar").addClass("alert-success text-center");
+		$(".glyphicon-ok-sign").css("color", "#3c763d");
+		FHC_DialogLib._formatShortDialog();
+	},
+	/**
+	 * Show error message as jQueryUI alert. Works only with bootstrap.
+	 * @param message
+	 */
+	alertError: function(message)
+	{
+		var html = "<p class='dialogmessage'><i class='glyphicon glyphicon-warning-sign'></i>&nbsp;&nbsp;"+message+"</p>";
+		FHC_DialogLib.alertDefault('Error occured', html);
+		$(".ui-dialog-titlebar").addClass("alert-danger text-center");
+		$(".glyphicon-warning-sign").css("color", "#a94442");
+		FHC_DialogLib._formatShortDialog();
+	},
+	/**
+	 * Show info message as jQueryUI alert. Works only with bootstrap.
+	 * @param message
+	 */
+	alertInfo: function(message)
+	{
+		var html = "<p class='dialogmessage'><i class='glyphicon glyphicon-info-sign'></i>&nbsp;&nbsp;"+message+"</p>";
+		FHC_DialogLib.alertDefault('Info', html);
+		$(".ui-dialog-titlebar").addClass("alert-info text-center");
+		$(".glyphicon-info-sign").css("color", "#245269");
+		FHC_DialogLib._formatShortDialog();
+	},
+	/**
+	 * Default jQueryUI alert
+	 * @param title shown as message box heading
+	 * @param html shown inside message box
+	 * @param width of the message box
+	 */
+	alertDefault: function(title, html, width)
+	{
+		var strDivDialog = "<div id=\"fhc-dialoglib-dialog\">";
+		strDivDialog += html;
+		strDivDialog += "</div>";
+
+		$(strDivDialog).appendTo("body"); // append the dialog div to the body
+
+		$("#fhc-dialoglib-dialog").dialog({
+			title: title,
+			dialogClass: "no-close",
+			autoOpen: true,
+			modal: true,
+			resizable: false,
+			height: "auto",
+			width: width,
+			minWidth: 300,
+			closeOnEscape: false,
+			buttons: [{
+				text: "Ok",
+				click: function() {
+					$(this).dialog("close");
+				}
+			}]
+		});
+	},
+	/**
+	 * formats jQueryUI messagebox as "short", i.e. containing only one line of text,
+	 * centers the text
+	 * @private
+	 */
+	_formatShortDialog: function()
+	{
+		$(".ui-dialog-title").width("100%");
+		$(".ui-dialog-buttonpane.ui-widget-content").css("padding", ".3em .4em .5em .4em");
+		$(".ui-dialog .ui-dialog-content").css("padding", "0");
+		$(".ui-dialog-buttonset button").css("margin", "0");
+	}
+
+};

public/js/infocenter/infocenterDetails.js

@@ -119,7 +119,7 @@ $(document).ready(function ()
 var InfocenterDetails = {
 
 	genericSaveError: function() {
-		alert("error when saving");
+		FHC_DialogLib.alertError("error when saving");
 	},
 	openZgvInfoForPrestudent: function(prestudent_id)
 	{
@@ -174,14 +174,11 @@ var InfocenterDetails = {
 			data,
 			{
 				successCallback: function(data, textStatus, jqXHR) {
-					if (data === true)
+					if (data !== true)
 					{
-						InfocenterDetails._refreshZgv(true);
-					}
-					else
-					{
-						alert("error when saving zgv Prio");
+						FHC_DialogLib.alertError("error when saving ZGV prio");
 					}
+					InfocenterDetails._refreshZgv(true);
 				}
 			}
 		);
@@ -264,7 +261,7 @@ var InfocenterDetails = {
 					}
 					else
 					{
-						alert("error when saving Absage");
+						FHC_DialogLib.alertError("error when saving Absage");
 					}
 				}
 			}
@@ -285,13 +282,13 @@ var InfocenterDetails = {
 					}
 					else if (data.error === 2 && parseInt(data.retval.prestudent_id, 10))
 					{
-						alert("error when setting accepted documents");
+						FHC_DialogLib.alertError("error when setting accepted documents");
 						InfocenterDetails._refreshZgv();
 						InfocenterDetails._refreshLog();
 					}
 					else
 					{
-						alert("error when saving Freigabe");
+						FHC_DialogLib.alertError("error when saving Freigabe");
 					}
 				}
 			}