Added support for activity feed and notifications on 3DS

src/database.js

@@ -251,6 +251,27 @@ async function getServerConfig() {
     return ENDPOINT.findOne();
 }
 
+async function getNewsFeed(user, numberOfPosts) {
+    verifyConnected();
+    return POST.find({
+        $or: [
+            {pid: user.followed_users},
+            {pid: user.pid}
+        ],
+    }).limit(numberOfPosts).sort({ created_at: -1});
+}
+
+async function getNewsFeedAfterTimestamp(user, numberOfPosts, post) {
+    verifyConnected();
+    return POST.find({
+        $or: [
+            {pid: user.followed_users},
+            {pid: user.pid}
+        ],
+        created_at: { $lt: post.created_at }
+    }).limit(numberOfPosts).sort({ created_at: -1});
+}
+
 module.exports = {
     connect,
     getCommunities,
@@ -281,5 +302,7 @@ module.exports = {
     getCommunityPostsAfterTimestamp,
     getServerConfig,
     pushNewNotificationByPID,
-    pushNewNotificationToAll
+    pushNewNotificationToAll,
+    getNewsFeed,
+    getNewsFeedAfterTimestamp,
 };

src/services/juxt-web/index.js

@@ -37,6 +37,8 @@ ctr.use('/titles/show', routes.CTR_SHOW);
 ctr.use('/communities', routes.CTR_COMMUNITIES);
 ctr.use('/users', routes.CTR_USER);
 ctr.use('/posts', routes.CTR_POST);
+ctr.use('/news', routes.CTR_NEWS);
+ctr.use('/activity-feed', routes.CTR_FEED);
 ctr.use('/', routes.CTR_WEB);
 
 admin.use('/', routes.WEB_ADMIN);

src/services/juxt-web/routes/ctr/feed.js

@@ -0,0 +1,86 @@
+var express = require('express');
+var xml = require('object-to-xml');
+const database = require('../../../../database');
+const util = require('../../../../authentication');
+var moment = require('moment');
+var router = express.Router();
+
+router.get('/', function (req, res) {
+    res.header('X-Nintendo-WhiteList','1|http,youtube.com,,2|https,youtube.com,,2|http,.youtube.com,,2|https,.youtube.com,,2|http,.ytimg.com,,2|https,.ytimg.com,,2|http,.googlevideo.com,,2|https,.googlevideo.com,,2|https,youtube.com,/embed/,6|https,youtube.com,/e/,6|https,youtube.com,/v/,6|https,www.youtube.com,/embed/,6|https,www.youtube.com,/e/,6|https,www.youtube.com,/v/,6|https,youtube.googleapis.com,/e/,6|https,youtube.googleapis.com,/v/,6|http,maps.googleapis.com,/maps/api/streetview,2|https,maps.googleapis.com,/maps/api/streetview,2|http,cbk0.google.com,/cbk,2|https,cbk0.google.com,/cbk,2|http,cbk1.google.com,/cbk,2|https,cbk1.google.com,/cbk,2|http,cbk2.google.com,/cbk,2|https,cbk2.google.com,/cbk,2|http,cbk3.google.com,/cbk,2|https,cbk3.google.com,/cbk,2|https,.cloudfront.net,,2|https,www.google-analytics.com,/,2|https,stats.g.doubleclick.net,,2|https,www.google.com,/ads/,2|https,ssl.google-analytics.com,,2|http,fonts.googleapis.com,,2||fonts.googleapis.com,,2');
+    database.connect().then(async e => {
+
+        let pid = util.data.processServiceToken(req.headers["x-nintendo-servicetoken"]);
+
+        if(pid === null)
+            pid = 1000000000;
+        let user = await database.getUserByPID(pid);
+        let communityMap = await util.data.getCommunityHash();
+        let posts = await database.getNewsFeed(user, 3);
+        res.render('ctr/feed.ejs', {
+            moment: moment,
+            user: user,
+            posts: posts,
+            communityMap: communityMap,
+        });
+    }).catch(error => {
+        console.log(error);
+        res.set("Content-Type", "application/xml");
+        res.statusCode = 400;
+        response = {
+            result: {
+                has_error: 1,
+                version: 1,
+                code: 400,
+                error_code: 15,
+                message: "SERVER_ERROR"
+            }
+        };
+        res.send("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n" + xml(response));
+    });
+});
+
+router.get('/loadposts', function (req, res) {
+    res.header('X-Nintendo-WhiteList','1|http,youtube.com,,2|https,youtube.com,,2|http,.youtube.com,,2|https,.youtube.com,,2|http,.ytimg.com,,2|https,.ytimg.com,,2|http,.googlevideo.com,,2|https,.googlevideo.com,,2|https,youtube.com,/embed/,6|https,youtube.com,/e/,6|https,youtube.com,/v/,6|https,www.youtube.com,/embed/,6|https,www.youtube.com,/e/,6|https,www.youtube.com,/v/,6|https,youtube.googleapis.com,/e/,6|https,youtube.googleapis.com,/v/,6|http,maps.googleapis.com,/maps/api/streetview,2|https,maps.googleapis.com,/maps/api/streetview,2|http,cbk0.google.com,/cbk,2|https,cbk0.google.com,/cbk,2|http,cbk1.google.com,/cbk,2|https,cbk1.google.com,/cbk,2|http,cbk2.google.com,/cbk,2|https,cbk2.google.com,/cbk,2|http,cbk3.google.com,/cbk,2|https,cbk3.google.com,/cbk,2|https,.cloudfront.net,,2|https,www.google-analytics.com,/,2|https,stats.g.doubleclick.net,,2|https,www.google.com,/ads/,2|https,ssl.google-analytics.com,,2|http,fonts.googleapis.com,,2|fonts.googleapis.com,,2|https,www.googletagmanager.com,,2');
+    database.connect().then(async e => {
+        let pid = util.data.processServiceToken(req.headers["x-nintendo-servicetoken"]);
+        let post = await database.getPostByID(req.query.postID);
+        if(pid === null)
+            pid = 1000000000;
+        let user = await database.getUserByPID(pid);
+        let communityMap = await util.data.getCommunityHash();
+        let posts;
+        if(post !== null)
+            posts = await database.getNewsFeedAfterTimestamp(user, 3, post);
+
+        if(posts.length > 0)
+        {
+            res.render('ctr/more_posts.ejs', {
+                communityMap: communityMap,
+                moment: moment,
+                database: database,
+                user: user,
+                newPosts: posts,
+            });
+        }
+        else
+        {
+            res.sendStatus(204);
+        }
+    }).catch(error => {
+        console.log(error);
+        res.set("Content-Type", "application/xml");
+        res.statusCode = 400;
+        response = {
+            result: {
+                has_error: 1,
+                version: 1,
+                code: 400,
+                error_code: 15,
+                message: "SERVER_ERROR"
+            }
+        };
+        res.send("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n" + xml(response));
+    });
+});
+
+module.exports = router;

src/services/juxt-web/routes/ctr/notifications.js

@@ -0,0 +1,44 @@
+var express = require('express');
+var xml = require('object-to-xml');
+const database = require('../../../../database');
+const util = require('../../../../authentication');
+var moment = require('moment');
+var router = express.Router();
+
+router.get('/', function (req, res) {
+    res.header('X-Nintendo-WhiteList','1|http,youtube.com,,2|https,youtube.com,,2|http,.youtube.com,,2|https,.youtube.com,,2|http,.ytimg.com,,2|https,.ytimg.com,,2|http,.googlevideo.com,,2|https,.googlevideo.com,,2|https,youtube.com,/embed/,6|https,youtube.com,/e/,6|https,youtube.com,/v/,6|https,www.youtube.com,/embed/,6|https,www.youtube.com,/e/,6|https,www.youtube.com,/v/,6|https,youtube.googleapis.com,/e/,6|https,youtube.googleapis.com,/v/,6|http,maps.googleapis.com,/maps/api/streetview,2|https,maps.googleapis.com,/maps/api/streetview,2|http,cbk0.google.com,/cbk,2|https,cbk0.google.com,/cbk,2|http,cbk1.google.com,/cbk,2|https,cbk1.google.com,/cbk,2|http,cbk2.google.com,/cbk,2|https,cbk2.google.com,/cbk,2|http,cbk3.google.com,/cbk,2|https,cbk3.google.com,/cbk,2|https,.cloudfront.net,,2|https,www.google-analytics.com,/,2|https,stats.g.doubleclick.net,,2|https,www.google.com,/ads/,2|https,ssl.google-analytics.com,,2|http,fonts.googleapis.com,,2||fonts.googleapis.com,,2');
+    database.connect().then(async e => {
+
+        //let paramPackData = util.data.decodeParamPack(req.headers["x-nintendo-parampack"]);
+        let pid = util.data.processServiceToken(req.headers["x-nintendo-servicetoken"]);
+
+        if(pid === null)
+            pid = 1000000000;
+        let user = await database.getUserByPID(pid);
+        res.render('ctr/notifications.ejs', {
+            moment: moment,
+            user: user,
+        });
+        user.notification_list.filter(noti => noti.read === false).forEach(function(notification) {
+            notification.read = true;
+        });
+        user.markModified('notification_list');
+        user.save();
+    }).catch(error => {
+        console.log(error);
+        res.set("Content-Type", "application/xml");
+        res.statusCode = 400;
+        response = {
+            result: {
+                has_error: 1,
+                version: 1,
+                code: 400,
+                error_code: 15,
+                message: "SERVER_ERROR"
+            }
+        };
+        res.send("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n" + xml(response));
+    });
+});
+
+module.exports = router;

src/services/juxt-web/routes/ctr/posts.js

@@ -104,7 +104,7 @@ router.post('/new', upload.none(), async function (req, res, next) {
             };
             const newPost = new POST(document);
             newPost.save();
-            res.redirect('/communities/' + community.community_id);
+            res.redirect('/communities/' + community.community_id + '/new');
         }
     }
     catch (e)

