Change sidebar to use content.db cache
This commit is contained in:
parent
682fa80a8a
commit
53c087f1ea
4 changed files with 82 additions and 36 deletions
|
@ -119,14 +119,17 @@ class UiWebsocketPlugin(object):
|
|||
("css", "orange"),
|
||||
("js", "purple"),
|
||||
("image", "green"),
|
||||
("json", "blue"),
|
||||
("json", "darkblue"),
|
||||
("user data", "blue"),
|
||||
("other", "white"),
|
||||
("total", "black")
|
||||
)
|
||||
# Collect stats
|
||||
size_filetypes = {}
|
||||
size_total = 0
|
||||
for key, content in site.content_manager.contents.iteritems():
|
||||
contents = site.content_manager.listContents() # Without user files
|
||||
for inner_path in contents:
|
||||
content = site.content_manager.contents[inner_path]
|
||||
if "files" not in content:
|
||||
continue
|
||||
for file_name, file_details in content["files"].items():
|
||||
|
@ -134,9 +137,19 @@ class UiWebsocketPlugin(object):
|
|||
ext = file_name.split(".")[-1]
|
||||
size_filetypes[ext] = size_filetypes.get(ext, 0) + file_details["size"]
|
||||
|
||||
# Get user file sizes
|
||||
size_user_content = site.content_manager.contents.execute(
|
||||
"SELECT SUM(size) + SUM(size_files) AS size FROM content WHERE ?",
|
||||
{"not__inner_path": contents}
|
||||
).fetchone()["size"]
|
||||
if not size_user_content:
|
||||
size_user_content = 0
|
||||
size_filetypes["user data"] = size_user_content
|
||||
size_total += size_user_content
|
||||
|
||||
# The missing difference is content.json sizes
|
||||
if "json" in size_filetypes:
|
||||
size_filetypes["json"] += site.settings["size"] - size_total
|
||||
size_filetypes["json"] += max(0, site.settings["size"] - size_total)
|
||||
size_total = size_other = site.settings["size"]
|
||||
|
||||
# Bar
|
||||
|
@ -144,7 +157,7 @@ class UiWebsocketPlugin(object):
|
|||
if extension == "total":
|
||||
continue
|
||||
if extension == "other":
|
||||
size = size_other
|
||||
size = max(0, size_other)
|
||||
elif extension == "image":
|
||||
size = size_filetypes.get("jpg", 0) + size_filetypes.get("png", 0) + size_filetypes.get("gif", 0)
|
||||
size_other -= size
|
||||
|
@ -165,7 +178,7 @@ class UiWebsocketPlugin(object):
|
|||
body.append("</ul><ul class='graph-legend'>")
|
||||
for extension, color in extensions:
|
||||
if extension == "other":
|
||||
size = size_other
|
||||
size = max(0, size_other)
|
||||
elif extension == "image":
|
||||
size = size_filetypes.get("jpg", 0) + size_filetypes.get("png", 0) + size_filetypes.get("gif", 0)
|
||||
elif extension == "total":
|
||||
|
@ -220,9 +233,10 @@ class UiWebsocketPlugin(object):
|
|||
def sidebarRenderOptionalFileStats(self, body, site):
|
||||
size_total = 0.0
|
||||
size_downloaded = 0.0
|
||||
for content in site.content_manager.contents.values():
|
||||
if "files_optional" not in content:
|
||||
continue
|
||||
res = site.content_manager.contents.execute("SELECT inner_path FROM content WHERE size_files_optional > 0 AND site_id = :site_id")
|
||||
for row in res:
|
||||
inner_path = row["inner_path"]
|
||||
content = site.content_manager.contents[inner_path]
|
||||
for file_name, file_details in content["files_optional"].items():
|
||||
size_total += file_details["size"]
|
||||
if site.content_manager.hashfield.hasHash(file_details["sha512"]):
|
||||
|
|
|
@ -11,7 +11,8 @@
|
|||
|
||||
.sidebar-container { width: 100%; height: 100%; overflow: hidden; position: fixed; }
|
||||
.sidebar { background-color: #212121; position: fixed; backface-visibility: hidden; right: -1200px; height: 100%; width: 1200px; } /*box-shadow: inset 0px 0px 10px #000*/
|
||||
.sidebar .content { margin: 30px; font-family: "Segoe UI Light", "Segoe UI", "Helvetica Neue"; color: white; width: 375px; height: 300px; font-weight: 200 }
|
||||
.sidebar .content { margin: 30px; font-family: "Segoe UI Light", "Segoe UI", "Helvetica Neue"; color: white; width: 375px; height: 300px; font-weight: 200; transition: all 1s; opacity: 0 }
|
||||
.sidebar-container.loaded .content { opacity: 1; transform: none }
|
||||
.sidebar h1, .sidebar h2 { font-weight: lighter; }
|
||||
.sidebar .button { margin: 0px; display: inline-block; transition: all 0.3s; box-sizing: border-box; max-width: 160px }
|
||||
.sidebar .button.hidden { padding: 0px; max-width: 0px; opacity: 0; pointer-events: none }
|
||||
|
@ -56,9 +57,10 @@
|
|||
|
||||
/* GRAPH */
|
||||
|
||||
.graph { padding: 0px; list-style-type: none; width: 351px; background-color: black; height: 10px; border-radius: 8px; overflow: hidden; position: relative;}
|
||||
.graph { padding: 0px; list-style-type: none; width: 351px; background-color: black; height: 10px; border-radius: 8px; overflow: hidden; position: relative; font-size: 0 }
|
||||
.graph li { height: 100%; position: absolute; transition: all 0.3s; }
|
||||
.graph-stacked li { position: static; float: left; }
|
||||
.graph-stacked { white-space: nowrap; }
|
||||
.graph-stacked li { position: static; display: inline-block; height: 20px }
|
||||
|
||||
.graph-legend { padding: 0px; list-style-type: none; margin-top: 13px; font-family: Consolas, "Andale Mono", monospace; font-size: 13px; text-transform: capitalize; }
|
||||
.sidebar .graph-legend li { margin: 0px; margin-top: 5px; margin-left: 0px; width: 160px; float: left; position: relative; }
|
||||
|
@ -77,8 +79,8 @@
|
|||
.color-green:before { color: #2ECC71 }
|
||||
.back-blue { background-color: #3BAFDA }
|
||||
.color-blue:before { color: #3BAFDA }
|
||||
.back-darkblue { background-color: #2196F3 }
|
||||
.color-darkblue:before { color: #2196F3 }
|
||||
.back-darkblue { background-color: #156fb7 }
|
||||
.color-darkblue:before { color: #156fb7 }
|
||||
.back-purple { background-color: #B10DC9 }
|
||||
.color-purple:before { color: #B10DC9 }
|
||||
.back-yellow { background-color: #FFDC00 }
|
||||
|
@ -89,8 +91,14 @@
|
|||
.color-gray:before { color: #ECF0F1 }
|
||||
.back-black { background-color: #34495E }
|
||||
.color-black:before { color: #34495E }
|
||||
.back-red { background-color: #5E4934 }
|
||||
.color-red:before { color: #5E4934 }
|
||||
.back-gray { background-color: #9e9e9e }
|
||||
.color-gray:before { color: #9e9e9e }
|
||||
.back-white { background-color: #EEE }
|
||||
.color-white:before { color: #EEE }
|
||||
.back-red { background-color: #E91E63 }
|
||||
.color-red:before { color: #E91E63 }
|
||||
|
||||
|
||||
/* Settings owned */
|
||||
|
|
|
@ -111,9 +111,10 @@
|
|||
|
||||
/* GRAPH */
|
||||
|
||||
.graph { padding: 0px; list-style-type: none; width: 351px; background-color: black; height: 10px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px ; overflow: hidden; position: relative;}
|
||||
.graph { padding: 0px; list-style-type: none; width: 351px; background-color: black; height: 10px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px ; overflow: hidden; position: relative; font-size: 0 }
|
||||
.graph li { height: 100%; position: absolute; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s ; }
|
||||
.graph-stacked li { position: static; float: left; }
|
||||
.graph-stacked { white-space: nowrap; }
|
||||
.graph-stacked li { position: static; display: inline-block; height: 20px }
|
||||
|
||||
.graph-legend { padding: 0px; list-style-type: none; margin-top: 13px; font-family: Consolas, "Andale Mono", monospace; font-size: 13px; text-transform: capitalize; }
|
||||
.sidebar .graph-legend li { margin: 0px; margin-top: 5px; margin-left: 0px; width: 160px; float: left; position: relative; }
|
||||
|
@ -132,8 +133,8 @@
|
|||
.color-green:before { color: #2ECC71 }
|
||||
.back-blue { background-color: #3BAFDA }
|
||||
.color-blue:before { color: #3BAFDA }
|
||||
.back-darkblue { background-color: #2196F3 }
|
||||
.color-darkblue:before { color: #2196F3 }
|
||||
.back-darkblue { background-color: #156fb7 }
|
||||
.color-darkblue:before { color: #156fb7 }
|
||||
.back-purple { background-color: #B10DC9 }
|
||||
.color-purple:before { color: #B10DC9 }
|
||||
.back-yellow { background-color: #FFDC00 }
|
||||
|
@ -144,8 +145,14 @@
|
|||
.color-gray:before { color: #ECF0F1 }
|
||||
.back-black { background-color: #34495E }
|
||||
.color-black:before { color: #34495E }
|
||||
.back-red { background-color: #5E4934 }
|
||||
.color-red:before { color: #5E4934 }
|
||||
.back-gray { background-color: #9e9e9e }
|
||||
.color-gray:before { color: #9e9e9e }
|
||||
.back-white { background-color: #EEE }
|
||||
.color-white:before { color: #EEE }
|
||||
.back-red { background-color: #E91E63 }
|
||||
.color-red:before { color: #E91E63 }
|
||||
|
||||
|
||||
/* Settings owned */
|
||||
|
|
|
@ -199,6 +199,7 @@ window.initScrollable = function () {
|
|||
this.displayGlobe = __bind(this.displayGlobe, this);
|
||||
this.loadGlobe = __bind(this.loadGlobe, this);
|
||||
this.animDrag = __bind(this.animDrag, this);
|
||||
this.setHtmlTag = __bind(this.setHtmlTag, this);
|
||||
this.waitMove = __bind(this.waitMove, this);
|
||||
this.resized = __bind(this.resized, this);
|
||||
this.tag = null;
|
||||
|
@ -214,6 +215,7 @@ window.initScrollable = function () {
|
|||
this.initFixbutton();
|
||||
this.dragStarted = 0;
|
||||
this.globe = null;
|
||||
this.preload_html = null;
|
||||
this.original_set_site_info = wrapper.setSiteInfo;
|
||||
if (false) {
|
||||
this.startDrag();
|
||||
|
@ -224,6 +226,15 @@ window.initScrollable = function () {
|
|||
}
|
||||
|
||||
Sidebar.prototype.initFixbutton = function() {
|
||||
|
||||
/*
|
||||
@fixbutton.on "mousedown touchstart", (e) =>
|
||||
if not @opened
|
||||
@logStart("Preloading")
|
||||
wrapper.ws.cmd "sidebarGetHtmlTag", {}, (res) =>
|
||||
@logEnd("Preloading")
|
||||
@preload_html = res
|
||||
*/
|
||||
this.fixbutton.on("mousedown touchstart", (function(_this) {
|
||||
return function(e) {
|
||||
e.preventDefault();
|
||||
|
@ -347,26 +358,32 @@ window.initScrollable = function () {
|
|||
};
|
||||
|
||||
Sidebar.prototype.updateHtmlTag = function() {
|
||||
return wrapper.ws.cmd("sidebarGetHtmlTag", {}, (function(_this) {
|
||||
return function(res) {
|
||||
if (_this.tag.find(".content").children().length === 0) {
|
||||
_this.log("Creating content");
|
||||
morphdom(_this.tag.find(".content")[0], '<div class="content">' + res + '</div>');
|
||||
return _this.when_loaded.resolve();
|
||||
} else {
|
||||
_this.log("Patching content");
|
||||
return morphdom(_this.tag.find(".content")[0], '<div class="content">' + res + '</div>', {
|
||||
onBeforeMorphEl: function(from_el, to_el) {
|
||||
if (from_el.className === "globe" || from_el.className.indexOf("noupdate") >= 0) {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (this.preload_html) {
|
||||
this.setHtmlTag(this.preload_html);
|
||||
return this.preload_html = null;
|
||||
} else {
|
||||
return wrapper.ws.cmd("sidebarGetHtmlTag", {}, this.setHtmlTag);
|
||||
}
|
||||
};
|
||||
|
||||
Sidebar.prototype.setHtmlTag = function(res) {
|
||||
if (this.tag.find(".content").children().length === 0) {
|
||||
this.log("Creating content");
|
||||
this.container.addClass("loaded");
|
||||
morphdom(this.tag.find(".content")[0], '<div class="content">' + res + '</div>');
|
||||
return this.when_loaded.resolve();
|
||||
} else {
|
||||
this.log("Patching content");
|
||||
return morphdom(this.tag.find(".content")[0], '<div class="content">' + res + '</div>', {
|
||||
onBeforeMorphEl: function(from_el, to_el) {
|
||||
if (from_el.className === "globe" || from_el.className.indexOf("noupdate") >= 0) {
|
||||
return false;
|
||||
} else {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
};
|
||||
})(this));
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
Sidebar.prototype.animDrag = function(e) {
|
||||
|
|
Loading…
Reference in a new issue