Multi button support for wrapperConfirm

src/Ui/media/Wrapper.coffee

@@ -203,13 +203,15 @@ class Wrapper
 		body =  $("<span class='message'>"+message.params[1]+"</span>")
 		@notifications.add("notification-#{message.id}", message.params[0], body, message.params[2])
 
-	displayConfirm: (message, caption, cb) ->
+	displayConfirm: (message, captions, cb) ->
 		body = $("<span class='message'>"+message+"</span>")
-		button = $("<a href='##{caption}' class='button button-#{caption}'>#{caption}</a>") # Add confirm button
+		if captions not instanceof Array then captions = [captions]  # Convert to list if necessary
-		button.on "click", =>
+		for caption, i in captions
-			cb(true)
+			button = $("<a href='##{caption}' class='button button-#{caption} button-#{i+1}' data-value='#{i+1}'>#{caption}</a>") # Add confirm button
-			return false
+			button.on "click", (e) =>
-		body.append(button)
+				cb(parseInt(e.currentTarget.dataset.value))
+				return false
+			body.append(button)
 		@notifications.add("notification-#{caption}", "ask", body)
 
 		button.focus()
@@ -219,8 +221,8 @@ class Wrapper
 	actionConfirm: (message, cb=false) ->
 		message.params = @toHtmlSafe(message.params) # Escape html
 		if message.params[1] then caption = message.params[1] else caption = "ok"
-		@displayConfirm message.params[0], caption, =>
+		@displayConfirm message.params[0], caption, (res) =>
-			@sendInner {"cmd": "response", "to": message.id, "result": "boom"} # Response to confirm
+			@sendInner {"cmd": "response", "to": message.id, "result": res} # Response to confirm
 			return false
 
 
@@ -472,8 +474,11 @@ class Wrapper
 	toHtmlSafe: (values) ->
 		if values not instanceof Array then values = [values] # Convert to array if its not
 		for value, i in values
-			value = String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;') # Escape
+			if value instanceof Array
-			value = value.replace(/&lt;([\/]{0,1}(br|b|u|i))&gt;/g, "<$1>") # Unescape b, i, u, br tags
+				value = @toHtmlSafe(value)
+			else
+				value = String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;') # Escape
+				value = value.replace(/&lt;([\/]{0,1}(br|b|u|i))&gt;/g, "<$1>") # Unescape b, i, u, br tags
 			values[i] = value
 		return values
 

src/Ui/media/all.css

@@ -25,6 +25,8 @@ a { color: black }
 	color: rgba(0,0,0,0); background: #999 url(img/loading.gif) no-repeat center center;
 	-webkit-transition: all 0.5s ease-out ; -moz-transition: all 0.5s ease-out ; -o-transition: all 0.5s ease-out ; -ms-transition: all 0.5s ease-out ; transition: all 0.5s ease-out  ; pointer-events: none; border-bottom: 2px solid #666
 }
+.button.button-2 { background-color: transparent; border: 1px solid #EEE; color: #555 }
+.button.button-2:hover { border: 1px solid #CCC; color: #000 }
 
 /* Fixbutton */
 

src/Ui/media/all.js

@@ -888,7 +888,7 @@ jQuery.extend( jQuery.easing,
       } else if (cmd === "progress") {
         return this.actionProgress(message);
       } else if (cmd === "prompt") {
-        return this.displayPrompt(message.params[0], message.params[1], message.params[2], (function(_this) {
+        return this.displayPrompt(message.params[0], message.params[1], message.params[2], message.params[3], (function(_this) {
           return function(res) {
             return _this.ws.response(message.id, res);
           };
@@ -1086,17 +1086,23 @@ jQuery.extend( jQuery.easing,
       return this.notifications.add("notification-" + message.id, message.params[0], body, message.params[2]);
     };
 
-    Wrapper.prototype.displayConfirm = function(message, caption, cb) {
+    Wrapper.prototype.displayConfirm = function(message, captions, cb) {
-      var body, button;
+      var body, button, caption, i, j, len;
       body = $("<span class='message'>" + message + "</span>");
-      button = $("<a href='#" + caption + "' class='button button-" + caption + "'>" + caption + "</a>");
+      if (!(captions instanceof Array)) {
-      button.on("click", (function(_this) {
+        captions = [captions];
-        return function() {
+      }
-          cb(true);
+      for (i = j = 0, len = captions.length; j < len; i = ++j) {
-          return false;
+        caption = captions[i];
-        };
+        button = $("<a href='#" + caption + "' class='button button-" + caption + " button-" + (i + 1) + "' data-value='" + (i + 1) + "'>" + caption + "</a>");
-      })(this));
+        button.on("click", (function(_this) {
-      body.append(button);
+          return function(e) {
+            cb(parseInt(e.currentTarget.dataset.value));
+            return false;
+          };
+        })(this));
+        body.append(button);
+      }
       this.notifications.add("notification-" + caption, "ask", body);
       button.focus();
       return $(".notification").scrollLeft(0);
@@ -1114,21 +1120,21 @@ jQuery.extend( jQuery.easing,
         caption = "ok";
       }
       return this.displayConfirm(message.params[0], caption, (function(_this) {
-        return function() {
+        return function(res) {
           _this.sendInner({
             "cmd": "response",
             "to": message.id,
-            "result": "boom"
+            "result": res
           });
           return false;
         };
       })(this));
     };
 
-    Wrapper.prototype.displayPrompt = function(message, type, caption, cb) {
+    Wrapper.prototype.displayPrompt = function(message, type, caption, placeholder, cb) {
       var body, button, input;
       body = $("<span class='message'>" + message + "</span>");
-      input = $("<input type='" + type + "' class='input button-" + type + "'/>");
+      input = $("<input type='" + type + "' class='input button-" + type + "' placeholder='" + placeholder + "'/>");
       input.on("keyup", (function(_this) {
         return function(e) {
           if (e.keyCode === 13) {
@@ -1151,15 +1157,16 @@ jQuery.extend( jQuery.easing,
     };
 
     Wrapper.prototype.actionPrompt = function(message) {
-      var caption, type;
+      var caption, placeholder, type;
       message.params = this.toHtmlSafe(message.params);
       if (message.params[1]) {
         type = message.params[1];
       } else {
         type = "text";
       }
-      caption = "OK";
+      caption = message.params[2] ? message.params[2] : "OK";
-      return this.displayPrompt(message.params[0], type, caption, (function(_this) {
+      placeholder = message.params[3];
+      return this.displayPrompt(message.params[0], type, caption, placeholder, (function(_this) {
         return function(res) {
           return _this.sendInner({
             "cmd": "response",
@@ -1464,8 +1471,12 @@ jQuery.extend( jQuery.easing,
       }
       for (i = j = 0, len = values.length; j < len; i = ++j) {
         value = values[i];
-        value = String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+        if (value instanceof Array) {
-        value = value.replace(/&lt;([\/]{0,1}(br|b|u|i))&gt;/g, "<$1>");
+          value = this.toHtmlSafe(value);
+        } else {
+          value = String(value).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
+          value = value.replace(/&lt;([\/]{0,1}(br|b|u|i))&gt;/g, "<$1>");
+        }
         values[i] = value;
       }
       return values;