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<h1><sub>Unofficial</sub> Roundabout Theme Index</h1> 10 11<ul id="ThemeList"></ul> 12 13<template id="ThemeListElement"> 14<li> 15<table class="table-root"> 16<tr> 17<th class="theme-name" colspan="2"> 18 19</th> 20</tr> 21<tr> 22<th> 23Author 24</th> 25<td> 26<a 27class="author-url" 28></a> 29</td> 30</tr> 31<tr> 32<td colspan="2"> 33<a 34class="download" 35>Theme CSS</a> 36</td> 37</tr> 38</table> 39</li> 40</template> 41 42<script type="module"> 43const ThemeList = await fetch("themes.xml") 44.then(res => res.text()) 45.then(txt => { 46const parser = new DOMParser(); 47const doc = parser.parseFromString(txt, "text/xml"); 48return doc; 49}); 50 51const ThemeListElementTemplate = document.querySelector("#ThemeListElement"); 52const HTMLThemeList = document.querySelector("#ThemeList"); 53 54const themes = ThemeList.querySelectorAll("theme"); 55for (let index = 0; index < themes.length; index++) { 56const theme = themes[index]; 57 58const title = theme.querySelector("title").textContent; 59const author = theme.querySelector("author"); 60const path = theme.querySelector("uri").textContent; 61 62const ListEl = ThemeListElementTemplate.content.cloneNode(true); 63ListEl.querySelector(".theme-name").textContent = title; 64ListEl.querySelector(".download").href = "themes/" + path; 65 66const Author = ListEl.querySelector(".author-url"); 67Author.href = author.getAttribute("uri"); 68Author.textContent = author.textContent; 69 70HTMLThemeList.appendChild(ListEl); 71} 72</script> 73</body> 74 75</html> 76