diff --git a/src/web/app/mobile/router.js b/src/web/app/mobile/router.js new file mode 100644 index 000000000..df4871f29 --- /dev/null +++ b/src/web/app/mobile/router.js @@ -0,0 +1,136 @@ +/** + * Mobile App Router + */ + +const riot = require('riot'); +const route = require('page'); +let page = null; + +module.exports = me => { + route('/', index); + route('/i/notifications', notifications); + route('/i/messaging', messaging); + route('/i/messaging/:username', messaging); + route('/i/drive', drive); + route('/i/drive/folder/:folder', drive); + route('/i/drive/file/:file', drive); + route('/i/settings', settings); + route('/i/settings/signin-history', settingsSignin); + route('/i/settings/api', settingsApi); + route('/i/settings/twitter', settingsTwitter); + route('/i/settings/authorized-apps', settingsAuthorizedApps); + route('/post/new', newPost); + route('/post::post', post); + route('/search::query', search); + route('/:user', user.bind(null, 'posts')); + route('/:user/graphs', user.bind(null, 'graphs')); + route('/:user/followers', userFollowers); + route('/:user/following', userFollowing); + 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')); + } + + function notifications() { + mount(document.createElement('mk-notifications-page')); + } + + function messaging(ctx) { + if (ctx.params.username) { + const el = document.createElement('mk-messaging-room-page'); + el.setAttribute('username', ctx.params.username); + mount(el); + } else { + mount(document.createElement('mk-messaging-page')); + } + } + + function newPost() { + mount(document.createElement('mk-new-post-page')); + } + + function settings() { + mount(document.createElement('mk-settings-page')); + } + + function settingsSignin() { + mount(document.createElement('mk-signin-history-page')); + } + + function settingsApi() { + mount(document.createElement('mk-api-info-page')); + } + + function settingsTwitter() { + mount(document.createElement('mk-twitter-setting-page')); + } + + function settingsAuthorizedApps() { + mount(document.createElement('mk-authorized-apps-page')); + } + + 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 userFollowing(ctx) { + const el = document.createElement('mk-user-following-page'); + el.setAttribute('user', ctx.params.user); + mount(el); + } + + function userFollowers(ctx) { + const el = document.createElement('mk-user-followers-page'); + el.setAttribute('user', ctx.params.user); + mount(el); + } + + function post(ctx) { + const el = document.createElement('mk-post-page'); + el.setAttribute('post', ctx.params.post); + mount(el); + } + + function drive(ctx) { + const el = document.createElement('mk-drive-page'); + if (ctx.params.folder) el.setAttribute('folder', ctx.params.folder); + if (ctx.params.file) el.setAttribute('file', ctx.params.file); + mount(el); + } + + function notFound() { + mount(document.createElement('mk-not-found')); + } + + riot.mixin('page', { + page: route + }); + + // EXEC + route(); +}; + +function mount(content) { + if (page) page.unmount(); + const body = document.getElementById('app'); + page = riot.mount(body.appendChild(content))[0]; +} diff --git a/src/web/app/mobile/router.ls b/src/web/app/mobile/router.ls deleted file mode 100644 index 3c0cb4223..000000000 --- a/src/web/app/mobile/router.ls +++ /dev/null @@ -1,138 +0,0 @@ -# Router -#================================ - -riot = require \riot -route = require \page -page = null - -module.exports = (me) ~> - - # Routing - #-------------------------------- - - route \/ index - route \/i/notifications notifications - route \/i/messaging messaging - route \/i/messaging/:username messaging - route \/i/drive drive - route \/i/drive/folder/:folder drive - route \/i/drive/file/:file drive - route \/i/settings settings - route \/i/settings/signin-history settings-signin - route \/i/settings/api settings-api - route \/i/settings/twitter settings-twitter - route \/i/settings/authorized-apps settings-authorized-apps - route \/post/new new-post - route \/post::post post - route \/search::query search - route \/:user user.bind null \posts - route \/:user/graphs user.bind null \graphs - route \/:user/followers user-followers - route \/:user/following user-following - 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 - - # 通知 - function notifications - mount document.create-element \mk-notifications-page - - # メッセージ - function messaging ctx - if ctx.params.username - p = document.create-element \mk-messaging-room-page - p.set-attribute \username ctx.params.username - mount p - else - mount document.create-element \mk-messaging-page - - # 新規投稿 - function new-post - mount document.create-element \mk-new-post-page - - # 設定 - function settings - mount document.create-element \mk-settings-page - function settings-signin - mount document.create-element \mk-signin-history-page - function settings-api - mount document.create-element \mk-api-info-page - function settings-twitter - mount document.create-element \mk-twitter-setting-page - function settings-authorized-apps - mount document.create-element \mk-authorized-apps-page - - # 検索 - 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 user-following ctx - document.create-element \mk-user-following-page - ..set-attribute \user ctx.params.user - .. |> mount - - # フォロワー一覧 - function user-followers ctx - document.create-element \mk-user-followers-page - ..set-attribute \user ctx.params.user - .. |> mount - - # 投稿詳細ページ - function post ctx - document.create-element \mk-post-page - ..set-attribute \post ctx.params.post - .. |> mount - - # ドライブ - function drive ctx - p = document.create-element \mk-drive-page - if ctx.params.folder then p.set-attribute \folder ctx.params.folder - if ctx.params.file then p.set-attribute \file ctx.params.file - mount p - - # not found - function not-found - mount document.create-element \mk-not-found - - # Register mixin - #-------------------------------- - - riot.mixin \page do - page: route - - # Exec - #-------------------------------- - - route! - -# Mount -#================================ - -function mount content - 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/mobile/script.js b/src/web/app/mobile/script.js index db4bff450..6f732da9c 100644 --- a/src/web/app/mobile/script.js +++ b/src/web/app/mobile/script.js @@ -3,9 +3,9 @@ */ require('./tags'); -const boot = require('../boot.js'); +const boot = require('../boot'); const mixins = require('./mixins'); -const route = require('./router.ls'); +const route = require('./router'); /** * Boot