text: var articlesApp=function(){function e(e,n,t){let i=document.getElementById(e);i.addEventListener("submit",(function(e){e.preventDefault();let a=new FormData(i),r=`${window.location.origin}${n}`,d=new XMLHttpRequest;d.open(t,r),d.setRequestHeader("Content-Type","application/json; charset=UTF-8");let l={};a.forEach((function(e,n){l[n]=e})),d.send(JSON.stringify(l)),d.onload=function(){!0===JSON.parse(d.response).success?window.location.href="/articles/app":document.getElementById("formMsg").style.display="block"}}))}return{load:function(){let n=window.location.hash.split("-");switch(n[0]){case"#create":document.getElementById("app").innerHTML='\n        <div class="card">\n          <div class="card-header clearfix">\n            <h2 class="h3 float-left">New Article</h2>\n            <div class="float-right">\n              <a href="#" class="btn btn-primary">Cancel</a>\n            </div>\n          </div>\n          <div class="card-body">\n            <form id="createArticle" class="card-body">\n              <div id="formMsg" class="alert alert-danger text-center">Your form has errors</div>\n\n              <div class="row">\n                <div class="form-group col-md-6">\n                  <label for="title">Title</label>\n                  <input type="text" id="title" name="title" class="form-control" required>\n                </div>\n                <div class="form-group col-md-6">\n                  <label for="published">Publish On</label>\n                  <input type="datetime-local" id="published" name="published" class="form-control" required>\n                </div>\n              </div>\n\n              <div class="row">\n                <div class="form-group col-md">\n                  <label for="body">Body</label>\n                  <textarea id="body" name="body" class="form-control" rows="6" required></textarea>\n                </div>\n              </div>\n\n              <div class="row">\n                <div class="form-group col-md-6">\n                  <label for="description">Summary</label>\n                  <input type="text" id="description" name="description" class="form-control" required>\n                </div>\n\n                <div class="form-group col-md-6">\n                  <label for="keywords">Keywords (separated by commas)</label>\n                  <input type="text" id="keywords" name="keywords" class="form-control" required>\n                </div>\n              </div>\n\n              <div class="text-right">\n                <input type="submit" value="Submit" class="btn btn-lg btn-primary btn-sm-block">\n              </div>\n            </form>\n          </div>\n        </div>\n    ',e("createArticle","/api/articles","POST");break;case"#view":!function(e){let n=`${window.location.origin}/api/articles/${e}`,t=new XMLHttpRequest;t.open("GET",n),t.setRequestHeader("Content-Type","application/json; charset=UTF-8"),t.send(),t.onload=function(){let e=document.getElementById("app"),n=JSON.parse(t.response),i="";i=`<div class="card">\n        <div class="card-header clearfix">\n          <h2 class="h3 float-left">${n.article.title}</h2>\n          <div class="float-right">\n          <a href="#edit-${n.article._id}" class="btn btn-primary">Edit</a>\n        </div>       \n          </div>\n       \n        <div class="card-body">\n          <div class="blockquote">${n.article.body}</div>\n          <br>\n          <div>Tagged: <em>${n.article.keywords}</em></div>\n        </div>\n      </div>\n\n      `,e.innerHTML=i}}(n[1]);break;case"#edit":!function(n){let t=`${window.location.origin}/api/articles/${n}`,i=new XMLHttpRequest;i.open("GET",t),i.setRequestHeader("Content-Type","application/json; charset=UTF-8"),i.send(),i.onload=function(){let n=document.getElementById("app"),t=JSON.parse(i.response);var a=Date(t.article.published);console.log(a);var r=`\n        <div class="card">\n          <div class="card-header clearfix">\n            <h2 class="h3 float-left">Edit Article</h2>\n            <div class="float-right">\n              <a href="#" class="btn btn-primary">Cancel</a>\n            </div>\n          </div>\n          <div class="card-body">\n            <form id="editArticle" class="card-body">\n              <div id="formMsg" class="alert alert-danger text-center">Your form has errors</div>\n\n              <div class="row">\n                <div class="form-group col-md-6">\n                  <label for="title">Title</label>\n                  <input type="text" id="title" name="title" class="form-control" value="${t.article.title}" required>\n                </div>\n                <div class="form-group col-md-6">\n                  <label for="published">Published On</label>\n                  <input type="datetime-local" id="published" name="published" class="form-control" value="${a}" required>\n                </div>\n              </div>\n\n              <div class="row">\n                <div class="form-group col-md">\n                  <label for="body">Body</label>\n                  <textarea id="body" name="body" class="form-control" rows="6" required>${t.article.body}</textarea>\n                </div>\n              </div>\n\n              <div class="row">\n                <div class="form-group col-md-6">\n                  <label for="description">Summary</label>\n                  <input type="text" id="description" name="description" class="form-control" value="${t.article.description}" required>\n                </div>\n\n                <div class="form-group col-md-6">\n                  <label for="keywords">Keywords (separated by commas)</label>\n                  <input type="text" id="keywords" name="keywords" class="form-control" value="${t.article.keywords}" required>\n                </div>\n              </div>\n              <div>\n                <input type="hidden" id="_id" name="_id" class="form-control" value="${t.article._id}" required>\n              </div>\n              <div>\n                <input type="hidden" id="created" name="created" class="form-control" value="${t.article.created}" required>\n              </div>\n\n              <div class="text-right">\n                <input type="submit" value="Submit" class="btn btn-lg btn-primary btn-sm-block">\n              </div>\n            </form>\n          </div>\n          <div>\n            <a href="#delete-${t.article._id}" class="text-danger">Delete</a>\n          </div>\n        </div>\n\n  `;n.innerHTML=r,e("editArticle","/api/articles","PUT")}}(n[1]);break;case"#delete":!function(e){let n=`${window.location.origin}/api/articles/${e}`,t=new XMLHttpRequest;t.open("GET",n),t.setRequestHeader("Content-Type","application/json; charset=UTF-8"),t.send(),t.onload=function(){let e=document.getElementById("app"),n=JSON.parse(t.response),i="";i=`<div class="card bg-transparent border-danger text-danger bg-danger">\n            <div class="card-header bg-transparent border-danger">\n            <div class="float-right">\n            <a href="#" class="btn btn-primary">Cancel</a>\n            </div>\n              <h2 class="h3 text-center">You're deleting this article</h2>\n            </div>\n            <div class="card-body text-center">\n              <div>\n                Are you sure you want to delete\n                <strong>${n.article.title}</strong>\n              </div>\n\n              <div>Summary: <strong>${n.article.description}</strong></div>\n\n              <div class="text-center">\n                <br>\n                <a onclick="articlesApp.deleteArticle('${n.article._id}');" class="btn btn-lg btn-danger text-white">\n                  Yes delete ${n.article.description}\n                </a>\n              </div>\n\n            </div>\n          </div>`,e.innerHTML=i}}(n[1]);break;default:!function(){let e=window.location.origin+"/api/articles",n=new XMLHttpRequest;n.open("GET",e),n.setRequestHeader("Content-Type","application/json; charset=UTF-8"),n.send(),n.onload=function(){let e=document.getElementById("app"),t=JSON.parse(n.response).articles,i="",a="";for(let e=0;e<t.length;e++)a=a+`<tr>\n          <td>\n            <a href="#view-${t[e]._id}">${t[e].title}</a>\n          </td>\n          <td>${t[e].description}</td>\n          <td>`+(t[e].published?""+t[e].published.slice(0,19).replace("T"," "):"No Publication Date Set")+"\n          </td>\n        </tr>";i=`<div class="card">\n        <div class="card-header clearfix">\n          <h2 class="h3 float-left">Articles</h2>\n          <div class="float-right">\n            <a href="#create" class="btn btn-primary">New Article</a>\n          </div>\n        </div>\n        <div class="table-responsive">\n          <table class="table table-striped table-hover table-bordered">\n            <thead>\n              <tr>\n                <td>Title</td>\n                <td>Description</td>\n                <td>Date Published</td>\n              </tr>\n            </thead>\n            <tbody>${a}</tbody>\n          </table>\n        </div>\n      </div>`,e.innerHTML=i}}()}},deleteArticle:function(e){!function(e){let n=`${window.location.origin}/api/articles/${e}`,t=new XMLHttpRequest;t.open("DELETE",n),t.setRequestHeader("Content-Type","application/json; charset=UTF-8"),t.send(),t.onload=function(){!0===JSON.parse(t.response).success?window.location.hash="#":alert("Unknown error, the article could not be deleted")}}(e)}}}();articlesApp.load(),window.addEventListener("hashchange",(function(){articlesApp.load()}));