Add modal dialog for alerts

include/staff/footer.inc.php

@@ -22,6 +22,20 @@ if(is_object($thisstaff) && $thisstaff->isStaff()) { ?>
 <div class="dialog" style="display:none;width:650px;" id="popup">
     <div class="body"></div>
 </div>
+<div style="display:none;" class="dialog" id="alert">
+    <h3><i class="icon-warning-sign"></i> <span id="title"></span></h3>
+    <a class="close" href=""><i class="icon-remove-circle"></i></a>
+    <hr/>
+    <div id="body" style="min-height: 20px;"></div>
+    <hr style="margin-top:3em"/>
+    <p class="full-width">
+        <span class="buttons pull-right">
+            <input type="button" value="<?php echo __('OK');?>" class="close">
+        </span>
+     </p>
+    <div class="clear"></div>
+</div>
+
 <script type="text/javascript">
 if ($.support.pjax) {
   $(document).on('click', 'a', function(event) {

scp/js/scp.js

@@ -16,18 +16,22 @@ function checkbox_checker(formObj, min, max) {
         msg=__("You're limited to only {0} selections.\n") .replace('{0}', max);
         msg=msg + __("You have made {0} selections.\n").replace('{0}', checked);
         msg=msg + __("Please remove {0} selection(s).").replace('{0}', checked-max);
-        alert(msg)
+        $.sysAlert(__('Alert'), msg);
+
         return (false);
     }
 
     if (checked< min ){
-        alert(__("Please make at least {0} selections. {1} checked so far.")
-            .replace('{0}', min)
-            .replace('{1}', checked));
+        $.sysAlert( __('Alert'),
+                __("Please make at least {0} selections. {1} checked so far.")
+                .replace('{0}', min)
+                .replace('{1}', checked)
+                );
+
         return (false);
     }
 
-    return (true);
+    return checked;
 }
 
 
@@ -563,6 +567,18 @@ $.dialog = function (url, codes, cb, options) {
     if (options.onload) { options.onload(); }
  };
 
+$.sysAlert = function (title, msg, cb) {
+    var $dialog =  $('.dialog#alert');
+    if ($dialog.length) {
+        $('#overlay').show();
+        $('#title', $dialog).html(title);
+        $('#body', $dialog).html(msg);
+        $dialog.show();
+    } else {
+        alert(msg);
+    }
+};
+
 $.userLookup = function (url, cb) {
     $.dialog(url, 201, function (xhr) {
         var user = $.parseJSON(xhr.responseText);