Added server/platform metadata and more detailed server views.

index.html

@@ -81,6 +81,19 @@
 					  Регистрация на lor.sh
 				    </a>
 				</p>
+
+				<table class="table table-sm">
+					<tbody>
+						<tr>
+							<td>Платформа</td>
+							<td id="node-platform">Mastodon</td>
+						</tr>
+						<tr>
+							<td>Регистрация</td>
+							<td id="node-registration">Премодерируемая</td>
+						</tr>
+					</tbody>
+				</table>
 			</div>
 		</div>
 	</div>

js/functions.js

@@ -1,14 +1,12 @@
 /**
- * Returns random key from the object.
+ * Returns random item from given array.
  * 
- * @param {object} obj 
- * @returns {string}
+ * @param {array} array 
+ * @returns {object}
  */
-function getRandomKey(obj) {
-    let keys = Object.keys(obj);
-    
-    return keys[ keys.length * Math.random() << 0 ];
-};
+function getRandomItem(array) {
+    return array[array.length * Math.random() << 0];
+}
 
 /**
  * Randomly sorts an array.

js/list-servers.js

@@ -1,19 +1,33 @@
 // Should be included using 'defer' after servers.js and functions.js
 
-let listGroup = document.getElementById('server-list');
+let tableBody = document.getElementById('table-servers-body');
 
-let shuffledServerNames = shuffleArray(Object.keys(instances));
-console.log('shuffled: ', shuffledServerNames);
+let shuffledServers = shuffleArray(instances);
+console.log('shuffled: ', shuffledServers);
 
-for (serverName of shuffledServerNames) {
-    let url = instances[serverName];
+for (server of shuffledServers) {
+    let platform = platforms[server.platform];
+    let regMode = registrationModes[server.registration];
 
-    // Creating list item
-    let item = document.createElement('a');
-    item.setAttribute('class', 'list-group-item');
-    item.setAttribute('href', url);
-    item.innerText = serverName;
+    let tr = document.createElement('tr');
 
-    listGroup.appendChild(item);
+    let tdName = document.createElement('td');
+    let tdPlatform = document.createElement('td');
+    let tdRegistration = document.createElement('td');
+    tr.appendChild(tdName);
+    tr.appendChild(tdPlatform);
+    tr.appendChild(tdRegistration);
+
+    serverLink = document.createElement('a');
+    serverLink.setAttribute('href', server.url);
+    serverLink.innerText = server.name;
+    tdName.appendChild(serverLink);
+    platformIcon = document.createElement('img');
+    platformIcon.setAttribute('src', platform.icon);
+    tdPlatform.appendChild(platformIcon);
+    tdPlatform.appendChild(document.createTextNode(' ' + platform.name));
+    tdRegistration.innerText = regMode.name;
+
+    // Adding to table
+    tableBody.appendChild(tr);
 }
-

js/random-server.js

@@ -1,10 +1,27 @@
 // Should be included using 'defer' after servers.js and functions.js
 
-let serverName = getRandomKey(instances);
-let url = instances[serverName];
+let server = getRandomItem(instances);
 
-console.log('Randomly selected: ', serverName, url);
+console.log('Randomly selected: ', server);
 
+// Server link
 let linkElement = document.getElementById('reg-link');
-linkElement.setAttribute('href', url);
-linkElement.innerText = 'Регистрация на ' + serverName;
+linkElement.setAttribute('href', server.url);
+linkElement.innerText = 'Регистрация на ' + server.name;
+
+let platform = platforms[server.platform];
+let regMode = registrationModes[server.registration];
+
+// Additional metadata elements
+let platformElement = document.getElementById('node-platform');
+let registrationElement = document.getElementById('node-registration');
+
+// Icon element
+let platformIcon = document.createElement('img');
+platformIcon.setAttribute('src', platform.icon);
+
+platformElement.innerHTML = '';
+platformElement.appendChild(platformIcon);
+platformElement.appendChild(document.createTextNode(' ' + platform.name));
+
+registrationElement.innerText = regMode.name;

js/servers.js

@@ -1,10 +1,22 @@
 // You can add your instances here using Pull Request on Github
 
-var instances = {
-    'lor.sh': 'https://lor.sh',
-    'mastodon.ml': 'https://mastodon.ml',
-    'Expired Mentality': 'https://expired.mentality.rip',
-    'Клуб "Свобода"': 'https://soc.phreedom.club',
-    'zHub.link': 'https://zhub.link',
-    'Дорогу осилит идущий': 'https://aspirant.de',
+var instances = [
+    {name: 'lor.sh', url: 'https://lor.sh', platform: 'mastodon', registration: 'premoderated'},
+    {name: 'mastodon.ml', url: 'https://mastodon.ml', platform: 'mastodon', registration: 'open'},
+    {name: 'Expired Mentality', url: 'https://expired.mentality.rip', platform: 'pleroma', registration: 'open'},
+    {name: 'Клуб "Свобода"', url: 'https://soc.phreedom.club', platform: 'pleroma', registration: 'open'},
+    {name: 'zHub.link', url: 'https://zhub.link', platform: 'mastodon', registration: 'open'},
+    {name: 'Дорогу осилит идущий', url: 'https://aspirant.de', platform: 'mastodon', registration: 'open'},
+];
+
+var platforms = {
+    mastodon: {name: 'Mastodon', icon: 'images/mastodon-32px.png'},
+    pleroma: {name: 'Pleroma', icon: 'images/pleroma-32px.png'},
+    friendica: {name: 'Friendica', icon: 'images/friendica-32px.png'},
+    //misskey: {name: 'Misskey', icon: 'images/misskey.png'},
+};
+
+var registrationModes = {
+    open: {name: 'Открытая', description: 'Свободная регистрация'},
+    premoderated: {name: 'Премодерируемая', description: 'После регистрации необходимо дождаться проверки модератора'},
 };

servers.html

@@ -72,9 +72,17 @@
             <div class="content">
                 <h2>Рекомендованные русскоязычные серверы</h2>
 
-                <div class="list-group" id="server-list">
-                    
-                </div>
+                <table class="table table-bordered table-sm">
+					<thead>
+						<th scope="col">Сервер</th>
+						<th scope="col">Платформа</th>
+						<th scope="col">Регистрация</th>
+					</thead>
+
+					<tbody id="table-servers-body">
+
+					</tbody>
+				</table>
             </div>
 		</div>
 	</div>