lastfm recent track

public/js/lastfm-nowplay.js

@@ -0,0 +1,32 @@
+export function update_lastfm_nowplay() {
+  let user = 'Alex_Popov';
+  let apikey = '5556942dcf4c422dca68d57fbbfdee23';
+  let url = `http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks&user=${user}&api_key=${apikey}&format=json&limit=1`;
+
+  let status_text = document.getElementById('lastfm_card_title');
+  let song_text = document.getElementById('lastfm_card_content');
+  let desc_text = document.getElementById('lastfm_card_footer');
+
+  fetch(url)
+    .then((response) => response.json())
+    .then((data) => {
+      // update desc
+      let desc_string = `Всего прослушано ${data.recenttracks['@attr'].total} треков`;
+      desc_text.innerText = desc_string;
+
+      // update content
+      let track_string = `${data.recenttracks.track[0].artist['#text']} — ${data.recenttracks.track[0].name}`;
+      song_text.innerText = track_string;
+
+      // TODO: get play now
+      status_text.innerText = 'Последняя проигранная композиция';
+    })
+    .catch((err) => console.warn('Something went wrong.', err));
+}
+
+/*
+  Application name a2s
+  API key          5556942dcf4c422dca68d57fbbfdee23
+  Shared secret    e1e1baa61478c5745c35b985ed2a49a9
+  Registered to    Alex_Popov
+*/

public/pages/personal.html

@@ -5,4 +5,27 @@
 	</ol>
 </nav>
 
-<p class="fs-3 text-shadow">Тут ничего нет... пока!</p>
+<div class="card text-center">
+	<div id="lastfm_card_title" class="card-header">Загружается...</div>
+	<div class="card-body">
+		<h5 id="lastfm_card_content" class="card-title placeholder-glow">
+			<span class="placeholder col-3 rounded"></span>
+		</h5>
+	</div>
+	<div
+		id="lastfm_card_footer"
+		class="card-footer text-body-secondary placeholder-glow"
+	>
+		<span class="placeholder col-2 rounded"></span>
+	</div>
+</div>
+
+<script type="module">
+	import { update_lastfm_nowplay } from './js/lastfm-nowplay.js';
+
+	function autorun() {
+		update_lastfm_nowplay();
+		setInterval(autorun, 120_000); // 2 minutes
+	}
+	autorun();
+</script>