index.html
HTML document, ASCII text
1<!DOCTYPE html> 2<html lang="en-US"> 3 4<head> 5<title>Unofficial Roundabout Theme Index</title> 6</head> 7 8<body> 9<hgroup role="group"> 10<h1><sub>Unofficial</sub> Roundabout Theme Index</h1> 11<p class="subtitle">The unofficial hub for Roundabout Themes</p> 12</hgroup> 13 14<p>Don't know how to install a theme? See <a href="install.html">install.html</a></p> 15 16<ul id="ThemeList"></ul> 17 18<template id="ThemeListElement"> 19<li> 20<table class="table-root"> 21<tr> 22<th class="theme-name" colspan="2"> 23 24</th> 25</tr> 26<tr> 27<th> 28Author 29</th> 30<td> 31<a 32class="author-url" 33></a> 34</td> 35</tr> 36<tr> 37<td colspan="2"> 38<a 39class="download" 40>Theme CSS</a> 41</td> 42</tr> 43</table> 44</li> 45</template> 46 47<script type="module"> 48const ThemeList = await fetch("themes.xml") 49.then(res => res.text()) 50.then(txt => { 51const parser = new DOMParser(); 52const doc = parser.parseFromString(txt, "text/xml"); 53return doc; 54}); 55 56const ThemeListElementTemplate = document.querySelector("#ThemeListElement"); 57const HTMLThemeList = document.querySelector("#ThemeList"); 58 59const themes = ThemeList.querySelectorAll("theme"); 60for (let index = 0; index < themes.length; index++) { 61const theme = themes[index]; 62 63const title = theme.querySelector("title").textContent; 64const author = theme.querySelector("author"); 65const path = theme.querySelector("uri").textContent; 66 67const ListEl = ThemeListElementTemplate.content.cloneNode(true); 68ListEl.querySelector(".theme-name").textContent = title; 69ListEl.querySelector(".download").href = "themes/" + path; 70 71const Author = ListEl.querySelector(".author-url"); 72Author.href = author.getAttribute("uri"); 73Author.textContent = author.textContent; 74 75HTMLThemeList.appendChild(ListEl); 76} 77</script> 78</body> 79 80</html> 81