diff --git a/src/web/app/desktop/router.js b/src/web/app/desktop/router.js new file mode 100644 index 000000000..f4d2ec347 --- /dev/null +++ b/src/web/app/desktop/router.js @@ -0,0 +1,74 @@ +/** + * Desktop App Router + */ + +const riot = require('riot'); +const route = require('page'); +let page = null; + +module.exports = me => { + route('/', index); + route('/i>mentions', mentions); + route('/post::post', post); + route('/search::query', search); + route('/:user', user.bind(null, 'home')); + route('/:user/graphs', user.bind(null, 'graphs')); + route('/:user/:post', post); + route('*', notFound); + + function index() { + me ? home() : entrance(); + } + + function home() { + mount(document.createElement('mk-home-page')); + } + + function entrance() { + mount(document.createElement('mk-entrance')); + document.documentElement.setAttribute('data-page', 'entrance'); + } + + function mentions() { + const el = document.createElement('mk-home-page'); + el.setAttribute('mode', 'mentions'); + mount(el); + } + + function search(ctx) { + const el = document.createElement('mk-search-page'); + el.setAttribute('query', ctx.params.query); + mount(el); + } + + function user(page, ctx) { + const el = document.createElement('mk-user-page'); + el.setAttribute('user', ctx.params.user); + el.setAttribute('page', page); + mount(el); + } + + function post(ctx) { + const el = document.createElement('mk-post-page'); + el.setAttribute('post', ctx.params.post); + mount(el); + } + + function notFound() { + mount(document.createElement('mk-not-found')); + } + + riot.mixin('page', { + page: route + }); + + // EXEC + route(); +}; + +function mount(content) { + document.documentElement.removeAttribute('data-page'); + if (page) page.unmount(); + const body = document.getElementById('app'); + page = riot.mount(body.appendChild(content))[0]; +} diff --git a/src/web/app/desktop/router.ls b/src/web/app/desktop/router.ls deleted file mode 100644 index 02a7e1181..000000000 --- a/src/web/app/desktop/router.ls +++ /dev/null @@ -1,77 +0,0 @@ -# Router -#================================ - -riot = require \riot -route = require \page -page = null - -module.exports = (me) ~> - - # Routing - #-------------------------------- - - route \/ index - route \/i>mentions mentions - route \/post::post post - route \/search::query search - route \/:user user.bind null \home - route \/:user/graphs user.bind null \graphs - route \/:user/:post post - route \* not-found - - # Handlers - #-------------------------------- - - function index - if me? then home! else entrance! - - function home - mount document.create-element \mk-home-page - - function entrance - mount document.create-element \mk-entrance - document.document-element.set-attribute \data-page \entrance - - function mentions - document.create-element \mk-home-page - ..set-attribute \mode \mentions - .. |> mount - - function search ctx - document.create-element \mk-search-page - ..set-attribute \query ctx.params.query - .. |> mount - - function user page, ctx - document.create-element \mk-user-page - ..set-attribute \user ctx.params.user - ..set-attribute \page page - .. |> mount - - function post ctx - document.create-element \mk-post-page - ..set-attribute \post ctx.params.post - .. |> mount - - function not-found - mount document.create-element \mk-not-found - - # Register mixin - #-------------------------------- - - riot.mixin \page do - page: route - - # Exec - #-------------------------------- - - route! - -# Mount -#================================ - -function mount content - document.document-element.remove-attribute \data-page - if page? then page.unmount! - body = document.get-element-by-id \app - page := riot.mount body.append-child content .0 diff --git a/src/web/app/desktop/script.js b/src/web/app/desktop/script.js index 845e6c495..b63f712f6 100644 --- a/src/web/app/desktop/script.js +++ b/src/web/app/desktop/script.js @@ -5,9 +5,9 @@ require('chart.js'); require('./tags'); const riot = require('riot'); -const boot = require('../boot.js'); +const boot = require('../boot'); const mixins = require('./mixins.ls'); -const route = require('./router.ls'); +const route = require('./router'); const fuckAdBlock = require('./scripts/fuck-ad-block.ls'); /**