new actadd manual
This commit is contained in:
Ellpeck
parent
76e3fe6fb3
commit
a8b6942863
3 changed files with 155 additions and 0 deletions
24
actaddmanual/index.html
Normal file
24
actaddmanual/index.html
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
|
||||||
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<title>Actually Additions Manual</title>
|
||||||
|
|
||||||
|
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
|
||||||
|
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="sidebar"></div>
|
||||||
|
<div id="entries"></div>
|
||||||
|
<script src="index.js"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
67
actaddmanual/index.js
Normal file
67
actaddmanual/index.js
Normal file
|
|
@ -0,0 +1,67 @@
|
||||||
|
const replacements = new Map();
|
||||||
|
replacements.set(/<imp>([^<]*)<r>/g, function (content) {
|
||||||
|
return `<span class="imp">${content}</span>`
|
||||||
|
});
|
||||||
|
replacements.set(/<item>([^<]*)<r>/g, function (content) {
|
||||||
|
return `<span class="item">${content}</span>`
|
||||||
|
});
|
||||||
|
replacements.set(/<n>/g, function (_content) {
|
||||||
|
return "<br>"
|
||||||
|
});
|
||||||
|
replacements.set(/<i>([^<]*)<r>/g, function (content) {
|
||||||
|
return `<em>${content}</em>`
|
||||||
|
});
|
||||||
|
replacements.set(/<tifisgrin>([^<]*)<r>/g, function (content) {
|
||||||
|
return `<span class="tifisgrin">${content}</span>`
|
||||||
|
});
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
url: "https://cdn.jsdelivr.net/gh/Ellpeck/ActuallyAdditions/src/main/resources/assets/actuallyadditions/lang/en_US.lang",
|
||||||
|
cache: false,
|
||||||
|
success: populateManual
|
||||||
|
});
|
||||||
|
|
||||||
|
function populateManual(lang) {
|
||||||
|
let startIndex = lang.indexOf("#Booklet Chapters");
|
||||||
|
let data = lang.substring(startIndex + 18);
|
||||||
|
|
||||||
|
let entries = $("#entries");
|
||||||
|
let sidebar = $("#sidebar");
|
||||||
|
|
||||||
|
for (let topic of data.split("\n\n")) {
|
||||||
|
let lines = topic.split("\n");
|
||||||
|
let t = '<div class="entry rounded">';
|
||||||
|
// first line is name
|
||||||
|
let name = lines[0].substring(lines[0].indexOf("=") + 1);
|
||||||
|
let id = lines[0].match(/chapter\.([^\.]*)\.name/)[1];
|
||||||
|
sidebar.append(`<a href=#${id}>${name}</a>`);
|
||||||
|
t += `<a class="anchor" id="${id}"></a>`;
|
||||||
|
t += `<h1>${name}</h1>`;
|
||||||
|
// following lines are content
|
||||||
|
for (let i = 1; i < lines.length; i++) {
|
||||||
|
let text = lines[i].substring(lines[i].indexOf("=") + 1);
|
||||||
|
t += `<p>${replaceFormatting(text)}</p>`;
|
||||||
|
}
|
||||||
|
t += "</div>";
|
||||||
|
entries.append(t);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Move to anchor now that it's loaded
|
||||||
|
if (window.location.hash.startsWith("#")) {
|
||||||
|
var anchor = $(window.location.hash);
|
||||||
|
if (anchor.length) {
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: anchor.offset().top
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function replaceFormatting(text) {
|
||||||
|
for (let [k, v] of replacements.entries()) {
|
||||||
|
text = text.replace(k, function (_substring, group) {
|
||||||
|
return v(group);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return text;
|
||||||
|
}
|
||||||
64
actaddmanual/style.css
Normal file
64
actaddmanual/style.css
Normal file
|
|
@ -0,0 +1,64 @@
|
||||||
|
body {
|
||||||
|
font-family: Roboto;
|
||||||
|
margin-top: 30px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
background-color: #e2e2e2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
color: blue;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imp {
|
||||||
|
color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entry {
|
||||||
|
width: 85%;
|
||||||
|
display: block;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
padding-top: 30px;
|
||||||
|
padding-bottom: 30px;
|
||||||
|
padding-left: 40px;
|
||||||
|
padding-right: 40px;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#entries {
|
||||||
|
margin-left: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar {
|
||||||
|
height: 100%;
|
||||||
|
width: 300px;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 1;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: white;
|
||||||
|
overflow-x: hidden;
|
||||||
|
padding-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar a {
|
||||||
|
padding: 5px 5px 5px 20px;
|
||||||
|
text-decoration: none;
|
||||||
|
color: #686868;
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar a:hover {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor {
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
top: -40px;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue