From: Lanius Trolling Date: Mon, 18 Dec 2023 20:04:20 +0000 (-0500) Subject: Make site more efficient w/ script loading X-Git-Url: https://gitweb.starshipfights.net/?a=commitdiff_plain;h=f5a71ef52c77340fd043109158fc27ab5374aa22;p=factbooks Make site more efficient w/ script loading --- diff --git a/.idea/misc.xml b/.idea/misc.xml index 1b9246d..45ba684 100644 --- a/.idea/misc.xml +++ b/.idea/misc.xml @@ -1,4 +1,8 @@ + + + diff --git a/graphics/external-link-dark.svg b/graphics/external-link-dark.svg deleted file mode 100644 index a052903..0000000 --- a/graphics/external-link-dark.svg +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - diff --git a/graphics/external-link.svg b/graphics/external-link.svg deleted file mode 100644 index d9a6bac..0000000 --- a/graphics/external-link.svg +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - diff --git a/graphics/faction-1-mechyrdia.png b/graphics/faction-1-mechyrdia.png deleted file mode 100644 index 53e558e..0000000 Binary files a/graphics/faction-1-mechyrdia.png and /dev/null differ diff --git a/graphics/faction-3-diadochi.png b/graphics/faction-3-diadochi.png deleted file mode 100644 index 72e6b0f..0000000 Binary files a/graphics/faction-3-diadochi.png and /dev/null differ diff --git a/graphics/faction-4-felinae.png b/graphics/faction-4-felinae.png deleted file mode 100644 index 971575c..0000000 Binary files a/graphics/faction-4-felinae.png and /dev/null differ diff --git a/graphics/faction-5-fulkreykk.png b/graphics/faction-5-fulkreykk.png deleted file mode 100644 index 1025e39..0000000 Binary files a/graphics/faction-5-fulkreykk.png and /dev/null differ diff --git a/graphics/faction-6-vestigium.png b/graphics/faction-6-vestigium.png deleted file mode 100644 index 7bf5d0e..0000000 Binary files a/graphics/faction-6-vestigium.png and /dev/null differ diff --git a/graphics/faction-7-ilkhai.png b/graphics/faction-7-ilkhai.png deleted file mode 100644 index 2248043..0000000 Binary files a/graphics/faction-7-ilkhai.png and /dev/null differ diff --git a/graphics/factions.png b/graphics/factions.png deleted file mode 100644 index f26c547..0000000 Binary files a/graphics/factions.png and /dev/null differ diff --git a/graphics/factions.svg b/graphics/factions.svg deleted file mode 100644 index 20ab8a7..0000000 --- a/graphics/factions.svg +++ /dev/null @@ -1,489 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/graphics/panel-dark.svg b/graphics/panel-dark.svg deleted file mode 100644 index 92306d4..0000000 --- a/graphics/panel-dark.svg +++ /dev/null @@ -1,96 +0,0 @@ - - - - - - - - - - - - - - diff --git a/graphics/panel.svg b/graphics/panel.svg deleted file mode 100644 index b601a13..0000000 --- a/graphics/panel.svg +++ /dev/null @@ -1,96 +0,0 @@ - - - - - - - - - - - - - - diff --git a/src/main/kotlin/info/mechyrdia/Factbooks.kt b/src/main/kotlin/info/mechyrdia/Factbooks.kt index 91f7849..7e2ebc5 100644 --- a/src/main/kotlin/info/mechyrdia/Factbooks.kt +++ b/src/main/kotlin/info/mechyrdia/Factbooks.kt @@ -151,7 +151,7 @@ fun Application.factbooks() { } get("/map") { - call.respondHtml(HttpStatusCode.OK, call.galaxyMapPage()) + call.respondFile(call.galaxyMapPage()) } // Routes for robots diff --git a/src/main/kotlin/info/mechyrdia/lore/view_map.kt b/src/main/kotlin/info/mechyrdia/lore/view_map.kt index 91ee003..91b938a 100644 --- a/src/main/kotlin/info/mechyrdia/lore/view_map.kt +++ b/src/main/kotlin/info/mechyrdia/lore/view_map.kt @@ -1,85 +1,18 @@ package info.mechyrdia.lore +import info.mechyrdia.Configuration import io.ktor.server.application.* +import io.ktor.util.* import kotlinx.html.* +import java.io.File import kotlin.collections.set -fun ApplicationCall.galaxyMapPage(): HTML.() -> Unit { - val theme = request.cookies["FACTBOOK_THEME"] - - val pageTitle = "The Milky Way Galaxy" - val ogData = OpenGraphData( - desc = "An interactive map of the Milky Way Galaxy in 256 UC (2896 AD)", - image = "https://mechyrdia.info/assets/images/map-galaxy.png" - ) - - return { - when (theme) { - "light" -> "light" - "dark" -> "dark" - else -> null - }?.let { attributes["data-theme"] = it } - - head { - meta(charset = "utf-8") - meta(name = "viewport", content = "width=device-width, initial-scale=1.0") - - meta(name = "theme-color", content = "#FFCC33") - - renderOgData(pageTitle, ogData) - - script(src = "/static/obj-viewer/three.js") {} - script(src = "/static/obj-viewer/three-examples.js") {} - script(src = "/static/obj-viewer/hammer.min.js") {} - - link(rel = "icon", type = "image/svg+xml", href = "/static/images/icon.png") - - for (font in preloadFonts) - link( - rel = "preload", - href = "/static/font/$font", - type = "font/woff" - ) { - attributes["as"] = "font" - } - - for (image in preloadImages) - link( - rel = "preload", - href = "/static/images/$image", - type = "image/png" - ) { - attributes["as"] = "image" - } - - link(rel = "stylesheet", href = "/assets/map/style.css") - - title { - +pageTitle - } - } - body { - div { id = "content" } - - div(classes = "panel") { id = "lore-bar" } - - div(classes = "panel") { - id = "back-link" - p { - a(href = "/lore/places/milky-way") { - +"Back to Factbook" - } - } - } - - div { - id = "modal" - div { id = "modal-bg" } - div(classes = "panel") { id = "modal-box" } - } - - script(src = "/assets/map/data.js") {} - script(src = "/assets/map/main.js") {} - } +fun ApplicationCall.galaxyMapPage(): File { + val themeName = when (request.cookies["FACTBOOK_THEME"]) { + "light" -> "light" + "dark" -> "dark" + else -> "system" } + + return File(Configuration.CurrentConfiguration.assetDir).combineSafe("map/index-$themeName.html") } diff --git a/src/main/kotlin/info/mechyrdia/lore/view_tpl.kt b/src/main/kotlin/info/mechyrdia/lore/view_tpl.kt index c8d6054..1c349f2 100644 --- a/src/main/kotlin/info/mechyrdia/lore/view_tpl.kt +++ b/src/main/kotlin/info/mechyrdia/lore/view_tpl.kt @@ -56,11 +56,6 @@ fun ApplicationCall.page(pageTitle: String, navBar: List? = null, sideb renderOgData(pageTitle, data) } - script(src = "/static/obj-viewer/three.js") {} - script(src = "/static/obj-viewer/three-examples.js") {} - - link(rel = "icon", type = "image/svg+xml", href = "/static/images/icon.png") - for (font in preloadFonts) link( rel = "preload", @@ -79,7 +74,9 @@ fun ApplicationCall.page(pageTitle: String, navBar: List? = null, sideb attributes["as"] = "image" } - link(rel = "stylesheet", href = "/static/style.css") + link(rel = "icon", type = "image/svg+xml", href = "/static/images/icon.png") + + link(rel = "stylesheet", type = "text/css", href = "/static/style.css") request.queryParameters["redirect"]?.let { redirect -> if (redirect == "no") diff --git a/src/main/kotlin/info/mechyrdia/lore/views_robots.kt b/src/main/kotlin/info/mechyrdia/lore/views_robots.kt index 045bd59..8f7177b 100644 --- a/src/main/kotlin/info/mechyrdia/lore/views_robots.kt +++ b/src/main/kotlin/info/mechyrdia/lore/views_robots.kt @@ -4,9 +4,12 @@ import info.mechyrdia.Configuration import io.ktor.util.* import java.io.File import java.time.Instant +import kotlin.math.max private const val AVERAGE_FACTBOOK_PAGE_CHANGEFREQ = "hourly" private const val AVERAGE_FACTBOOK_INDEX_CHANGEFREQ = "daily" +private const val AVERAGE_FACTBOOK_INTRO_CHANGEFREQ = "daily" +private const val FACTBOOK_INTRO_PRIORITY = "0.7" private const val FACTBOOK_ROOT_PRIORITY = "0.6" private const val FACTBOOK_INDEX_PRIORITY = "0.4" private const val FACTBOOK_PAGE_PRIORITY = "0.8" @@ -21,7 +24,8 @@ private val File.lastSubFilesModified: Instant? private val File.lastContentModified: Instant get() = lastSubFilesModified ?: Instant.ofEpochMilli(lastModified()) -private fun List.renderIntoSitemap(sitemap: Appendable, base: String? = null) { +context(Appendable) +private fun List.renderIntoSitemap(base: String? = null) { val prefix by lazy(LazyThreadSafetyMode.NONE) { base?.let { "$it/" } ?: "" } for (node in this) { if (Configuration.CurrentConfiguration.isDevMode || !(node.name.endsWith(".wip") || node.name.endsWith(".old"))) { @@ -32,34 +36,49 @@ private fun List.renderIntoSitemap(sitemap: Appendable, base: Strin val changeFreq = if (node.subNodes.isNotEmpty()) AVERAGE_FACTBOOK_INDEX_CHANGEFREQ else AVERAGE_FACTBOOK_PAGE_CHANGEFREQ val priority = if (node.subNodes.isNotEmpty()) FACTBOOK_INDEX_PRIORITY else FACTBOOK_PAGE_PRIORITY - sitemap.appendLine("\t") - sitemap.appendLine("\t\thttps://mechyrdia.info/lore/$path") - sitemap.appendLine("\t\t$lastModified") - sitemap.appendLine("\t\t$changeFreq") - sitemap.appendLine("\t\t$priority") - sitemap.appendLine("\t") - node.subNodes.renderIntoSitemap(sitemap, path) + appendLine("\t") + appendLine("\t\thttps://mechyrdia.info/lore/$path") + appendLine("\t\t$lastModified") + appendLine("\t\t$changeFreq") + appendLine("\t\t$priority") + appendLine("\t") + node.subNodes.renderIntoSitemap(path) } } } -private fun renderLoreSitemap(sitemap: Appendable) { +private fun Appendable.renderLoreSitemap() { val rootFile = File(Configuration.CurrentConfiguration.articleDir) val rootLastModified = rootFile.lastContentModified - sitemap.appendLine("\t") - sitemap.appendLine("\t\thttps://mechyrdia.info/lore") - sitemap.appendLine("\t\t$rootLastModified") - sitemap.appendLine("\t\t$AVERAGE_FACTBOOK_INDEX_CHANGEFREQ") - sitemap.appendLine("\t\t$FACTBOOK_ROOT_PRIORITY") - sitemap.appendLine("\t") + appendLine("\t") + appendLine("\t\thttps://mechyrdia.info/lore") + appendLine("\t\t$rootLastModified") + appendLine("\t\t$AVERAGE_FACTBOOK_INDEX_CHANGEFREQ") + appendLine("\t\t$FACTBOOK_ROOT_PRIORITY") + appendLine("\t") - rootArticleNodeList().renderIntoSitemap(sitemap) + rootArticleNodeList().renderIntoSitemap() +} + +private fun Appendable.renderIntroSitemap() { + val introFile = File(Configuration.CurrentConfiguration.rootDir).combineSafe("intro.html") + val introMetaFile = File(Configuration.CurrentConfiguration.rootDir).combineSafe("introMeta.json") + + val introLastModified = Instant.ofEpochMilli(max(introFile.lastModified(), introMetaFile.lastModified())) + + appendLine("\t") + appendLine("\t\thttps://mechyrdia.info") + appendLine("\t\t$introLastModified") + appendLine("\t\t$AVERAGE_FACTBOOK_INTRO_CHANGEFREQ") + appendLine("\t\t$FACTBOOK_INTRO_PRIORITY") + appendLine("\t") } fun Appendable.generateSitemap() { appendLine("") appendLine("") - renderLoreSitemap(this) + renderIntroSitemap() + renderLoreSitemap() appendLine("") } diff --git a/src/main/resources/static/init.js b/src/main/resources/static/init.js index b392430..6dfb458 100644 --- a/src/main/resources/static/init.js +++ b/src/main/resources/static/init.js @@ -7,6 +7,16 @@ return new Promise(resolve => window.requestAnimationFrame(resolve)); } + function loadScript(url) { + return new Promise((resolve, reject) => { + const script = document.createElement('script'); + script.onload = () => resolve(); + script.onerror = event => reject(event); + script.src = url; + document.head.appendChild(script); + }); + } + window.addEventListener("load", function () { // Tylan alphabet async function tylanToFont(input, output) { @@ -145,6 +155,12 @@ window.addEventListener("load", function () { // Mesh viewing + + async function loadThree() { + await loadScript("/static/obj-viewer/three.js"); + await loadScript("/static/obj-viewer/three-examples.js"); + } + async function loadObj(modelName) { const mtlLib = await (new THREE.MTLLoader()).setPath("/assets/meshes/").setResourcePath("/assets/meshes/").loadAsync(modelName + ".mtl"); mtlLib.preload(); @@ -152,60 +168,64 @@ } const canvases = document.getElementsByTagName("canvas"); - for (const canvas of canvases) { - const canvasModelName = canvas.getAttribute("data-model"); - if (canvasModelName == null || canvasModelName === "") continue; + if (canvases.length > 0) { + (async () => { + await loadThree(); - (async (modelName) => { - const modelAsync = loadObj(modelName); + for (const canvas of canvases) { + const modelName = canvas.getAttribute("data-model"); + if (modelName == null || modelName === "") continue; - const camera = new THREE.PerspectiveCamera(69, 1, 0.01, 1000.0); + const modelAsync = loadObj(modelName); - const scene = new THREE.Scene(); - scene.add(new THREE.AmbientLight("#555555", 1.0)); + const camera = new THREE.PerspectiveCamera(69, 1, 0.01, 1000.0); - const renderer = new THREE.WebGLRenderer({"canvas": canvas, "antialias": true}); + const scene = new THREE.Scene(); + scene.add(new THREE.AmbientLight("#555555", 1.0)); - const controls = new THREE.OrbitControls(camera, canvas); + const renderer = new THREE.WebGLRenderer({"canvas": canvas, "antialias": true}); - function render() { - controls.update(); - renderer.render(scene, camera); - window.requestAnimationFrame(render); - } + const controls = new THREE.OrbitControls(camera, canvas); - function onResize() { - const dim = canvas.getBoundingClientRect(); - camera.aspect = dim.width / dim.height; - camera.updateProjectionMatrix(); - renderer.setSize(dim.width, dim.height, false); - } + function render() { + controls.update(); + renderer.render(scene, camera); + window.requestAnimationFrame(render); + } + + function onResize() { + const dim = canvas.getBoundingClientRect(); + camera.aspect = dim.width / dim.height; + camera.updateProjectionMatrix(); + renderer.setSize(dim.width, dim.height, false); + } - window.addEventListener('resize', onResize); - await frame(); - onResize(); + window.addEventListener('resize', onResize); + await frame(); + onResize(); - const model = await modelAsync; - scene.add(model); + const model = await modelAsync; + scene.add(model); - const bbox = new THREE.Box3().setFromObject(scene); - bbox.dimensions = { - x: bbox.max.x - bbox.min.x, - y: bbox.max.y - bbox.min.y, - z: bbox.max.z - bbox.min.z - }; - model.position.sub(new THREE.Vector3(bbox.min.x + bbox.dimensions.x / 2, bbox.min.y + bbox.dimensions.y / 2, bbox.min.z + bbox.dimensions.z / 2)); + const bbox = new THREE.Box3().setFromObject(scene); + bbox.dimensions = { + x: bbox.max.x - bbox.min.x, + y: bbox.max.y - bbox.min.y, + z: bbox.max.z - bbox.min.z + }; + model.position.sub(new THREE.Vector3(bbox.min.x + bbox.dimensions.x / 2, bbox.min.y + bbox.dimensions.y / 2, bbox.min.z + bbox.dimensions.z / 2)); - camera.position.set(bbox.dimensions.x / 2, bbox.dimensions.y / 2, Math.max(bbox.dimensions.x, bbox.dimensions.y, bbox.dimensions.z)); + camera.position.set(bbox.dimensions.x / 2, bbox.dimensions.y / 2, Math.max(bbox.dimensions.x, bbox.dimensions.y, bbox.dimensions.z)); - const light = new THREE.PointLight("#AAAAAA", 1.0); - scene.add(camera); - camera.add(light); - light.position.set(0, 0, 0); + const light = new THREE.PointLight("#AAAAAA", 1.0); + scene.add(camera); + camera.add(light); + light.position.set(0, 0, 0); - render(); - })(canvasModelName).catch(reason => { - console.error("Error rendering model " + canvasModelName, reason); + render(); + } + })().catch(reason => { + console.error("Error rendering models", reason); }); } }); diff --git a/stuff/export_faction_images.py b/stuff/export_faction_images.py new file mode 100644 index 0000000..517a6d9 --- /dev/null +++ b/stuff/export_faction_images.py @@ -0,0 +1,17 @@ +from PIL import Image + +IMAGES = [ + 'faction-1-mechyrdia.png', + 'faction-3-diadochi.png', + 'faction-4-felinae.png', + 'faction-5-fulkreykk.png', + 'faction-6-vestigium.png', + 'faction-7-ilkhai.png' +] + +NEW_SIZE = (320, 320) + +DEST_DIR = "../test/assets/images" + +for image_name in IMAGES: + Image.open(image_name).resize(NEW_SIZE, Image.Resampling.LANCZOS).save(f'{DEST_DIR}/{image_name}') diff --git a/stuff/external-link-dark.svg b/stuff/external-link-dark.svg new file mode 100644 index 0000000..a052903 --- /dev/null +++ b/stuff/external-link-dark.svg @@ -0,0 +1,50 @@ + + + + + + + + diff --git a/stuff/external-link.svg b/stuff/external-link.svg new file mode 100644 index 0000000..d9a6bac --- /dev/null +++ b/stuff/external-link.svg @@ -0,0 +1,50 @@ + + + + + + + + diff --git a/stuff/faction-1-mechyrdia.png b/stuff/faction-1-mechyrdia.png new file mode 100644 index 0000000..b0b7e86 Binary files /dev/null and b/stuff/faction-1-mechyrdia.png differ diff --git a/stuff/faction-3-diadochi.png b/stuff/faction-3-diadochi.png new file mode 100644 index 0000000..931c96b Binary files /dev/null and b/stuff/faction-3-diadochi.png differ diff --git a/stuff/faction-4-felinae.png b/stuff/faction-4-felinae.png new file mode 100644 index 0000000..fd0b35f Binary files /dev/null and b/stuff/faction-4-felinae.png differ diff --git a/stuff/faction-5-fulkreykk.png b/stuff/faction-5-fulkreykk.png new file mode 100644 index 0000000..17a8c74 Binary files /dev/null and b/stuff/faction-5-fulkreykk.png differ diff --git a/stuff/faction-6-vestigium.png b/stuff/faction-6-vestigium.png new file mode 100644 index 0000000..70b0fd4 Binary files /dev/null and b/stuff/faction-6-vestigium.png differ diff --git a/stuff/faction-7-ilkhai.png b/stuff/faction-7-ilkhai.png new file mode 100644 index 0000000..040ba21 Binary files /dev/null and b/stuff/faction-7-ilkhai.png differ diff --git a/stuff/factions.png b/stuff/factions.png new file mode 100644 index 0000000..f26c547 Binary files /dev/null and b/stuff/factions.png differ diff --git a/stuff/factions.svg b/stuff/factions.svg new file mode 100644 index 0000000..20ab8a7 --- /dev/null +++ b/stuff/factions.svg @@ -0,0 +1,489 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/stuff/make_map_index_pages.py b/stuff/make_map_index_pages.py new file mode 100644 index 0000000..0a497b7 --- /dev/null +++ b/stuff/make_map_index_pages.py @@ -0,0 +1,15 @@ +THEMES = [ + ('index-dark.html', ' data-theme="dark"'), + ('index-light.html', ' data-theme="light"'), + ('index-system.html', '') +] + +DEST_DIR = "../test/assets/map" + +with open("map-index.html", 'r') as text_reader: + text = text_reader.read() + +for (theme_file, theme_attr) in THEMES: + new_text = text.replace("{{THEME}}", theme_attr) + with open(f'{DEST_DIR}/{theme_file}', 'w') as text_writer: + text_writer.write(new_text) diff --git a/stuff/map-index.html b/stuff/map-index.html new file mode 100644 index 0000000..d3e8d7a --- /dev/null +++ b/stuff/map-index.html @@ -0,0 +1,70 @@ + + + + + + + + + + + + + + + + The Milky Way Galaxy + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + + + diff --git a/stuff/panel-dark.svg b/stuff/panel-dark.svg new file mode 100644 index 0000000..92306d4 --- /dev/null +++ b/stuff/panel-dark.svg @@ -0,0 +1,96 @@ + + + + + + + + + + + + + + diff --git a/stuff/panel.svg b/stuff/panel.svg new file mode 100644 index 0000000..b601a13 --- /dev/null +++ b/stuff/panel.svg @@ -0,0 +1,96 @@ + + + + + + + + + + + + + +