basic seach

js/main.ts

@@ -1,63 +1,93 @@
 let articleParent = document.getElementById("articles");
 
-window.onload = function() {
+function updateSeach(value: string) {
+    if(value == "") {
+        addRecent()
+        return
+    }
 
-    recent(5).then(function(data) {
+    let query: SearchQuery = {
+        query: value,
+        limit: 5
+    }
+
+
+    clearArticles()
+    search(query).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)
-
+            addArticle(article)
         })
     })
 }
+
+function clearArticles() {
+    articleParent.innerHTML = ""
+}
+
+window.onload = function() {
+    addRecent()
+}
+
+function addRecent () {
+    clearArticles()
+    recent(5).then(function(data) {
+        data.forEach(function(article) {
+            addArticle(article)
+        })
+    })
+}
+
+function addArticle(article: ArticleSummary) {
+    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)
+}