Alamantus
/
Readlebee
mirror of https://gitlab.com/Alamantus/Readlebee.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Use i18n as example in views

This commit is contained in:
Robbie Antenesse 2019-09-09 17:08:11 -06:00
parent 64bda6f982
commit 951d07e11f
3 changed files with 20 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/views/home/index.js
View File

@ -1,31 +1,33 @@
import html from 'choo/html';
import { I18n } from '../../i18n';
import './styles.scss'; // Creates a separate CSS file, but allows better code splitting.
// We'll see if code splitting is worth it in the end or if we should combine everything into `src/index.scss`
import { HomeController } from './controller'; // The controller for this view, where processing should happen.
// This is the view function that is exported and used in the view manager.
export const homeView = (state, emit) => {
const i18n = new I18n(state);
const controller = new HomeController(state);
// Returning an array in a view allows non-shared parent HTML elements.
// This one doesn't have the problem right now, but it's good to remember.
return [
html`<section>
<h2 class="subtitle">An attempt at a viable alternative to Goodreads</h2>
<h2 class="subtitle">${i18n.__('home.subtitle')}</h2>
<article class="flex two">
<div class="half">
<div class="card">
<header>
<p>Still gotta figure out a design.</p>
<p>${i18n.__('home.temp_left')}</p>
</header>
</div>
</div>
<div class="half">
<div class="card">
<header>
<p>It's early days, my friends!</p>
<p>${i18n.__('home.temp_right')}</p>
</header>
</div>
</div>

10
app/views/login/index.js
View File

@ -1,19 +1,23 @@
import html from 'choo/html';
import { I18n } from '../../i18n';
export const loginView = (state, emit) => {
const i18n = new I18n(state);
return html`<section>
<article class="card">
<div class="container wide">
<label>
<span>Email</span>
<span>${i18n.__('login.email')}</span>
<input type="email" name="email">
</label>
<label>
<span>Password</span>
<span>${i18n.__('login.password')}</span>
<input type="password" name="password">
</label>
<input type="submit" value="Log In!">
<input type="submit" value="${i18n.__('login.login_button')}">
</div>
</article>

15
app/views/search/index.js
View File

@ -1,23 +1,24 @@
import html from 'choo/html';
// We'll see if code splitting is worth it in the end or if we should combine everything into `src/index.scss`
import { I18n } from '../../i18n';
import { SearchController } from './controller'; // The controller for this view, where processing should happen.
// This is the view function that is exported and used in the view manager.
export const searchView = (state, emit) => {
const i18n = new I18n(state);
const controller = new SearchController(state);
if (!controller.state.done && controller.hasQuery) {
controller.searchOpenLibrary(state.query.for).then(() => {
emit('render');
});
}
// if (!controller.state.done && controller.hasQuery) {
// controller.searchOpenLibrary(state.query.for).then(() => {
// emit('render');
// });
// }
// Returning an array in a view allows non-shared parent HTML elements.
// This one doesn't have the problem right now, but it's good to remember.
return [
html`<section>
<h2 class="subtitle">An attempt at a viable alternative to Goodreads</h2>
<h2 class="subtitle">${i18n.__('search.header')}</h2>
<article>
${controller.results.map(result => {