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:
parent
bcde0c6dc7
commit
43a8c006a1
5 changed files with 55 additions and 13 deletions
|
@ -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!",
|
||||||
|
|
|
@ -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];
|
|
||||||
}
|
|
||||||
}
|
}
|
|
@ -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)
|
||||||
),
|
),
|
||||||
];
|
];
|
||||||
}
|
}
|
39
app/views/home/loggedIn.js
Normal file
39
app/views/home/loggedIn.js
Normal 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>`,
|
||||||
|
];
|
||||||
|
}
|
|
@ -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>
|
||||||
|
|
Loading…
Add table
Reference in a new issue