Merge pull request #1231 from imachug/issue-1229

Sign & Publish in one button
This commit is contained in:
ZeroNet 2018-01-21 17:50:39 +01:00 committed by GitHub
commit acfe4deacf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 338 additions and 20 deletions

View file

@ -428,8 +428,10 @@ class UiWebsocketPlugin(object):
body.append(_(u"""
<div class='flex'>
<input type='text' class='text' value="content.json" id='input-contents'/>
<a href='#Sign' class='button' id='button-sign'>{_[Sign]}</a>
<a href='#Publish' class='button' id='button-publish'>{_[Publish]}</a>
<span id='wrapper-sign-publish' class='button'>
<a href='#Sign-and-Publish' id='button-sign-publish'>{_[Sign and publish]}</a>
<a href='#Sign-and-Publish' id='menu-sign-publish'>\u22EE</a>
</span>
</div>
</li>
"""))
@ -468,6 +470,10 @@ class UiWebsocketPlugin(object):
body.append("</ul>")
body.append("</div>")
body.append("<div class='menu template'>")
body.append("<a href='#'' class='menu-item template'>Template</a>")
body.append("</div>")
self.response(to, "".join(body))
def downloadGeoLiteDb(self, db_path):

View file

@ -0,0 +1,46 @@
class Menu
constructor: (@button) ->
@elem = $(".menu.template").clone().removeClass("template")
@elem.appendTo("body")
@items = []
show: ->
if window.visible_menu and window.visible_menu.button[0] == @button[0] # Same menu visible then hide it
window.visible_menu.hide()
@hide()
else
button_pos = @button.offset()
@elem.css({"top": button_pos.top+@button.outerHeight(), "left": button_pos.left})
@button.addClass("menu-active")
@elem.addClass("visible")
if window.visible_menu then window.visible_menu.hide()
window.visible_menu = @
hide: ->
@elem.removeClass("visible")
@button.removeClass("menu-active")
window.visible_menu = null
addItem: (title, cb) ->
item = $(".menu-item.template", @elem).clone().removeClass("template")
item.html(title)
item.on "click", =>
if not cb(item)
@hide()
return false
item.appendTo(@elem)
@items.push item
return item
log: (args...) ->
console.log "[Menu]", args...
window.Menu = Menu
# Hide menu on outside click
$("body").on "click", (e) ->
if window.visible_menu and e.target != window.visible_menu.button[0] and $(e.target).parent()[0] != window.visible_menu.elem[0]
window.visible_menu.hide()

View file

@ -0,0 +1,19 @@
.menu {
background-color: white; padding: 10px 0px; position: absolute; top: 0px; left: 0px; max-height: 0px; overflow: hidden; transform: translate(0px, -30px); pointer-events: none;
box-shadow: 0px 2px 8px rgba(0,0,0,0.3); border-radius: 2px; opacity: 0; transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out;
}
.menu.visible { opacity: 1; max-height: 350px; transform: translate(0px, 0px); transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out; pointer-events: all }
.menu-item { display: block; text-decoration: none; color: black; padding: 6px 24px; transition: all 0.2s; border-bottom: none; font-weight: normal; padding-left: 30px; }
.menu-item-separator { margin-top: 5px; border-top: 1px solid #eee }
.menu-item:hover { background-color: #F6F6F6; transition: none; color: inherit; border: none }
.menu-item:active, .menu-item:focus { background-color: #AF3BFF; color: white; transition: none }
.menu-item.selected:before {
content: "L"; display: inline-block; transform: rotateZ(45deg) scaleX(-1);
font-weight: bold; position: absolute; margin-left: -17px; font-size: 12px; margin-top: 2px;
}
@media only screen and (max-width: 800px) {
.menu, .menu.visible { position: absolute; left: unset !important; right: 20px; }
}

View file

@ -354,8 +354,13 @@ class Sidebar extends Class
@updateHtmlTag()
return false
# Sign content.json
@tag.find("#button-sign").off("click touchend").on "click touchend", =>
# Sign and publish content.json
$(document).on "click touchend", =>
@tag.find("#button-sign-publish-menu").removeClass("visible")
@tag.find(".contents + .flex").removeClass("sign-publish-flex")
menu = new Menu(@tag.find("#wrapper-sign-publish"))
menu.addItem "Sign", =>
inner_path = @tag.find("#input-contents").val()
wrapper.ws.cmd "fileRules", {inner_path: inner_path}, (res) =>
@ -372,14 +377,47 @@ class Sidebar extends Class
if res == "ok"
wrapper.notifications.add "sign", "done", "#{inner_path} Signed!", 5000
@tag.find(".contents + .flex").removeClass "active"
menu.hide()
menu.addItem "Publish", =>
inner_path = @tag.find("#input-contents").val()
wrapper.ws.cmd "sitePublish", {"inner_path": inner_path, "sign": false}
@tag.find(".contents + .flex").removeClass "active"
menu.hide()
@tag.find("#menu-sign-publish").off("click touchend").on "click touchend", =>
if window.visible_menu == menu
@tag.find(".contents + .flex").removeClass "active"
menu.hide()
else
@tag.find(".contents + .flex").addClass "active"
@tag.find(".content-wrapper").prop "scrollTop", 10000
menu.show()
return false
# Publish content.json
@tag.find("#button-publish").off("click touchend").on "click touchend", =>
$("body").on "click", =>
@tag.find(".contents + .flex").removeClass "active"
@tag.find("#button-sign-publish").off("click touchend").on "click touchend", =>
inner_path = @tag.find("#input-contents").val()
@tag.find("#button-publish").addClass "loading"
wrapper.ws.cmd "sitePublish", {"inner_path": inner_path, "sign": false}, =>
@tag.find("#button-publish").removeClass "loading"
wrapper.ws.cmd "fileRules", {inner_path: inner_path}, (res) =>
if wrapper.site_info.privatekey or wrapper.site_info.auth_address in res.signers
# Privatekey stored in users.json
wrapper.ws.cmd "sitePublish", {privatekey: "stored", inner_path: inner_path, sign: true}, (res) =>
if res == "ok"
wrapper.notifications.add "sign", "done", "#{inner_path} Signed and published!", 5000
else
# Ask the user for privatekey
wrapper.displayPrompt "Enter your private key:", "password", "Sign", "", (privatekey) => # Prompt the private key
wrapper.ws.cmd "sitePublish", {privatekey: privatekey, inner_path: inner_path, sign: true}, (res) =>
if res == "ok"
wrapper.notifications.add "sign", "done", "#{inner_path} Signed and published!", 5000
return false
# Close
@tag.find(".close").off("click touchend").on "click touchend", (e) =>

View file

@ -1,3 +1,7 @@
.menu {
font-family: Roboto, 'Segoe UI', 'Helvetica Neue';
}
.drag-bg { width: 100%; height: 100%; position: fixed; }
.fixbutton.dragging { cursor: -webkit-grabbing; }
.fixbutton-bg:active { cursor: -webkit-grabbing; }
@ -112,7 +116,7 @@
#checkbox-owned { margin-bottom: 25px; margin-top: 26px; margin-left: 11px; }
.settings-owned { clear: both }
#checkbox-owned ~ .settings-owned { opacity: 0; max-height: 0px; transition: all 0.3s linear; overflow: hidden }
#checkbox-owned:checked ~ .settings-owned { opacity: 1; max-height: 400px }
#checkbox-owned:checked ~ .settings-owned { opacity: 1; max-height: 420px }
/* Globe */
.globe { width: 360px; height: 360px }
@ -124,6 +128,25 @@
.contents a { color: white }
.contents a:active { background-color: #6B6B6B }
.contents + .flex.active {
padding-bottom: 100px;
}
#wrapper-sign-publish {
padding: 0;
}
#button-sign-publish, #menu-sign-publish {
display: inline-block;
margin: 5px 10px;
text-decoration: none;
}
#button-sign-publish {
margin-right: 5px;
}
#menu-sign-publish {
margin-left: 5px;
}
/* Small screen */
@media screen and (max-width: 600px) {
.sidebar .close { display: block }

View file

@ -1,5 +1,29 @@
/* ---- plugins/Sidebar/media/Menu.css ---- */
.menu {
background-color: white; padding: 10px 0px; position: absolute; top: 0px; left: 0px; max-height: 0px; overflow: hidden; -webkit-transform: translate(0px, -30px); -moz-transform: translate(0px, -30px); -o-transform: translate(0px, -30px); -ms-transform: translate(0px, -30px); transform: translate(0px, -30px) ; pointer-events: none;
-webkit-box-shadow: 0px 2px 8px rgba(0,0,0,0.3); -moz-box-shadow: 0px 2px 8px rgba(0,0,0,0.3); -o-box-shadow: 0px 2px 8px rgba(0,0,0,0.3); -ms-box-shadow: 0px 2px 8px rgba(0,0,0,0.3); box-shadow: 0px 2px 8px rgba(0,0,0,0.3) ; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px ; opacity: 0; -webkit-transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out; -o-transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out; transition: opacity 0.2s ease-out, transform 1s ease-out, max-height 0.2s ease-in-out ;
}
.menu.visible { opacity: 1; max-height: 350px; -webkit-transform: translate(0px, 0px); -moz-transform: translate(0px, 0px); -o-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px) ; -webkit-transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out; -moz-transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out; -o-transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out; -ms-transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out; transition: opacity 0.1s ease-out, transform 0.3s ease-out, max-height 0.3s ease-in-out ; pointer-events: all }
.menu-item { display: block; text-decoration: none; color: black; padding: 6px 24px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s ; border-bottom: none; font-weight: normal; padding-left: 30px; }
.menu-item-separator { margin-top: 5px; border-top: 1px solid #eee }
.menu-item:hover { background-color: #F6F6F6; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none ; color: inherit; border: none }
.menu-item:active, .menu-item:focus { background-color: #AF3BFF; color: white; -webkit-transition: none ; -moz-transition: none ; -o-transition: none ; -ms-transition: none ; transition: none }
.menu-item.selected:before {
content: "L"; display: inline-block; -webkit-transform: rotateZ(45deg) scaleX(-1); -moz-transform: rotateZ(45deg) scaleX(-1); -o-transform: rotateZ(45deg) scaleX(-1); -ms-transform: rotateZ(45deg) scaleX(-1); transform: rotateZ(45deg) scaleX(-1) ;
font-weight: bold; position: absolute; margin-left: -17px; font-size: 12px; margin-top: 2px;
}
@media only screen and (max-width: 800px) {
.menu, .menu.visible { position: absolute; left: unset !important; right: 20px; }
}
/* ---- plugins/Sidebar/media/Scrollbable.css ---- */
@ -52,6 +76,10 @@
/* ---- plugins/Sidebar/media/Sidebar.css ---- */
.menu {
font-family: Roboto, 'Segoe UI', 'Helvetica Neue';
}
.drag-bg { width: 100%; height: 100%; position: fixed; }
.fixbutton.dragging { cursor: -webkit-grabbing; }
.fixbutton-bg:active { cursor: -webkit-grabbing; }
@ -166,7 +194,7 @@
#checkbox-owned { margin-bottom: 25px; margin-top: 26px; margin-left: 11px; }
.settings-owned { clear: both }
#checkbox-owned ~ .settings-owned { opacity: 0; max-height: 0px; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear ; overflow: hidden }
#checkbox-owned:checked ~ .settings-owned { opacity: 1; max-height: 400px }
#checkbox-owned:checked ~ .settings-owned { opacity: 1; max-height: 420px }
/* Globe */
.globe { width: 360px; height: 360px }
@ -178,6 +206,25 @@
.contents a { color: white }
.contents a:active { background-color: #6B6B6B }
.contents + .flex.active {
padding-bottom: 100px;
}
#wrapper-sign-publish {
padding: 0;
}
#button-sign-publish, #menu-sign-publish {
display: inline-block;
margin: 5px 10px;
text-decoration: none;
}
#button-sign-publish {
margin-right: 5px;
}
#menu-sign-publish {
margin-left: 5px;
}
/* Small screen */
@media screen and (max-width: 600px) {
.sidebar .close { display: block }

View file

@ -57,6 +57,85 @@
}).call(this);
/* ---- plugins/Sidebar/media/Menu.coffee ---- */
(function() {
var Menu,
slice = [].slice;
Menu = (function() {
function Menu(button) {
this.button = button;
this.elem = $(".menu.template").clone().removeClass("template");
this.elem.appendTo("body");
this.items = [];
}
Menu.prototype.show = function() {
var button_pos;
if (window.visible_menu && window.visible_menu.button[0] === this.button[0]) {
window.visible_menu.hide();
return this.hide();
} else {
button_pos = this.button.offset();
this.elem.css({
"top": button_pos.top + this.button.outerHeight(),
"left": button_pos.left
});
this.button.addClass("menu-active");
this.elem.addClass("visible");
if (window.visible_menu) {
window.visible_menu.hide();
}
return window.visible_menu = this;
}
};
Menu.prototype.hide = function() {
this.elem.removeClass("visible");
this.button.removeClass("menu-active");
return window.visible_menu = null;
};
Menu.prototype.addItem = function(title, cb) {
var item;
item = $(".menu-item.template", this.elem).clone().removeClass("template");
item.html(title);
item.on("click", (function(_this) {
return function() {
if (!cb(item)) {
_this.hide();
}
return false;
};
})(this));
item.appendTo(this.elem);
this.items.push(item);
return item;
};
Menu.prototype.log = function() {
var args;
args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
return console.log.apply(console, ["[Menu]"].concat(slice.call(args)));
};
return Menu;
})();
window.Menu = Menu;
$("body").on("click", function(e) {
if (window.visible_menu && e.target !== window.visible_menu.button[0] && $(e.target).parent()[0] !== window.visible_menu.elem[0]) {
return window.visible_menu.hide();
}
});
}).call(this);
/* ---- plugins/Sidebar/media/RateLimit.coffee ---- */
@ -234,8 +313,7 @@ window.initScrollable = function () {
@logStart("Preloading")
wrapper.ws.cmd "sidebarGetHtmlTag", {}, (res) =>
@logEnd("Preloading")
@preload_html = res
*/
@preload_html = res */
this.fixbutton.on("mousedown touchstart", (function(_this) {
return function(e) {
if (e.button > 0) {
@ -475,6 +553,7 @@ window.initScrollable = function () {
};
Sidebar.prototype.onOpened = function() {
var menu;
this.log("Opened");
this.scrollable();
this.tag.find("#checkbox-owned").off("click touchend").on("click touchend", (function(_this) {
@ -607,7 +686,14 @@ window.initScrollable = function () {
return false;
};
})(this));
this.tag.find("#button-sign").off("click touchend").on("click touchend", (function(_this) {
$(document).on("click touchend", (function(_this) {
return function() {
_this.tag.find("#button-sign-publish-menu").removeClass("visible");
return _this.tag.find(".contents + .flex").removeClass("sign-publish-flex");
};
})(this));
menu = new Menu(this.tag.find("#wrapper-sign-publish"));
menu.addItem("Sign", (function(_this) {
return function() {
var inner_path;
inner_path = _this.tag.find("#input-contents").val();
@ -639,20 +725,73 @@ window.initScrollable = function () {
});
}
});
return false;
_this.tag.find(".contents + .flex").removeClass("active");
return menu.hide();
};
})(this));
this.tag.find("#button-publish").off("click touchend").on("click touchend", (function(_this) {
menu.addItem("Publish", (function(_this) {
return function() {
var inner_path;
inner_path = _this.tag.find("#input-contents").val();
_this.tag.find("#button-publish").addClass("loading");
return wrapper.ws.cmd("sitePublish", {
wrapper.ws.cmd("sitePublish", {
"inner_path": inner_path,
"sign": false
}, function() {
return _this.tag.find("#button-publish").removeClass("loading");
});
_this.tag.find(".contents + .flex").removeClass("active");
return menu.hide();
};
})(this));
this.tag.find("#menu-sign-publish").off("click touchend").on("click touchend", (function(_this) {
return function() {
if (window.visible_menu === menu) {
_this.tag.find(".contents + .flex").removeClass("active");
menu.hide();
} else {
_this.tag.find(".contents + .flex").addClass("active");
_this.tag.find(".content-wrapper").prop("scrollTop", 10000);
menu.show();
}
return false;
};
})(this));
$("body").on("click", (function(_this) {
return function() {
return _this.tag.find(".contents + .flex").removeClass("active");
};
})(this));
this.tag.find("#button-sign-publish").off("click touchend").on("click touchend", (function(_this) {
return function() {
var inner_path;
inner_path = _this.tag.find("#input-contents").val();
wrapper.ws.cmd("fileRules", {
inner_path: inner_path
}, function(res) {
var ref;
if (wrapper.site_info.privatekey || (ref = wrapper.site_info.auth_address, indexOf.call(res.signers, ref) >= 0)) {
return wrapper.ws.cmd("sitePublish", {
privatekey: "stored",
inner_path: inner_path,
sign: true
}, function(res) {
if (res === "ok") {
return wrapper.notifications.add("sign", "done", inner_path + " Signed and published!", 5000);
}
});
} else {
return wrapper.displayPrompt("Enter your private key:", "password", "Sign", "", function(privatekey) {
return wrapper.ws.cmd("sitePublish", {
privatekey: privatekey,
inner_path: inner_path,
sign: true
}, function(res) {
if (res === "ok") {
return wrapper.notifications.add("sign", "done", inner_path + " Signed and published!", 5000);
}
});
});
}
});
return false;
};
})(this));
this.tag.find(".close").off("click touchend").on("click touchend", (function(_this) {