Simplify the gallery router by removing an unnecessary Event class
This commit is contained in:
parent
7b51e67eab
commit
5d7d23688d
@ -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
|
||||||
)
|
)
|
||||||
])
|
])
|
||||||
];
|
];
|
||||||
|
|||||||
@ -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',
|
||||||
|
|||||||
@ -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) {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user