TheAdversary/frontend
4
0
Fork 0
Code Issues Pull Requests Projects 1 Releases Wiki Activity

added main.ts, and recent loading for Articles - early state

Browse Source
This commit is contained in:
Elias Müller
2022-02-02 20:48:36 +01:00
parent 026bf1c3bc
commit df4f4da3d3
5 changed files with 112 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend Submodule

Submodule frontend added at 026bf1c3bc

7
html/landingpage.gohtml
View File

@@ -9,6 +9,7 @@
<link rel="stylesheet" href="sass/index.css">
<script src="js/api.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript" defer></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@@ -31,8 +32,8 @@
<h2>Assault penguins to the Power</h2>
</div>
<div class="content">
<div class="articles">
<div id="articles" class="articles">
<!--
<a href="#">
<div class="article">
<div class="article-header">
@@ -94,7 +95,7 @@
</div>
</div>
</a>
-->
</div>
</div>
</body>

43
js/main.js Normal file
View File

@@ -0,0 +1,43 @@
let articleParent = document.getElementById("articles");
window.onload = function () {
recent(5).then(function (data) {
data.forEach(function (article) {
let articleA = document.createElement("a");
articleA.setAttribute("href", article.link);
let articleDiv = document.createElement("div");
articleDiv.setAttribute("class", "article");
let articleHeader = document.createElement("div");
articleHeader.setAttribute("class", "article-header");
let articleHeaderTitle = document.createElement("h3");
articleHeaderTitle.innerHTML = article.title;
articleHeader.appendChild(articleHeaderTitle);
articleDiv.appendChild(articleHeader);
let articleDescription = document.createElement("div");
articleDescription.setAttribute("class", "article-description");
let articleDescriptionP = document.createElement("p");
let articleDescriptionTopics = document.createElement("i");
articleDescriptionTopics.innerHTML = article.tags.join(", ");
let articleDescriptionAuthors = document.createElement("i");
articleDescriptionAuthors.innerHTML = article.authors[0].name;
let articleDescriptionDate = document.createElement("i");
articleDescriptionDate.innerHTML = article.modified.toString();
articleDescriptionP.appendChild(articleDescriptionTopics);
articleDescriptionP.appendChild(articleDescriptionAuthors);
articleDescriptionP.appendChild(articleDescriptionDate);
articleDescription.appendChild(articleDescriptionP);
articleDiv.appendChild(articleDescription);
let articleBody = document.createElement("div");
articleBody.setAttribute("class", "article-body");
let articleBodyP = document.createElement("p");
articleBodyP.innerHTML = article.summary;
articleBody.appendChild(articleBodyP);
articleDiv.appendChild(articleBody);
articleA.appendChild(articleDiv);
articleParent.appendChild(articleA);
let divider = document.createElement("div");
divider.setAttribute("class", "divider");
articleParent.appendChild(divider);
});
});
};
//# sourceMappingURL=main.js.map

1
js/main.js.map Normal file
View File

@@ -0,0 +1 @@
{"version":3,"file":"main.js","sourceRoot":"","sources":["main.ts"],"names":[],"mappings":"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"}

63
js/main.ts Normal file
View File

@@ -0,0 +1,63 @@
let articleParent = document.getElementById("articles");
window.onload = function() {
recent(5).then(function(data) {
data.forEach(function(article) {
let articleA = document.createElement("a")
articleA.setAttribute("href", article.link)
let articleDiv = document.createElement("div")
articleDiv.setAttribute("class", "article")
let articleHeader = document.createElement("div")
articleHeader.setAttribute("class", "article-header")
let articleHeaderTitle = document.createElement("h3")
articleHeaderTitle.innerHTML = article.title
articleHeader.appendChild(articleHeaderTitle)
articleDiv.appendChild(articleHeader)
let articleDescription = document.createElement("div")
articleDescription.setAttribute("class", "article-description")
let articleDescriptionP = document.createElement("p")
let articleDescriptionTopics = document.createElement("i")
articleDescriptionTopics.innerHTML = article.tags.join(", ")
let articleDescriptionAuthors = document.createElement("i")
articleDescriptionAuthors.innerHTML = article.authors[0].name //TODO join ALL Auhtors
let articleDescriptionDate = document.createElement("i")
articleDescriptionDate.innerHTML = article.modified.toString()
articleDescriptionP.appendChild(articleDescriptionTopics)
articleDescriptionP.appendChild(articleDescriptionAuthors)
articleDescriptionP.appendChild(articleDescriptionDate)
articleDescription.appendChild(articleDescriptionP)
articleDiv.appendChild(articleDescription)
let articleBody = document.createElement("div")
articleBody.setAttribute("class", "article-body")
let articleBodyP = document.createElement("p")
articleBodyP.innerHTML = article.summary
articleBody.appendChild(articleBodyP)
articleDiv.appendChild(articleBody)
articleA.appendChild(articleDiv)
articleParent.appendChild(articleA)
let divider = document.createElement("div")
divider.setAttribute("class", "divider")
articleParent.appendChild(divider)
})
})
}