rodude123
da791c8866
Some checks reported warnings
🚀 Deploy website on push / 🎉 Deploy (push) Has been cancelled
Signed-off-by: rodude123 <rodude123@gmail.com>
1 line
12 KiB
JavaScript
1 line
12 KiB
JavaScript
const scrollLimit=150;function goToURL(e){let t=e.split("/");if("/blog/"!==e&&"/blog"!==e){if("post"!==t[2])return"category"===t[2]?t[3]?void loadPostsByCategory(t[t.length-1]):void loadAllCategories():void show404();loadIndividualPost(t[t.length-1]).catch((e=>console.log(e)))}else loadHomeContent()}function createLargePost(e){let t=document.createElement("div");t.classList.add("outerContent");let n=document.createElement("img");n.className="banner",n.src=e.headerImg,n.alt=e.title,t.appendChild(n);let a=document.createElement("div");a.classList.add("content");let o=document.createElement("div");o.classList.add("postContent");let s="";return e.categories.split(", ").forEach((t=>{s+=`<a href="/blog/category/${t}" class="link">${t}</a>`,e.categories.split(", ").length>1&&(s+=", ")})),s.endsWith(", ")&&(s=s.substring(0,s.length-2)),o.innerHTML=`\n <h2>${e.title}</h2>\n <h3>Last updated: ${e.dateModified} | ${s}</h3>\n <p>${e.abstract}</p>\n <a href="/blog/post/${e.title}#disqus_thread" class="btn btnPrimary">See Post</a>\n `,a.appendChild(o),t.appendChild(a),t}function loadHomeContent(){fetch("/api/blog/post").then((e=>e.json().then((e=>{for(let t=0;t<e.length;t++){if(1===e[t].featured){let n=document.createElement("section");n.classList.add("largePost"),n.id="featuredPost";let a=document.createElement("h1");a.innerHTML="featured post",n.appendChild(a);let o=createLargePost(e[t]);n.appendChild(o),document.querySelector("#main").prepend(n)}if(0===t){let n=document.createElement("section");n.classList.add("largePost"),n.id="latestPost";let a=document.createElement("h1");a.innerHTML="latest post",n.appendChild(a);let o=createLargePost(e[t]);n.appendChild(o),document.querySelector("#main").prepend(n)}}}))))}async function getLatestAndFeaturedPosts(){return[await fetch("/api/blog/post/latest").then((e=>e.json())),await fetch("/api/blog/post/featured").then((e=>e.json()))]}function csvToArray(e){let t="",n=[""],a=0,o=!0,s=null;for(s of e)'"'===s?(o&&s===t&&(n[a]+=s),o=!o):","===s&&o?s=n[++a]="":"\n"===s&&o?("\r"===t&&(row[a]=row[a].slice(0,-1)),n=n[++r]=[s=""],a=0):n[a]+=s,t=s;return n}async function getCategories(){let e=await fetch("/api/blog/categories").then((e=>e.json())),t=[];return e.forEach((e=>t=t.concat(csvToArray(e.categories.replace(/\s*,\s*/g,","))))),[...new Set(t)]}function createCategories(e){let t="";return e.forEach((e=>t+=`<a href="/blog/category/${e}" class="link">${e}</a>`)),t}function createButtonCategories(e){let t="";return e.forEach((e=>e.forEach((e=>t+=`<a href="/blog/category/${e}" class="btn btnOutline">${e}</a>`)))),t}async function createSideContent(){let e=await getLatestAndFeaturedPosts(),t=e[0],n=e[1],a=createCategories(await getCategories()),o=document.createElement("aside");return o.classList.add("sideContent"),o.innerHTML=`\n <div class="authorInfo">\n <div class="picture">\n <img src="/imgs/profile.jpg"\n alt="My professional picture taken in brighton near \n north street at night wearing a beige jacket and checkered shirt"\n class="profile">\n <p>Rohit Pai</p>\n </div>\n \n <a href="https://linkedin.com/in/rohitpai98">\n <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\n <path d="M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm-2 16h-2v-6h2v6zm-1-6.891c-.607 0-1.1-.496-1.1-1.109 0-.612.492-1.109 1.1-1.109s1.1.497 1.1 1.109c0 .613-.493 1.109-1.1 1.109zm8 6.891h-1.998v-2.861c0-1.881-2.002-1.722-2.002 0v2.861h-2v-6h2v1.093c.872-1.616 4-1.736 4 1.548v3.359z"/>\n </svg>\n </a>\n \n <a href="mailto:rohit@rohitpai.co.uk">\n <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\n <path d="M13.718 10.528c0 .792-.268 1.829-.684 2.642-1.009 1.98-3.063 1.967-3.063-.14 0-.786.27-1.799.687-2.58 1.021-1.925 3.06-1.624 3.06.078zm10.282 1.472c0 6.627-5.373 12-12 12s-12-5.373-12-12 5.373-12 12-12 12 5.373 12 12zm-5-1.194c0-3.246-2.631-5.601-6.256-5.601-4.967 0-7.744 3.149-7.744 7.073 0 3.672 2.467 6.517 7.024 6.517 2.52 0 4.124-.726 5.122-1.288l-.687-.991c-1.022.593-2.251 1.136-4.256 1.136-3.429 0-5.733-2.199-5.733-5.473 0-5.714 6.401-6.758 9.214-5.071 2.624 1.642 2.524 5.578.582 7.083-1.034.826-2.199.799-1.821-.756 0 0 1.212-4.489 1.354-4.975h-1.364l-.271.952c-.278-.785-.943-1.295-1.911-1.295-2.018 0-3.722 2.19-3.722 4.783 0 1.73.913 2.804 2.38 2.804 1.283 0 1.95-.726 2.364-1.373-.3 2.898 5.725 1.557 5.725-3.525z"/>\n </svg>\n </a>\n \n <a href="https://gitea.rohitpai.co.uk/rodude123">\n <svg xmlns="http://www.w3.org/2000/svg"\n x="0px" y="0px" viewBox="0 0 1024 1024"\n style="enable-background:new -1 0 1024 1024;" xml:space="preserve">\n <style type="text/css">.st1 {fill: #FFFFFF;}</style>\n <g id="Guides"></g>\n <g id="Icon"><circle class="st0" cx="512" cy="512" r="512"/>\n <g><path class="st1" d="M762.2,350.3c-100.9,5.3-160.7,8-212,8.5v114.1l-16-7.9l-0.1-106.1c-58.9,0-110.7-3.1-209.1-8.6 c-12.3-0.1-29.5-2.4-47.9-2.5c-47.1-0.1-110.2,33.5-106.7,118C175.8,597.6,296,609.9,344,610.9c5.3,24.7,61.8,110.1,103.6,114.6 H631C740.9,717.3,823.3,351.7,762.2,350.3z M216.2,467.6c-4.7-36.6,11.8-74.8,73.2-73.2C296.1,462,307,501.5,329,561.9 C272.8,554.5,225,536.2,216.2,467.6z M631.8,551.1l-51.3,105.6c-6.5,13.4-22.7,19-36.2,12.5l-105.6-51.3 c-13.4-6.5-19-22.7-12.5-36.2l51.3-105.6c6.5-13.4,22.7-19,36.2-12.5l105.6,51.3C632.7,521.5,638.3,537.7,631.8,551.1z"/>\n <path class="st1"\n d="M555,609.9c0.1-0.2,0.2-0.3,0.2-0.5c17.2-35.2,24.3-49.8,19.8-62.4c-3.9-11.1-15.5-16.6-36.7-26.6 c-0.8-0.4-1.7-0.8-2.5-1.2c0.2-2.3-0.1-4.7-1-7c-0.8-2.3-2.1-4.3-3.7-6l13.6-27.8l-11.9-5.8L519.1,501c-2,0-4.1,0.3-6.2,1 c-8.9,3.2-13.5,13-10.3,21.9c0.7,1.9,1.7,3.5,2.8,5l-23.6,48.4c-1.9,0-3.8,0.3-5.7,1c-8.9,3.2-13.5,13-10.3,21.9 c3.2,8.9,13,13.5,21.9,10.3c8.9-3.2,13.5-13,10.3-21.9c-0.9-2.5-2.3-4.6-4-6.3l23-47.2c2.5,0.2,5,0,7.5-0.9 c2.1-0.8,3.9-1.9,5.5-3.3c0.9,0.4,1.9,0.9,2.7,1.3c17.4,8.2,27.9,13.2,30,19.1c2.6,7.5-5.1,23.4-19.3,52.3 c-0.1,0.2-0.2,0.5-0.4,0.7c-2.2-0.1-4.4,0.2-6.5,1c-8.9,3.2-13.5,13-10.3,21.9c3.2,8.9,13,13.5,21.9,10.3 c8.9-3.2,13.5-13,10.3-21.9C557.8,613.6,556.5,611.6,555,609.9z"/>\n </g>\n </g>\n </svg>\n </a>\n <h3>Avid Full Stack Dev | Uni of Notts Grad | Amateur Blogger</h3>\n\n </div>\n <div class="otherPosts">\n <h2>latest post</h2>\n <h3>${t.title}</h3>\n <p>${t.abstract}</p>\n <a href="/blog/post/${t.title}" class="btn btnPrimary boxShadowIn boxShadowOut">See Post</a>\n </div>\n <div class="otherPosts">\n <h2>featured post</h2>\n <h3>${n.title}</h3>\n <p>${n.abstract}</p>\n <a href="/blog/post/${n.title}" class="btn btnPrimary boxShadowIn boxShadowOut">See Post</a>\n </div>\n <div class="categories">\n <h2>categories</h2>\n ${a}\n </div>\n `,o}async function loadIndividualPost(e){document.title="Rohit Pai - "+decodeURI(e),await fetch(`/api/blog/post/${e}`).then((async e=>{e.ok?await e.json().then((async e=>{let t=document.createElement("section");t.classList.add("post"),t.id="individualPost";let n=document.createElement("div");n.classList.add("mainContent");let a=document.createElement("article");a.innerHTML=`\n <h1>${e.title}</h1>\n <div class="byLine">\n <h3>Last updated: ${e.dateModified}</h3>\n <h3>${createButtonCategories([csvToArray(e.categories.replace(/\s*,\s*/g,","))])}</h3>\n </div>\n <div class="cover" style="background-image: url('${e.headerImg}')"></div>\n ${e.body}\n `;let o=document.createElement("section");o.classList.add("comments"),o.innerHTML='<h2>Comments</h2>\n <div id="disqus_thread"></div>\n ',n.appendChild(a),n.appendChild(o);let s=await createSideContent();t.appendChild(n),t.appendChild(s),document.querySelector("#main").appendChild(t);var c,i;c=document,(i=c.createElement("script")).src="https://rohitpaiportfolio.disqus.com/embed.js",i.setAttribute("data-timestamp",+new Date),c.body.appendChild(i)})):show404()}))}async function loadAllCategories(){document.title="Rohit Pai - Categories";let e=await getCategories(),t=document.querySelector("#main"),n=document.createElement("section");n.classList.add("categories"),n.id="allCategories";let a=document.createElement("h1");a.innerHTML="Categories",t.appendChild(a);for(let t of e){let e=document.createElement("div");e.classList.add("btnContainer");let a=document.createElement("a");a.classList.add("btn"),a.classList.add("btnPrimary"),a.innerHTML=t,a.href=`/blog/category/${t}`,e.appendChild(a),n.appendChild(e)}t.appendChild(n)}function loadPostsByCategory(e){document.title="Rohit Pai - "+decodeURI(e),fetch(`/api/blog/categories/${e}`).then((t=>t.json().then((t=>{let n=document.querySelector("#main"),a=document.createElement("section");a.classList.add("catPosts"),a.id="postsByCategory";let o=document.createElement("h1");o.innerHTML=decodeURI(e),n.appendChild(o);for(let e=0;e<t.length;e++){let n=document.createElement("section");n.classList.add("largePost"),e<t.length-1&&n.classList.add("categoryPost"),n.id=`lp-${e+1}`;let o=createLargePost(t[e]);n.appendChild(o),a.appendChild(n)}n.appendChild(a)}))))}function show404(){document.querySelector("#main").innerHTML='\n <div class="error">\n <div class="fof">\n <h1>Blog post, Category or page not found</h1>\n <a href="/blog/" class="btn btnPrimary">See all blog posts</a>\n </div>\n </div> \n '}document.addEventListener("DOMContentLoaded",(()=>{goToURL(window.location.pathname)})),window.addEventListener("popstate",(e=>{goToURL(window.history.state)})),window.onscroll=()=>{document.body.scrollTop>=150||document.documentElement.scrollTop>=150?document.querySelector("nav").classList.add("scrolled"):document.querySelector("nav").classList.remove("scrolled")}; |