custom alert: now alert will be able to display custom HTML

10 files changed, 53 insertions, 13 deletions

diff --git a/stylesheets/caffe.css b/stylesheets/caffe.css
index 7e2c5879..aee4d5ab 100644
--- a/stylesheets/caffe.css
+++ b/stylesheets/caffe.css
@@ -382,7 +382,7 @@ font-size: 9pt;
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
   background: #a47a6b url('img/caffe_reply.png') repeat center;
   border: solid 1px #a47a6b;
   -moz-border-radius: 5px;
diff --git a/stylesheets/dark.css b/stylesheets/dark.css
index 7d81f56d..7fc4e199 100644
--- a/stylesheets/dark.css
+++ b/stylesheets/dark.css
@@ -181,7 +181,7 @@ div.report {
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
 	background: #333333;
 }
 .options_tab_icon {
diff --git a/stylesheets/dark_roach.css b/stylesheets/dark_roach.css
index 1831fd91..7d123c6d 100644
--- a/stylesheets/dark_roach.css
+++ b/stylesheets/dark_roach.css
@@ -471,7 +471,7 @@ input[type="submit"]:hover
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
         background: #333333;
 }
 .options_tab_icon {
diff --git a/stylesheets/futaba+vichan.css b/stylesheets/futaba+vichan.css
index 607cf49c..5f7d742b 100644
--- a/stylesheets/futaba+vichan.css
+++ b/stylesheets/futaba+vichan.css
@@ -101,7 +101,7 @@ div.boardlist.bottom {
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
   background: rgb(240, 224, 214);
 }
 .options_tab_icon {
diff --git a/stylesheets/futaba-light.css b/stylesheets/futaba-light.css
index ecc5da83..fc67709f 100644
--- a/stylesheets/futaba-light.css
+++ b/stylesheets/futaba-light.css
@@ -98,7 +98,7 @@ table.modlog tr th {
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
   background: rgb(240, 224, 214);
 }
 
diff --git a/stylesheets/futaba.css b/stylesheets/futaba.css
index c9cefb85..02c38351 100644
--- a/stylesheets/futaba.css
+++ b/stylesheets/futaba.css
@@ -86,7 +86,7 @@ table.modlog tr th {
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
   background: rgb(240, 224, 214);
 }
 .options_tab_icon {
diff --git a/stylesheets/roach.css b/stylesheets/roach.css
index 945559be..99aa6125 100644
--- a/stylesheets/roach.css
+++ b/stylesheets/roach.css
@@ -256,7 +256,7 @@ border-top: 1px solid #835B36 !important;
 }
 
 /* options.js */ 
-#options_div { 
+#options_div, #alert_div { 
         background: white; 
 }
 
diff --git a/stylesheets/style.css b/stylesheets/style.css
index ac6a2c11..e0ce08c5 100644
--- a/stylesheets/style.css
+++ b/stylesheets/style.css
@@ -786,7 +786,7 @@ div.thread:hover {
   text-align: center;
 }
 
-#options_handler {
+#options_handler, #alert_handler {
   position: fixed;
   top: 0px;
   left: 0px;
@@ -798,7 +798,7 @@ div.thread:hover {
   z-index: 9900;
 }
 
-#options_background {
+#options_background, #alert_background {
   background: black;
   opacity: 0.5;
   position: absolute;
@@ -811,21 +811,38 @@ div.thread:hover {
   z-index: -1;
 }
 
-#options_div {
+#options_div, #alert_div {
   background-color: #d6daf0;
   border: 1px solid black;
   display: inline-block;
   position: relative;
   margin-top: 20px;
+}
+
+#options_div {
   width: 600px;
   height: 300px;
 }
 
+#alert_div {
+  width: 500px;
+}
+
+#alert_message {
+  text-align: center;
+  margin: 13px;
+  font-size: 110%;
+}
+
+.alert_button {
+  margin-bottom: 13px;
+}
+
 #options_div textarea {
   max-width: 100%;
 }
 
-#options_close {
+#options_close, #alert_close {
   top: 0px;
   right: 0px;
   position: absolute;
@@ -878,7 +895,7 @@ div.thread:hover {
   margin-bottom: 5px;
 }
 
-.mobile-style #options_div {
+.mobile-style #options_div, .mobile-style #alert_div {
   display: block;
   width: 100%;
   height: 100%;
diff --git a/stylesheets/yotsuba.css b/stylesheets/yotsuba.css
index 845a5f67..8997b696 100644
--- a/stylesheets/yotsuba.css
+++ b/stylesheets/yotsuba.css
@@ -59,7 +59,7 @@ table.modlog tr th {
 }
 
 /* options.js */
-#options_div {
+#options_div, #alert_div {
 	background: #f0e0d6;
 }
 
diff --git a/templates/main.js b/templates/main.js
index ed25f7d9..ead852fe 100644
--- a/templates/main.js
+++ b/templates/main.js
@@ -69,6 +69,29 @@ var datelocale =
         , pm: _('pm')
         };
 
+
+function alert(a) {
+  var handler, div;
+  var close = function() {
+    handler.fadeOut(400, function() { handler.remove(); });
+    return false;
+  };
+
+  handler = $("<div id='alert_handler'></div>").hide().appendTo('body');
+
+  $("<div id='alert_background'></div>").click(close).appendTo(handler);
+
+  div = $("<div id='alert_div'></div>").appendTo(handler);
+  $("<a id='alert_close' href='javascript:void(0)'><i class='fa fa-times'></i></div>")
+  .click(close).appendTo(div);
+
+  $("<div id='alert_message'></div>").html(a).appendTo(div);
+
+  $("<button class='button alert_button'>"+_("OK")+"</button>").click(close).appendTo(div);
+
+  handler.fadeIn(400);
+}
+
 var saved = {};