broadcast!

FNLookup · Jun 14, 2024 · f899f2a · f899f2a
1 parent 79ebba8
commit f899f2a
Show file tree

Hide file tree

Showing 7 changed files with 193 additions and 2 deletions.
diff --git a/broadcast/index.html b/broadcast/index.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="FNLookup is an easy browsing interface for most Fortnite related content.">
+    <meta name="author" content="tposejank">
+    <title>Broadcast - FNLookup</title>
+    <link rel="icon" href="/assets/icons/logo.png">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;1,300&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="/css/style.css">
+    <script src="/js/backend.js" type="text/javascript"></script>
+    <script src="/js/script.js" type="text/javascript"></script>
+    <script src="js/blog.js" type="text/javascript"></script>
+</head>
+
+<body>
+    <div class="nav-container">
+    </div>
+
+    <script>
+        localStorage.popupVersion = '0.1'
+        i()
+    </script>
+
+    <div class="content" fullpage="true" style="max-width: 1450px; align-items: center;">
+        <h1 class="header-text-bold">Welcome to Broadcast!</h1>
+        <h2 class="header-text-bold">This is FNLookup's blog.</h2>
+
+        <div id="blog-entries" class="fnlookup-blog-posts">
+        </div>
+    </div>
+
+    <script>loadBlog()</script>
+</body>
+
+</html>
diff --git a/broadcast/js/blog.js b/broadcast/js/blog.js
@@ -0,0 +1,23 @@
+function loadBlog() {
+    fetch('https://raw.githubusercontent.com/FNLookup/fnlookup-blog/main/manifest.json')
+    .then(response => response.json())
+    .then(json => {
+        for (blog of json.directory) {
+            async function createBlog() {
+                let information = await fetch('https://raw.githubusercontent.com/FNLookup/fnlookup-blog/main/' + blog.id + '/info.json')
+                let infofile = await information.json()
+
+                document.getElementById('blog-entries').innerHTML += `            <a href="read/?id=${blog.id}" class="blog-post d-30-media">
+                <img src="https://raw.githubusercontent.com/FNLookup/fnlookup-blog/main/${blog.id}/${infofile['header-image']}" alt="Design" class="image">
+                <div class="information">
+                    <h3 class="header-text-bold">${blog.shortTitle}</h3>
+                    <h4 class="header-text-bold">${infofile['written-by']}</h4>
+                </div>
+            </a>`
+            }
+
+            createBlog()
+        }
+    })
+    .catch(error => console.error(error));
+}
diff --git a/broadcast/read/index.html b/broadcast/read/index.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="FNLookup is an easy browsing interface for most Fortnite related content.">
+    <meta name="author" content="tposejank">
+    <title>Broadcast - FNLookup</title>
+    <link rel="icon" href="/assets/icons/logo.png">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;1,300&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="/css/style.css">
+    <script src="/js/backend.js" type="text/javascript"></script>
+    <script src="/js/script.js" type="text/javascript"></script>
+    <script src="js/blog.js" type="text/javascript"></script>
+    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+</head>
+
+<body>
+    <div class="nav-container">
+    </div>
+
+    <script>
+        i()
+    </script>
+
+    <div class="content" fullpage="true" style="max-width: 1450px;">
+        <div class="blog-post-big-image-container">
+            <img src="https://raw.githubusercontent.com/FNLookup/fnlookup-blog/main/welcome-fnlookup-3/design.png" alt="Banner" class="blog-post-view-banner">
+        </div>
+
+        <hr>
+
+        <div id="blog-data" class="blog-data"></div>
+    </div>
+
+    <script>loadBlogData()</script>
+</body>
+
+</html>
diff --git a/broadcast/read/js/blog.js b/broadcast/read/js/blog.js
@@ -0,0 +1,25 @@
+function loadBlogData() {
+    let params = new URLSearchParams(window.location.search)
+
+    let blogId = params.get('id')
+
+    fetch('https://raw.githubusercontent.com/FNLookup/fnlookup-blog/main/' + blogId + '/BLOG_DATA.md')
+    .then(response => response.text())
+    .then(text => {
+        const content = document.getElementById('blog-data');
+        content.innerHTML = marked.parse(text);
+
+        for (let child of content.children) {
+            for (let childrenofthechild of child.children) {
+                let nodename = childrenofthechild.nodeName
+
+                if (nodename == 'IMG') {
+                    let stupidSplit = childrenofthechild.src.split('/')
+                    childrenofthechild.src = 'https://raw.githubusercontent.com/FNLookup/fnlookup-blog/main/' + blogId + '/' + stupidSplit[stupidSplit.length - 1]
+                }
+            }
+
+        }
+    })
+    .catch(error => console.error(error));
+}
diff --git a/css/style.css b/css/style.css
@@ -263,6 +263,16 @@ a.link-underline:hover {
     position: relative;
 }
 
+.navigation-part popup {
+    position: absolute;
+    right: 5rem;
+    background-color: #101C40;
+    padding: 1rem;
+    border-radius: 15px;
+    font-family: headings-squash;
+    width: 150px;
+}
+
 .navbar-button,
 .part-button {
     padding: .8rem 1rem;
@@ -3586,6 +3596,54 @@ jam-track {
     padding-left: 1rem;
 }
 
+.fnlookup-blog-posts {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.blog-post {
+    margin: 0.5rem;
+    background-color: var(--card-background-color);
+    overflow: hidden;
+    border-radius: 15px;
+}
+
+.blog-post .information {
+    padding: 1rem;
+}
+
+.blog-post img {
+    width: 100%;
+    display: block;
+}
+
+.blog-post-big-image-container {
+    max-height: 300px;
+    overflow: hidden;
+    border-radius: 15px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.blog-post-big-image-container img {
+    width: 100%;
+    display: block;
+}
+
+.blog-data {
+    font-family: headings-squash;
+}
+
+.blog-data * {
+    margin: 0.5rem 0;
+}
+
+.blog-data img {
+    width: 50%;
+    height: 50%;
+}
+
 .cookie-container {
     width: 100%;
     height: 100%;

diff --git a/items/view/js/item.js b/items/view/js/item.js
@@ -373,7 +373,7 @@ function init() {
                     let ds = gne('a');
                     ds.innerText = rSince;
 
-                    if (dsince == 0) ds.innerHTML = '<a href="/item-shop/">Today</a>';
+                    if (dsince == 0) ds.innerHTML = '<a href="/items/shop/">Today</a>';
 
                     right.append(ds);
 

diff --git a/js/script.js b/js/script.js
@@ -49,7 +49,8 @@ function i() {
                 <a class="part-button"><img src="/assets/icons/home.png" class="navigation-icon"></a>
             </div>
             <div class="navigation-part" id="navigation-2">
-                <a href="/404.html" class="part-button"><img src="/assets/icons/broadcast.png" class="navigation-icon"></a>
+                <a href="/broadcast/" class="part-button"><img src="/assets/icons/broadcast.png" class="navigation-icon"></a>
+                ${(localStorage.popupVersion != '0.1' || localStorage.popupVersion == undefined ? `<popup>>>>> NEW! >>>> Broadcast!</popup>` : '')}
             </div>
             <div class="navigation-part" id="navigation-3">
                 <a href="/404.html" class="part-button"><img src="/assets/icons/notis.png" class="navigation-icon"></a>