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

Improve Choo routing for viewmanager

This commit is contained in:
Robbie Antenesse 2019-09-05 13:47:16 -06:00
parent 3507b7ea2f
commit 0c6c6dd938
2 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/index.js
View File

@ -39,5 +39,7 @@ app.use((state, emitter) => {
// which is given the app's state from above and the emitter.emit method that // which is given the app's state from above and the emitter.emit method that
// triggers the app's emitter listeners. // triggers the app's emitter listeners.
app.route('/', viewManager); app.route('/', viewManager);
app.route('/:page', viewManager);
app.route('/404', viewManager);
app.mount('body'); // Overwrite the `<body>` tag with the content of the Choo app app.mount('body'); // Overwrite the `<body>` tag with the content of the Choo app

16
src/views/manager.js
View File

@ -7,10 +7,7 @@ export const viewManager = (state, emit) => {
// In viewManager all we are doing is checking the app's state // In viewManager all we are doing is checking the app's state
// and passing the state and emit to the relevant view. // and passing the state and emit to the relevant view.
let htmlContent = html`<div>loading</div>`; let htmlContent = html`<div>loading</div>`;
if (state.query.hasOwnProperty('search')) { switch (state.params.page) {
state.currentView = 'search'; // Override view if there's a search query
}
switch (state.currentView) {
case 'home': case 'home':
default: { default: {
htmlContent = homeView(state, emit); htmlContent = homeView(state, emit);
@ -37,11 +34,12 @@ export const viewManager = (state, emit) => {
<label for="navMenu" class="burger pseudo button">&#8801;</label> <label for="navMenu" class="burger pseudo button">&#8801;</label>
<div class="menu"> <div class="menu">
<form method="GET" style="display:inline-block;"> <label style="display: inline-block;">
<label> <input type="text" name="search" placeholder="Search" onchange=${e => {
<input type="text" name="search" placeholder="Search"> console.log(encodeURIComponent(e.target.value.trim()));
</label> emit('pushState', '/search?for=' + encodeURIComponent(e.target.value.trim()));
</form> }}>
</label>
<a href="https://gitlab.com/Alamantus/book-tracker" class="pseudo button">Repo</a> <a href="https://gitlab.com/Alamantus/book-tracker" class="pseudo button">Repo</a>
<a href="https://gitter.im/book-tracker/general" class="pseudo button">Chat</a> <a href="https://gitter.im/book-tracker/general" class="pseudo button">Chat</a>
</div> </div>