Add first work for masto news and update public coropora page

app/templates/main/news.html.j2

@@ -9,6 +9,8 @@
     </div>
 
     <div class="col s12">
+      <div id="mastodon"></div>
+
       <div class="card" id="april-2022-update">
         <div class="card-content">
           <span class="card-title">April 2022 update</span>
@@ -126,3 +128,33 @@
   </div>
 </div>
 {% endblock page_content %}
+
+{% block scripts %}
+{{ super() }}
+<script>
+  let mastodonElement = document.querySelector('#mastodon');
+  fetch(`https://fedihum.org/api/v1/accounts/109386364241901080/statuses`, {method: 'GET', headers: {Accept: 'application/json'}})
+    .then((response) => {return response.json();})
+    .then((statuses) => {
+      for (let status of statuses) {
+        console.log(status);
+        let contentHtml = `<div>${status.content}</div>`
+        let tagsHtml = '<p>';
+        for (let tag of status.tags) {
+          tagsHtml += `<a href="${tag.url}" class="chip">${tag.name}</a>`;
+        }
+        tagsHtml += '</p>';
+        let statusHtml = `
+          <div id="${status.id}" class="card">
+            <div class="card-content">
+              <span class="card-title">Mastodon News</span>
+              ${contentHtml}
+              ${tagsHtml}
+            </div>
+          </div>
+        `;
+        mastodonElement.insertAdjacentHTML('beforeend', statusHtml);
+      }
+    });
+</script>
+{% endblock scripts %}