New homepage
This commit is contained in:
parent
955f1d0f16
commit
c3f27b7451
|
|
@ -17,11 +17,13 @@ services:
|
||||||
- type: bind
|
- type: bind
|
||||||
source: /srv/ext/sys/caddy
|
source: /srv/ext/sys/caddy
|
||||||
target: /data/caddy
|
target: /data/caddy
|
||||||
|
- type: bind
|
||||||
|
source: /srv/ext/sys/www
|
||||||
|
target: /www
|
||||||
|
read_only: true
|
||||||
configs:
|
configs:
|
||||||
- source: Caddyfile
|
- source: Caddyfile
|
||||||
target: /etc/caddy/Caddyfile
|
target: /etc/caddy/Caddyfile
|
||||||
- source: index.html
|
|
||||||
target: /www/index.html
|
|
||||||
extra_hosts:
|
extra_hosts:
|
||||||
- host.docker.internal:host-gateway
|
- host.docker.internal:host-gateway
|
||||||
|
|
||||||
|
|
@ -219,10 +221,7 @@ configs:
|
||||||
name: dave.yaml-v3
|
name: dave.yaml-v3
|
||||||
Caddyfile:
|
Caddyfile:
|
||||||
file: Caddyfile
|
file: Caddyfile
|
||||||
name: Caddyfile-v55
|
name: Caddyfile-v57
|
||||||
index.html:
|
|
||||||
file: index.html
|
|
||||||
name: index.html-v33
|
|
||||||
|
|
||||||
|
|
||||||
secrets:
|
secrets:
|
||||||
|
|
|
||||||
|
|
@ -2,96 +2,150 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Deer Grove</title>
|
<title>Deer Grove</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<link rel="icon" href="/landing-page/deergrove.png">
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
font-family: sans-serif;
|
display: flex;
|
||||||
background: #efe;
|
flex-flow: column;
|
||||||
|
height: 100vh;
|
||||||
|
margin: 0;
|
||||||
|
font-family: Helvetica, sans-serif;
|
||||||
|
background-color: #222;
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
section {
|
|
||||||
margin: 3em auto;
|
nav {
|
||||||
max-width: 30em;
|
overflow-x: scroll;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 12pt;
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
menu, ul {
|
nav img {
|
||||||
margin-block: auto;
|
max-height: 2em;
|
||||||
padding-inline: inherit;
|
|
||||||
list-style: none;
|
|
||||||
}
|
}
|
||||||
li {
|
nav a {
|
||||||
margin: 1em;
|
padding: 0.5em 1.5em;
|
||||||
|
color: #aaa;
|
||||||
|
text-decoration: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
nav a:hover {
|
||||||
|
background: #555;
|
||||||
|
}
|
||||||
|
nav a.active {
|
||||||
|
background: #8b8;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
iframe {
|
||||||
|
flex-grow: 1;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icons {
|
||||||
|
margin: auto 2em;
|
||||||
|
}
|
||||||
|
.icons {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: center;
|
||||||
|
max-width: 40em;
|
||||||
|
margin: auto;
|
||||||
|
gap: 20px;
|
||||||
|
}
|
||||||
|
.icons a {
|
||||||
|
background-color: #444;
|
||||||
|
color: #fff;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
border-radius: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.icons a img {
|
||||||
|
max-width: 66%;
|
||||||
|
max-height: 66%;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
image-rendering: pixelated;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
<script type="module">
|
||||||
|
function activate(event, element) {
|
||||||
|
if (element.target) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
let parent = element.parentElement
|
||||||
|
for (let e of parent.getElementsByClassName("active")) {
|
||||||
|
e.classList.remove("active")
|
||||||
|
}
|
||||||
|
element.classList.add("active")
|
||||||
|
|
||||||
|
let iframe = document.querySelector("iframe")
|
||||||
|
iframe.src = element.href
|
||||||
|
|
||||||
|
event.preventDefault()
|
||||||
|
}
|
||||||
|
|
||||||
|
function init() {
|
||||||
|
let doc = document.querySelector("iframe").contentDocument
|
||||||
|
|
||||||
|
for (let l of document.head.querySelectorAll("style")) {
|
||||||
|
doc.head.appendChild(l.cloneNode(true))
|
||||||
|
}
|
||||||
|
|
||||||
|
let icons = doc.body.appendChild(doc.createElement("section"))
|
||||||
|
icons.classList.add("icons")
|
||||||
|
|
||||||
|
for (let link of document.querySelectorAll("nav a")) {
|
||||||
|
let dlink = icons.appendChild(link.cloneNode(true))
|
||||||
|
dlink.textContent = ""
|
||||||
|
|
||||||
|
if (link.dataset.icon) {
|
||||||
|
let icon = dlink.appendChild(doc.createElement("img"))
|
||||||
|
icon.src = link.dataset.icon
|
||||||
|
icon.style.objectFit = "cover"
|
||||||
|
} else {
|
||||||
|
let text = dlink.appendChild(doc.createElement("div"))
|
||||||
|
text.textContent = link.textContent
|
||||||
|
}
|
||||||
|
|
||||||
|
// Make both of them update the selected tab
|
||||||
|
link.addEventListener("click", event => activate(event, link))
|
||||||
|
dlink.addEventListener("click", event => activate(event, link))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (document.readyState === "loading") {
|
||||||
|
document.addEventListener("DOMContentLoaded", init)
|
||||||
|
} else {
|
||||||
|
init()
|
||||||
|
}
|
||||||
|
</script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Deer Grove</h1>
|
<nav>
|
||||||
<section>
|
<img src="/landing-page/deergrove.png">
|
||||||
<menu>
|
<a href="/sonarr/" data-icon="/sonarr/Content/Images/logo.svg" title="Episode manager">Shows</a>
|
||||||
<h2>Major Services</h2>
|
<a href="/radarr/" data-icon="/radarr/Content/Images/logo.svg" title="Movie manager">Movies</a>
|
||||||
<ul>
|
<a href="/lidarr/" data-icon="/lidarr/Content/Images/logo.svg" title="Music manager">Music</a>
|
||||||
<li><a href="//drive.woozle.org/">📁 Drive</a></li>
|
<a href="/readarr/" data-icon="/readarr/Content/Images/logo.svg" title="Book manager">Books</a>
|
||||||
<li><a href="//ancestry.woozle.org/">👪 Ancestry</a></li>
|
<a href="/sucker/" data-icon="/landing-page/cd-dvd.svg" title="Media Sucker">Sucker</a>
|
||||||
<li><a href="//git.woozle.org/">🗄️ Git</a></li>
|
<hr>
|
||||||
</ul>
|
<a href="/prowlarr/" data-icon="/prowlarr/Content/Images/logo.png" title="Indexer/Searcher">Search</a>
|
||||||
|
<a href="/nzbget/" data-icon="/landing-page/nzbget.png" title="Usenet downloader">Usenet</a>
|
||||||
<h2>Smaller stuff</h2>
|
<a href="/transmission/web/" data-icon="/transmission/web/style/transmission/images/logo.png" title="BitTorrent downloader">BitTorrent</a>
|
||||||
<ul>
|
<hr>
|
||||||
<li><a href="/octoprint/">🖨️ Octoprint: 3d Printer</a></li>
|
<a href="/octoprint/" data-icon="/octoprint/static/img/logo.png" title="3D Printer Front-End">Octoprint</a>
|
||||||
<li><a href="/wallart/">🖼️ Wall Art Uploader</a></li>
|
<a href="/wallart/" data-icon="/wallart/wallart.png" title="Wall Art uploader">Wall Art</a>
|
||||||
</ul>
|
<hr>
|
||||||
|
<a href="https://git.woozle.org" target="_blank" data-icon="https://git.woozle.org/assets/img/logo.svg" title="Git repositories">Git</a>
|
||||||
<h2>Media</h2>
|
<a href="https://drive.woozle.org/" target="_blank" data-icon="/landing-page/cloud-folder.png" titled="Shared storage">Drive</a>
|
||||||
<ul>
|
<a href="https://ancestry.woozle.org/" target="_blank" data-icon="https://ancestry.woozle.org/images/favicon_gwd.png" title="Genealogy">Ancestry</a>
|
||||||
<li><a href="/sucker/">💿 Media Sucker: DVD/CD ripper</a></li>
|
</nav>
|
||||||
<li><a href="/sonarr/">📺 Sonarr: TV episode manager</a></li>
|
<iframe></iframe>
|
||||||
<li><a href="/radarr/">🎬 Radarr: Movie manager</a></li>
|
|
||||||
<li><a href="/lidarr/">🎶 Lidarr: Music manager</a></li>
|
|
||||||
<li><a href="/readarr/">📖 Readarr: Book manager</a></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
<h2>Media Helpers</h2>
|
|
||||||
<ul>
|
|
||||||
<li><a href="/prowlarr/">🐯 Prowlarr: Indexer for downloaders</a></li>
|
|
||||||
<li><a href="/transmission/web/">📥 Transmission</a></li>
|
|
||||||
<li><a href="/nzbget/">📰 NZBGet: Usenet fetcher</a></li>
|
|
||||||
</ul>
|
|
||||||
</menu>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
<h1>How all the media stuff fits together</h1>
|
|
||||||
<p>
|
|
||||||
Plex is the main interface for users.
|
|
||||||
It indexes media in <tt>/srv/ext/media</tt>
|
|
||||||
and lets everybody watch it whetever.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
The Media Sucker automatically sucks things off of CDs and DVDs.
|
|
||||||
You still have to rename the files and move them into the right place, though.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Sonarr/Radarr/Lidarr/Readarr let you tell it what you'd like to have,
|
|
||||||
and watches various feeds,
|
|
||||||
waiting for it to appear.
|
|
||||||
Then it tells a downloader to download it.
|
|
||||||
Once a file is downloaded,
|
|
||||||
it moves it into a directory where Plex can see it,
|
|
||||||
making sure it's named properly.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Prowlarr connects to various download indexers,
|
|
||||||
to find whatever it is you're looking for.
|
|
||||||
<a href="https://nzbgeek.info/">NZBGeek</a> is a paid feed provider that I use:
|
|
||||||
it monitors Usenet for new posts,
|
|
||||||
and provides them as feeds.
|
|
||||||
I pay <a href="https://frugalusenet.com/">Frugal Usenet</a> $5 a month to run a Usenet server so I don't have to.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Transmission and NZBGet are downloaders.
|
|
||||||
Once you've found something in an index,
|
|
||||||
you can ask these to download it.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
<!--
|
|
||||||
vi: ts=2 sw=2 et ai
|
|
||||||
-->
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue