version 0.1.6, dont check own sites integrity, serving newly added sites, only serve .html files with wrapper, pass query string to innerframe, support for background-color in content.json, websocket api sitepublish and filewrite commands, pass hashchange to innerframe, wrapperPrompt notification support,
This commit is contained in:
HelloZeroNet
parent
a977feec33
commit
024655cf15
11 changed files with 172 additions and 16 deletions
|
|
@ -23,6 +23,9 @@ class Wrapper
|
|||
@site_error = null # Latest failed file download
|
||||
|
||||
window.onload = @onLoad # On iframe loaded
|
||||
$(window).on "hashchange", -> # On hash change
|
||||
src = $("#inner-iframe").attr("src").replace(/#.*/, "")+window.location.hash
|
||||
$("#inner-iframe").attr("src", src)
|
||||
@
|
||||
|
||||
|
||||
|
|
@ -60,6 +63,8 @@ class Wrapper
|
|||
@notifications.add("notification-#{message.id}", message.params[0], message.params[1], message.params[2])
|
||||
else if cmd == "wrapperConfirm" # Display confirm message
|
||||
@actionWrapperConfirm(message)
|
||||
else if cmd == "wrapperPrompt" # Prompt input
|
||||
@actionWrapperPrompt(message)
|
||||
else # Send to websocket
|
||||
@ws.send(message) # Pass message to websocket
|
||||
|
||||
|
|
@ -80,6 +85,30 @@ class Wrapper
|
|||
@notifications.add("notification-#{message.id}", "ask", body)
|
||||
|
||||
|
||||
|
||||
actionWrapperPrompt: (message) ->
|
||||
message.params = @toHtmlSafe(message.params) # Escape html
|
||||
if message.params[1] then type = message.params[1] else type = "text"
|
||||
caption = "OK"
|
||||
|
||||
body = $("<span>"+message.params[0]+"</span>")
|
||||
|
||||
input = $("<input type='#{type}' class='input button-#{type}'/>") # Add input
|
||||
input.on "keyup", (e) => # Send on enter
|
||||
if e.keyCode == 13
|
||||
@sendInner {"cmd": "response", "to": message.id, "result": input.val()} # Response to confirm
|
||||
body.append(input)
|
||||
|
||||
button = $("<a href='##{caption}' class='button button-#{caption}'>#{caption}</a>") # Add confirm button
|
||||
button.on "click", => # Response on button click
|
||||
@sendInner {"cmd": "response", "to": message.id, "result": input.val()} # Response to confirm
|
||||
return false
|
||||
body.append(button)
|
||||
|
||||
|
||||
@notifications.add("notification-#{message.id}", "ask", body)
|
||||
|
||||
|
||||
onOpenWebsocket: (e) =>
|
||||
@ws.cmd "channelJoin", {"channel": "siteChanged"} # Get info on modifications
|
||||
@log "onOpenWebsocket", @inner_ready, @wrapperWsInited
|
||||
|
|
@ -112,10 +141,11 @@ class Wrapper
|
|||
|
||||
# Iframe loaded
|
||||
onLoad: (e) =>
|
||||
@log "onLoad", e
|
||||
@log "onLoad"
|
||||
@inner_loaded = true
|
||||
if not @inner_ready then @sendInner {"cmd": "wrapperReady"} # Inner frame loaded before wrapper
|
||||
if not @site_error then @loading.hideScreen() # Hide loading screen
|
||||
if window.location.hash then $("#inner-iframe")[0].src += window.location.hash # Hash tag
|
||||
if @ws.ws.readyState == 1 and not @site_info # Ws opened
|
||||
@reloadSiteInfo()
|
||||
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ a { color: black }
|
|||
.notifications { position: absolute; top: 0px; right: 85px; display: inline-block; z-index: 999; white-space: nowrap }
|
||||
.notification {
|
||||
position: relative; float: right; clear: both; margin: 10px; height: 50px; box-sizing: border-box; overflow: hidden; backface-visibility: hidden; perspective: 1000px;
|
||||
background-color: white; color: #4F4F4F; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px
|
||||
background-color: white; color: #4F4F4F; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; /*border: 1px solid rgba(210, 206, 205, 0.2)*/
|
||||
}
|
||||
.notification-icon {
|
||||
display: block; width: 50px; height: 50px; position: absolute; float: left; z-index: 1;
|
||||
|
|
@ -53,6 +53,9 @@ a { color: black }
|
|||
.notification-info .notification-icon { font-size: 22px; font-weight: bold; background-color: #2980b9; line-height: 48px }
|
||||
.notification-done .notification-icon { font-size: 22px; background-color: #27ae60 }
|
||||
|
||||
/* Notification input */
|
||||
.notification .input { padding: 6px; border: 1px solid #DDD; margin-left: 10px; border-bottom: 2px solid #DDD; border-radius: 1px; margin-right: -11px; transition: all 0.3s }
|
||||
.notification .input:focus { border-color: #95a5a6; outline: none }
|
||||
|
||||
/* Icons (based on http://nicolasgallagher.com/pure-css-gui-icons/demo/) */
|
||||
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ a { color: black }
|
|||
.notifications { position: absolute; top: 0px; right: 85px; display: inline-block; z-index: 999; white-space: nowrap }
|
||||
.notification {
|
||||
position: relative; float: right; clear: both; margin: 10px; height: 50px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; overflow: hidden; backface-visibility: hidden; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px ;
|
||||
background-color: white; color: #4F4F4F; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px
|
||||
background-color: white; color: #4F4F4F; font-family: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; /*border: 1px solid rgba(210, 206, 205, 0.2)*/
|
||||
}
|
||||
.notification-icon {
|
||||
display: block; width: 50px; height: 50px; position: absolute; float: left; z-index: 1;
|
||||
|
|
@ -58,6 +58,9 @@ a { color: black }
|
|||
.notification-info .notification-icon { font-size: 22px; font-weight: bold; background-color: #2980b9; line-height: 48px }
|
||||
.notification-done .notification-icon { font-size: 22px; background-color: #27ae60 }
|
||||
|
||||
/* Notification input */
|
||||
.notification .input { padding: 6px; border: 1px solid #DDD; margin-left: 10px; border-bottom: 2px solid #DDD; -webkit-border-radius: 1px; -moz-border-radius: 1px; -o-border-radius: 1px; -ms-border-radius: 1px; border-radius: 1px ; margin-right: -11px; -webkit-transition: all 0.3s ; -moz-transition: all 0.3s ; -o-transition: all 0.3s ; -ms-transition: all 0.3s ; transition: all 0.3s }
|
||||
.notification .input:focus { border-color: #95a5a6; outline: none }
|
||||
|
||||
/* Icons (based on http://nicolasgallagher.com/pure-css-gui-icons/demo/) */
|
||||
|
||||
|
|
|
|||
|
|
@ -107,7 +107,7 @@
|
|||
};
|
||||
|
||||
ZeroWebsocket.prototype.onOpenWebsocket = function(e) {
|
||||
this.log("Open", e);
|
||||
this.log("Open");
|
||||
if (this.onOpen != null) {
|
||||
return this.onOpen(e);
|
||||
}
|
||||
|
|
@ -743,6 +743,11 @@ jQuery.extend( jQuery.easing,
|
|||
this.wrapperWsInited = false;
|
||||
this.site_error = null;
|
||||
window.onload = this.onLoad;
|
||||
$(window).on("hashchange", function() {
|
||||
var src;
|
||||
src = $("#inner-iframe").attr("src").replace(/#.*/, "") + window.location.hash;
|
||||
return $("#inner-iframe").attr("src", src);
|
||||
});
|
||||
this;
|
||||
}
|
||||
|
||||
|
|
@ -786,6 +791,8 @@ jQuery.extend( jQuery.easing,
|
|||
return this.notifications.add("notification-" + message.id, message.params[0], message.params[1], message.params[2]);
|
||||
} else if (cmd === "wrapperConfirm") {
|
||||
return this.actionWrapperConfirm(message);
|
||||
} else if (cmd === "wrapperPrompt") {
|
||||
return this.actionWrapperPrompt(message);
|
||||
} else {
|
||||
return this.ws.send(message);
|
||||
}
|
||||
|
|
@ -815,6 +822,44 @@ jQuery.extend( jQuery.easing,
|
|||
return this.notifications.add("notification-" + message.id, "ask", body);
|
||||
};
|
||||
|
||||
Wrapper.prototype.actionWrapperPrompt = function(message) {
|
||||
var body, button, caption, input, type;
|
||||
message.params = this.toHtmlSafe(message.params);
|
||||
if (message.params[1]) {
|
||||
type = message.params[1];
|
||||
} else {
|
||||
type = "text";
|
||||
}
|
||||
caption = "OK";
|
||||
body = $("<span>" + message.params[0] + "</span>");
|
||||
input = $("<input type='" + type + "' class='input button-" + type + "'/>");
|
||||
input.on("keyup", (function(_this) {
|
||||
return function(e) {
|
||||
if (e.keyCode === 13) {
|
||||
return _this.sendInner({
|
||||
"cmd": "response",
|
||||
"to": message.id,
|
||||
"result": input.val()
|
||||
});
|
||||
}
|
||||
};
|
||||
})(this));
|
||||
body.append(input);
|
||||
button = $("<a href='#" + caption + "' class='button button-" + caption + "'>" + caption + "</a>");
|
||||
button.on("click", (function(_this) {
|
||||
return function() {
|
||||
_this.sendInner({
|
||||
"cmd": "response",
|
||||
"to": message.id,
|
||||
"result": input.val()
|
||||
});
|
||||
return false;
|
||||
};
|
||||
})(this));
|
||||
body.append(button);
|
||||
return this.notifications.add("notification-" + message.id, "ask", body);
|
||||
};
|
||||
|
||||
Wrapper.prototype.onOpenWebsocket = function(e) {
|
||||
this.ws.cmd("channelJoin", {
|
||||
"channel": "siteChanged"
|
||||
|
|
@ -859,7 +904,7 @@ jQuery.extend( jQuery.easing,
|
|||
};
|
||||
|
||||
Wrapper.prototype.onLoad = function(e) {
|
||||
this.log("onLoad", e);
|
||||
this.log("onLoad");
|
||||
this.inner_loaded = true;
|
||||
if (!this.inner_ready) {
|
||||
this.sendInner({
|
||||
|
|
@ -869,6 +914,9 @@ jQuery.extend( jQuery.easing,
|
|||
if (!this.site_error) {
|
||||
this.loading.hideScreen();
|
||||
}
|
||||
if (window.location.hash) {
|
||||
$("#inner-iframe")[0].src += window.location.hash;
|
||||
}
|
||||
if (this.ws.ws.readyState === 1 && !this.site_info) {
|
||||
return this.reloadSiteInfo();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ class ZeroWebsocket
|
|||
|
||||
|
||||
onOpenWebsocket: (e) =>
|
||||
@log "Open", e
|
||||
@log "Open"
|
||||
if @onOpen? then @onOpen(e)
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue