From d9e90e97f811e48cefa81285911b26501f9aff87 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Feb 2017 08:37:30 +0900 Subject: :v: --- src/web/app/mobile/mixins.js | 23 +++++++++++++++++++++++ src/web/app/mobile/mixins.ls | 19 ------------------- src/web/app/mobile/script.js | 2 +- 3 files changed, 24 insertions(+), 20 deletions(-) create mode 100644 src/web/app/mobile/mixins.js delete mode 100644 src/web/app/mobile/mixins.ls (limited to 'src/web/app/mobile') diff --git a/src/web/app/mobile/mixins.js b/src/web/app/mobile/mixins.js new file mode 100644 index 0000000000..6d16260070 --- /dev/null +++ b/src/web/app/mobile/mixins.js @@ -0,0 +1,23 @@ +const riot = require('riot'); + +module.exports = me => { + if (me) { + require('./scripts/stream.ls')(me); + } + + require('./scripts/ui.ls'); + + riot.mixin('open-post-form', { + openPostForm: opts => { + const app = document.getElementById('app'); + app.style.display = 'none'; + const form = riot.mount(document.body.appendChild(document.createElement('mk-post-form')), opts)[0]; + function recover() { + app.style.display = 'block'; + } + form + .on('cancel', recover) + .on('post', recover); + } + }); +}; diff --git a/src/web/app/mobile/mixins.ls b/src/web/app/mobile/mixins.ls deleted file mode 100644 index 902774f91a..0000000000 --- a/src/web/app/mobile/mixins.ls +++ /dev/null @@ -1,19 +0,0 @@ -riot = require \riot - -module.exports = (me) ~> - if me? - (require './scripts/stream.ls') me - - require './scripts/ui.ls' - - riot.mixin \open-post-form do - open-post-form: (opts) -> - app = document.get-element-by-id \app - app.style.display = \none - form = document.body.append-child document.create-element \mk-post-form - form = riot.mount form, opts .0 - form.on \cancel recover - form.on \post recover - - function recover - app.style.display = \block diff --git a/src/web/app/mobile/script.js b/src/web/app/mobile/script.js index e22b4b6432..db4bff4501 100644 --- a/src/web/app/mobile/script.js +++ b/src/web/app/mobile/script.js @@ -4,7 +4,7 @@ require('./tags'); const boot = require('../boot.js'); -const mixins = require('./mixins.ls'); +const mixins = require('./mixins'); const route = require('./router.ls'); /** -- cgit v1.2.3-freya From ba5896497105ffdac2c802da64d03ea0c09ec132 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Feb 2017 09:00:14 +0900 Subject: :v: --- src/web/app/mobile/router.js | 136 ++++++++++++++++++++++++++++++++++++++++++ src/web/app/mobile/router.ls | 138 ------------------------------------------- src/web/app/mobile/script.js | 4 +- 3 files changed, 138 insertions(+), 140 deletions(-) create mode 100644 src/web/app/mobile/router.js delete mode 100644 src/web/app/mobile/router.ls (limited to 'src/web/app/mobile') diff --git a/src/web/app/mobile/router.js b/src/web/app/mobile/router.js new file mode 100644 index 0000000000..df4871f292 --- /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 3c0cb42236..0000000000 --- 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 db4bff4501..6f732da9cc 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 -- cgit v1.2.3-freya From 4770e1fab89b35671f9fd1eb3080efca717e27ac Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Feb 2017 13:18:59 +0900 Subject: :v: --- src/web/app/common/scripts/stream.js | 39 +++++++++++++++++++++++++++++++++++ src/web/app/common/scripts/stream.ls | 39 ----------------------------------- src/web/app/desktop/scripts/stream.ls | 4 ++-- src/web/app/mobile/scripts/stream.ls | 2 +- 4 files changed, 42 insertions(+), 42 deletions(-) create mode 100644 src/web/app/common/scripts/stream.js delete mode 100644 src/web/app/common/scripts/stream.ls (limited to 'src/web/app/mobile') diff --git a/src/web/app/common/scripts/stream.js b/src/web/app/common/scripts/stream.js new file mode 100644 index 0000000000..b31e570444 --- /dev/null +++ b/src/web/app/common/scripts/stream.js @@ -0,0 +1,39 @@ +const ReconnectingWebSocket = require('reconnecting-websocket'); +const riot = require('riot'); + +module.exports = me => { + let state = 'initializing'; + const stateEv = riot.observable(); + const event = riot.observable(); + const host = CONFIG.api.url.replace('http', 'ws'); + const socket = new ReconnectingWebSocket(`${host}?i=${me.token}`); + + socket.onopen = () => { + state = 'connected'; + stateEv.trigger('connected'); + }; + + socket.onclose = () => { + state = 'reconnecting'; + stateEv.trigger('closed'); + }; + + socket.onmessage = message => { + try { + const message = JSON.parse(message.data); + if (message.type) { + event.trigger(message.type, message.body); + } + } catch (e) { + // noop + } + }; + + event.on('i_updated', me.update); + + return { + stateEv: stateEv, + getState: () => state, + event: event + }; +}; diff --git a/src/web/app/common/scripts/stream.ls b/src/web/app/common/scripts/stream.ls deleted file mode 100644 index c2c061603e..0000000000 --- a/src/web/app/common/scripts/stream.ls +++ /dev/null @@ -1,39 +0,0 @@ -# Stream -#================================ - -ReconnectingWebSocket = require \reconnecting-websocket -riot = require \riot - -module.exports = (me) ~> - state = \initializing - state-ev = riot.observable! - event = riot.observable! - - host = CONFIG.api.url.replace \http \ws - socket = new ReconnectingWebSocket "#{host}?i=#{me.token}" - - socket.onopen = ~> - state := \connected - state-ev.trigger \connected - - socket.onclose = ~> - state := \reconnecting - state-ev.trigger \closed - - socket.onmessage = (message) ~> - try - message = JSON.parse message.data - if message.type? - event.trigger message.type, message.body - catch - # ignore - - get-state = ~> state - - event.on \i_updated me.update - - { - state-ev - get-state - event - } diff --git a/src/web/app/desktop/scripts/stream.ls b/src/web/app/desktop/scripts/stream.ls index f84d6097a7..88dac16cb6 100644 --- a/src/web/app/desktop/scripts/stream.ls +++ b/src/web/app/desktop/scripts/stream.ls @@ -1,8 +1,8 @@ # Stream #================================ -stream = require '../../common/scripts/stream.ls' -get-post-summary = require '../../common/scripts/get-post-summary.ls' +stream = require '../../common/scripts/stream' +get-post-summary = require '../../common/scripts/get-post-summary' riot = require \riot module.exports = (me) ~> diff --git a/src/web/app/mobile/scripts/stream.ls b/src/web/app/mobile/scripts/stream.ls index b7810b49ae..28418d7788 100644 --- a/src/web/app/mobile/scripts/stream.ls +++ b/src/web/app/mobile/scripts/stream.ls @@ -1,7 +1,7 @@ # Stream #================================ -stream = require '../../common/scripts/stream.ls' +stream = require '../../common/scripts/stream' riot = require \riot module.exports = (me) ~> -- cgit v1.2.3-freya From 2db313986aa494da3d6ba3ac2773002ee1b2b8fe Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Feb 2017 13:23:23 +0900 Subject: :v: --- src/web/app/desktop/mixins.ls | 2 +- src/web/app/desktop/scripts/stream.js | 45 +++++++++++++++++++++++++++++++++++ src/web/app/desktop/scripts/stream.ls | 38 ----------------------------- src/web/app/mobile/mixins.js | 2 +- src/web/app/mobile/scripts/stream.js | 11 +++++++++ src/web/app/mobile/scripts/stream.ls | 13 ---------- 6 files changed, 58 insertions(+), 53 deletions(-) create mode 100644 src/web/app/desktop/scripts/stream.js delete mode 100644 src/web/app/desktop/scripts/stream.ls create mode 100644 src/web/app/mobile/scripts/stream.js delete mode 100644 src/web/app/mobile/scripts/stream.ls (limited to 'src/web/app/mobile') diff --git a/src/web/app/desktop/mixins.ls b/src/web/app/desktop/mixins.ls index b099b45165..054acbe745 100644 --- a/src/web/app/desktop/mixins.ls +++ b/src/web/app/desktop/mixins.ls @@ -2,7 +2,7 @@ riot = require \riot module.exports = (me) ~> if me? - (require './scripts/stream.ls') me + (require './scripts/stream') me require './scripts/user-preview.ls' diff --git a/src/web/app/desktop/scripts/stream.js b/src/web/app/desktop/scripts/stream.js new file mode 100644 index 0000000000..ea1548ecfd --- /dev/null +++ b/src/web/app/desktop/scripts/stream.js @@ -0,0 +1,45 @@ +const stream = require('../../common/scripts/stream'); +const getPostSummary = require('../../common/scripts/get-post-summary'); +const riot = require('riot'); + +module.exports = me => { + const s = stream(me); + + s.event.on('drive_file_created', file => { + const n = new Notification('ファイルがアップロードされました', { + body: file.name, + icon: file.url + '?thumbnail&size=64' + }); + setTimeout(n.close.bind(n), 5000); + }); + + s.event.on('mention', post => { + const n = new Notification(post.user.name + "さんから:", { + body: getPostSummary(post), + icon: post.user.avatar_url + '?thumbnail&size=64' + }); + setTimeout(n.close.bind(n), 6000); + }); + + s.event.on('reply', post => { + const n = new Notification(post.user.name + "さんから返信:", { + body: getPostSummary(post), + icon: post.user.avatar_url + '?thumbnail&size=64' + }); + setTimeout(n.close.bind(n), 6000); + }); + + s.event.on('quote', post => { + const n = new Notification(post.user.name + "さんが引用:", { + body: getPostSummary(post), + icon: post.user.avatar_url + '?thumbnail&size=64' + }); + setTimeout(n.close.bind(n), 6000); + }); + + riot.mixin('stream', { + stream: s.event, + getStreamState: s.getState, + streamStateEv: s.stateEv + }); +}; diff --git a/src/web/app/desktop/scripts/stream.ls b/src/web/app/desktop/scripts/stream.ls deleted file mode 100644 index 88dac16cb6..0000000000 --- a/src/web/app/desktop/scripts/stream.ls +++ /dev/null @@ -1,38 +0,0 @@ -# Stream -#================================ - -stream = require '../../common/scripts/stream' -get-post-summary = require '../../common/scripts/get-post-summary' -riot = require \riot - -module.exports = (me) ~> - s = stream me - - s.event.on \drive_file_created (file) ~> - n = new Notification 'ファイルがアップロードされました' do - body: file.name - icon: file.url + '?thumbnail&size=64' - set-timeout (n.close.bind n), 5000ms - - s.event.on \mention (post) ~> - n = new Notification "#{post.user.name}さんから:" do - body: get-post-summary post - icon: post.user.avatar_url + '?thumbnail&size=64' - set-timeout (n.close.bind n), 6000ms - - s.event.on \reply (post) ~> - n = new Notification "#{post.user.name}さんから返信:" do - body: get-post-summary post - icon: post.user.avatar_url + '?thumbnail&size=64' - set-timeout (n.close.bind n), 6000ms - - s.event.on \quote (post) ~> - n = new Notification "#{post.user.name}さんが引用:" do - body: get-post-summary post - icon: post.user.avatar_url + '?thumbnail&size=64' - set-timeout (n.close.bind n), 6000ms - - riot.mixin \stream do - stream: s.event - get-stream-state: s.get-state - stream-state-ev: s.state-ev diff --git a/src/web/app/mobile/mixins.js b/src/web/app/mobile/mixins.js index 6d16260070..cd344d32e0 100644 --- a/src/web/app/mobile/mixins.js +++ b/src/web/app/mobile/mixins.js @@ -2,7 +2,7 @@ const riot = require('riot'); module.exports = me => { if (me) { - require('./scripts/stream.ls')(me); + require('./scripts/stream')(me); } require('./scripts/ui.ls'); diff --git a/src/web/app/mobile/scripts/stream.js b/src/web/app/mobile/scripts/stream.js new file mode 100644 index 0000000000..e12788f60b --- /dev/null +++ b/src/web/app/mobile/scripts/stream.js @@ -0,0 +1,11 @@ +const stream = require('../../common/scripts/stream'); +const riot = require('riot'); + +module.exports = me => { + const s = stream(me); + riot.mixin('stream', { + stream: s.event, + getStreamState: s.getState, + streamStateEv: s.stateEv + }); +}; diff --git a/src/web/app/mobile/scripts/stream.ls b/src/web/app/mobile/scripts/stream.ls deleted file mode 100644 index 28418d7788..0000000000 --- a/src/web/app/mobile/scripts/stream.ls +++ /dev/null @@ -1,13 +0,0 @@ -# Stream -#================================ - -stream = require '../../common/scripts/stream' -riot = require \riot - -module.exports = (me) ~> - s = stream me - - riot.mixin \stream do - stream: s.event - get-stream-state: s.get-state - stream-state-ev: s.state-ev -- cgit v1.2.3-freya From fde6ed60736d688c63bdbc8de2875e2e687f9f16 Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Feb 2017 13:24:39 +0900 Subject: :v: --- src/web/app/mobile/mixins.js | 2 +- src/web/app/mobile/scripts/ui.js | 7 +++++++ src/web/app/mobile/scripts/ui.ls | 6 ------ 3 files changed, 8 insertions(+), 7 deletions(-) create mode 100644 src/web/app/mobile/scripts/ui.js delete mode 100644 src/web/app/mobile/scripts/ui.ls (limited to 'src/web/app/mobile') diff --git a/src/web/app/mobile/mixins.js b/src/web/app/mobile/mixins.js index cd344d32e0..be0e0d155e 100644 --- a/src/web/app/mobile/mixins.js +++ b/src/web/app/mobile/mixins.js @@ -5,7 +5,7 @@ module.exports = me => { require('./scripts/stream')(me); } - require('./scripts/ui.ls'); + require('./scripts/ui'); riot.mixin('open-post-form', { openPostForm: opts => { diff --git a/src/web/app/mobile/scripts/ui.js b/src/web/app/mobile/scripts/ui.js new file mode 100644 index 0000000000..51ab6acd2d --- /dev/null +++ b/src/web/app/mobile/scripts/ui.js @@ -0,0 +1,7 @@ +const riot = require('riot'); + +const ui = riot.observable(); + +riot.mixin('ui', { + ui: ui +}); diff --git a/src/web/app/mobile/scripts/ui.ls b/src/web/app/mobile/scripts/ui.ls deleted file mode 100644 index aa94a8b052..0000000000 --- a/src/web/app/mobile/scripts/ui.ls +++ /dev/null @@ -1,6 +0,0 @@ -riot = require \riot - -ui = riot.observable! - -riot.mixin \ui do - ui: ui -- cgit v1.2.3-freya From cedeba580ee3846230161408f603f72fe169dadf Mon Sep 17 00:00:00 2001 From: syuilo Date: Sat, 18 Feb 2017 13:26:27 +0900 Subject: Improve readability --- src/web/app/mobile/mixins.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'src/web/app/mobile') diff --git a/src/web/app/mobile/mixins.js b/src/web/app/mobile/mixins.js index be0e0d155e..98601a1072 100644 --- a/src/web/app/mobile/mixins.js +++ b/src/web/app/mobile/mixins.js @@ -11,10 +11,12 @@ module.exports = me => { openPostForm: opts => { const app = document.getElementById('app'); app.style.display = 'none'; - const form = riot.mount(document.body.appendChild(document.createElement('mk-post-form')), opts)[0]; + function recover() { app.style.display = 'block'; } + + const form = riot.mount(document.body.appendChild(document.createElement('mk-post-form')), opts)[0]; form .on('cancel', recover) .on('post', recover); -- cgit v1.2.3-freya