oci/zeronet
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix multi-line confirmation dialog

Browse source
This commit is contained in:
shortcutme 2017-05-18 03:05:02 +02:00
parent f9c0c21714
commit 2677ad92d3
No known key found for this signature in database
GPG key ID: 5B63BAE6CB9613AE
4 changed files with 19 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/Ui/media/Wrapper.coffee
View file

@ -204,17 +204,19 @@ class Wrapper
@notifications.add("notification-#{message.id}", message.params[0], body, message.params[2]) @notifications.add("notification-#{message.id}", message.params[0], body, message.params[2])
displayConfirm: (message, captions, cb) -> displayConfirm: (message, captions, cb) ->
body = $("<span class='message'>"+message+"</span>") body = $("<span class='message-outer'><span class='message'>"+message+"</span></span>")
buttons = $("<span class='buttons'></span>")
if captions not instanceof Array then captions = [captions] # Convert to list if necessary if captions not instanceof Array then captions = [captions] # Convert to list if necessary
for caption, i in captions for caption, i in captions
button = $("<a href='##{caption}' class='button button-#{caption} button-#{i+1}' data-value='#{i+1}'>#{caption}</a>") # Add confirm button button = $("<a href='##{caption}' class='button button-confirm button-#{caption} button-#{i+1}' data-value='#{i+1}'>#{caption}</a>") # Add confirm button
button.on "click", (e) => button.on "click", (e) =>
cb(parseInt(e.currentTarget.dataset.value)) cb(parseInt(e.currentTarget.dataset.value))
return false return false
body.append(button) buttons.append(button)
body.append(buttons)
@notifications.add("notification-#{caption}", "ask", body) @notifications.add("notification-#{caption}", "ask", body)
button.focus() buttons.first().focus()
$(".notification").scrollLeft(0) $(".notification").scrollLeft(0)

4
src/Ui/media/Wrapper.css
View file

@ -54,8 +54,10 @@ a { color: black }
padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table; padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table;
background-color: white; left: 50px; top: 0; position: relative; padding-top: 5px; padding-bottom: 5px; background-color: white; left: 50px; top: 0; position: relative; padding-top: 5px; padding-bottom: 5px;
} }
.notification .message-outer { display: table-row }
.notification .buttons { display: table-cell; vertical-align: top; padding-top: 9px; }
.notification.long .body { padding-top: 10px; padding-bottom: 10px } .notification.long .body { padding-top: 10px; padding-bottom: 10px }
.notification .message { display: table-cell; vertical-align: middle } .notification .message { display: table-cell; vertical-align: middle; }
.notification.visible { max-width: 350px } .notification.visible { max-width: 350px }

4
src/Ui/media/all.css
View file

@ -59,8 +59,10 @@ a { color: black }
padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table; padding-left: 14px; padding-right: 60px; height: 40px; vertical-align: middle; display: table;
background-color: white; left: 50px; top: 0; position: relative; padding-top: 5px; padding-bottom: 5px; background-color: white; left: 50px; top: 0; position: relative; padding-top: 5px; padding-bottom: 5px;
} }
.notification .message-outer { display: table-row }
.notification .buttons { display: table-cell; vertical-align: top; padding-top: 9px; }
.notification.long .body { padding-top: 10px; padding-bottom: 10px } .notification.long .body { padding-top: 10px; padding-bottom: 10px }
.notification .message { display: table-cell; vertical-align: middle } .notification .message { display: table-cell; vertical-align: middle; }
.notification.visible { max-width: 350px } .notification.visible { max-width: 350px }

12
src/Ui/media/all.js
View file

@ -1087,24 +1087,26 @@ jQuery.extend( jQuery.easing,
}; };
Wrapper.prototype.displayConfirm = function(message, captions, cb) { Wrapper.prototype.displayConfirm = function(message, captions, cb) {
var body, button, caption, i, j, len; var body, button, buttons, caption, i, j, len;
body = $("<span class='message'>" + message + "</span>"); body = $("<span class='message-outer'><span class='message'>" + message + "</span></span>");
buttons = $("<span class='buttons'></span>");
if (!(captions instanceof Array)) { if (!(captions instanceof Array)) {
captions = [captions]; captions = [captions];
} }
for (i = j = 0, len = captions.length; j < len; i = ++j) { for (i = j = 0, len = captions.length; j < len; i = ++j) {
caption = captions[i]; caption = captions[i];
button = $("<a href='#" + caption + "' class='button button-" + caption + " button-" + (i + 1) + "' data-value='" + (i + 1) + "'>" + caption + "</a>"); button = $("<a href='#" + caption + "' class='button button-confirm button-" + caption + " button-" + (i + 1) + "' data-value='" + (i + 1) + "'>" + caption + "</a>");
button.on("click", (function(_this) { button.on("click", (function(_this) {
return function(e) { return function(e) {
cb(parseInt(e.currentTarget.dataset.value)); cb(parseInt(e.currentTarget.dataset.value));
return false; return false;
}; };
})(this)); })(this));
body.append(button); buttons.append(button);
} }
body.append(buttons);
this.notifications.add("notification-" + caption, "ask", body); this.notifications.add("notification-" + caption, "ask", body);
button.focus(); buttons.first().focus();
return $(".notification").scrollLeft(0); return $(".notification").scrollLeft(0);
}; };