# Lainring


**Lainring** is a decentralized [webring](https://indieweb.org/webring) created by the users of [Lainchan](https://lainchan.org/); an anonymous image board.

<!--more-->

Lainring is quite a big reason of why I have a website in the first place. Ever since visiting the Lainring, I fell in love with the concept, and wanted to be part of it. So here we are.

**Being in a webring does NOT mean I endorse or support the points of views or contents of the websites in said webring.**

## How to join
Go to the [Lainchan thread](https://lainchan.org/%CE%A9/res/70358.html) and link your website. Add a 240x60 button.

This page requires JavaScript to be enabled in your web browser.

## The Lainring
Here's the Lainring in all its glory.

<div id="lainring">... Loading, please wait ...</div>
<script>
document.addEventListener("DOMContentLoaded", function(event) {
	/* Try to retrieve the json file */
	fetch('/lainring.json').then(res => res.json()).then((data) => {
		let out = '';
		/* For each element in the JSON, build an anchor-image DOM structure */
		data.items.forEach(element => {
			/* This string is split in multiple lines for readability */
			out += '<a title="' + element.title + '" ' +
				'href="' + element.url + '">' +
				'<img src="' + element.img + '" alt="' + element.title + '" /></a>';
		});
		/* Inject the DOM structure into the element with the id 'lainring' */
		document.getElementById('lainring').innerHTML = out;
	}).catch(err => {
		/* throw an error */
		throw err
	});
});
</script>

Thanks to [Sizeof(cat)](https://sizeof.cat/) for, like much of my site, helping me learn how to show this. If you want to add the Lainring to your site, go check out [his version of the lainring](https://sizeof.cat/post/lainring/). He includes there a quick guide on how to set it up.