src/services/juxt-web/routes/ctr/userpage.js

@@ -89,7 +89,7 @@ router.get('/show', function (req, res) {
     database.connect().then(async e => {
         let user = await database.getUserByPID(userID);
         let newPosts = await database.getPostsByUserID(user.pid);
-        let numPosts = await database.getNumberPostsByUserID(user.pid);
+        let numPosts = await database.getNumberUserPostsByID(user.pid);
         if(isAJAX) {
             res.render('ctr/user_page_ajax.ejs', {
                 // EJS variable and server-side variable

src/services/juxt-web/routes/index.js

@@ -12,6 +12,8 @@ module.exports = {
 	CTR_COMMUNITIES: require('./ctr/communities'),
 	CTR_USER: require('./ctr/userpage'),
 	CTR_POST: require('./ctr/posts'),
+	CTR_FEED: require('./ctr/feed'),
+	CTR_NEWS: require('./ctr/notifications'),
 	WEB_ADMIN: require('./admin/home'),
 	WEB_API: require('./admin/api'),
 };

src/services/juxt-web/routes/portal/feed.js

@@ -15,9 +15,13 @@ router.get('/', function (req, res) {
         if(pid === null)
             pid = 1000000000;
         let user = await database.getUserByPID(pid);
+        let communityMap = await util.data.getCommunityHash();
+        let posts = await database.getNewsFeed(user, 3);
         res.render('portal/feed.ejs', {
             moment: moment,
             user: user,
+            posts: posts,
+            communityMap: communityMap,
         });
         user.notification_list.filter(noti => noti.read === false).forEach(function(notification) {
             notification.read = true;
@@ -41,4 +45,48 @@ router.get('/', function (req, res) {
     });
 });
 
+router.get('/loadposts', function (req, res) {
+    res.header('X-Nintendo-WhiteList','1|http,youtube.com,,2|https,youtube.com,,2|http,.youtube.com,,2|https,.youtube.com,,2|http,.ytimg.com,,2|https,.ytimg.com,,2|http,.googlevideo.com,,2|https,.googlevideo.com,,2|https,youtube.com,/embed/,6|https,youtube.com,/e/,6|https,youtube.com,/v/,6|https,www.youtube.com,/embed/,6|https,www.youtube.com,/e/,6|https,www.youtube.com,/v/,6|https,youtube.googleapis.com,/e/,6|https,youtube.googleapis.com,/v/,6|http,maps.googleapis.com,/maps/api/streetview,2|https,maps.googleapis.com,/maps/api/streetview,2|http,cbk0.google.com,/cbk,2|https,cbk0.google.com,/cbk,2|http,cbk1.google.com,/cbk,2|https,cbk1.google.com,/cbk,2|http,cbk2.google.com,/cbk,2|https,cbk2.google.com,/cbk,2|http,cbk3.google.com,/cbk,2|https,cbk3.google.com,/cbk,2|https,.cloudfront.net,,2|https,www.google-analytics.com,/,2|https,stats.g.doubleclick.net,,2|https,www.google.com,/ads/,2|https,ssl.google-analytics.com,,2|http,fonts.googleapis.com,,2|fonts.googleapis.com,,2|https,www.googletagmanager.com,,2');
+    database.connect().then(async e => {
+        let pid = util.data.processServiceToken(req.headers["x-nintendo-servicetoken"]);
+        let post = await database.getPostByID(req.query.postID);
+        if(pid === null)
+            pid = 1000000000;
+        let user = await database.getUserByPID(pid);
+        let communityMap = await util.data.getCommunityHash();
+        let posts;
+        if(post !== null)
+            posts = await database.getNewsFeedAfterTimestamp(user, 3, post);
+
+        if(posts.length > 0)
+        {
+            res.render('portal/more_posts.ejs', {
+                communityMap: communityMap,
+                moment: moment,
+                database: database,
+                user: user,
+                newPosts: posts,
+            });
+        }
+        else
+        {
+            res.sendStatus(204);
+        }
+    }).catch(error => {
+        console.log(error);
+        res.set("Content-Type", "application/xml");
+        res.statusCode = 400;
+        response = {
+            result: {
+                has_error: 1,
+                version: 1,
+                code: 400,
+                error_code: 15,
+                message: "SERVER_ERROR"
+            }
+        };
+        res.send("<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n" + xml(response));
+    });
+});
+
 module.exports = router;

src/services/juxt-web/routes/portal/posts.js

@@ -104,7 +104,7 @@ router.post('/new', upload.none(), async function (req, res, next) {
             };
             const newPost = new POST(document);
             newPost.save();
-            res.redirect('/communities/' + community.community_id);
+            res.redirect('/communities/' + community.community_id + '/new');
         }
     }
     catch (e)

src/webfiles/ctr/all_communities.ejs

@@ -0,0 +1,60 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>3DS Testing</title>
+    <script src="/js/pjax.js"></script>
+    <script src="/js/juxt.js"></script>
+    <link rel="stylesheet" type="text/css" href="/css/juxt.css">
+</head>
+<body>
+<div id="main">
+    <div class="top-screen">
+        <div class="header-description">
+            <p>
+                Check out the communities for the games that you play or games that you're curious about!
+            </p>
+        </div>
+        <div id="headers-communities-icon" class="header-icon"></div>
+        <h2 class="header-title">Communities</h2>
+    </div>
+    <div class="bottom-screen">
+        <div class="search-container">
+            <div id="search-icon"></div>
+            <input id="search-bar" type="text" placeholder="Search communities..." name="search" onclick="searchCommunities(this)" readonly>
+        </div>
+        <div class="communities-wrapper" id="popular-communities">
+            <h1 class="communities-header">All Communities</h1>
+            <table>
+                <tbody>
+                <% for(var i = 0; i < communities.length; i++) {%>
+                    <% if(i === communities.length - 1) { %>
+                        <tr>
+                            <td>
+                                <div class="community-list-wrapper bottom" data-pjax="/communities/<%= communities[i].community_id %>/new">
+                                    <img class="community-list-icon" src="<%= communities[i].browser_thumbnail %>">
+                                    <h2 class="community-list-title"><%= communities[i].name %></h2>
+                                    <h4><%= communities[i].followers %> followers</h4>
+                                </div>
+                            </td>
+                        </tr>
+                    <% } else { %>
+                        <tr>
+                            <td>
+                                <div class="community-list-wrapper" data-pjax="/communities/<%= communities[i].community_id %>/new">
+                                    <img class="community-list-icon" src="<%= communities[i].browser_thumbnail %>">
+                                    <h2 class="community-list-title"><%= communities[i].name %></h2>
+                                    <h4><%= communities[i].followers %> followers</h4>
+                                </div>
+                            </td>
+                        </tr>
+                <% }} %>
+                </tbody>
+            </table>
+        </div>
+        <div class="toolbar-padding"></div>
+    </div>
+</div>
+<body onload="onStart()"></body>
+</body>
+</html>

src/webfiles/ctr/communities.ejs

@@ -25,6 +25,9 @@
         </div>
         <div class="communities-wrapper" id="popular-communities">
             <h1 class="communities-header">Popular Places</h1>
+            <div data-pjax="/communities/all">
+                <button class="outlined-button" style="position: absolute;margin-left: 222px;margin-top: -28px;"><p>Show All</p></button>
+            </div>
             <table>
                 <tbody>
                 <% for(var i = 0; i < popularCommunities.length; i++) {%>

src/webfiles/ctr/community.ejs

@@ -12,13 +12,110 @@
     <div class="top-screen" <%if(community.CTR_browser_header) {%>style="background: url('<%=community.CTR_browser_header%>')"<%}%>>
         <div class="header-description">
             <p>
-
+                <% community.description %>
             </p>
         </div>
         <div id="" class="header-icon"><img class="community-page-info-icon" src="<%= community.browser_thumbnail %>"></div>
         <h2 class="header-title"><%= community.name %></h2>
     </div>
     <div class="bottom-screen">
+
+        <div id="windowOverlay" class="overlay" style="margin-bottom: 0">
+            <div class="overlay-content" style="position: fixed">
+                <div id="post-window" class="post-wrapper">
+                    <!--Start of Main Post-->
+                    <form class="post-emotion-radio" action="/posts/new" method="post" enctype="multipart/form-data">
+                        <table>
+                            <tr>
+                                <td>
+                                    <div class="post-emotions-wrapper">
+                                        <label for="post-emotion-0">
+                                            <input type="radio" name="emotion" id="post-emotion-0" value="0" checked onclick="selectEmotion(this)">
+                                            <span class="selected-post-emotion-0"></span>
+                                        </label>
+                                        <label for="post-emotion-1">
+                                            <input type="radio" name="emotion" id="post-emotion-1" value="1" onclick="selectEmotion(this)">
+                                            <span class="post-emotion-1"></span>
+                                        </label>
+                                        <label for="post-emotion-2">
+                                            <input type="radio" name="emotion" id="post-emotion-2" value="2" onclick="selectEmotion(this)">
+                                            <span class="post-emotion-2"></span>
+                                        </label>
+                                        <label for="post-emotion-3">
+                                            <input type="radio" name="emotion" id="post-emotion-3" value="3" onclick="selectEmotion(this)">
+                                            <span class="post-emotion-3"></span>
+                                        </label>
+                                        <label for="post-emotion-4">
+                                            <input type="radio" name="emotion" id="post-emotion-4" value="4" onclick="selectEmotion(this)">
+                                            <span class="post-emotion-4"></span>
+                                        </label>
+                                        <label for="post-emotion-5">
+                                            <input type="radio" name="emotion" id="post-emotion-5" value="5" onclick="selectEmotion(this)">
+                                            <span class="post-emotion-5"></span>
+                                        </label>
+                                    </div>
+                                    <input type="hidden" id="olive_title_id" name="olive_title_id" value="<%= community.title_id[0] %>">
+                                    <input type="hidden" id="olive_community_id" name="olive_community_id" value="<%= community.community_id %>">
+                                    <input type="hidden" id="_post_type" name="_post_type" value="body">
+                                </td>
+                                <td>
+                                    <div class="post-screenshot-picker" onclick="loadScreenshots()">
+                                        <div class="post-screenshot-picker-icon"></div>
+                                        <div class="post-screenshot-picker-dropdown">
+                                            <div><img src="" class="post-screenshot-preview" id="post-top-screen-preview" onclick="document.getElementById('screenshot-value').value = wiiuMainApplication.getScreenShot(true);"></div>
+                                            <div><img src="" class="post-screenshot-preview" id="post-bottom-screen-preview" onclick="document.getElementById('screenshot-value').value = wiiuMainApplication.getScreenShot(false);"></div>
+                                            <div onclick="document.getElementById('screenshot-value').value = ''; loadScreenshots()">No Screenshot</div>
+                                            <input type="hidden" id="screenshot-value" name="screenshot" value="">
+                                        </div>
+                                    </div>
+                                </td>
+                                <td>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td>
+                                    <div class="post-type-button-text selected" onclick="swapPostType(0)"></div>
+                                </td>
+                                <td rowspan="2" id="post-text-input">
+                                    <textarea class="post-textarea" id="comment" name="body" placeholder="Tap here to make a post." rows="4" cols="50" onchange="if(wiiuFilter.checkWord(this.value) === -2) { this.value = ''; alert('Prost cannot contain explicit language');}"></textarea>
+                                </td>
+                                <td rowspan="2" id="post-painting-input" style="display: none;">
+                                    <div class="post-memo">
+                                        <img class="post-memo-preview" id="memo" width="640px" height="240px" src="" style="display: none;" onclick="newPainting(false)">
+                                        <input type="hidden" id="memo-value" name="painting" value="">
+                                    </div>
+                                </td>
+                                <br>
+                            </tr>
+                            <tr>
+                                <td>
+                                    <div class="post-type-button-painting" onclick="swapPostType(1);newPainting(false)"></div>
+                                </td>
+                            </tr>
+                            <tr>
+                                <td colspan="2">
+                                    <label class="checkbox-container checkbox-post">Spoilers
+                                        <input type="checkbox" id="spoiler" name="spoiler" value="true" onclick="wiiuSound.playSoundByName('SE_WAVE_MENU', 1);">
+                                        <span class="checkmark"></span>
+                                    </label>
+                                </td>
+                            </tr>
+                            <tr style="height: 70px">
+                                <td class="post-close-button-wrapper" colspan="2">
+                                    <div class="post-close-button" onclick="hideNewPostScreen();wiiuMemo.reset();">
+                                        <p style="margin-top: -2px;">X <b>Close</b></p>
+                                    </div>
+                                </td>
+                                <td>
+                                    <input type="submit" value="Post" class="submit-button" onclick="wiiuSound.playSoundByName('SE_WAVE_MENU', 1);wiiuSound.playSoundByName('BGM_OLV_MAIN_LOOP_NOWAIT', 3);">
+                                </td>
+                            </tr>
+                        </table>
+                    </form>
+                </div>
+            </div>
+        </div>
+
         <div id="community-related-wrapper">
             <div class="related-button-text">
                 Related
@@ -33,7 +130,7 @@
             <p class="community-page-follow-button-text">Follow</p>
         </div>
         <%}%>
-        <button class="community-page-new-post-button">New Post</button>
+        <button class="community-page-new-post-button" onclick="showNewPostScreen()">New Post</button>
         <div class="community-page-posts-wrapper">
             <table class="community-page-posts-header">
                 <tbody>
@@ -56,7 +153,7 @@
                 <% if(totalNumPosts === 0) {%>
                     <p class="no-posts-text">No Posts</p>
                 <%} else { %>
-                    <button id="load-more-posts-button" onclick="loadCommunityPosts()">Load More Posts</button>
+                    <button id="load-more-posts-button" onclick="loadCommunityPosts()" style="background: #1F8A42">Load More Posts</button>
                     <% newPosts.forEach(function(post) { %>
                         <div class="post-user-info-wrapper" id="<%= post.id %>">
                             <%if(post.verified) {%>

src/webfiles/ctr/feed.ejs

@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>3DS Testing</title>
+    <script src="/js/pjax.js"></script>
+    <script src="/js/juxt.js"></script>
+    <link rel="stylesheet" type="text/css" href="/css/juxt.css">
+</head>
+<body>
+<div id="main">
+    <div class="top-screen">
+        <div class="header-description">
+            <p>
+                Here you can view posts and more from the users you follow.
+            </p>
+        </div>
+        <div id="headers-activity-feed-icon" class="header-icon"></div>
+        <h2 class="header-title">Activity Feed</h2>
+    </div>
+    <div class="bottom-screen">
+        <div class="community-page-posts-wrapper">
+            <div id="community-posts-inner-body">
+
+                <% if(posts.length === 0) {%>
+                    <p class="no-posts-text">No Posts</p>
+                <%} else { %>
+                    <button id="load-more-posts-button" onclick="loadFeedPosts()">Load More Posts</button>
+                    <% posts.forEach(function(post) { %>
+                        <div class="post-user-info-wrapper" id="<%= post.id %>">
+                            <%if(post.verified) {%>
+                                <img class="community-page-post-user-icon verified" src="<%= post.mii_face_url %>" onclick="pjax.loadUrl('/users/show?pid=<%= post.pid %>')">
+                                <span class="community-page-verified-user-badge community-page-verified" style=""></span>
+                            <%} else {%>
+                                <img class="community-page-post-user-icon" src="<%= post.mii_face_url %>" onclick="pjax.loadUrl('/users/show?pid=<%= post.pid %>')">
+                                <span class="community-page-verified-user-badge community-page-verified" style="display: none;"></span>
+                            <%}%>
+                            <h2 class="community-page-post-username" data-pjax="/users/show?pid=<%= post.pid %>"><%= post.screen_name %></h2>
+                            <h4 class="community-page-post-time-stamp"><%= moment(post.created_at).fromNow() %> - <a onclick="pjax.loadUrl('/communities/<%=communityMap.get(post.title_id + '-id')%>/new')"><%= communityMap.get(post.title_id) %></a></h4>
+
+                            <div class="community-page-post-yeah-button-wrapper <%if(user.likes.indexOf(post.id) !== -1){ %> selected <%}%>">
+                                <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, '<%= post.id %>')"></div>
+                            </div>
+                            <div id="yeah-<%= post.id %>" class="community-page-post-yeah-count"><%= post.empathy_count %> Yeahs</div>
+                        </div>
+                        <div class="community-page-post-wrapper">
+                            <% if(post.body !== '' && post.painting === '' && post.screenshot === '' && !post.url) { %>
+                                <h3><%= post.body %></h3>
+                            <%} else { %>
+                                <% if(post.screenshot !== '') { %>
+                                    <img id="<%= post.id %>" class="community-page-post-screenshot" src="data:image/png;base64,<%= post.screenshot %>">
+                                <%}%>
+                                <% if(post.painting !== '') { %>
+                                    <img id="<%= post.id%>" class="community-page-post-painting" src="<%= post.painting_uri %>">
+                                <%}%>
+                                <% if(post.url) { %>
+                                        <h3 style="font-weight: bolder; color: #4F279B">Video Playback is not yet supported on the 3DS</h3>
+                                <%}%>
+                                <% if(post.body) { %>
+                                    <div class="community-page-post-text-overlay">
+                                        <h3><%= post.body %></h3>
+                                    </div>
+                                <%}%>
+                            <%}%>
+                        </div>
+                    <% }); %>
+                <%}%>
+            </div>
+        </div>
+        <div class="toolbar-padding"></div>
+    </div>
+    <body onload="onStart()"></body>
+</body>
+</html>

src/webfiles/ctr/more_posts.ejs

@@ -8,7 +8,7 @@
             <span class="community-page-verified-user-badge community-page-verified" style="display: none;" data-pjax="/users/show?pid=<%= post.pid %>"></span>
         <%}%>
         <h2 class="community-page-post-username" data-pjax="/users/show?pid=<%= post.pid %>"><%= post.screen_name %></h2>
-        <h4 class="community-page-post-time-stamp"><%= moment(post.created_at).fromNow() %></h4>
+        <h4 class="community-page-post-time-stamp"><%= moment(post.created_at).fromNow() %> - <a onclick="pjax.loadUrl('/communities/<%=communityMap.get(post.title_id + '-id')%>/new')"><%= communityMap.get(post.title_id) %></h4>
 
         <div class="community-page-post-yeah-button-wrapper <%if(user.likes.indexOf(post.id) !== -1){ %> selected <%}%>">
             <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, '<%= post.id %>')"></div>

src/webfiles/ctr/notifications.ejs

@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>3DS Testing</title>
+    <script src="/js/pjax.js"></script>
+    <script src="/js/juxt.js"></script>
+    <link rel="stylesheet" type="text/css" href="/css/juxt.css">
+</head>
+<body>
+<div id="main">
+    <div class="top-screen">
+        <div class="header-description">
+            <p>
+                Here you can view notifications. You'll get notifications when someone follows you, or replies to your post.
+            </p>
+        </div>
+        <div id="headers-news-icon" class="header-icon"></div>
+        <h2 class="header-title">Notifications</h2>
+    </div>
+    <div class="bottom-screen">
+        <div id="messages-list-wrapper">
+            <table cellspacing="0">
+                <tbody id="messages-list">
+                <% if(user.notification_list.length === 0) {%>
+                    <p class="no-posts-text" style="margin-left: 36%;">No Notifications</p>
+                <%} else { %>
+                    <% let i = 0; user.notification_list.reverse().forEach(function(notification) { %>
+                        <% if(i === 0) { %>
+                        <tr class="message-wrapper" data-pjax="<%=notification.link%>">
+                            <td class="messages-unread-badge-wrapper top">
+                                <%if(!notification.read) {%><div class="unread-badge"></div><%}%>
+                            </td>
+                            <td class="messages-list-wrapper top">
+                                <h3 class="notifications-list-content"><%= notification.content %><span style="color: rgba(113,141,148,1)"> - <%= moment(notification.created_at).fromNow() %></span></h3>
+                            </td>
+                        </tr>
+                        <%i = -1;%>
+                        <%} else {%>
+                        <tr class="message-wrapper" data-pjax="<%=notification.link%>">
+                            <td class="messages-unread-badge-wrapper">
+                                <%if(!notification.read) {%><div class="unread-badge"></div><%}%>
+                            </td>
+                            <td class="messages-list-wrapper">
+                                <h3 class="notifications-list-content"><%= notification.content %><span style="color: rgba(113,141,148,1)"> - <%= moment(notification.created_at).fromNow() %></span></h3>
+                            </td>
+                        </tr>
+                        <%}%>
+                    <%});%>
+                    </tr>
+                    <td></td>
+                    <td class="messages-list-wrapper end"></td>
+                    </tr>
+                <%}%>
+                </tbody>
+            </table>
+        </div>
+        <div class="toolbar-padding"></div>
+    </div>
+    <body onload="onStart()"></body>
+</body>
+</html>

src/webfiles/portal/community.ejs

@@ -211,7 +211,7 @@
                         <h4 class="community-page-post-time-stamp"><%= moment(post.created_at).fromNow() %></h4>
 
                         <div class="community-page-post-yeah-button-wrapper <%if(user.likes.indexOf(post.id) !== -1){ %> selected <%}%>">
-                            <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, <%= post.id %>)"></div>
+                            <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, '<%= post.id %>')"></div>
                         </div>
                         <div id="yeah-<%= post.id %>" class="community-page-post-yeah-count"><%= post.empathy_count %> Yeahs</div>
                     </div>

src/webfiles/portal/feed.ejs

@@ -23,9 +23,55 @@
     <li id="nav-bar-exit" onclick="exit()"><a href="">Close</a></li>
 </menu>
 <div id="main">
-    <h1 id="title" class="page-header">Activity Feed</h1>
+    <div class="community-page-posts-wrapper">
+        <h1 id="title" class="page-header" style="margin-left: 135px; margin-top: -15px;">Activity Feed</h1>
+        <div id="community-posts-inner-body">
+            <% if(posts.length === 0) {%>
+                <p class="no-posts-text" style="margin-left: 20%">It's empty here. Try following someone!</p>
+            <%} else { %>
+                <button id="load-more-posts-button" onclick="loadFeedPosts()">Load More Posts</button>
+                <% posts.forEach(function(post) { %>
+                    <div class="post-user-info-wrapper" id="<%= post.id %>">
+                        <%if(post.verified) {%>
+                            <img class="community-page-post-user-icon verified" src="<%= post.mii_face_url %>" data-pjax="/users/show?pid=<%= post.pid %>">
+                            <span class="community-page-verified-user-badge community-page-verified" style="" data-pjax="/users/show?pid=<%= post.pid %>"></span>
+                        <%} else {%>
+                            <img class="community-page-post-user-icon" src="<%= post.mii_face_url %>" data-pjax="/users/show?pid=<%= post.pid %>">
+                            <span class="community-page-verified-user-badge community-page-verified" style="display: none;" data-pjax="/users/show?pid=<%= post.pid %>"></span>
+                        <%}%>
+                        <h2 class="community-page-post-username" data-pjax="/users/show?pid=<%= post.pid %>"><%= post.screen_name %></h2>
+                        <h4 class="community-page-post-time-stamp"><%= moment(post.created_at).fromNow() %> - <a onclick="pjax.loadUrl('/communities/<%=communityMap.get(post.title_id + '-id')%>/new')"><%= communityMap.get(post.title_id) %></a></h4>
+
+                        <div class="community-page-post-yeah-button-wrapper <%if(user.likes.indexOf(post.id) !== -1){ %> selected <%}%>">
+                            <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, '<%= post.id %>')"></div>
+                        </div>
+                        <div id="yeah-<%= post.id %>" class="community-page-post-yeah-count"><%= post.empathy_count %> Yeahs</div>
+                    </div>
+                    <div class="community-page-post-wrapper">
+                        <% if(post.body !== '' && post.painting === '' && post.screenshot === '' && !post.url) { %>
+                            <h3><%= post.body %></h3>
+                        <%} else { %>
+                            <% if(post.screenshot !== '') { %>
+                                <img id="<%= post.id %>" class="community-page-post-screenshot" src="data:image/png;base64,<%= post.screenshot %>">
+                            <%}%>
+                            <% if(post.painting !== '') { %>
+                                <img id="<%= post.id%>" class="community-page-post-painting" src="<%= post.painting_uri %>">
+                            <%}%>
+                            <% if(post.url) { %>
+                                <h3 style="font-weight: bolder; color: #4F279B">Video Playback is not yet supported on the 3DS</h3>
+                            <%}%>
+                            <% if(post.body) { %>
+                                <div class="community-page-post-text-overlay">
+                                    <h3><%= post.body %></h3>
+                                </div>
+                            <%}%>
+                        <%}%>
+                    </div>
+                <% }); %>
+            <%}%>
+        </div>
+    </div>
 
-    <div id="messages-list-wrapper"></div>
     <img src="" onerror="wiiuBrowser.showLoadingIcon(!1);window.scroll(0, 0);">
 </div>
 <body onload="stopLoading();wiiuBrowser.lockUserOperation(false);">

src/webfiles/portal/js/juxt.js

@@ -590,6 +590,29 @@ function loadCommunityPosts() {
     wiiuSound.playSoundByName("SE_WAVE_MENU", 1);
     wiiuBrowser.showLoadingIcon(!1);
 }
+function loadFeedPosts() {
+    wiiuBrowser.showLoadingIcon(!0);
+    var postID = document.getElementsByClassName('post-user-info-wrapper')[document.getElementsByClassName('post-user-info-wrapper').length - 1].id
+    var xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function() {
+        if (this.readyState === 4 && this.status === 200) {
+            document.getElementsByClassName('community-page-posts-wrapper')[0].innerHTML += this.responseText;
+            initCommunityUsers();
+        }
+        else if(this.readyState === 4 && this.status === 204)
+        {
+            document.getElementById('load-more-posts-button').style.display = 'none';
+        }
+        else if (this.readyState === 4){
+            wiiuErrorViewer.openByCodeAndMessage(5983000 + this.status, 'Error: "' + this.statusText + '"\nPlease send code to Jemma on Discord with what you were doing');
+        }
+    };
+    xhttp.open("GET", '/activity-feed/loadposts?postID=' + postID, true);
+    xhttp.send();
+
+    wiiuSound.playSoundByName("SE_WAVE_MENU", 1);
+    wiiuBrowser.showLoadingIcon(!1);
+}
 function switchUserPageTabs(type) {
     document.getElementById('user-page-posts-tab').classList.remove('selected');
     document.getElementById('user-page-friends-tab').classList.remove('selected');

src/webfiles/portal/more_posts.ejs

@@ -10,7 +10,7 @@
         <h2 class="community-page-post-username" data-pjax="/users/show?pid=<%= post.pid %>"><%= post.screen_name %></h2>
         <h4 class="community-page-post-time-stamp"><%= moment(post.created_at).fromNow() %> - <%= communityMap.get(post.title_id) %></h4>
         <div class="community-page-post-yeah-button-wrapper <%if(user.likes.indexOf(post.id) !== -1){ %> selected <%}%>">
-            <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, <%= post.id %>)"></div>
+            <div class="community-page-post-yeah-button" onclick="yeah(this.parentNode, '<%= post.id %>')"></div>
         </div>
         <div id="yeah-<%= post.id %>" class="community-page-post-yeah-count"><%= post.empathy_count %> Yeahs</div>
     </div>

src/webfiles/portal/user_page.ejs

@@ -33,11 +33,11 @@
     <div class="community-page-info-container">
         <%if(parentUser.followed_users.indexOf(user.pid) !== -1){ %>
             <div class="user-page-follow-button-wrapper selected" <%if(parentUser.pid === 1000000000) {%> style="display: none" <%}%>>
-                <p class="user-page-follow-button-text" id="<%= user.pid %>" data-pjax="/users/show?pid=<%=user.pid%>" style="color: #FFFFFF">Following</p>
+                <p class="user-page-follow-button-text" id="<%= user.pid %>" onclick="followUser(this)" style="color: #FFFFFF">Following</p>
             </div>
         <%} else {%>
             <div class="user-page-follow-button-wrapper" <%if(parentUser.pid === 1000000000) {%> style="display: none" <%}%>>
-                <p class="user-page-follow-button-text" id="<%= user.pid %>" data-pjax="/users/show?pid=<%=user.pid%>">Follow User</p>
+                <p class="user-page-follow-button-text" id="<%= user.pid %>" onclick="followUser(this)">Follow User</p>
             </div>
         <%}%>
         <img class="community-page-info-icon" src="<%= user.pfp_uri %>">