more shit

ndview/PageGenerator.cs

@@ -167,7 +167,7 @@ namespace ndview
 		    }
 		}
 
-		await index.TagSelfClosingAsync("img", token, ("src", $"i/thumb/{ifn}"), ("width", Thumbnailer.Width.ToString()));
+		await index.TagSelfClosingAsync("img", token, ("src", $"i/thumb/{ifn}")); //("width", Thumbnailer.Width.ToString()));
 	    }
 
 	}
@@ -338,6 +338,24 @@ namespace ndview
 
 	    await using (await index.TagAsync("body", cancel))
 	    {
+		await using(await index.TagAsync("nav", cancel, ("class", "script")))
+		{
+		    await using(await index.TagAsync("ul", cancel)) {
+			await using(await index.TagAsync("li", cancel))
+			    await using(await index.TagAsync("a", cancel, ("href", "#!"), ("id", "expand_all_threads")))
+				await index.Append("expand all");
+			await using(await index.TagAsync("li", cancel))
+			    await using(await index.TagAsync("a", cancel, ("href", "#!"), ("id", "collapse_all_threads")))
+				await index.Append("collapse all");
+			await using(await index.TagAsync("li", cancel))
+			    await using(await index.TagAsync("a", cancel, ("href", "#!"), ("id", "expand_all_images")))
+				await index.Append("expand all images");
+			await using(await index.TagAsync("li", cancel))
+			    await using(await index.TagAsync("a", cancel, ("href", "#!"), ("id", "collapse_all_images")))
+				await index.Append("collapse all images");
+		    }
+		    
+		}
 		await using (await index.TagAsync("main", cancel))
 		{
 		    foreach (var thread in Board.Threads.OrderByDescending(x => x.Children.Where(x => !(x.Email?.Equals("sage") ?? false)).LastOrDefault()?.PostNumber ?? x.PostNumber))

ndview/Properties/static/css/base.css

@@ -91,6 +91,7 @@ h1 {
 
 a.expand {
     padding-top: 1px;
+    padding-right: 1em;
 }
 
 * {
@@ -105,3 +106,49 @@ h3 {
 a {
     text-decoration: none;
 }
+
+blockquote > em {
+    color: #789922;
+    font-style: normal;
+}
+
+a:hover {
+    color: red;
+    transition: 0.5s;
+}
+
+nav {
+    position: fixed;
+    float: right;
+    right: 10px;
+    top: 10px;
+    background-color: white;
+    padding: 5px;
+    border: solid 1px;
+    border-color: black;
+}
+
+nav :not(a)
+{
+    cursor: default;
+}
+
+nav ul {
+    display: flex;
+    justify-content: center;
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+}
+nav ul::before {
+    content: "< ";
+}
+nav ul li {
+    padding: 0 2px;
+}
+nav ul li:not(:last-child)::after {
+    content: " | ";
+}
+nav ul::after {
+    content: " >";
+}

ndview/Properties/static/js/base.js

@@ -1,3 +1,19 @@
+const set_image_expand = (x, set) => {
+    const matches = /i\/(thumb\/)?(\d+\.\w+)$/i.exec(x.getAttribute("src"));
+
+    if(matches[1])
+    {
+	//Is thumbnail
+	if(set===true || set===undefined)
+	    x.setAttribute("src", "i/"+matches[2]);
+    }
+    else {
+	//Is full
+	if(set===false || set===undefined)
+	    x.setAttribute("src", "i/thumb/"+matches[2]);
+    }
+};
+
 window.addEventListener('load', () => {
     document.querySelectorAll(".thread").forEach(x=> x.classList.toggle("hidden"));
     document.querySelectorAll(".script").forEach(x=> x.style=""); //unhide script-specific elements
@@ -7,4 +23,32 @@ window.addEventListener('load', () => {
 	    document.querySelector("[id='"+ x.getAttribute("href").slice(1) +"']").classList.toggle("hidden");
 	});
     });
+
+    document.querySelectorAll("figure > img").forEach(x=> {
+	x.addEventListener("click", ()=> {
+	    set_image_expand(x);
+	});
+    });
+
+    //nav buttons
+    document.querySelector("#expand_all_threads").addEventListener("click", () => {
+	document.querySelectorAll("section.hidden").forEach(x=> {
+	    x.classList.toggle("hidden");
+	});
+    });
+    document.querySelector("#collapse_all_threads").addEventListener("click", () => {
+	document.querySelectorAll("section:not(.hidden)").forEach(x=> {
+	    x.classList.toggle("hidden"); 
+	});
+    });
+    document.querySelector("#expand_all_images").addEventListener("click", () => {	
+	document.querySelectorAll("figure > img").forEach(x=> {
+	    set_image_expand(x, true);
+	});
+    });
+    document.querySelector("#collapse_all_images").addEventListener("click", () => {
+	document.querySelectorAll("figure > img").forEach(x=> {
+	    set_image_expand(x, false);
+	});
+    });
 });