1
0
Fork 0
mirror of https://gitlab.com/Alamantus/Readlebee.git synced 2025-06-09 10:56:38 +02:00

Add loggedIn view for home page

This commit is contained in:
Robbie Antenesse 2019-10-17 20:56:57 -06:00
parent bcde0c6dc7
commit 43a8c006a1
5 changed files with 55 additions and 13 deletions

View file

@ -16,7 +16,10 @@
"logged_out_community_header": "A Look Inside the Hive", "logged_out_community_header": "A Look Inside the Hive",
"logged_out_recent_reviews": "Recent Reviews", "logged_out_recent_reviews": "Recent Reviews",
"logged_out_recent_updates": "Recent Updates", "logged_out_recent_updates": "Recent Updates",
"logged_out_join_now": "Join Now!" "logged_out_join_now": "Join Now!",
"logged_in_subtitle": "Welcome!",
"logged_in_updates": "Updates",
"logged_in_interactions": "Interactions"
}, },
"404": { "404": {
"header": "Oops!", "header": "Oops!",

View file

@ -5,19 +5,18 @@ export class HomeController extends ViewController {
// Super passes state, view name, and default state to ViewController, // Super passes state, view name, and default state to ViewController,
// which stores state in this.appState and the view controller's state to this.state // which stores state in this.appState and the view controller's state to this.state
super(state, i18n, 'home', { super(state, i18n, 'home', {
loggedOut: {
recentReviews: [], recentReviews: [],
recentUpdates: [], recentUpdates: [],
},
loggedIn: {
updates: [], // statuses, ratings, and reviews from people you follow.
interactions: [], // likes, comments, recommendations, etc.
},
}); });
// If using controller methods in an input's onchange or onclick instance, // If using controller methods in an input's onchange or onclick instance,
// either bind the class's 'this' instance to the method first... // either bind the class's 'this' instance to the method first...
// or use `onclick=${() => controller.submit()}` to maintain the 'this' of the class instead. // or use `onclick=${() => controller.submit()}` to maintain the 'this' of the class instead.
} }
get recentReviews() {
return [...this.state.recentReviews];
}
get recentUpdates() {
return [...this.state.recentUpdates];
}
} }

View file

@ -2,6 +2,7 @@ import html from 'choo/html';
import { HomeController } from './controller'; // The controller for this view, where processing should happen. import { HomeController } from './controller'; // The controller for this view, where processing should happen.
import { loggedOutView } from './loggedOut'; import { loggedOutView } from './loggedOut';
import { loggedInView } from './loggedIn';
// This is the view function that is exported and used in the view manager. // This is the view function that is exported and used in the view manager.
export const homeView = (state, emit, i18n) => { export const homeView = (state, emit, i18n) => {
@ -12,7 +13,7 @@ export const homeView = (state, emit, i18n) => {
return [ return [
(!controller.isLoggedIn (!controller.isLoggedIn
? loggedOutView(controller, emit) ? loggedOutView(controller, emit)
: html`<p>lol wut how are u logged in</p>` : loggedInView(controller, emit)
), ),
]; ];
} }

View file

@ -0,0 +1,39 @@
import html from 'choo/html';
export const loggedInView = (homeController, emit) => {
const { __ } = homeController.i18n;
return [
html`<section>
<h2>${__('home.logged_in_subtitle')}</h2>
<div class="flex one two-700">
<div>
<div class="card">
<header>
<h3>${__('home.logged_in_updates')}</h3>
<button class="small pseudo pull-right tooltip-left" data-tooltip=${__('interaction.reload')}>
<i class="icon-reload"></i>
</button>
</header>
<footer>
${homeController.state.loggedIn.updates.map(update => reviewCard(homeController, update))}
</footer>
</div>
</div>
<div>
<div class="card">
<header>
<h3>${__('home.logged_in_interactions')}</h3>
<button class="small pseudo pull-right tooltip-left" data-tooltip=${__('interaction.reload')}>
<i class="icon-reload"></i>
</button>
</header>
<footer>
${homeController.state.loggedIn.interactions.map(interaction => reviewCard(homeController, interaction))}
</footer>
</div>
</div>
</div>
</section>`,
];
}

View file

@ -57,7 +57,7 @@ export const loggedOutView = (homeController, emit) => {
</button> </button>
</header> </header>
<footer> <footer>
${homeController.recentReviews.map(review => reviewCard(homeController, review))} ${homeController.state.loggedOut.recentReviews.map(review => reviewCard(homeController, review))}
</footer> </footer>
</div> </div>
</div> </div>
@ -70,7 +70,7 @@ export const loggedOutView = (homeController, emit) => {
</button> </button>
</header> </header>
<footer> <footer>
${homeController.recentUpdates.map(review => reviewCard(homeController, review))} ${homeController.state.loggedOut.recentUpdates.map(update => reviewCard(homeController, update))}
</footer> </footer>
</div> </div>
</div> </div>