Improve Choo routing for viewmanager
This commit is contained in:
parent
3507b7ea2f
commit
0c6c6dd938
|
@ -39,5 +39,7 @@ app.use((state, emitter) => {
|
|||
// which is given the app's state from above and the emitter.emit method that
|
||||
// triggers the app's emitter listeners.
|
||||
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
|
|
@ -7,10 +7,7 @@ export const viewManager = (state, emit) => {
|
|||
// In viewManager all we are doing is checking the app's state
|
||||
// and passing the state and emit to the relevant view.
|
||||
let htmlContent = html`<div>loading</div>`;
|
||||
if (state.query.hasOwnProperty('search')) {
|
||||
state.currentView = 'search'; // Override view if there's a search query
|
||||
}
|
||||
switch (state.currentView) {
|
||||
switch (state.params.page) {
|
||||
case 'home':
|
||||
default: {
|
||||
htmlContent = homeView(state, emit);
|
||||
|
@ -37,11 +34,12 @@ export const viewManager = (state, emit) => {
|
|||
<label for="navMenu" class="burger pseudo button">≡</label>
|
||||
|
||||
<div class="menu">
|
||||
<form method="GET" style="display:inline-block;">
|
||||
<label>
|
||||
<input type="text" name="search" placeholder="Search">
|
||||
</label>
|
||||
</form>
|
||||
<label style="display: inline-block;">
|
||||
<input type="text" name="search" placeholder="Search" onchange=${e => {
|
||||
console.log(encodeURIComponent(e.target.value.trim()));
|
||||
emit('pushState', '/search?for=' + encodeURIComponent(e.target.value.trim()));
|
||||
}}>
|
||||
</label>
|
||||
<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>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue