Simplify the gallery router by removing an unnecessary Event class

This commit is contained in:
Timothy Farrell 2018-07-19 23:52:28 -05:00
parent f08476e7ec
commit faec6dcc69
3 changed files with 13 additions and 57 deletions

View File

@ -13,17 +13,17 @@ import { FocusView } from './focus.js';
import { Dropzone } from './components/dropzone.js'; import { Dropzone } from './components/dropzone.js';
import { Overlay } from './components/overlay.js'; import { Overlay } from './components/overlay.js';
import { Icon } from './components/icon.js'; import { Icon } from './components/icon.js';
import { routeChanged } from '../services/router.js'; import { currentRoute } from '../services/router.js';
import { injectStyle, styled } from '../utils/style.js'; import { injectStyle, styled } from '../utils/style.js';
import { FILL_STYLE } from './styles.js'; import { FILL_STYLE } from './styles.js';
export function GalleryView(vm) { export function GalleryView(vm) {
const routeName = prop(); let routeName;
const routeParams = prop(); let routeParams;
routeChanged.subscribe(function onRouteChange(name, params) { currentRoute.subscribe(([name, params]) => {
routeName(name); routeName = name;
routeParams(params); routeParams = params;
vm.redraw(); vm.redraw();
}); });
@ -33,9 +33,9 @@ export function GalleryView(vm) {
renderSwitch( renderSwitch(
{ {
photos: [AllImagesView, {}, 'allImages'], photos: [AllImagesView, {}, 'allImages'],
focus: [FocusView, routeParams(), `focus_${routeParams() && routeParams().id}`] focus: [FocusView, routeParams, `focus_${routeParams && routeParams.id}`]
}, },
routeName() routeName
) )
]) ])
]; ];

View File

@ -1,15 +1,13 @@
import { Router } from 'router'; import { Router } from 'router';
import { Event } from '../utils/event.js'; import { prop } from 'frptools';
export const routeChanged = new Event('Router.newRoute'); export const currentRoute = prop([], r => r[1] && r[1].path);
const fire = routeChanged.fire.bind(routeChanged);
export const router = Router([ export const router = Router([
{ {
name: 'home', name: 'home',
path: '/', path: '/',
enter: (r, route) => fire('photos', route) enter: (r, route) => currentRoute(['photos', route])
}, },
{ {
name: 'focus', name: 'focus',
@ -17,7 +15,7 @@ export const router = Router([
vars: { vars: {
id: /[_A-Za-z0-9]+/ id: /[_A-Za-z0-9]+/
}, },
enter: (r, route) => fire('focus', route) enter: (r, route) => currentRoute(['focus', route])
}, },
{ {
id: '404', id: '404',

View File

@ -1,46 +1,4 @@
import { log, error, group, groupEnd } from '../utils/console.js'; import { log, group, groupEnd } from '../utils/console.js';
export class Event {
constructor(name) {
this.name = name;
this.stages = [];
}
async fire(...args) {
const groupName = `Feeding pipeline "${this.name}"`;
group(groupName);
log('params:', ...args);
let i = this.stages.length;
const _next = async res => {
if (!i) {
groupEnd(groupName);
return res;
}
i -= 1;
const stage = this.stages[i];
try {
const result = stage(...args);
if (result && result.then) {
return result.then(_next);
}
return Promise.resolve(result).then(_next);
} catch (e) {
const stageName = stage.name || '<anonymous function>';
error(`${stageName} threw error:`, e);
}
};
return await _next();
}
subscribe(callback, position = 0) {
this.stages.splice(position, 0, callback);
}
unsubscribe(callback) {
this.stages.splice(this.stages.indexOf(callback), 1);
}
}
// requestIdleCallback sortof-polyfill // requestIdleCallback sortof-polyfill
if (!global.requestIdleCallback) { if (!global.requestIdleCallback) {