Merge sidebar js, css
This commit is contained in:
shortcutme
parent
d5da404ed4
commit
1f9eafa619
2 changed files with 96 additions and 16 deletions
|
|
@ -1,13 +1,23 @@
|
|||
|
||||
/* ---- plugins/Sidebar/media/Console.css ---- */
|
||||
/* ---- Console.css ---- */
|
||||
|
||||
|
||||
.console-container { width: 100%; z-index: 998; position: absolute; top: -100vh; padding-bottom: 100%; }
|
||||
.console-container .console { background-color: #212121; height: 100vh; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -o-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px) ; padding-top: 80px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; }
|
||||
|
||||
.console-top { color: white; font-family: Consolas, monospace; font-size: 11px; line-height: 20px; padding: 5px; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; letter-spacing: 0.5px;}
|
||||
.console-text { overflow-y: scroll; height: 100%; color: #DDD; }
|
||||
|
||||
.console-top { color: white; font-family: Consolas, monospace; font-size: 11px; line-height: 20px; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box ; letter-spacing: 0.5px;}
|
||||
.console-text { overflow-y: scroll; height: calc(100% - 10px); color: #DDD; padding: 5px; margin-top: -36px; }
|
||||
.console-tabs {
|
||||
background-color: #41193fad; position: relative; margin-right: 15px; backdrop-filter: blur(2px);
|
||||
-webkit-box-shadow: 0px 0px 45px #7d2463; -moz-box-shadow: 0px 0px 45px #7d2463; -o-box-shadow: 0px 0px 45px #7d2463; -ms-box-shadow: 0px 0px 45px #7d2463; box-shadow: 0px 0px 45px #7d2463 ; background: -webkit-linear-gradient(-75deg, #591a48ed, #70305e66);background: -moz-linear-gradient(-75deg, #591a48ed, #70305e66);background: -o-linear-gradient(-75deg, #591a48ed, #70305e66);background: -ms-linear-gradient(-75deg, #591a48ed, #70305e66);background: linear-gradient(-75deg, #591a48ed, #70305e66); border-bottom: 1px solid #792e6473;
|
||||
}
|
||||
.console-tabs a {
|
||||
margin-right: 5px; padding: 5px 15px; text-decoration: none; color: #AAA;
|
||||
font-size: 11px; font-family: "Consolas"; text-transform: uppercase; border: 1px solid #666;
|
||||
border-bottom: 0px; display: inline-block; margin: 5px; margin-bottom: 0px; background-color: rgba(0,0,0,0.5);
|
||||
}
|
||||
.console-tabs a:hover { color: #FFF }
|
||||
.console-tabs a.active { background-color: #46223c; color: #FFF }
|
||||
.console-middle {height: 0px; top: 50%; position: absolute; width: 100%; left: 50%; display: none; }
|
||||
|
||||
.console .mynode {
|
||||
|
|
@ -25,7 +35,7 @@
|
|||
}
|
||||
|
||||
|
||||
/* ---- plugins/Sidebar/media/Menu.css ---- */
|
||||
/* ---- Menu.css ---- */
|
||||
|
||||
|
||||
.menu {
|
||||
|
|
@ -48,7 +58,7 @@
|
|||
.menu, .menu.visible { position: absolute; left: unset !important; right: 20px; }
|
||||
}
|
||||
|
||||
/* ---- plugins/Sidebar/media/Scrollbable.css ---- */
|
||||
/* ---- Scrollbable.css ---- */
|
||||
|
||||
|
||||
.scrollable {
|
||||
|
|
@ -97,7 +107,7 @@
|
|||
}
|
||||
|
||||
|
||||
/* ---- plugins/Sidebar/media/Sidebar.css ---- */
|
||||
/* ---- Sidebar.css ---- */
|
||||
|
||||
|
||||
.menu {
|
||||
|
|
|
|||
|
|
@ -70,6 +70,8 @@
|
|||
function Console(sidebar) {
|
||||
var handleMessageWebsocket_original;
|
||||
this.sidebar = sidebar;
|
||||
this.handleTabClick = bind(this.handleTabClick, this);
|
||||
this.changeFilter = bind(this.changeFilter, this);
|
||||
this.stopDragY = bind(this.stopDragY, this);
|
||||
this.cleanup = bind(this.cleanup, this);
|
||||
this.onClosed = bind(this.onClosed, this);
|
||||
|
|
@ -83,6 +85,23 @@
|
|||
this.tag = null;
|
||||
this.opened = false;
|
||||
this.filter = null;
|
||||
this.tab_types = [
|
||||
{
|
||||
title: "All",
|
||||
filter: ""
|
||||
}, {
|
||||
title: "Info",
|
||||
filter: "INFO"
|
||||
}, {
|
||||
title: "Warning",
|
||||
filter: "WARNING"
|
||||
}, {
|
||||
title: "Error",
|
||||
filter: "ERROR"
|
||||
}
|
||||
];
|
||||
this.read_size = 32 * 1024;
|
||||
this.tab_active = "";
|
||||
handleMessageWebsocket_original = this.sidebar.wrapper.handleMessageWebsocket;
|
||||
this.sidebar.wrapper.handleMessageWebsocket = (function(_this) {
|
||||
return function(message) {
|
||||
|
|
@ -93,7 +112,14 @@
|
|||
}
|
||||
};
|
||||
})(this);
|
||||
if (window.top.location.hash === "#console") {
|
||||
$(window).on("hashchange", (function(_this) {
|
||||
return function() {
|
||||
if (window.top.location.hash === "#ZeroNet:console") {
|
||||
return _this.open();
|
||||
}
|
||||
};
|
||||
})(this));
|
||||
if (window.top.location.hash === "#ZeroNet:console") {
|
||||
setTimeout(((function(_this) {
|
||||
return function() {
|
||||
return _this.open();
|
||||
|
|
@ -103,10 +129,12 @@
|
|||
}
|
||||
|
||||
Console.prototype.createHtmltag = function() {
|
||||
var j, len, ref, tab, tab_type;
|
||||
if (!this.container) {
|
||||
this.container = $("<div class=\"console-container\">\n <div class=\"console\">\n <div class=\"console-top\">\n <div class=\"console-text\">Loading...</div>\n </div>\n <div class=\"console-middle\">\n <div class=\"mynode\"></div>\n <div class=\"peers\">\n <div class=\"peer\"><div class=\"line\"></div><a href=\"#\" class=\"icon\">\u25BD</div></div>\n </div>\n </div>\n </div>\n</div>");
|
||||
this.container = $("<div class=\"console-container\">\n <div class=\"console\">\n <div class=\"console-top\">\n <div class=\"console-tabs\"></div>\n <div class=\"console-text\">Loading...</div>\n </div>\n <div class=\"console-middle\">\n <div class=\"mynode\"></div>\n <div class=\"peers\">\n <div class=\"peer\"><div class=\"line\"></div><a href=\"#\" class=\"icon\">\u25BD</div></div>\n </div>\n </div>\n </div>\n</div>");
|
||||
this.text = this.container.find(".console-text");
|
||||
this.text_elem = this.text[0];
|
||||
this.tabs = this.container.find(".console-tabs");
|
||||
this.text.on("mousewheel", (function(_this) {
|
||||
return function(e) {
|
||||
if (e.originalEvent.deltaY < 0) {
|
||||
|
|
@ -118,6 +146,19 @@
|
|||
this.text.is_bottom = true;
|
||||
this.container.appendTo(document.body);
|
||||
this.tag = this.container.find(".console");
|
||||
ref = this.tab_types;
|
||||
for (j = 0, len = ref.length; j < len; j++) {
|
||||
tab_type = ref[j];
|
||||
tab = $("<a></a>", {
|
||||
href: "#",
|
||||
"data-filter": tab_type.filter
|
||||
}).text(tab_type.title);
|
||||
if (tab_type.filter === this.tab_active) {
|
||||
tab.addClass("active");
|
||||
}
|
||||
tab.on("click", this.handleTabClick);
|
||||
this.tabs.append(tab);
|
||||
}
|
||||
this.container.on("mousedown touchend touchcancel", (function(_this) {
|
||||
return function(e) {
|
||||
if (e.target !== e.currentTarget) {
|
||||
|
|
@ -193,7 +234,8 @@
|
|||
|
||||
Console.prototype.loadConsoleText = function() {
|
||||
this.sidebar.wrapper.ws.cmd("consoleLogRead", {
|
||||
filter: this.filter
|
||||
filter: this.filter,
|
||||
read_size: this.read_size
|
||||
}, (function(_this) {
|
||||
return function(res) {
|
||||
var pos_diff, size_read, size_total;
|
||||
|
|
@ -201,11 +243,17 @@
|
|||
pos_diff = res["pos_end"] - res["pos_start"];
|
||||
size_read = Math.round(pos_diff / 1024);
|
||||
size_total = Math.round(res['pos_end'] / 1024);
|
||||
_this.text.append("<br><br>");
|
||||
_this.text.append("Displaying " + res.lines.length + " of " + res.num_found + " lines found in the last " + size_read + "kB of the log file. (" + size_total + "kB total)<br>");
|
||||
_this.addLines(res.lines, false);
|
||||
return _this.text_elem.scrollTop = _this.text_elem.scrollHeight;
|
||||
};
|
||||
})(this));
|
||||
if (this.stream_id) {
|
||||
this.sidebar.wrapper.ws.cmd("consoleLogStreamRemove", {
|
||||
stream_id: this.stream_id
|
||||
});
|
||||
}
|
||||
return this.sidebar.wrapper.ws.cmd("consoleLogStream", {
|
||||
filter: this.filter
|
||||
}, (function(_this) {
|
||||
|
|
@ -216,15 +264,17 @@
|
|||
};
|
||||
|
||||
Console.prototype.close = function() {
|
||||
window.top.location.hash = "";
|
||||
this.sidebar.move_lock = "y";
|
||||
this.sidebar.startDrag();
|
||||
return this.sidebar.stopDrag();
|
||||
};
|
||||
|
||||
Console.prototype.open = function() {
|
||||
this.createHtmltag();
|
||||
this.sidebar.fixbutton_targety = this.sidebar.page_height;
|
||||
return this.stopDragY();
|
||||
this.sidebar.startDrag();
|
||||
this.sidebar.moved("y");
|
||||
this.sidebar.fixbutton_targety = this.sidebar.page_height - this.sidebar.fixbutton_inity - 50;
|
||||
return this.sidebar.stopDrag();
|
||||
};
|
||||
|
||||
Console.prototype.onOpened = function() {
|
||||
|
|
@ -275,6 +325,26 @@
|
|||
}
|
||||
};
|
||||
|
||||
Console.prototype.changeFilter = function(filter) {
|
||||
this.filter = filter;
|
||||
if (this.filter === "") {
|
||||
this.read_size = 32 * 1024;
|
||||
} else {
|
||||
this.read_size = 1024 * 1024;
|
||||
}
|
||||
return this.loadConsoleText();
|
||||
};
|
||||
|
||||
Console.prototype.handleTabClick = function(e) {
|
||||
var elem;
|
||||
elem = $(e.currentTarget);
|
||||
this.tab_active = elem.data("filter");
|
||||
$("a", this.tabs).removeClass("active");
|
||||
elem.addClass("active");
|
||||
this.changeFilter(this.tab_active);
|
||||
return false;
|
||||
};
|
||||
|
||||
return Console;
|
||||
|
||||
})(Class);
|
||||
|
|
@ -283,6 +353,7 @@
|
|||
|
||||
}).call(this);
|
||||
|
||||
|
||||
/* ---- Menu.coffee ---- */
|
||||
|
||||
|
||||
|
|
@ -530,9 +601,9 @@ window.initScrollable = function () {
|
|||
this.globe = null;
|
||||
this.preload_html = null;
|
||||
this.original_set_site_info = this.wrapper.setSiteInfo;
|
||||
if (window.top.location.hash === "#ZeroNet:OpenSidebar") {
|
||||
if (false) {
|
||||
this.startDrag();
|
||||
this.moved("x");
|
||||
this.moved();
|
||||
this.fixbutton_targetx = this.fixbutton_initx - this.width;
|
||||
this.stopDrag();
|
||||
}
|
||||
|
|
@ -1274,7 +1345,6 @@ window.initScrollable = function () {
|
|||
|
||||
}).call(this);
|
||||
|
||||
|
||||
/* ---- morphdom.js ---- */
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue