From 204ad535c060322c35b3798198e9c40db31916d5 Mon Sep 17 00:00:00 2001
From: syuilo <syuilotan@yahoo.co.jp>
Date: Mon, 20 Feb 2017 09:53:57 +0900
Subject: [PATCH] wip
---
src/web/app/auth/tags/form.tag | 22 +-
src/web/app/auth/tags/index.tag | 54 +--
src/web/app/common/tags/api-info.tag | 2 +-
src/web/app/common/tags/authorized-apps.tag | 20 +-
src/web/app/common/tags/core-error.tag | 6 +-
src/web/app/common/tags/file-type-icon.tag | 2 +-
src/web/app/common/tags/messaging/form.tag | 89 +++--
src/web/app/common/tags/messaging/index.tag | 74 ++--
src/web/app/common/tags/messaging/message.tag | 22 +-
src/web/app/common/tags/messaging/room.tag | 94 ++---
src/web/app/common/tags/number.tag | 12 +-
src/web/app/common/tags/poll-editor.tag | 22 +-
src/web/app/common/tags/poll.tag | 22 +-
src/web/app/common/tags/raw.tag | 2 +-
src/web/app/common/tags/ripple-string.tag | 14 +-
src/web/app/common/tags/signin-history.tag | 32 +-
src/web/app/common/tags/signin.tag | 48 +--
src/web/app/common/tags/signup.tag | 120 +++---
src/web/app/common/tags/special-message.tag | 4 +-
src/web/app/common/tags/time.tag | 34 +-
src/web/app/common/tags/twitter-setting.tag | 2 +-
src/web/app/common/tags/uploader.tag | 38 +-
src/web/app/common/tags/url-preview.tag | 24 +-
src/web/app/common/tags/url.tag | 20 +-
src/web/app/desktop/tags/analog-clock.tag | 30 +-
.../desktop/tags/autocomplete-suggestion.tag | 82 ++---
.../app/desktop/tags/big-follow-button.tag | 70 ++--
src/web/app/desktop/tags/contextmenu.tag | 36 +-
src/web/app/desktop/tags/crop-window.tag | 36 +-
src/web/app/desktop/tags/dialog.tag | 50 +--
src/web/app/desktop/tags/donation.tag | 12 +-
.../desktop/tags/drive/base-contextmenu.tag | 26 +-
.../app/desktop/tags/drive/browser-window.tag | 16 +-
src/web/app/desktop/tags/drive/browser.tag | 342 +++++++++---------
.../desktop/tags/drive/file-contextmenu.tag | 62 ++--
src/web/app/desktop/tags/drive/file.tag | 52 +--
.../desktop/tags/drive/folder-contextmenu.tag | 46 +--
src/web/app/desktop/tags/drive/folder.tag | 120 +++---
src/web/app/desktop/tags/drive/nav-folder.tag | 84 ++---
src/web/app/desktop/tags/follow-button.tag | 70 ++--
.../app/desktop/tags/following-setuper.tag | 40 +-
src/web/app/desktop/tags/go-top.tag | 12 +-
.../desktop/tags/home-widgets/calendar.tag | 30 +-
.../desktop/tags/home-widgets/donation.tag | 2 +-
.../desktop/tags/home-widgets/mentions.tag | 82 ++---
.../tags/home-widgets/notifications.tag | 6 +-
.../tags/home-widgets/photo-stream.tag | 30 +-
.../app/desktop/tags/home-widgets/profile.tag | 12 +-
.../desktop/tags/home-widgets/rss-reader.tag | 30 +-
.../desktop/tags/home-widgets/timeline.tag | 102 +++---
.../app/desktop/tags/home-widgets/tips.tag | 24 +-
.../tags/home-widgets/user-recommendation.tag | 40 +-
src/web/app/desktop/tags/home.tag | 30 +-
src/web/app/desktop/tags/image-dialog.tag | 36 +-
src/web/app/desktop/tags/images-viewer.tag | 18 +-
src/web/app/desktop/tags/input-dialog.tag | 44 +--
src/web/app/desktop/tags/list-user.tag | 2 +-
.../desktop/tags/messaging/room-window.tag | 8 +-
src/web/app/desktop/tags/messaging/window.tag | 10 +-
src/web/app/desktop/tags/notifications.tag | 38 +-
src/web/app/desktop/tags/pages/entrance.tag | 20 +-
.../desktop/tags/pages/entrance/signin.tag | 8 +-
src/web/app/desktop/tags/pages/home.tag | 44 +--
src/web/app/desktop/tags/pages/post.tag | 16 +-
src/web/app/desktop/tags/pages/search.tag | 10 +-
src/web/app/desktop/tags/pages/user.tag | 16 +-
src/web/app/desktop/tags/post-detail-sub.tag | 36 +-
src/web/app/desktop/tags/post-detail.tag | 124 +++----
src/web/app/desktop/tags/post-form-window.tag | 28 +-
src/web/app/desktop/tags/post-form.tag | 164 ++++-----
src/web/app/desktop/tags/post-preview.tag | 8 +-
.../app/desktop/tags/post-status-graph.tag | 58 +--
src/web/app/desktop/tags/progress-dialog.tag | 24 +-
.../app/desktop/tags/repost-form-window.tag | 28 +-
src/web/app/desktop/tags/repost-form.tag | 38 +-
src/web/app/desktop/tags/search-posts.tag | 72 ++--
src/web/app/desktop/tags/search.tag | 8 +-
.../tags/select-file-from-drive-window.tag | 36 +-
.../desktop/tags/set-avatar-suggestion.tag | 10 +-
.../desktop/tags/set-banner-suggestion.tag | 10 +-
src/web/app/desktop/tags/settings-window.tag | 10 +-
src/web/app/desktop/tags/settings.tag | 46 +--
src/web/app/desktop/tags/stream-indicator.tag | 30 +-
src/web/app/desktop/tags/sub-post-content.tag | 14 +-
.../app/desktop/tags/timeline-post-sub.tag | 8 +-
src/web/app/desktop/tags/timeline-post.tag | 86 ++---
src/web/app/desktop/tags/timeline.tag | 34 +-
.../app/desktop/tags/ui-header-account.tag | 42 +--
src/web/app/desktop/tags/ui-header-clock.tag | 14 +-
src/web/app/desktop/tags/ui-header-nav.tag | 46 +--
.../desktop/tags/ui-header-notifications.tag | 28 +-
.../desktop/tags/ui-header-post-button.tag | 4 +-
src/web/app/desktop/tags/ui-header-search.tag | 6 +-
src/web/app/desktop/tags/ui-header.tag | 2 +-
src/web/app/desktop/tags/ui-notification.tag | 20 +-
src/web/app/desktop/tags/ui.tag | 24 +-
.../desktop/tags/user-followers-window.tag | 2 +-
src/web/app/desktop/tags/user-followers.tag | 8 +-
.../desktop/tags/user-following-window.tag | 2 +-
src/web/app/desktop/tags/user-following.tag | 8 +-
.../app/desktop/tags/user-friends-graph.tag | 44 +--
src/web/app/desktop/tags/user-graphs.tag | 4 +-
src/web/app/desktop/tags/user-header.tag | 36 +-
src/web/app/desktop/tags/user-home.tag | 8 +-
src/web/app/desktop/tags/user-likes-graph.tag | 30 +-
src/web/app/desktop/tags/user-photos.tag | 32 +-
src/web/app/desktop/tags/user-posts-graph.tag | 48 +--
src/web/app/desktop/tags/user-preview.tag | 48 +--
src/web/app/desktop/tags/user-profile.tag | 14 +-
src/web/app/desktop/tags/user-timeline.tag | 114 +++---
src/web/app/desktop/tags/user.tag | 24 +-
src/web/app/desktop/tags/users-list.tag | 54 +--
src/web/app/desktop/tags/window.tag | 286 +++++++--------
src/web/app/dev/tags/new-app-form.tag | 64 ++--
src/web/app/dev/tags/pages/app.tag | 18 +-
src/web/app/dev/tags/pages/apps.tag | 16 +-
src/web/app/mobile/tags/drive-selector.tag | 22 +-
src/web/app/mobile/tags/drive.tag | 220 +++++------
src/web/app/mobile/tags/drive/file-viewer.tag | 18 +-
src/web/app/mobile/tags/drive/file.tag | 14 +-
src/web/app/mobile/tags/drive/folder.tag | 6 +-
src/web/app/mobile/tags/follow-button.tag | 70 ++--
src/web/app/mobile/tags/home-timeline.tag | 46 +--
src/web/app/mobile/tags/home.tag | 6 +-
src/web/app/mobile/tags/images-viewer.tag | 6 +-
.../app/mobile/tags/notification-preview.tag | 4 +-
src/web/app/mobile/tags/notification.tag | 4 +-
src/web/app/mobile/tags/notifications.tag | 38 +-
src/web/app/mobile/tags/notify.tag | 20 +-
src/web/app/mobile/tags/page/drive.tag | 50 +--
src/web/app/mobile/tags/page/entrance.tag | 20 +-
src/web/app/mobile/tags/page/home.tag | 38 +-
.../app/mobile/tags/page/messaging-room.tag | 24 +-
src/web/app/mobile/tags/page/messaging.tag | 10 +-
.../app/mobile/tags/page/notifications.tag | 14 +-
src/web/app/mobile/tags/page/post.tag | 20 +-
src/web/app/mobile/tags/page/search.tag | 18 +-
src/web/app/mobile/tags/page/settings.tag | 6 +-
src/web/app/mobile/tags/page/settings/api.tag | 6 +-
.../tags/page/settings/authorized-apps.tag | 6 +-
.../app/mobile/tags/page/settings/signin.tag | 6 +-
.../app/mobile/tags/page/settings/twitter.tag | 6 +-
.../app/mobile/tags/page/user-followers.tag | 34 +-
.../app/mobile/tags/page/user-following.tag | 34 +-
src/web/app/mobile/tags/page/user.tag | 18 +-
src/web/app/mobile/tags/post-detail.tag | 118 +++---
src/web/app/mobile/tags/post-form.tag | 108 +++---
src/web/app/mobile/tags/post-preview.tag | 2 +-
src/web/app/mobile/tags/search-posts.tag | 22 +-
src/web/app/mobile/tags/search.tag | 8 +-
src/web/app/mobile/tags/stream-indicator.tag | 30 +-
src/web/app/mobile/tags/sub-post-content.tag | 12 +-
src/web/app/mobile/tags/timeline-post-sub.tag | 2 +-
src/web/app/mobile/tags/timeline-post.tag | 54 +--
src/web/app/mobile/tags/timeline.tag | 46 +--
src/web/app/mobile/tags/ui-header.tag | 16 +-
src/web/app/mobile/tags/ui-nav.tag | 12 +-
src/web/app/mobile/tags/ui.tag | 36 +-
src/web/app/mobile/tags/user-followers.tag | 14 +-
src/web/app/mobile/tags/user-following.tag | 14 +-
src/web/app/mobile/tags/user-preview.tag | 2 +-
src/web/app/mobile/tags/user-timeline.tag | 20 +-
src/web/app/mobile/tags/user.tag | 50 +--
src/web/app/mobile/tags/users-list.tag | 54 +--
164 files changed, 2979 insertions(+), 2966 deletions(-)
diff --git a/src/web/app/auth/tags/form.tag b/src/web/app/auth/tags/form.tag
index 99212febfc..b5ace73716 100644
--- a/src/web/app/auth/tags/form.tag
+++ b/src/web/app/auth/tags/form.tag
@@ -106,21 +106,21 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @session = @opts.session
- @app = @session.app
+ this.session = this.opts.session
+ this.app = @session.app
- @cancel = ~>
- @api \auth/deny do
+ cancel() {
+ this.api 'auth/deny' do
token: @session.token
- .then ~>
- @trigger \denied
+ .then =>
+ this.trigger('denied');
- @accept = ~>
- @api \auth/accept do
+ accept() {
+ this.api 'auth/accept' do
token: @session.token
- .then ~>
- @trigger \accepted
+ .then =>
+ this.trigger('accepted');
</script>
</mk-form>
diff --git a/src/web/app/auth/tags/index.tag b/src/web/app/auth/tags/index.tag
index b17d857db2..a9f7828b96 100644
--- a/src/web/app/auth/tags/index.tag
+++ b/src/web/app/auth/tags/index.tag
@@ -88,48 +88,48 @@
</style>
<script>
- @mixin \i
- @mixin \api
+ this.mixin('i');
+ this.mixin('api');
- @state = null
- @fetching = true
+ this.state = null
+ this.fetching = true
- @token = window.location.href.split \/ .pop!
+ this.token = window.location.href.split '/' .pop!
- @on \mount ~>
+ this.on('mount', () => {
if not @SIGNIN then return
- # Fetch session
- @api \auth/session/show do
+ // Fetch session
+ this.api 'auth/session/show' do
token: @token
- .then (session) ~>
- @session = session
- @fetching = false
+ .then (session) =>
+ this.session = session
+ this.fetching = false
- # 既に連携していた場合
+ // 既に連携していた場合
if @session.app.is_authorized
- @api \auth/accept do
+ this.api 'auth/accept' do
token: @session.token
- .then ~>
+ .then =>
@accepted!
else
- @state = \waiting
- @update!
+ this.state = 'waiting'
+ this.update();
- @refs.form.on \denied ~>
- @state = \denied
- @update!
+ this.refs.form.on('denied', () => {
+ this.state = 'denied'
+ this.update();
- @refs.form.on \accepted @accepted
+ this.refs.form.on 'accepted' @accepted
- .catch (error) ~>
- @fetching = false
- @state = \fetch-session-error
- @update!
+ .catch (error) =>
+ this.fetching = false
+ this.state = 'fetch-session-error'
+ this.update();
- @accepted = ~>
- @state = \accepted
- @update!
+ accepted() {
+ this.state = 'accepted'
+ this.update();
if @session.app.callback_url
location.href = @session.app.callback_url + '?token=' + @session.token
diff --git a/src/web/app/common/tags/api-info.tag b/src/web/app/common/tags/api-info.tag
index f3cef26509..d3b1e4c25d 100644
--- a/src/web/app/common/tags/api-info.tag
+++ b/src/web/app/common/tags/api-info.tag
@@ -21,6 +21,6 @@
text-decoration underline
</style>
<script>
- @mixin \i
+ this.mixin('i');
</script>
</mk-api-info>
diff --git a/src/web/app/common/tags/authorized-apps.tag b/src/web/app/common/tags/authorized-apps.tag
index 16e9d9c0c1..918e8b956c 100644
--- a/src/web/app/common/tags/authorized-apps.tag
+++ b/src/web/app/common/tags/authorized-apps.tag
@@ -17,18 +17,18 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @apps = []
- @fetching = true
+ this.apps = []
+ this.fetching = true
- @on \mount ~>
- @api \i/authorized_apps
- .then (apps) ~>
- @apps = apps
- @fetching = false
- @update!
- .catch (err) ~>
+ this.on('mount', () => {
+ this.api 'i/authorized_apps'
+ .then (apps) =>
+ this.apps = apps
+ this.fetching = false
+ this.update();
+ .catch (err) =>
console.error err
</script>
</mk-authorized-apps>
diff --git a/src/web/app/common/tags/core-error.tag b/src/web/app/common/tags/core-error.tag
index 5b5d163600..07f41e403c 100644
--- a/src/web/app/common/tags/core-error.tag
+++ b/src/web/app/common/tags/core-error.tag
@@ -57,8 +57,8 @@
</style>
<script>
- @retry = ~>
- @unmount!
- @opts.retry!
+ retry() {
+ this.unmount();
+ this.opts.retry!
</script>
</mk-core-error>
diff --git a/src/web/app/common/tags/file-type-icon.tag b/src/web/app/common/tags/file-type-icon.tag
index 37cae49993..c484a57498 100644
--- a/src/web/app/common/tags/file-type-icon.tag
+++ b/src/web/app/common/tags/file-type-icon.tag
@@ -5,6 +5,6 @@
display inline
</style>
<script>
- @kind = @opts.type.split \/ .0
+ this.kind = this.opts.type.split '/' .0
</script>
</mk-file-type-icon>
diff --git a/src/web/app/common/tags/messaging/form.tag b/src/web/app/common/tags/messaging/form.tag
index d6750fb9ec..649c16a25d 100644
--- a/src/web/app/common/tags/messaging/form.tag
+++ b/src/web/app/common/tags/messaging/form.tag
@@ -2,9 +2,15 @@
<textarea ref="text" onkeypress={ onkeypress } onpaste={ onpaste } placeholder="ここにメッセージを入力"></textarea>
<div class="files"></div>
<mk-uploader ref="uploader"></mk-uploader>
- <button class="send" onclick={ send } disabled={ sending } title="メッセージを送信"><i class="fa fa-paper-plane" if={ !sending }></i><i class="fa fa-spinner fa-spin" if={ sending }></i></button>
- <button class="attach-from-local" type="button" title="PCから画像を添付する"><i class="fa fa-upload"></i></button>
- <button class="attach-from-drive" type="button" title="アルバムから画像を添付する"><i class="fa fa-folder-open"></i></button>
+ <button class="send" onclick={ send } disabled={ sending } title="メッセージを送信">
+ <i class="fa fa-paper-plane" if={ !sending }></i><i class="fa fa-spinner fa-spin" if={ sending }></i>
+ </button>
+ <button class="attach-from-local" type="button" title="PCから画像を添付する">
+ <i class="fa fa-upload"></i>
+ </button>
+ <button class="attach-from-drive" type="button" title="アルバムから画像を添付する">
+ <i class="fa fa-folder-open"></i>
+ </button>
<input name="file" type="file" accept="image/*"/>
<style>
:scope
@@ -111,49 +117,56 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @onpaste = (e) ~>
- data = e.clipboard-data
- items = data.items
- for i from 0 to items.length - 1
- item = items[i]
- switch (item.kind)
- | \file =>
- @upload item.get-as-file!
+ onpaste(e) {
+ const data = e.clipboardData;
+ const items = data.items;
+ for (let i = 0; i < items.length; i++) {
+ const item = items[i];
+ if (item.kind == 'file') {
+ this.upload(item.getAsFile());
+ }
+ }
+ }
- @onkeypress = (e) ~>
- if (e.which == 10 || e.which == 13) && e.ctrl-key
- @send!
+ onkeypress(e) {
+ if ((e.which == 10 || e.which == 13) && e.ctrlKey) {
+ this.send();
+ }
+ }
- @select-file = ~>
- @refs.file.click!
+ selectFile() {
+ this.refs.file.click();
+ }
- @select-file-from-drive = ~>
- browser = document.body.append-child document.create-element \mk-select-file-from-drive-window
- event = riot.observable!
- riot.mount browser, do
- multiple: true
+ selectFileFromDrive() {
+ const browser = document.body.appendChild(document.createElement('mk-select-file-from-drive-window'));
+ const event = riot.observable();
+ riot.mount(browser, {
+ multiple: true,
event: event
- event.one \selected (files) ~>
- files.for-each @add-file
+ });
+ event.one('selected', files => {
+ files.forEach(this.addFile);
+ });
- @send = ~>
- @sending = true
- @api \messaging/messages/create do
- user_id: @opts.user.id
- text: @refs.text.value
- .then (message) ~>
+ send() {
+ this.sending = true
+ this.api 'messaging/messages/create' do
+ user_id: this.opts.user.id
+ text: this.refs.text.value
+ .then (message) =>
@clear!
- .catch (err) ~>
+ .catch (err) =>
console.error err
- .then ~>
- @sending = false
- @update!
+ .then =>
+ this.sending = false
+ this.update();
- @clear = ~>
- @refs.text.value = ''
- @files = []
- @update!
+ clear() {
+ this.refs.text.value = ''
+ this.files = []
+ this.update();
</script>
</mk-messaging-form>
diff --git a/src/web/app/common/tags/messaging/index.tag b/src/web/app/common/tags/messaging/index.tag
index 69f78ba8e3..f9ce48641f 100644
--- a/src/web/app/common/tags/messaging/index.tag
+++ b/src/web/app/common/tags/messaging/index.tag
@@ -286,72 +286,72 @@
</style>
<script>
- @mixin \i
- @mixin \api
+ this.mixin('i');
+ this.mixin('api');
- @search-result = []
+ this.search-result = []
- @on \mount ~>
- @api \messaging/history
- .then (history) ~>
- @is-loading = false
- history.for-each (message) ~>
+ this.on('mount', () => {
+ this.api 'messaging/history'
+ .then (history) =>
+ this.is-loading = false
+ history.for-each (message) =>
message.is_me = message.user_id == @I.id
- message._click = ~>
+ message._click = =>
if message.is_me
- @trigger \navigate-user message.recipient
+ this.trigger 'navigate-user' message.recipient
else
- @trigger \navigate-user message.user
- @history = history
- @update!
- .catch (err) ~>
+ this.trigger 'navigate-user' message.user
+ this.history = history
+ this.update();
+ .catch (err) =>
console.error err
- @search = ~>
- q = @refs.search.value
+ search() {
+ q = this.refs.search.value
if q == ''
- @search-result = []
+ this.search-result = []
else
- @api \users/search do
+ this.api 'users/search' do
query: q
max: 5
- .then (users) ~>
- users.for-each (user) ~>
- user._click = ~>
- @trigger \navigate-user user
- @search-result = []
- @search-result = users
- @update!
- .catch (err) ~>
+ .then (users) =>
+ users.for-each (user) =>
+ user._click = =>
+ this.trigger 'navigate-user' user
+ this.search-result = []
+ this.search-result = users
+ this.update();
+ .catch (err) =>
console.error err
- @on-search-keydown = (e) ~>
+ on-search-keydown(e) {
key = e.which
switch (key)
- | 9, 40 => # Key[TAB] or Key[↓]
+ | 9, 40 => // Key[TAB] or Key[↓]
e.prevent-default!
e.stop-propagation!
- @refs.search-result.child-nodes[0].focus!
+ this.refs.search-result.child-nodes[0].focus();
- @on-search-result-keydown = (i, e) ~>
+ on-search-result-keydown(i, e) {
key = e.which
switch (key)
- | 10, 13 => # Key[ENTER]
+ | 10, 13 => // Key[ENTER]
e.prevent-default!
e.stop-propagation!
@search-result[i]._click!
- | 27 => # Key[ESC]
+ | 27 => // Key[ESC]
e.prevent-default!
e.stop-propagation!
- @refs.search.focus!
- | 38 => # Key[↑]
+ this.refs.search.focus();
+ | 38 => // Key[↑]
e.prevent-default!
e.stop-propagation!
- (@refs.search-result.child-nodes[i].previous-element-sibling || @refs.search-result.child-nodes[@search-result.length - 1]).focus!
- | 9, 40 => # Key[TAB] or Key[↓]
+ (this.refs.search-result.child-nodes[i].previous-element-sibling || this.refs.search-result.child-nodes[@search-result.length - 1]).focus();
+ | 9, 40 => // Key[TAB] or Key[↓]
e.prevent-default!
e.stop-propagation!
- (@refs.search-result.child-nodes[i].next-element-sibling || @refs.search-result.child-nodes[0]).focus!
+ (this.refs.search-result.child-nodes[i].next-element-sibling || this.refs.search-result.child-nodes[0]).focus();
</script>
</mk-messaging>
diff --git a/src/web/app/common/tags/messaging/message.tag b/src/web/app/common/tags/messaging/message.tag
index 5765ffa6c8..a43991e0ec 100644
--- a/src/web/app/common/tags/messaging/message.tag
+++ b/src/web/app/common/tags/messaging/message.tag
@@ -203,27 +203,27 @@
</style>
<script>
- @mixin \i
- @mixin \text
+ this.mixin('i');
+ this.mixin('text');
- @message = @opts.message
+ this.message = this.opts.message
@message.is_me = @message.user.id == @I.id
- @on \mount ~>
+ this.on('mount', () => {
if @message.text?
tokens = @analyze @message.text
- @refs.text.innerHTML = @compile tokens
+ this.refs.text.innerHTML = @compile tokens
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
- # URLをプレビュー
+ // URLをプレビュー
tokens
- .filter (t) -> t.type == \link
- .map (t) ~>
- @preview = @refs.text.append-child document.create-element \mk-url-preview
+ .filter (t) -> t.type == 'link'
+ .map (t) =>
+ this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
riot.mount @preview, do
url: t.content
</script>
diff --git a/src/web/app/common/tags/messaging/room.tag b/src/web/app/common/tags/messaging/room.tag
index 5882a7fa40..a571b330cb 100644
--- a/src/web/app/common/tags/messaging/room.tag
+++ b/src/web/app/common/tags/messaging/room.tag
@@ -124,101 +124,101 @@
</style>
<script>
- @mixin \i
- @mixin \api
- @mixin \messaging-stream
+ this.mixin('i');
+ this.mixin('api');
+ this.mixin('messaging-stream');
- @user = @opts.user
- @init = true
- @sending = false
- @messages = []
+ this.user = this.opts.user
+ this.init = true
+ this.sending = false
+ this.messages = []
- @connection = new @MessagingStreamConnection @I, @user.id
+ this.connection = new @MessagingStreamConnection @I, @user.id
- @on \mount ~>
- @connection.event.on \message @on-message
- @connection.event.on \read @on-read
+ this.on('mount', () => {
+ @connection.event.on 'message' this.on-message
+ @connection.event.on 'read' this.on-read
- document.add-event-listener \visibilitychange @on-visibilitychange
+ document.add-event-listener 'visibilitychange' this.on-visibilitychange
- @api \messaging/messages do
+ this.api 'messaging/messages' do
user_id: @user.id
- .then (messages) ~>
- @init = false
- @messages = messages.reverse!
- @update!
+ .then (messages) =>
+ this.init = false
+ this.messages = messages.reverse!
+ this.update();
@scroll-to-bottom!
- .catch (err) ~>
+ .catch (err) =>
console.error err
- @on \unmount ~>
- @connection.event.off \message @on-message
- @connection.event.off \read @on-read
+ this.on('unmount', () => {
+ @connection.event.off 'message' this.on-message
+ @connection.event.off 'read' this.on-read
@connection.close!
- document.remove-event-listener \visibilitychange @on-visibilitychange
+ document.remove-event-listener 'visibilitychange' this.on-visibilitychange
- @on \update ~>
- @messages.for-each (message) ~>
+ this.on('update', () => {
+ @messages.for-each (message) =>
date = (new Date message.created_at).get-date!
month = (new Date message.created_at).get-month! + 1
message._date = date
message._datetext = month + '月 ' + date + '日'
- @on-message = (message) ~>
+ on-message(message) {
is-bottom = @is-bottom!
@messages.push message
if message.user_id != @I.id and not document.hidden
@connection.socket.send JSON.stringify do
- type: \read
+ type: 'read'
id: message.id
- @update!
+ this.update();
if is-bottom
- # Scroll to bottom
+ // Scroll to bottom
@scroll-to-bottom!
else if message.user_id != @I.id
- # Notify
+ // Notify
@notify '新しいメッセージがあります'
- @on-read = (ids) ~>
+ on-read(ids) {
if not Array.isArray ids then ids = [ids]
- ids.for-each (id) ~>
- if (@messages.some (x) ~> x.id == id)
+ ids.for-each (id) =>
+ if (@messages.some (x) => x.id == id)
exist = (@messages.map (x) -> x.id).index-of id
@messages[exist].is_read = true
- @update!
+ this.update();
- @is-bottom = ~>
- current = @root.scroll-top + @root.offset-height
- max = @root.scroll-height
+ is-bottom() {
+ current = this.root.scroll-top + this.root.offset-height
+ max = this.root.scroll-height
current > (max - 32)
- @scroll-to-bottom = ~>
- @root.scroll-top = @root.scroll-height
+ scroll-to-bottom() {
+ this.root.scroll-top = this.root.scroll-height
- @notify = (message) ~>
- n = document.create-element \p
+ notify(message) {
+ n = document.createElement 'p'
n.inner-HTML = '<i class="fa fa-arrow-circle-down"></i>' + message
- n.onclick = ~>
+ n.onclick = =>
@scroll-to-bottom!
n.parent-node.remove-child n
- @refs.notifications.append-child n
+ this.refs.notifications.appendChild n
- set-timeout ~>
+ setTimeout =>
n.style.opacity = 0
- set-timeout ~>
+ setTimeout =>
n.parent-node.remove-child n
, 1000ms
, 4000ms
- @on-visibilitychange = ~>
+ on-visibilitychange() {
if document.hidden then return
- @messages.for-each (message) ~>
+ @messages.for-each (message) =>
if message.user_id != @I.id and not message.is_read
@connection.socket.send JSON.stringify do
- type: \read
+ type: 'read'
id: message.id
</script>
</mk-messaging-room>
diff --git a/src/web/app/common/tags/number.tag b/src/web/app/common/tags/number.tag
index c878c842e2..626b184fce 100644
--- a/src/web/app/common/tags/number.tag
+++ b/src/web/app/common/tags/number.tag
@@ -5,14 +5,14 @@
</style>
<script>
- @on \mount ~>
- # バグ？ https://github.com/riot/riot/issues/2103
- #value = @opts.value
- value = @opts.riot-value
- max = @opts.max
+ this.on('mount', () => {
+ // バグ？ https://github.com/riot/riot/issues/2103
+ #value = this.opts.value
+ value = this.opts.riot-value
+ max = this.opts.max
if max? then if value > max then value = max
- @root.innerHTML = value.to-locale-string!
+ this.root.innerHTML = value.to-locale-string!
</script>
</mk-number>
diff --git a/src/web/app/common/tags/poll-editor.tag b/src/web/app/common/tags/poll-editor.tag
index 1c9c668f0b..46975bbe23 100644
--- a/src/web/app/common/tags/poll-editor.tag
+++ b/src/web/app/common/tags/poll-editor.tag
@@ -86,24 +86,24 @@
</style>
<script>
- @choices = ['', '']
+ this.choices = ['', '']
- @oninput = (i, e) ~>
+ oninput(i, e) {
@choices[i] = e.target.value
- @add = ~>
+ add() {
@choices.push ''
- @update!
- @refs.choices.child-nodes[@choices.length - 1].child-nodes[0].focus!
+ this.update();
+ this.refs.choices.child-nodes[@choices.length - 1].child-nodes[0].focus();
- @remove = (i) ~>
- @choices = @choices.filter((_, _i) -> _i != i)
- @update!
+ remove(i) {
+ this.choices = @choices.filter((_, _i) -> _i != i)
+ this.update();
- @destroy = ~>
- @opts.ondestroy!
+ destroy() {
+ this.opts.ondestroy!
- @get = ~>
+ get() {
return {
choices: @choices.filter (choice) -> choice != ''
}
diff --git a/src/web/app/common/tags/poll.tag b/src/web/app/common/tags/poll.tag
index 426bb44281..d0ee1fad7d 100644
--- a/src/web/app/common/tags/poll.tag
+++ b/src/web/app/common/tags/poll.tag
@@ -68,23 +68,23 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @post = @opts.post
- @poll = @post.poll
- @total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
- @is-voted = @poll.choices.some (c) -> c.is_voted
- @result = @is-voted
+ this.post = this.opts.post
+ this.poll = @post.poll
+ this.total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
+ this.is-voted = @poll.choices.some (c) -> c.is_voted
+ this.result = @is-voted
- @toggle-result = ~>
- @result = !@result
+ toggle-result() {
+ this.result = !@result
- @vote = (id) ~>
+ vote(id) {
if (@poll.choices.some (c) -> c.is_voted) then return
- @api \posts/polls/vote do
+ this.api 'posts/polls/vote' do
post_id: @post.id
choice: id
- .then ~>
+ .then =>
@poll.choices.for-each (c) ->
if c.id == id
c.votes++
diff --git a/src/web/app/common/tags/raw.tag b/src/web/app/common/tags/raw.tag
index 609c53e7e9..0637675c45 100644
--- a/src/web/app/common/tags/raw.tag
+++ b/src/web/app/common/tags/raw.tag
@@ -4,5 +4,5 @@
display inline
</style>
- <script>@root.innerHTML = @opts.content</script>
+ <script>this.root.innerHTML = this.opts.content</script>
</mk-raw>
diff --git a/src/web/app/common/tags/ripple-string.tag b/src/web/app/common/tags/ripple-string.tag
index d3303e6ba6..f52d75e706 100644
--- a/src/web/app/common/tags/ripple-string.tag
+++ b/src/web/app/common/tags/ripple-string.tag
@@ -14,13 +14,13 @@
</style>
<script>
- @on \mount ~>
- text = @root.innerHTML
- @root.innerHTML = ''
- (text.split '').for-each (c, i) ~>
- ce = document.create-element \span
+ this.on('mount', () => {
+ text = this.root.innerHTML
+ this.root.innerHTML = ''
+ (text.split '').for-each (c, i) =>
+ ce = document.createElement 'span'
ce.innerHTML = c
- ce.style.animation-delay = (i / 10) + 's'
- @root.append-child ce
+ ce.style.animationDelay = (i / 10) + 's'
+ this.root.appendChild ce
</script>
</mk-ripple-string>
diff --git a/src/web/app/common/tags/signin-history.tag b/src/web/app/common/tags/signin-history.tag
index ffc837891d..2b8bddd268 100644
--- a/src/web/app/common/tags/signin-history.tag
+++ b/src/web/app/common/tags/signin-history.tag
@@ -48,28 +48,28 @@
</style>
<script>
- @mixin \api
- @mixin \stream
+ this.mixin('api');
+ this.mixin('stream');
- @history = []
- @fetching = true
+ this.history = []
+ this.fetching = true
- @on \mount ~>
- @api \i/signin_history
- .then (history) ~>
- @history = history
- @fetching = false
- @update!
- .catch (err) ~>
+ this.on('mount', () => {
+ this.api 'i/signin_history'
+ .then (history) =>
+ this.history = history
+ this.fetching = false
+ this.update();
+ .catch (err) =>
console.error err
- @stream.on \signin @on-signin
+ @stream.on 'signin' this.on-signin
- @on \unmount ~>
- @stream.off \signin @on-signin
+ this.on('unmount', () => {
+ @stream.off 'signin' this.on-signin
- @on-signin = (signin) ~>
+ on-signin(signin) {
@history.unshift signin
- @update!
+ this.update();
</script>
</mk-signin-history>
diff --git a/src/web/app/common/tags/signin.tag b/src/web/app/common/tags/signin.tag
index 28d73b037f..75fa51afa7 100644
--- a/src/web/app/common/tags/signin.tag
+++ b/src/web/app/common/tags/signin.tag
@@ -97,41 +97,41 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @user = null
- @signing = false
+ this.user = null
+ this.signing = false
- @oninput = ~>
- @api \users/show do
- username: @refs.username.value
- .then (user) ~>
- @user = user
- @trigger \user user
- @update!
+ oninput() {
+ this.api 'users/show' do
+ username: this.refs.username.value
+ .then (user) =>
+ this.user = user
+ this.trigger 'user' user
+ this.update();
- @onsubmit = (e) ~>
+ onsubmit(e) {
e.prevent-default!
- if @refs.username.value == ''
- @refs.username.focus!
+ if this.refs.username.value == ''
+ this.refs.username.focus();
return false
- if @refs.password.value == ''
- @refs.password.focus!
+ if this.refs.password.value == ''
+ this.refs.password.focus();
return false
- @signing = true
- @update!
+ this.signing = true
+ this.update();
- @api \signin do
- username: @refs.username.value
- password: @refs.password.value
- .then ~>
+ this.api 'signin' do
+ username: this.refs.username.value
+ password: this.refs.password.value
+ .then =>
location.reload!
- .catch ~>
+ .catch =>
alert 'something happened'
- @signing = false
- @update!
+ this.signing = false
+ this.update();
false
</script>
diff --git a/src/web/app/common/tags/signup.tag b/src/web/app/common/tags/signup.tag
index 7af72807a5..86c4bb5e14 100644
--- a/src/web/app/common/tags/signup.tag
+++ b/src/web/app/common/tags/signup.tag
@@ -174,117 +174,117 @@
</style>
<script>
- @mixin \api
- @mixin \get-password-strength
+ this.mixin('api');
+ this.mixin('get-password-strength');
- @username-state = null
- @password-strength = ''
- @password-retype-state = null
- @recaptchaed = false
+ this.username-state = null
+ this.password-strength = ''
+ this.password-retype-state = null
+ this.recaptchaed = false
- window.on-recaptchaed = ~>
- @recaptchaed = true
- @update!
+ window.on-recaptchaed = =>
+ this.recaptchaed = true
+ this.update();
- window.on-recaptcha-expired = ~>
- @recaptchaed = false
- @update!
+ window.on-recaptcha-expired = =>
+ this.recaptchaed = false
+ this.update();
- @on \mount ~>
- head = (document.get-elements-by-tag-name \head).0
- script = document.create-element \script
- ..set-attribute \src \https://www.google.com/recaptcha/api.js
- head.append-child script
+ this.on('mount', () => {
+ head = (document.get-elements-by-tag-name 'head).0'
+ script = document.createElement 'script'
+ ..set-attribute 'src' \https://www.google.com/recaptcha/api.js
+ head.appendChild script
- @on-change-username = ~>
- username = @refs.username.value
+ on-change-username() {
+ username = this.refs.username.value
if username == ''
- @username-state = null
- @update!
+ this.username-state = null
+ this.update();
return
err = switch
- | not username.match /^[a-zA-Z0-9\-]+$/ => \invalid-format
- | username.length < 3chars => \min-range
- | username.length > 20chars => \max-range
+ | not username.match /^[a-zA-Z0-9\-]+$/ => 'invalid-format'
+ | username.length < 3chars => 'min-range'
+ | username.length > 20chars => 'max-range'
| _ => null
if err?
- @username-state = err
- @update!
+ this.username-state = err
+ this.update();
else
- @username-state = \wait
- @update!
+ this.username-state = 'wait'
+ this.update();
- @api \username/available do
+ this.api 'username/available' do
username: username
- .then (result) ~>
+ .then (result) =>
if result.available
- @username-state = \ok
+ this.username-state = 'ok'
else
- @username-state = \unavailable
- @update!
- .catch (err) ~>
- @username-state = \error
- @update!
+ this.username-state = 'unavailable'
+ this.update();
+ .catch (err) =>
+ this.username-state = 'error'
+ this.update();
- @on-change-password = ~>
- password = @refs.password.value
+ on-change-password() {
+ password = this.refs.password.value
if password == ''
- @password-strength = ''
+ this.password-strength = ''
return
strength = @get-password-strength password
if strength > 0.3
- @password-strength = \medium
+ this.password-strength = 'medium'
if strength > 0.7
- @password-strength = \high
+ this.password-strength = 'high'
else
- @password-strength = \low
+ this.password-strength = 'low'
- @update!
+ this.update();
- @refs.password-metar.style.width = (strength * 100) + \%
+ this.refs.password-metar.style.width = (strength * 100) + '%'
- @on-change-password-retype = ~>
- password = @refs.password.value
- retyped-password = @refs.password-retype.value
+ on-change-password-retype() {
+ password = this.refs.password.value
+ retyped-password = this.refs.password-retype.value
if retyped-password == ''
- @password-retype-state = null
+ this.password-retype-state = null
return
if password == retyped-password
- @password-retype-state = \match
+ this.password-retype-state = 'match'
else
- @password-retype-state = \not-match
+ this.password-retype-state = 'not-match'
- @onsubmit = (e) ~>
+ onsubmit(e) {
e.prevent-default!
- username = @refs.username.value
- password = @refs.password.value
+ username = this.refs.username.value
+ password = this.refs.password.value
- locker = document.body.append-child document.create-element \mk-locker
+ locker = document.body.appendChild document.createElement 'mk-locker'
- @api \signup do
+ this.api 'signup' do
username: username
password: password
'g-recaptcha-response': grecaptcha.get-response!
- .then ~>
- @api \signin do
+ .then =>
+ this.api 'signin' do
username: username
password: password
- .then ~>
+ .then =>
location.href = CONFIG.url
- .catch ~>
+ .catch =>
alert '何らかの原因によりアカウントの作成に失敗しました。再度お試しください。'
grecaptcha.reset!
- @recaptchaed = false
+ this.recaptchaed = false
locker.parent-node.remove-child locker
diff --git a/src/web/app/common/tags/special-message.tag b/src/web/app/common/tags/special-message.tag
index 53c54c9816..8304f87ec1 100644
--- a/src/web/app/common/tags/special-message.tag
+++ b/src/web/app/common/tags/special-message.tag
@@ -21,7 +21,7 @@
</style>
<script>
now = new Date!
- @d = now.get-date!
- @m = now.get-month! + 1
+ this.d = now.get-date!
+ this.m = now.get-month! + 1
</script>
</mk-special-message>
diff --git a/src/web/app/common/tags/time.tag b/src/web/app/common/tags/time.tag
index 0c9a6d6f90..9bdb7f4cd7 100644
--- a/src/web/app/common/tags/time.tag
+++ b/src/web/app/common/tags/time.tag
@@ -1,31 +1,31 @@
<mk-time>
<time datetime={ opts.time }><span if={ mode == 'relative' }>{ relative }</span><span if={ mode == 'absolute' }>{ absolute }</span><span if={ mode == 'detail' }>{ absolute } ({ relative })</span></time>
<script>
- @time = new Date @opts.time
- @mode = @opts.mode || \relative
- @tickid = null
+ this.time = new Date this.opts.time
+ this.mode = this.opts.mode || 'relative'
+ this.tickid = null
- @absolute =
- @time.get-full-year! + \年 +
- @time.get-month! + 1 + \月 +
- @time.get-date! + \日 +
+ this.absolute =
+ @time.get-full-year! + '年' +
+ @time.get-month! + 1 + '月' +
+ @time.get-date! + '日' +
' ' +
- @time.get-hours! + \時 +
- @time.get-minutes! + \分
+ @time.get-hours! + '時' +
+ @time.get-minutes! + '分'
- @on \mount ~>
- if @mode == \relative or @mode == \detail
+ this.on('mount', () => {
+ if @mode == 'relative' or @mode == 'detail'
@tick!
- @tickid = set-interval @tick, 1000ms
+ this.tickid = set-interval @tick, 1000ms
- @on \unmount ~>
- if @mode == \relative or @mode == \detail
+ this.on('unmount', () => {
+ if @mode == 'relative' or @mode == 'detail'
clear-interval @tickid
- @tick = ~>
+ tick() {
now = new Date!
ago = (now - @time) / 1000ms
- @relative = switch
+ this.relative = switch
| ago >= 31536000s => ~~(ago / 31536000s) + '年前'
| ago >= 2592000s => ~~(ago / 2592000s) + 'ヶ月前'
| ago >= 604800s => ~~(ago / 604800s) + '週間前'
@@ -36,6 +36,6 @@
| ago >= 0s => 'たった今'
| ago < 0s => '未来'
| _ => 'なぞのじかん'
- @update!
+ this.update();
</script>
</mk-time>
diff --git a/src/web/app/common/tags/twitter-setting.tag b/src/web/app/common/tags/twitter-setting.tag
index 162ccd2928..6996c45b4d 100644
--- a/src/web/app/common/tags/twitter-setting.tag
+++ b/src/web/app/common/tags/twitter-setting.tag
@@ -24,6 +24,6 @@
color #8899a6
</style>
<script>
- @mixin \i
+ this.mixin('i');
</script>
</mk-twitter-setting>
diff --git a/src/web/app/common/tags/uploader.tag b/src/web/app/common/tags/uploader.tag
index 275a26c019..2cf1aa324f 100644
--- a/src/web/app/common/tags/uploader.tag
+++ b/src/web/app/common/tags/uploader.tag
@@ -140,55 +140,55 @@
</style>
<script>
- @mixin \i
+ this.mixin('i');
- @uploads = []
+ this.uploads = []
- @upload = (file, folder) ~>
+ upload(file, folder) {
id = Math.random!
ctx =
id: id
- name: file.name || \untitled
+ name: file.name || 'untitled'
progress: undefined
@uploads.push ctx
- @trigger \change-uploads @uploads
- @update!
+ this.trigger 'change-uploads' @uploads
+ this.update();
reader = new FileReader!
- reader.onload = (e) ~>
+ reader.onload = (e) =>
ctx.img = e.target.result
- @update!
+ this.update();
reader.read-as-data-URL file
data = new FormData!
- data.append \i @I.token
- data.append \file file
+ data.append 'i' @I.token
+ data.append 'file' file
if folder?
- data.append \folder_id folder
+ data.append 'folder_id' folder
xhr = new XMLHttpRequest!
- xhr.open \POST CONFIG.apiUrl + '/drive/files/create' true
- xhr.onload = (e) ~>
+ xhr.open 'POST' CONFIG.apiUrl + '/drive/files/create' true
+ xhr.onload = (e) =>
drive-file = JSON.parse e.target.response
- @trigger \uploaded drive-file
+ this.trigger 'uploaded' drive-file
- @uploads = @uploads.filter (x) -> x.id != id
- @trigger \change-uploads @uploads
+ this.uploads = @uploads.filter (x) -> x.id != id
+ this.trigger 'change-uploads' @uploads
- @update!
+ this.update();
- xhr.upload.onprogress = (e) ~>
+ xhr.upload.onprogress = (e) =>
if e.length-computable
if ctx.progress == undefined
ctx.progress = {}
ctx.progress.max = e.total
ctx.progress.value = e.loaded
- @update!
+ this.update();
xhr.send data
</script>
diff --git a/src/web/app/common/tags/url-preview.tag b/src/web/app/common/tags/url-preview.tag
index 7aab9d94e0..74f952016e 100644
--- a/src/web/app/common/tags/url-preview.tag
+++ b/src/web/app/common/tags/url-preview.tag
@@ -91,22 +91,22 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @url = @opts.url
- @loading = true
+ this.url = this.opts.url
+ this.loading = true
- @on \mount ~>
+ this.on('mount', () => {
fetch CONFIG.url + '/api:url?url=' + @url
- .then (res) ~>
+ .then (res) =>
info <~ res.json!.then
- @title = info.title
- @description = info.description
- @thumbnail = info.thumbnail
- @icon = info.icon
- @sitename = info.sitename
+ this.title = info.title
+ this.description = info.description
+ this.thumbnail = info.thumbnail
+ this.icon = info.icon
+ this.sitename = info.sitename
- @loading = false
- @update!
+ this.loading = false
+ this.update();
</script>
</mk-url-preview>
diff --git a/src/web/app/common/tags/url.tag b/src/web/app/common/tags/url.tag
index d4284b61bf..596d2914c9 100644
--- a/src/web/app/common/tags/url.tag
+++ b/src/web/app/common/tags/url.tag
@@ -30,19 +30,19 @@
</style>
<script>
- @url = @opts.href
+ this.url = this.opts.href
- @on \before-mount ~>
- parser = document.create-element \a
+ this.on('before-mount', () => {
+ parser = document.createElement 'a'
parser.href = @url
- @schema = parser.protocol
- @hostname = parser.hostname
- @port = parser.port
- @pathname = parser.pathname
- @query = parser.search
- @hash = parser.hash
+ this.schema = parser.protocol
+ this.hostname = parser.hostname
+ this.port = parser.port
+ this.pathname = parser.pathname
+ this.query = parser.search
+ this.hash = parser.hash
- @update!
+ this.update();
</script>
</mk-url>
diff --git a/src/web/app/desktop/tags/analog-clock.tag b/src/web/app/desktop/tags/analog-clock.tag
index d2458a7789..06896fe20b 100644
--- a/src/web/app/desktop/tags/analog-clock.tag
+++ b/src/web/app/desktop/tags/analog-clock.tag
@@ -9,29 +9,29 @@
</style>
<script>
- @on \mount ~>
+ this.on('mount', () => {
@draw!
- @clock = set-interval @draw, 1000ms
+ this.clock = set-interval @draw, 1000ms
- @on \unmount ~>
+ this.on('unmount', () => {
clear-interval @clock
- @draw = ~>
+ draw() {
now = new Date!
s = now.get-seconds!
m = now.get-minutes!
h = now.get-hours!
vec2 = (x, y) ->
- @x = x
- @y = y
+ this.x = x
+ this.y = y
- ctx = @refs.canvas.get-context \2d
- canv-w = @refs.canvas.width
- canv-h = @refs.canvas.height
+ ctx = this.refs.canvas.get-context '2d'
+ canv-w = this.refs.canvas.width
+ canv-h = this.refs.canvas.height
ctx.clear-rect 0, 0, canv-w, canv-h
- # 背景
+ // 背景
center = (Math.min (canv-w / 2), (canv-h / 2))
line-start = center * 0.90
line-end-short = center * 0.87
@@ -56,12 +56,12 @@
(canv-h / 2) + uv.y * line-end-short
ctx.stroke!
- # 分
+ // 分
angle = Math.PI * (m + s / 60) / 30
length = (Math.min canv-w, canv-h) / 2.6
uv = new vec2 (Math.sin angle), (-Math.cos angle)
ctx.begin-path!
- ctx.stroke-style = \#ffffff
+ ctx.stroke-style = '#ffffff'
ctx.line-width = 2
ctx.move-to do
(canv-w / 2) - uv.x * length / 5
@@ -71,12 +71,12 @@
(canv-h / 2) + uv.y * length
ctx.stroke!
- # 時
+ // 時
angle = Math.PI * (h % 12 + m / 60) / 6
length = (Math.min canv-w, canv-h) / 4
uv = new vec2 (Math.sin angle), (-Math.cos angle)
ctx.begin-path!
- #ctx.stroke-style = \#ffffff
+ #ctx.stroke-style = '#ffffff'
ctx.stroke-style = CONFIG.theme-color
ctx.line-width = 2
ctx.move-to do
@@ -87,7 +87,7 @@
(canv-h / 2) + uv.y * length
ctx.stroke!
- # 秒
+ // 秒
angle = Math.PI * s / 30
length = (Math.min canv-w, canv-h) / 2.6
uv = new vec2 (Math.sin angle), (-Math.cos angle)
diff --git a/src/web/app/desktop/tags/autocomplete-suggestion.tag b/src/web/app/desktop/tags/autocomplete-suggestion.tag
index 4aea8d8881..073352b19f 100644
--- a/src/web/app/desktop/tags/autocomplete-suggestion.tag
+++ b/src/web/app/desktop/tags/autocomplete-suggestion.tag
@@ -80,101 +80,101 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @q = @opts.q
- @textarea = @opts.textarea
- @loading = true
- @users = []
- @select = -1
+ this.q = this.opts.q
+ this.textarea = this.opts.textarea
+ this.loading = true
+ this.users = []
+ this.select = -1
- @on \mount ~>
- @textarea.add-event-listener \keydown @on-keydown
+ this.on('mount', () => {
+ @textarea.add-event-listener 'keydown' this.on-keydown
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.add-event-listener \mousedown @mousedown
+ Array.prototype.for-each.call all, (el) =>
+ el.add-event-listener 'mousedown' @mousedown
- @api \users/search_by_username do
+ this.api 'users/search_by_username' do
query: @q
limit: 30users
- .then (users) ~>
- @users = users
- @loading = false
- @update!
- .catch (err) ~>
+ .then (users) =>
+ this.users = users
+ this.loading = false
+ this.update();
+ .catch (err) =>
console.error err
- @on \unmount ~>
- @textarea.remove-event-listener \keydown @on-keydown
+ this.on('unmount', () => {
+ @textarea.remove-event-listener 'keydown' this.on-keydown
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.remove-event-listener \mousedown @mousedown
+ Array.prototype.for-each.call all, (el) =>
+ el.remove-event-listener 'mousedown' @mousedown
- @mousedown = (e) ~>
- if (!contains @root, e.target) and (@root != e.target)
+ mousedown(e) {
+ if (!contains this.root, e.target) and (this.root != e.target)
@close!
- @on-click = (e) ~>
+ on-click(e) {
@complete e.item
- @on-keydown = (e) ~>
+ on-keydown(e) {
key = e.which
switch (key)
- | 10, 13 => # Key[ENTER]
+ | 10, 13 => // Key[ENTER]
if @select != -1
e.prevent-default!
e.stop-propagation!
@complete @users[@select]
else
@close!
- | 27 => # Key[ESC]
+ | 27 => // Key[ESC]
e.prevent-default!
e.stop-propagation!
@close!
- | 38 => # Key[↑]
+ | 38 => // Key[↑]
if @select != -1
e.prevent-default!
e.stop-propagation!
@select-prev!
else
@close!
- | 9, 40 => # Key[TAB] or Key[↓]
+ | 9, 40 => // Key[TAB] or Key[↓]
e.prevent-default!
e.stop-propagation!
@select-next!
| _ =>
@close!
- @select-next = ~>
+ select-next() {
@select++
if @select >= @users.length
- @select = 0
+ this.select = 0
@apply-select!
- @select-prev = ~>
+ select-prev() {
@select--
if @select < 0
- @select = @users.length - 1
+ this.select = @users.length - 1
@apply-select!
- @apply-select = ~>
- @refs.users.children.for-each (el) ~>
- el.remove-attribute \data-selected
+ apply-select() {
+ this.refs.users.children.for-each (el) =>
+ el.remove-attribute 'data-selected'
- @refs.users.children[@select].set-attribute \data-selected \true
- @refs.users.children[@select].focus!
+ this.refs.users.children[@select].set-attribute 'data-selected' \true
+ this.refs.users.children[@select].focus();
- @complete = (user) ~>
- @opts.complete user
+ complete(user) {
+ this.opts.complete user
- @close = ~>
- @opts.close!
+ close() {
+ this.opts.close!
function contains(parent, child)
node = child.parent-node
diff --git a/src/web/app/desktop/tags/big-follow-button.tag b/src/web/app/desktop/tags/big-follow-button.tag
index dfee12b2a0..6c87e87558 100644
--- a/src/web/app/desktop/tags/big-follow-button.tag
+++ b/src/web/app/desktop/tags/big-follow-button.tag
@@ -70,58 +70,58 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
- @mixin \stream
+ this.mixin('api');
+ this.mixin('is-promise');
+ this.mixin('stream');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
- @init = true
- @wait = false
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
+ this.init = true
+ this.wait = false
- @on \mount ~>
- @user-promise.then (user) ~>
- @user = user
- @init = false
- @update!
- @stream.on \follow @on-stream-follow
- @stream.on \unfollow @on-stream-unfollow
+ this.on('mount', () => {
+ @user-promise.then (user) =>
+ this.user = user
+ this.init = false
+ this.update();
+ @stream.on 'follow' this.on-stream-follow
+ @stream.on 'unfollow' this.on-stream-unfollow
- @on \unmount ~>
- @stream.off \follow @on-stream-follow
- @stream.off \unfollow @on-stream-unfollow
+ this.on('unmount', () => {
+ @stream.off 'follow' this.on-stream-follow
+ @stream.off 'unfollow' this.on-stream-unfollow
- @on-stream-follow = (user) ~>
+ on-stream-follow(user) {
if user.id == @user.id
- @user = user
- @update!
+ this.user = user
+ this.update();
- @on-stream-unfollow = (user) ~>
+ on-stream-unfollow(user) {
if user.id == @user.id
- @user = user
- @update!
+ this.user = user
+ this.update();
- @onclick = ~>
- @wait = true
+ onclick() {
+ this.wait = true
if @user.is_following
- @api \following/delete do
+ this.api 'following/delete' do
user_id: @user.id
- .then ~>
+ .then =>
@user.is_following = false
.catch (err) ->
console.error err
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
else
- @api \following/create do
+ this.api 'following/create' do
user_id: @user.id
- .then ~>
+ .then =>
@user.is_following = true
.catch (err) ->
console.error err
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
</script>
</mk-big-follow-button>
diff --git a/src/web/app/desktop/tags/contextmenu.tag b/src/web/app/desktop/tags/contextmenu.tag
index b22948b7d4..114d48cf37 100644
--- a/src/web/app/desktop/tags/contextmenu.tag
+++ b/src/web/app/desktop/tags/contextmenu.tag
@@ -94,39 +94,39 @@
</style>
<script>
- @root.add-event-listener \contextmenu (e) ~>
+ this.root.add-event-listener 'contextmenu' (e) =>
e.prevent-default!
- @mousedown = (e) ~>
+ mousedown(e) {
e.prevent-default!
- if (!contains @root, e.target) and (@root != e.target)
+ if (!contains this.root, e.target) and (this.root != e.target)
@close!
return false
- @open = (pos) ~>
+ open(pos) {
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.add-event-listener \mousedown @mousedown
- @root.style.display = \block
- @root.style.left = pos.x + \px
- @root.style.top = pos.y + \px
+ Array.prototype.for-each.call all, (el) =>
+ el.add-event-listener 'mousedown' @mousedown
+ this.root.style.display = 'block'
+ this.root.style.left = pos.x + 'px'
+ this.root.style.top = pos.y + 'px'
- Velocity @root, \finish true
- Velocity @root, { opacity: 0 } 0ms
- Velocity @root, {
+ Velocity this.root, 'finish' true
+ Velocity this.root, { opacity: 0 } 0ms
+ Velocity this.root, {
opacity: 1
} {
queue: false
duration: 100ms
- easing: \linear
+ easing: 'linear'
}
- @close = ~>
+ close() {
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.remove-event-listener \mousedown @mousedown
- @trigger \closed
- @unmount!
+ Array.prototype.for-each.call all, (el) =>
+ el.remove-event-listener 'mousedown' @mousedown
+ this.trigger('closed');
+ this.unmount();
function contains(parent, child)
node = child.parent-node
diff --git a/src/web/app/desktop/tags/crop-window.tag b/src/web/app/desktop/tags/crop-window.tag
index 8d27f4c512..e022c76fa7 100644
--- a/src/web/app/desktop/tags/crop-window.tag
+++ b/src/web/app/desktop/tags/crop-window.tag
@@ -158,31 +158,31 @@
</style>
<script>
- @mixin \cropper
+ this.mixin('cropper');
- @image = @opts.file
- @title = @opts.title
- @aspect-ratio = @opts.aspect-ratio
- @cropper = null
+ this.image = this.opts.file
+ this.title = this.opts.title
+ this.aspect-ratio = this.opts.aspect-ratio
+ this.cropper = null
- @on \mount ~>
- @img = @refs.window.refs.img
- @cropper = new @Cropper @img, do
+ this.on('mount', () => {
+ this.img = this.refs.window.refs.img
+ this.cropper = new @Cropper @img, do
aspect-ratio: @aspect-ratio
highlight: no
view-mode: 1
- @ok = ~>
- @cropper.get-cropped-canvas!.to-blob (blob) ~>
- @trigger \cropped blob
- @refs.window.close!
+ ok() {
+ @cropper.get-cropped-canvas!.to-blob (blob) =>
+ this.trigger 'cropped' blob
+ this.refs.window.close!
- @skip = ~>
- @trigger \skiped
- @refs.window.close!
+ skip() {
+ this.trigger('skiped');
+ this.refs.window.close!
- @cancel = ~>
- @trigger \canceled
- @refs.window.close!
+ cancel() {
+ this.trigger('canceled');
+ this.refs.window.close!
</script>
</mk-crop-window>
diff --git a/src/web/app/desktop/tags/dialog.tag b/src/web/app/desktop/tags/dialog.tag
index 528779242e..a444ac18f6 100644
--- a/src/web/app/desktop/tags/dialog.tag
+++ b/src/web/app/desktop/tags/dialog.tag
@@ -79,34 +79,34 @@
</style>
<script>
- @can-through = if opts.can-through? then opts.can-through else true
- @opts.buttons.for-each (button) ~>
- button._onclick = ~>
+ this.can-through = if opts.can-through? then opts.can-through else true
+ this.opts.buttons.for-each (button) =>
+ button._onclick = =>
if button.onclick?
button.onclick!
@close!
- @on \mount ~>
- @refs.header.innerHTML = @opts.title
- @refs.body.innerHTML = @opts.text
+ this.on('mount', () => {
+ this.refs.header.innerHTML = this.opts.title
+ this.refs.body.innerHTML = this.opts.text
- @refs.bg.style.pointer-events = \auto
- Velocity @refs.bg, \finish true
- Velocity @refs.bg, {
+ this.refs.bg.style.pointer-events = 'auto'
+ Velocity this.refs.bg, 'finish' true
+ Velocity this.refs.bg, {
opacity: 1
} {
queue: false
duration: 100ms
- easing: \linear
+ easing: 'linear'
}
- Velocity @refs.main, {
+ Velocity this.refs.main, {
opacity: 0
scale: 1.2
} {
duration: 0
}
- Velocity @refs.main, {
+ Velocity this.refs.main, {
opacity: 1
scale: 1
} {
@@ -114,34 +114,34 @@
easing: [ 0, 0.5, 0.5, 1 ]
}
- @close = ~>
- @refs.bg.style.pointer-events = \none
- Velocity @refs.bg, \finish true
- Velocity @refs.bg, {
+ close() {
+ this.refs.bg.style.pointer-events = 'none'
+ Velocity this.refs.bg, 'finish' true
+ Velocity this.refs.bg, {
opacity: 0
} {
queue: false
duration: 300ms
- easing: \linear
+ easing: 'linear'
}
- @refs.main.style.pointer-events = \none
- Velocity @refs.main, \finish true
- Velocity @refs.main, {
+ this.refs.main.style.pointer-events = 'none'
+ Velocity this.refs.main, 'finish' true
+ Velocity this.refs.main, {
opacity: 0
scale: 0.8
} {
queue: false
duration: 300ms
easing: [ 0.5, -0.5, 1, 0.5 ]
- complete: ~>
- @unmount!
+ complete: =>
+ this.unmount();
}
- @bg-click = ~>
+ bg-click() {
if @can-through
- if @opts.on-through?
- @opts.on-through!
+ if this.opts.on-through?
+ this.opts.on-through!
@close!
</script>
</mk-dialog>
diff --git a/src/web/app/desktop/tags/donation.tag b/src/web/app/desktop/tags/donation.tag
index 7d0056d36f..d92e24e30f 100644
--- a/src/web/app/desktop/tags/donation.tag
+++ b/src/web/app/desktop/tags/donation.tag
@@ -47,21 +47,21 @@
</style>
<script>
- @mixin \api
- @mixin \i
+ this.mixin('api');
+ this.mixin('i');
- @close = (e) ~>
+ close(e) {
e.prevent-default!
e.stop-propagation!
@I.data.no_donation = true
@I.update!
- @api \i/appdata/set do
+ this.api 'i/appdata/set' do
data: JSON.stringify do
no_donation: @I.data.no_donation
- @unmount!
+ this.unmount();
- @parent.parent.set-root-layout!
+ this.parent.parent.set-root-layout!
</script>
</mk-donation>
diff --git a/src/web/app/desktop/tags/drive/base-contextmenu.tag b/src/web/app/desktop/tags/drive/base-contextmenu.tag
index c3a613d32b..39e01558da 100644
--- a/src/web/app/desktop/tags/drive/base-contextmenu.tag
+++ b/src/web/app/desktop/tags/drive/base-contextmenu.tag
@@ -13,26 +13,26 @@
</ul>
</mk-contextmenu>
<script>
- @browser = @opts.browser
+ this.browser = this.opts.browser
- @on \mount ~>
- @refs.ctx.on \closed ~>
- @trigger \closed
- @unmount!
+ this.on('mount', () => {
+ this.refs.ctx.on('closed', () => {
+ this.trigger('closed');
+ this.unmount();
- @open = (pos) ~>
- @refs.ctx.open pos
+ open(pos) {
+ this.refs.ctx.open pos
- @create-folder = ~>
+ create-folder() {
@browser.create-folder!
- @refs.ctx.close!
+ this.refs.ctx.close!
- @upload = ~>
+ upload() {
@browser.select-local-file!
- @refs.ctx.close!
+ this.refs.ctx.close!
- @url-upload = ~>
+ url-upload() {
@browser.url-upload!
- @refs.ctx.close!
+ this.refs.ctx.close!
</script>
</mk-drive-browser-base-contextmenu>
diff --git a/src/web/app/desktop/tags/drive/browser-window.tag b/src/web/app/desktop/tags/drive/browser-window.tag
index c975427893..c36726444f 100644
--- a/src/web/app/desktop/tags/drive/browser-window.tag
+++ b/src/web/app/desktop/tags/drive/browser-window.tag
@@ -28,19 +28,19 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @folder = if @opts.folder? then @opts.folder else null
+ this.folder = if this.opts.folder? then this.opts.folder else null
- @on \mount ~>
- @refs.window.on \closed ~>
- @unmount!
+ this.on('mount', () => {
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @api \drive .then (info) ~>
+ this.api 'drive' .then (info) =>
@update do
usage: info.usage / info.capacity * 100
- @close = ~>
- @refs.window.close!
+ close() {
+ this.refs.window.close!
</script>
</mk-drive-browser-window>
diff --git a/src/web/app/desktop/tags/drive/browser.tag b/src/web/app/desktop/tags/drive/browser.tag
index 1e8448dab2..02c886d14d 100644
--- a/src/web/app/desktop/tags/drive/browser.tag
+++ b/src/web/app/desktop/tags/drive/browser.tag
@@ -238,211 +238,211 @@
</style>
<script>
- @mixin \api
- @mixin \dialog
- @mixin \input-dialog
- @mixin \stream
+ this.mixin('api');
+ this.mixin('dialog');
+ this.mixin('input-dialog');
+ this.mixin('stream');
- @files = []
- @folders = []
- @hierarchy-folders = []
+ this.files = []
+ this.folders = []
+ this.hierarchy-folders = []
- @uploads = []
+ this.uploads = []
- # 現在の階層(フォルダ)
- # * null でルートを表す
- @folder = null
+ // 現在の階層(フォルダ)
+ // * null でルートを表す
+ this.folder = null
- @multiple = if @opts.multiple? then @opts.multiple else false
+ this.multiple = if this.opts.multiple? then this.opts.multiple else false
- # ドロップされようとしているか
- @draghover = false
+ // ドロップされようとしているか
+ this.draghover = false
- # 自信の所有するアイテムがドラッグをスタートさせたか
- # (自分自身の階層にドロップできないようにするためのフラグ)
- @is-drag-source = false
+ // 自信の所有するアイテムがドラッグをスタートさせたか
+ // (自分自身の階層にドロップできないようにするためのフラグ)
+ this.is-drag-source = false
- @on \mount ~>
- @refs.uploader.on \uploaded (file) ~>
+ this.on('mount', () => {
+ this.refs.uploader.on('uploaded', (file) => {
@add-file file, true
- @refs.uploader.on \change-uploads (uploads) ~>
- @uploads = uploads
- @update!
+ this.refs.uploader.on('change-uploads', (uploads) => {
+ this.uploads = uploads
+ this.update();
- @stream.on \drive_file_created @on-stream-drive-file-created
- @stream.on \drive_file_updated @on-stream-drive-file-updated
- @stream.on \drive_folder_created @on-stream-drive-folder-created
- @stream.on \drive_folder_updated @on-stream-drive-folder-updated
+ @stream.on 'drive_file_created' this.on-stream-drive-file-created
+ @stream.on 'drive_file_updated' this.on-stream-drive-file-updated
+ @stream.on 'drive_folder_created' this.on-stream-drive-folder-created
+ @stream.on 'drive_folder_updated' this.on-stream-drive-folder-updated
- # Riotのバグでnullを渡しても""になる
- # https://github.com/riot/riot/issues/2080
- #if @opts.folder?
- if @opts.folder? and @opts.folder != ''
- @move @opts.folder
+ // Riotのバグでnullを渡しても""になる
+ // https://github.com/riot/riot/issues/2080
+ #if this.opts.folder?
+ if this.opts.folder? and this.opts.folder != ''
+ @move this.opts.folder
else
@load!
- @on \unmount ~>
- @stream.off \drive_file_created @on-stream-drive-file-created
- @stream.off \drive_file_updated @on-stream-drive-file-updated
- @stream.off \drive_folder_created @on-stream-drive-folder-created
- @stream.off \drive_folder_updated @on-stream-drive-folder-updated
+ this.on('unmount', () => {
+ @stream.off 'drive_file_created' this.on-stream-drive-file-created
+ @stream.off 'drive_file_updated' this.on-stream-drive-file-updated
+ @stream.off 'drive_folder_created' this.on-stream-drive-folder-created
+ @stream.off 'drive_folder_updated' this.on-stream-drive-folder-updated
- @on-stream-drive-file-created = (file) ~>
+ on-stream-drive-file-created(file) {
@add-file file, true
- @on-stream-drive-file-updated = (file) ~>
+ on-stream-drive-file-updated(file) {
current = if @folder? then @folder.id else null
if current != file.folder_id
@remove-file file
else
@add-file file, true
- @on-stream-drive-folder-created = (folder) ~>
+ on-stream-drive-folder-created(folder) {
@add-folder folder, true
- @on-stream-drive-folder-updated = (folder) ~>
+ on-stream-drive-folder-updated(folder) {
current = if @folder? then @folder.id else null
if current != folder.parent_id
@remove-folder folder
else
@add-folder folder, true
- @onmousedown = (e) ~>
- if (contains @refs.folders-container, e.target) or (contains @refs.files-container, e.target)
+ onmousedown(e) {
+ if (contains this.refs.folders-container, e.target) or (contains this.refs.files-container, e.target)
return true
- rect = @refs.main.get-bounding-client-rect!
+ rect = this.refs.main.get-bounding-client-rect!
- left = e.page-x + @refs.main.scroll-left - rect.left - window.page-x-offset
- top = e.page-y + @refs.main.scroll-top - rect.top - window.page-y-offset
+ left = e.page-x + this.refs.main.scroll-left - rect.left - window.page-x-offset
+ top = e.page-y + this.refs.main.scroll-top - rect.top - window.page-y-offset
- move = (e) ~>
- @refs.selection.style.display = \block
+ move = (e) =>
+ this.refs.selection.style.display = 'block'
- cursor-x = e.page-x + @refs.main.scroll-left - rect.left - window.page-x-offset
- cursor-y = e.page-y + @refs.main.scroll-top - rect.top - window.page-y-offset
+ cursor-x = e.page-x + this.refs.main.scroll-left - rect.left - window.page-x-offset
+ cursor-y = e.page-y + this.refs.main.scroll-top - rect.top - window.page-y-offset
w = cursor-x - left
h = cursor-y - top
if w > 0
- @refs.selection.style.width = w + \px
- @refs.selection.style.left = left + \px
+ this.refs.selection.style.width = w + 'px'
+ this.refs.selection.style.left = left + 'px'
else
- @refs.selection.style.width = -w + \px
- @refs.selection.style.left = cursor-x + \px
+ this.refs.selection.style.width = -w + 'px'
+ this.refs.selection.style.left = cursor-x + 'px'
if h > 0
- @refs.selection.style.height = h + \px
- @refs.selection.style.top = top + \px
+ this.refs.selection.style.height = h + 'px'
+ this.refs.selection.style.top = top + 'px'
else
- @refs.selection.style.height = -h + \px
- @refs.selection.style.top = cursor-y + \px
+ this.refs.selection.style.height = -h + 'px'
+ this.refs.selection.style.top = cursor-y + 'px'
- up = (e) ~>
- document.document-element.remove-event-listener \mousemove move
- document.document-element.remove-event-listener \mouseup up
+ up = (e) =>
+ document.document-element.remove-event-listener 'mousemove' move
+ document.document-element.remove-event-listener 'mouseup' up
- @refs.selection.style.display = \none
+ this.refs.selection.style.display = 'none'
- document.document-element.add-event-listener \mousemove move
- document.document-element.add-event-listener \mouseup up
+ document.document-element.add-event-listener 'mousemove' move
+ document.document-element.add-event-listener 'mouseup' up
- @path-oncontextmenu = (e) ~>
+ path-oncontextmenu(e) {
e.prevent-default!
e.stop-immediate-propagation!
return false
- @ondragover = (e) ~>
+ ondragover(e) {
e.prevent-default!
e.stop-propagation!
- # ドラッグ元が自分自身の所有するアイテムかどうか
+ // ドラッグ元が自分自身の所有するアイテムかどうか
if !@is-drag-source
- # ドラッグされてきたものがファイルだったら
- if e.data-transfer.effect-allowed == \all
- e.data-transfer.drop-effect = \copy
+ // ドラッグされてきたものがファイルだったら
+ if e.data-transfer.effect-allowed == 'all'
+ e.data-transfer.drop-effect = 'copy'
else
- e.data-transfer.drop-effect = \move
- @draghover = true
+ e.data-transfer.drop-effect = 'move'
+ this.draghover = true
else
- # 自分自身にはドロップさせない
- e.data-transfer.drop-effect = \none
+ // 自分自身にはドロップさせない
+ e.data-transfer.drop-effect = 'none'
return false
- @ondragenter = (e) ~>
+ ondragenter(e) {
e.prevent-default!
if !@is-drag-source
- @draghover = true
+ this.draghover = true
- @ondragleave = (e) ~>
- @draghover = false
+ ondragleave(e) {
+ this.draghover = false
- @ondrop = (e) ~>
+ ondrop(e) {
e.prevent-default!
e.stop-propagation!
- @draghover = false
+ this.draghover = false
- # ドロップされてきたものがファイルだったら
+ // ドロップされてきたものがファイルだったら
if e.data-transfer.files.length > 0
- Array.prototype.for-each.call e.data-transfer.files, (file) ~>
+ Array.prototype.for-each.call e.data-transfer.files, (file) =>
@upload file, @folder
return false
- # データ取得
+ // データ取得
data = e.data-transfer.get-data 'text'
if !data?
return false
- # パース
+ // パース
obj = JSON.parse data
- # (ドライブの)ファイルだったら
- if obj.type == \file
+ // (ドライブの)ファイルだったら
+ if obj.type == 'file'
file = obj.id
- if (@files.some (f) ~> f.id == file)
+ if (@files.some (f) => f.id == file)
return false
@remove-file file
- @api \drive/files/update do
+ this.api 'drive/files/update' do
file_id: file
folder_id: if @folder? then @folder.id else null
- .then ~>
- # something
- .catch (err, text-status) ~>
+ .then =>
+ // something
+ .catch (err, text-status) =>
console.error err
- # (ドライブの)フォルダーだったら
- else if obj.type == \folder
+ // (ドライブの)フォルダーだったら
+ else if obj.type == 'folder'
folder = obj.id
- # 移動先が自分自身ならreject
+ // 移動先が自分自身ならreject
if @folder? and folder == @folder.id
return false
- if (@folders.some (f) ~> f.id == folder)
+ if (@folders.some (f) => f.id == folder)
return false
@remove-folder folder
- @api \drive/folders/update do
+ this.api 'drive/folders/update' do
folder_id: folder
parent_id: if @folder? then @folder.id else null
- .then ~>
- # something
- .catch (err) ~>
+ .then =>
+ // something
+ .catch (err) =>
if err == 'detected-circular-definition'
@dialog do
'<i class="fa fa-exclamation-triangle"></i>操作を完了できません'
'移動先のフォルダーは、移動するフォルダーのサブフォルダーです。'
[
- text: \OK
+ text: 'OK'
]
return false
- @oncontextmenu = (e) ~>
+ oncontextmenu(e) {
e.prevent-default!
e.stop-immediate-propagation!
- ctx = document.body.append-child document.create-element \mk-drive-browser-base-contextmenu
+ ctx = document.body.appendChild document.createElement 'mk-drive-browser-base-contextmenu'
ctx = riot.mount ctx, do
browser: @
ctx = ctx.0
@@ -452,17 +452,17 @@
return false
- @select-local-file = ~>
- @refs.file-input.click!
+ select-local-file() {
+ this.refs.file-input.click!
- @url-upload = ~>
+ url-upload() {
url <~ @input-dialog do
'URLアップロード'
'アップロードしたいファイルのURL'
null
if url? and url != ''
- @api \drive/files/upload_from_url do
+ this.api 'drive/files/upload_from_url' do
url: url
folder_id: if @folder? then @folder.id else undefined
@@ -470,61 +470,61 @@
'<i class="fa fa-check"></i>アップロードをリクエストしました'
'アップロードが完了するまで時間がかかる場合があります。'
[
- text: \OK
+ text: 'OK'
]
- @create-folder = ~>
+ create-folder() {
name <~ @input-dialog do
'フォルダー作成'
'フォルダー名'
null
- @api \drive/folders/create do
+ this.api 'drive/folders/create' do
name: name
folder_id: if @folder? then @folder.id else undefined
- .then (folder) ~>
+ .then (folder) =>
@add-folder folder, true
- @update!
- .catch (err) ~>
+ this.update();
+ .catch (err) =>
console.error err
- @change-file-input = ~>
- files = @refs.file-input.files
+ change-file-input() {
+ files = this.refs.file-input.files
for i from 0 to files.length - 1
file = files.item i
@upload file, @folder
- @upload = (file, folder) ~>
- if folder? and typeof folder == \object
+ upload(file, folder) {
+ if folder? and typeof folder == 'object'
folder = folder.id
- @refs.uploader.upload file, folder
+ this.refs.uploader.upload file, folder
- @get-selection = ~>
+ get-selection() {
@files.filter (file) -> file._selected
- @new-window = (folder-id) ~>
- browser = document.body.append-child document.create-element \mk-drive-browser-window
+ new-window(folder-id) {
+ browser = document.body.appendChild document.createElement 'mk-drive-browser-window'
riot.mount browser, do
folder: folder-id
- @move = (target-folder) ~>
- if target-folder? and typeof target-folder == \object
+ move(target-folder) {
+ if target-folder? and typeof target-folder == 'object'
target-folder = target-folder.id
if target-folder == null
@go-root!
return
- @loading = true
- @update!
+ this.loading = true
+ this.update();
- @api \drive/folders/show do
+ this.api 'drive/folders/show' do
folder_id: target-folder
- .then (folder) ~>
- @folder = folder
- @hierarchy-folders = []
+ .then (folder) =>
+ this.folder = folder
+ this.hierarchy-folders = []
- x = (f) ~>
+ x = (f) =>
@hierarchy-folders.unshift f
if f.parent?
x f.parent
@@ -532,20 +532,20 @@
if folder.parent?
x folder.parent
- @update!
+ this.update();
@load!
.catch (err, text-status) ->
console.error err
- @add-folder = (folder, unshift = false) ~>
+ add-folder(folder, unshift = false) {
current = if @folder? then @folder.id else null
if current != folder.parent_id
return
- if (@folders.some (f) ~> f.id == folder.id)
+ if (@folders.some (f) => f.id == folder.id)
exist = (@folders.map (f) -> f.id).index-of folder.id
@folders[exist] = folder
- @update!
+ this.update();
return
if unshift
@@ -553,17 +553,17 @@
else
@folders.push folder
- @update!
+ this.update();
- @add-file = (file, unshift = false) ~>
+ add-file(file, unshift = false) {
current = if @folder? then @folder.id else null
if current != file.folder_id
return
- if (@files.some (f) ~> f.id == file.id)
+ if (@files.some (f) => f.id == file.id)
exist = (@files.map (f) -> f.id).index-of file.id
@files[exist] = file
- @update!
+ this.update();
return
if unshift
@@ -571,34 +571,34 @@
else
@files.push file
- @update!
+ this.update();
- @remove-folder = (folder) ~>
- if typeof folder == \object
+ remove-folder(folder) {
+ if typeof folder == 'object'
folder = folder.id
- @folders = @folders.filter (f) -> f.id != folder
- @update!
+ this.folders = @folders.filter (f) -> f.id != folder
+ this.update();
- @remove-file = (file) ~>
- if typeof file == \object
+ remove-file(file) {
+ if typeof file == 'object'
file = file.id
- @files = @files.filter (f) -> f.id != file
- @update!
+ this.files = @files.filter (f) -> f.id != file
+ this.update();
- @go-root = ~>
+ go-root() {
if @folder != null
- @folder = null
- @hierarchy-folders = []
- @update!
+ this.folder = null
+ this.hierarchy-folders = []
+ this.update();
@load!
- @load = ~>
- @folders = []
- @files = []
- @more-folders = false
- @more-files = false
- @loading = true
- @update!
+ load() {
+ this.folders = []
+ this.files = []
+ this.more-folders = false
+ this.more-files = false
+ this.loading = true
+ this.update();
load-folders = null
load-files = null
@@ -606,41 +606,41 @@
folders-max = 30
files-max = 30
- # フォルダ一覧取得
- @api \drive/folders do
+ // フォルダ一覧取得
+ this.api 'drive/folders' do
folder_id: if @folder? then @folder.id else null
limit: folders-max + 1
- .then (folders) ~>
+ .then (folders) =>
if folders.length == folders-max + 1
- @more-folders = true
+ this.more-folders = true
folders.pop!
load-folders := folders
complete!
- .catch (err, text-status) ~>
+ .catch (err, text-status) =>
console.error err
- # ファイル一覧取得
- @api \drive/files do
+ // ファイル一覧取得
+ this.api 'drive/files' do
folder_id: if @folder? then @folder.id else null
limit: files-max + 1
- .then (files) ~>
+ .then (files) =>
if files.length == files-max + 1
- @more-files = true
+ this.more-files = true
files.pop!
load-files := files
complete!
- .catch (err, text-status) ~>
+ .catch (err, text-status) =>
console.error err
flag = false
- complete = ~>
+ complete = =>
if flag
- load-folders.for-each (folder) ~>
+ load-folders.for-each (folder) =>
@add-folder folder
- load-files.for-each (file) ~>
+ load-files.for-each (file) =>
@add-file file
- @loading = false
- @update!
+ this.loading = false
+ this.update();
else
flag := true
diff --git a/src/web/app/desktop/tags/drive/file-contextmenu.tag b/src/web/app/desktop/tags/drive/file-contextmenu.tag
index a2c9eb3f4e..69073bd29f 100644
--- a/src/web/app/desktop/tags/drive/file-contextmenu.tag
+++ b/src/web/app/desktop/tags/drive/file-contextmenu.tag
@@ -38,60 +38,60 @@
</ul>
</mk-contextmenu>
<script>
- @mixin \api
- @mixin \i
- @mixin \update-avatar
- @mixin \update-banner
- @mixin \update-wallpaper
- @mixin \input-dialog
- @mixin \NotImplementedException
+ this.mixin('api');
+ this.mixin('i');
+ this.mixin('update-avatar');
+ this.mixin('update-banner');
+ this.mixin('update-wallpaper');
+ this.mixin('input-dialog');
+ this.mixin('NotImplementedException');
- @browser = @opts.browser
- @file = @opts.file
+ this.browser = this.opts.browser
+ this.file = this.opts.file
- @on \mount ~>
- @refs.ctx.on \closed ~>
- @trigger \closed
- @unmount!
+ this.on('mount', () => {
+ this.refs.ctx.on('closed', () => {
+ this.trigger('closed');
+ this.unmount();
- @open = (pos) ~>
- @refs.ctx.open pos
+ open(pos) {
+ this.refs.ctx.open pos
- @rename = ~>
- @refs.ctx.close!
+ rename() {
+ this.refs.ctx.close!
name <~ @input-dialog do
'ファイル名の変更'
'新しいファイル名を入力してください'
@file.name
- @api \drive/files/update do
+ this.api 'drive/files/update' do
file_id: @file.id
name: name
- .then ~>
- # something
- .catch (err) ~>
+ .then =>
+ // something
+ .catch (err) =>
console.error err
- @copy-url = ~>
+ copy-url() {
@NotImplementedException!
- @download = ~>
- @refs.ctx.close!
+ download() {
+ this.refs.ctx.close!
- @set-avatar = ~>
- @refs.ctx.close!
+ set-avatar() {
+ this.refs.ctx.close!
@update-avatar @I, null, @file
- @set-banner = ~>
- @refs.ctx.close!
+ set-banner() {
+ this.refs.ctx.close!
@update-banner @I, null, @file
- @set-wallpaper = ~>
- @refs.ctx.close!
+ set-wallpaper() {
+ this.refs.ctx.close!
@update-wallpaper @I, null, @file
- @add-app = ~>
+ add-app() {
@NotImplementedException!
</script>
</mk-drive-browser-file-contextmenu>
diff --git a/src/web/app/desktop/tags/drive/file.tag b/src/web/app/desktop/tags/drive/file.tag
index 252e5ab1de..e86948aee0 100644
--- a/src/web/app/desktop/tags/drive/file.tag
+++ b/src/web/app/desktop/tags/drive/file.tag
@@ -144,40 +144,40 @@
</style>
<script>
- @bytes-to-size = require '../../../common/scripts/bytes-to-size.js'
+ this.bytes-to-size = require('../../../common/scripts/bytes-to-size.js');
- @mixin \i
+ this.mixin('i');
- @file = @opts.file
- @browser = @parent
+ this.file = this.opts.file
+ this.browser = this.parent
- @title = @file.name + '\n' + @file.type + ' ' + (@bytes-to-size @file.datasize)
+ this.title = @file.name + '\n' + @file.type + ' ' + (@bytes-to-size @file.datasize)
- @is-contextmenu-showing = false
+ this.is-contextmenu-showing = false
- @onclick = ~>
+ onclick() {
if @browser.multiple
if @file._selected?
@file._selected = !@file._selected
else
@file._selected = true
- @browser.trigger \change-selection @browser.get-selection!
+ @browser.trigger 'change-selection' @browser.get-selection!
else
if @file._selected
- @browser.trigger \selected @file
+ @browser.trigger 'selected' @file
else
- @browser.files.for-each (file) ~>
+ @browser.files.for-each (file) =>
file._selected = false
@file._selected = true
- @browser.trigger \change-selection @file
+ @browser.trigger 'change-selection' @file
- @oncontextmenu = (e) ~>
+ oncontextmenu(e) {
e.prevent-default!
e.stop-immediate-propagation!
- @is-contextmenu-showing = true
- @update!
- ctx = document.body.append-child document.create-element \mk-drive-browser-file-contextmenu
+ this.is-contextmenu-showing = true
+ this.update();
+ ctx = document.body.appendChild document.createElement 'mk-drive-browser-file-contextmenu'
ctx = riot.mount ctx, do
browser: @browser
file: @file
@@ -185,25 +185,25 @@
ctx.open do
x: e.page-x - window.page-x-offset
y: e.page-y - window.page-y-offset
- ctx.on \closed ~>
- @is-contextmenu-showing = false
- @update!
+ ctx.on('closed', () => {
+ this.is-contextmenu-showing = false
+ this.update();
return false
- @ondragstart = (e) ~>
- e.data-transfer.effect-allowed = \move
+ ondragstart(e) {
+ e.data-transfer.effect-allowed = 'move'
e.data-transfer.set-data 'text' JSON.stringify do
- type: \file
+ type: 'file'
id: @file.id
file: @file
- @is-dragging = true
+ this.is-dragging = true
- # 親ブラウザに対して、ドラッグが開始されたフラグを立てる
- # (=あなたの子供が、ドラッグを開始しましたよ)
+ // 親ブラウザに対して、ドラッグが開始されたフラグを立てる
+ // (=あなたの子供が、ドラッグを開始しましたよ)
@browser.is-drag-source = true
- @ondragend = (e) ~>
- @is-dragging = false
+ ondragend(e) {
+ this.is-dragging = false
@browser.is-drag-source = false
</script>
</mk-drive-browser-file>
diff --git a/src/web/app/desktop/tags/drive/folder-contextmenu.tag b/src/web/app/desktop/tags/drive/folder-contextmenu.tag
index aea0904aa9..20cb264e5d 100644
--- a/src/web/app/desktop/tags/drive/folder-contextmenu.tag
+++ b/src/web/app/desktop/tags/drive/folder-contextmenu.tag
@@ -18,49 +18,49 @@
</ul>
</mk-contextmenu>
<script>
- @mixin \api
- @mixin \input-dialog
+ this.mixin('api');
+ this.mixin('input-dialog');
- @browser = @opts.browser
- @folder = @opts.folder
+ this.browser = this.opts.browser
+ this.folder = this.opts.folder
- @open = (pos) ~>
- @refs.ctx.open pos
+ open(pos) {
+ this.refs.ctx.open pos
- @refs.ctx.on \closed ~>
- @trigger \closed
- @unmount!
+ this.refs.ctx.on('closed', () => {
+ this.trigger('closed');
+ this.unmount();
- @move = ~>
+ move() {
@browser.move @folder.id
- @refs.ctx.close!
+ this.refs.ctx.close!
- @new-window = ~>
+ new-window() {
@browser.new-window @folder.id
- @refs.ctx.close!
+ this.refs.ctx.close!
- @create-folder = ~>
+ create-folder() {
@browser.create-folder!
- @refs.ctx.close!
+ this.refs.ctx.close!
- @upload = ~>
+ upload() {
@browser.select-lcoal-file!
- @refs.ctx.close!
+ this.refs.ctx.close!
- @rename = ~>
- @refs.ctx.close!
+ rename() {
+ this.refs.ctx.close!
name <~ @input-dialog do
'フォルダ名の変更'
'新しいフォルダ名を入力してください'
@folder.name
- @api \drive/folders/update do
+ this.api 'drive/folders/update' do
folder_id: @folder.id
name: name
- .then ~>
- # something
- .catch (err) ~>
+ .then =>
+ // something
+ .catch (err) =>
console.error err
</script>
</mk-drive-browser-folder-contextmenu>
diff --git a/src/web/app/desktop/tags/drive/folder.tag b/src/web/app/desktop/tags/drive/folder.tag
index b6d52f19e6..e14f70f419 100644
--- a/src/web/app/desktop/tags/drive/folder.tag
+++ b/src/web/app/desktop/tags/drive/folder.tag
@@ -50,124 +50,124 @@
</style>
<script>
- @mixin \api
- @mixin \dialog
+ this.mixin('api');
+ this.mixin('dialog');
- @folder = @opts.folder
- @browser = @parent
+ this.folder = this.opts.folder
+ this.browser = this.parent
- @title = @folder.name
- @hover = false
- @draghover = false
- @is-contextmenu-showing = false
+ this.title = @folder.name
+ this.hover = false
+ this.draghover = false
+ this.is-contextmenu-showing = false
- @onclick = ~>
+ onclick() {
@browser.move @folder
- @onmouseover = ~>
- @hover = true
+ onmouseover() {
+ this.hover = true
- @onmouseout = ~>
- @hover = false
+ onmouseout() {
+ this.hover = false
- @ondragover = (e) ~>
+ ondragover(e) {
e.prevent-default!
e.stop-propagation!
- # 自分自身がドラッグされていない場合
+ // 自分自身がドラッグされていない場合
if !@is-dragging
- # ドラッグされてきたものがファイルだったら
- if e.data-transfer.effect-allowed == \all
- e.data-transfer.drop-effect = \copy
+ // ドラッグされてきたものがファイルだったら
+ if e.data-transfer.effect-allowed == 'all'
+ e.data-transfer.drop-effect = 'copy'
else
- e.data-transfer.drop-effect = \move
+ e.data-transfer.drop-effect = 'move'
else
- # 自分自身にはドロップさせない
- e.data-transfer.drop-effect = \none
+ // 自分自身にはドロップさせない
+ e.data-transfer.drop-effect = 'none'
return false
- @ondragenter = ~>
+ ondragenter() {
if !@is-dragging
- @draghover = true
+ this.draghover = true
- @ondragleave = ~>
- @draghover = false
+ ondragleave() {
+ this.draghover = false
- @ondrop = (e) ~>
+ ondrop(e) {
e.stop-propagation!
- @draghover = false
+ this.draghover = false
- # ファイルだったら
+ // ファイルだったら
if e.data-transfer.files.length > 0
- Array.prototype.for-each.call e.data-transfer.files, (file) ~>
+ Array.prototype.for-each.call e.data-transfer.files, (file) =>
@browser.upload file, @folder
return false
- # データ取得
+ // データ取得
data = e.data-transfer.get-data 'text'
if !data?
return false
- # パース
+ // パース
obj = JSON.parse data
- # (ドライブの)ファイルだったら
- if obj.type == \file
+ // (ドライブの)ファイルだったら
+ if obj.type == 'file'
file = obj.id
@browser.remove-file file
- @api \drive/files/update do
+ this.api 'drive/files/update' do
file_id: file
folder_id: @folder.id
- .then ~>
- # something
- .catch (err, text-status) ~>
+ .then =>
+ // something
+ .catch (err, text-status) =>
console.error err
- # (ドライブの)フォルダーだったら
- else if obj.type == \folder
+ // (ドライブの)フォルダーだったら
+ else if obj.type == 'folder'
folder = obj.id
- # 移動先が自分自身ならreject
+ // 移動先が自分自身ならreject
if folder == @folder.id
return false
@browser.remove-folder folder
- @api \drive/folders/update do
+ this.api 'drive/folders/update' do
folder_id: folder
parent_id: @folder.id
- .then ~>
- # something
- .catch (err) ~>
+ .then =>
+ // something
+ .catch (err) =>
if err == 'detected-circular-definition'
@dialog do
'<i class="fa fa-exclamation-triangle"></i>操作を完了できません'
'移動先のフォルダーは、移動するフォルダーのサブフォルダーです。'
[
- text: \OK
+ text: 'OK'
]
return false
- @ondragstart = (e) ~>
- e.data-transfer.effect-allowed = \move
+ ondragstart(e) {
+ e.data-transfer.effect-allowed = 'move'
e.data-transfer.set-data 'text' JSON.stringify do
- type: \folder
+ type: 'folder'
id: @folder.id
- @is-dragging = true
+ this.is-dragging = true
- # 親ブラウザに対して、ドラッグが開始されたフラグを立てる
- # (=あなたの子供が、ドラッグを開始しましたよ)
+ // 親ブラウザに対して、ドラッグが開始されたフラグを立てる
+ // (=あなたの子供が、ドラッグを開始しましたよ)
@browser.is-drag-source = true
- @ondragend = (e) ~>
- @is-dragging = false
+ ondragend(e) {
+ this.is-dragging = false
@browser.is-drag-source = false
- @oncontextmenu = (e) ~>
+ oncontextmenu(e) {
e.prevent-default!
e.stop-immediate-propagation!
- @is-contextmenu-showing = true
- @update!
- ctx = document.body.append-child document.create-element \mk-drive-browser-folder-contextmenu
+ this.is-contextmenu-showing = true
+ this.update();
+ ctx = document.body.appendChild document.createElement 'mk-drive-browser-folder-contextmenu'
ctx = riot.mount ctx, do
browser: @browser
folder: @folder
@@ -175,9 +175,9 @@
ctx.open do
x: e.page-x - window.page-x-offset
y: e.page-y - window.page-y-offset
- ctx.on \closed ~>
- @is-contextmenu-showing = false
- @update!
+ ctx.on('closed', () => {
+ this.is-contextmenu-showing = false
+ this.update();
return false
</script>
diff --git a/src/web/app/desktop/tags/drive/nav-folder.tag b/src/web/app/desktop/tags/drive/nav-folder.tag
index 632783d20b..afa6287751 100644
--- a/src/web/app/desktop/tags/drive/nav-folder.tag
+++ b/src/web/app/desktop/tags/drive/nav-folder.tag
@@ -6,90 +6,90 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- # Riotのバグでnullを渡しても""になる
- # https://github.com/riot/riot/issues/2080
- #@folder = @opts.folder
- @folder = if @opts.folder? and @opts.folder != '' then @opts.folder else null
- @browser = @parent
+ // Riotのバグでnullを渡しても""になる
+ // https://github.com/riot/riot/issues/2080
+ #this.folder = this.opts.folder
+ this.folder = if this.opts.folder? and this.opts.folder != '' then this.opts.folder else null
+ this.browser = this.parent
- @hover = false
+ this.hover = false
- @onclick = ~>
+ onclick() {
@browser.move @folder
- @onmouseover = ~>
- @hover = true
+ onmouseover() {
+ this.hover = true
- @onmouseout = ~>
- @hover = false
+ onmouseout() {
+ this.hover = false
- @ondragover = (e) ~>
+ ondragover(e) {
e.prevent-default!
e.stop-propagation!
- # このフォルダがルートかつカレントディレクトリならドロップ禁止
+ // このフォルダがルートかつカレントディレクトリならドロップ禁止
if @folder == null and @browser.folder == null
- e.data-transfer.drop-effect = \none
- # ドラッグされてきたものがファイルだったら
- else if e.data-transfer.effect-allowed == \all
- e.data-transfer.drop-effect = \copy
+ e.data-transfer.drop-effect = 'none'
+ // ドラッグされてきたものがファイルだったら
+ else if e.data-transfer.effect-allowed == 'all'
+ e.data-transfer.drop-effect = 'copy'
else
- e.data-transfer.drop-effect = \move
+ e.data-transfer.drop-effect = 'move'
return false
- @ondragenter = ~>
+ ondragenter() {
if @folder != null or @browser.folder != null
- @draghover = true
+ this.draghover = true
- @ondragleave = ~>
+ ondragleave() {
if @folder != null or @browser.folder != null
- @draghover = false
+ this.draghover = false
- @ondrop = (e) ~>
+ ondrop(e) {
e.stop-propagation!
- @draghover = false
+ this.draghover = false
- # ファイルだったら
+ // ファイルだったら
if e.data-transfer.files.length > 0
- Array.prototype.for-each.call e.data-transfer.files, (file) ~>
+ Array.prototype.for-each.call e.data-transfer.files, (file) =>
@browser.upload file, @folder
return false
- # データ取得
+ // データ取得
data = e.data-transfer.get-data 'text'
if !data?
return false
- # パース
+ // パース
obj = JSON.parse data
- # (ドライブの)ファイルだったら
- if obj.type == \file
+ // (ドライブの)ファイルだったら
+ if obj.type == 'file'
file = obj.id
@browser.remove-file file
- @api \drive/files/update do
+ this.api 'drive/files/update' do
file_id: file
folder_id: if @folder? then @folder.id else null
- .then ~>
- # something
- .catch (err, text-status) ~>
+ .then =>
+ // something
+ .catch (err, text-status) =>
console.error err
- # (ドライブの)フォルダーだったら
- else if obj.type == \folder
+ // (ドライブの)フォルダーだったら
+ else if obj.type == 'folder'
folder = obj.id
- # 移動先が自分自身ならreject
+ // 移動先が自分自身ならreject
if @folder? and folder == @folder.id
return false
@browser.remove-folder folder
- @api \drive/folders/update do
+ this.api 'drive/folders/update' do
folder_id: folder
parent_id: if @folder? then @folder.id else null
- .then ~>
- # something
- .catch (err, text-status) ~>
+ .then =>
+ // something
+ .catch (err, text-status) =>
console.error err
return false
diff --git a/src/web/app/desktop/tags/follow-button.tag b/src/web/app/desktop/tags/follow-button.tag
index 1e82b5ed1a..575c99c700 100644
--- a/src/web/app/desktop/tags/follow-button.tag
+++ b/src/web/app/desktop/tags/follow-button.tag
@@ -67,58 +67,58 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
- @mixin \stream
+ this.mixin('api');
+ this.mixin('is-promise');
+ this.mixin('stream');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
- @init = true
- @wait = false
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
+ this.init = true
+ this.wait = false
- @on \mount ~>
- @user-promise.then (user) ~>
- @user = user
- @init = false
- @update!
- @stream.on \follow @on-stream-follow
- @stream.on \unfollow @on-stream-unfollow
+ this.on('mount', () => {
+ @user-promise.then (user) =>
+ this.user = user
+ this.init = false
+ this.update();
+ @stream.on 'follow' this.on-stream-follow
+ @stream.on 'unfollow' this.on-stream-unfollow
- @on \unmount ~>
- @stream.off \follow @on-stream-follow
- @stream.off \unfollow @on-stream-unfollow
+ this.on('unmount', () => {
+ @stream.off 'follow' this.on-stream-follow
+ @stream.off 'unfollow' this.on-stream-unfollow
- @on-stream-follow = (user) ~>
+ on-stream-follow(user) {
if user.id == @user.id
- @user = user
- @update!
+ this.user = user
+ this.update();
- @on-stream-unfollow = (user) ~>
+ on-stream-unfollow(user) {
if user.id == @user.id
- @user = user
- @update!
+ this.user = user
+ this.update();
- @onclick = ~>
- @wait = true
+ onclick() {
+ this.wait = true
if @user.is_following
- @api \following/delete do
+ this.api 'following/delete' do
user_id: @user.id
- .then ~>
+ .then =>
@user.is_following = false
.catch (err) ->
console.error err
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
else
- @api \following/create do
+ this.api 'following/create' do
user_id: @user.id
- .then ~>
+ .then =>
@user.is_following = true
.catch (err) ->
console.error err
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
</script>
</mk-follow-button>
diff --git a/src/web/app/desktop/tags/following-setuper.tag b/src/web/app/desktop/tags/following-setuper.tag
index 1b2e5aafa0..5faba3e653 100644
--- a/src/web/app/desktop/tags/following-setuper.tag
+++ b/src/web/app/desktop/tags/following-setuper.tag
@@ -123,41 +123,41 @@
</style>
<script>
- @mixin \api
- @mixin \user-preview
+ this.mixin('api');
+ this.mixin('user-preview');
- @users = null
- @loading = true
+ this.users = null
+ this.loading = true
- @limit = 6users
- @page = 0
+ this.limit = 6users
+ this.page = 0
- @on \mount ~>
+ this.on('mount', () => {
@load!
- @load = ~>
- @loading = true
- @users = null
- @update!
+ load() {
+ this.loading = true
+ this.users = null
+ this.update();
- @api \users/recommendation do
+ this.api 'users/recommendation' do
limit: @limit
offset: @limit * @page
- .then (users) ~>
- @loading = false
- @users = users
- @update!
+ .then (users) =>
+ this.loading = false
+ this.users = users
+ this.update();
.catch (err, text-status) ->
console.error err
- @refresh = ~>
+ refresh() {
if @users.length < @limit
- @page = 0
+ this.page = 0
else
@page++
@load!
- @close = ~>
- @unmount!
+ close() {
+ this.unmount();
</script>
</mk-following-setuper>
diff --git a/src/web/app/desktop/tags/go-top.tag b/src/web/app/desktop/tags/go-top.tag
index d43e68ea90..42efaf2f2a 100644
--- a/src/web/app/desktop/tags/go-top.tag
+++ b/src/web/app/desktop/tags/go-top.tag
@@ -1,14 +1,14 @@
<mk-go-top>
<button class="hidden" title="一番上へ"><i class="fa fa-angle-up"></i></button>
<script>
- window.add-event-listener \load @on-scroll
- window.add-event-listener \scroll @on-scroll
- window.add-event-listener \resize @on-scroll
+ window.add-event-listener 'load' this.on-scroll
+ window.add-event-listener 'scroll' this.on-scroll
+ window.add-event-listener 'resize' this.on-scroll
- @on-scroll = ~>
+ on-scroll() {
if $ window .scroll-top! > 500px
- @remove-class \hidden
+ @remove-class 'hidden'
else
- @add-class \hidden
+ @add-class 'hidden'
</script>
</mk-go-top>
diff --git a/src/web/app/desktop/tags/home-widgets/calendar.tag b/src/web/app/desktop/tags/home-widgets/calendar.tag
index 3d62dc60c5..81378b8a7c 100644
--- a/src/web/app/desktop/tags/home-widgets/calendar.tag
+++ b/src/web/app/desktop/tags/home-widgets/calendar.tag
@@ -106,43 +106,43 @@
</style>
<script>
- @draw = ~>
+ draw() {
now = new Date!
nd = now.get-date!
nm = now.get-month!
ny = now.get-full-year!
- @year = ny
- @month = nm + 1
- @day = nd
- @week-day = [\日 \月 \火 \水 \木 \金 \土][now.get-day!]
+ this.year = ny
+ this.month = nm + 1
+ this.day = nd
+ this.week-day = [\日 '月' \火 '水' \木 '金' \土][now.get-day!]
@day-numer = (now - (new Date ny, nm, nd))
@day-denom = 1000ms * 60s * 60m * 24h
- @month-numer = (now - (new Date ny, nm, 1))
- @month-denom = (new Date ny, nm + 1, 1) - (new Date ny, nm, 1)
+ this.month-numer = (now - (new Date ny, nm, 1))
+ this.month-denom = (new Date ny, nm + 1, 1) - (new Date ny, nm, 1)
@year-numer = (now - (new Date ny, 0, 1))
@year-denom = (new Date ny + 1, 0, 1) - (new Date ny, 0, 1)
@day-p = @day-numer / @day-denom * 100
- @month-p = @month-numer / @month-denom * 100
+ this.month-p = @month-numer / @month-denom * 100
@year-p = @year-numer / @year-denom * 100
- @is-holiday =
+ this.is-holiday =
(now.get-day! == 0 or now.get-day! == 6)
- @special =
- | nm == 0 and nd == 1 => \on-new-years-day
+ this.special =
+ | nm == 0 and nd == 1 => 'on-new-years-day'
| _ => false
- @update!
+ this.update();
@draw!
- @on \mount ~>
- @clock = set-interval @draw, 1000ms
+ this.on('mount', () => {
+ this.clock = set-interval @draw, 1000ms
- @on \unmount ~>
+ this.on('unmount', () => {
clear-interval @clock
</script>
</mk-calendar-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/donation.tag b/src/web/app/desktop/tags/home-widgets/donation.tag
index 047ea5011d..57c86a8751 100644
--- a/src/web/app/desktop/tags/home-widgets/donation.tag
+++ b/src/web/app/desktop/tags/home-widgets/donation.tag
@@ -32,5 +32,5 @@
color #999
</style>
- <script>@mixin \user-preview</script>
+ <script>this.mixin('user-preview');</script>
</mk-donation-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/mentions.tag b/src/web/app/desktop/tags/home-widgets/mentions.tag
index d683b0817b..149a302386 100644
--- a/src/web/app/desktop/tags/home-widgets/mentions.tag
+++ b/src/web/app/desktop/tags/home-widgets/mentions.tag
@@ -46,65 +46,65 @@
</style>
<script>
- @mixin \i
- @mixin \api
+ this.mixin('i');
+ this.mixin('api');
- @is-loading = true
- @is-empty = false
- @more-loading = false
- @mode = \all
+ this.is-loading = true
+ this.is-empty = false
+ this.more-loading = false
+ this.mode = 'all'
- @on \mount ~>
- document.add-event-listener \keydown @on-document-keydown
- window.add-event-listener \scroll @on-scroll
+ this.on('mount', () => {
+ document.add-event-listener 'keydown' this.on-document-keydown
+ window.add-event-listener 'scroll' this.on-scroll
- @fetch ~>
- @trigger \loaded
+ @fetch =>
+ this.trigger('loaded');
- @on \unmount ~>
- document.remove-event-listener \keydown @on-document-keydown
- window.remove-event-listener \scroll @on-scroll
+ this.on('unmount', () => {
+ document.remove-event-listener 'keydown' this.on-document-keydown
+ window.remove-event-listener 'scroll' this.on-scroll
- @on-document-keydown = (e) ~>
+ on-document-keydown(e) {
tag = e.target.tag-name.to-lower-case!
- if tag != \input and tag != \textarea
- if e.which == 84 # t
- @refs.timeline.focus!
+ if tag != 'input' and tag != 'textarea'
+ if e.which == 84 // t
+ this.refs.timeline.focus();
- @fetch = (cb) ~>
- @api \posts/mentions do
- following: @mode == \following
- .then (posts) ~>
- @is-loading = false
- @is-empty = posts.length == 0
- @update!
- @refs.timeline.set-posts posts
+ fetch(cb) {
+ this.api 'posts/mentions' do
+ following: @mode == 'following'
+ .then (posts) =>
+ this.is-loading = false
+ this.is-empty = posts.length == 0
+ this.update();
+ this.refs.timeline.set-posts posts
if cb? then cb!
- .catch (err) ~>
+ .catch (err) =>
console.error err
if cb? then cb!
- @more = ~>
- if @more-loading or @is-loading or @refs.timeline.posts.length == 0
+ more() {
+ if @more-loading or @is-loading or this.refs.timeline.posts.length == 0
return
- @more-loading = true
- @update!
- @api \posts/mentions do
- following: @mode == \following
- max_id: @refs.timeline.tail!.id
- .then (posts) ~>
- @more-loading = false
- @update!
- @refs.timeline.prepend-posts posts
- .catch (err) ~>
+ this.more-loading = true
+ this.update();
+ this.api 'posts/mentions' do
+ following: @mode == 'following'
+ max_id: this.refs.timeline.tail!.id
+ .then (posts) =>
+ this.more-loading = false
+ this.update();
+ this.refs.timeline.prepend-posts posts
+ .catch (err) =>
console.error err
- @on-scroll = ~>
+ on-scroll() {
current = window.scroll-y + window.inner-height
if current > document.body.offset-height - 8
@more!
- @set-mode = (mode) ~>
+ set-mode(mode) {
@update do
mode: mode
@fetch!
diff --git a/src/web/app/desktop/tags/home-widgets/notifications.tag b/src/web/app/desktop/tags/home-widgets/notifications.tag
index b09ae976eb..4ed7f63782 100644
--- a/src/web/app/desktop/tags/home-widgets/notifications.tag
+++ b/src/web/app/desktop/tags/home-widgets/notifications.tag
@@ -43,8 +43,8 @@
</style>
<script>
- @settings = ~>
- w = riot.mount document.body.append-child document.create-element \mk-settings-window .0
- w.switch \notification
+ settings() {
+ w = riot.mount document.body.appendChild document.createElement 'mk-settings-window' .0
+ w.switch 'notification'
</script>
</mk-notifications-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/photo-stream.tag b/src/web/app/desktop/tags/home-widgets/photo-stream.tag
index 6ce0fd33f7..9b7756108e 100644
--- a/src/web/app/desktop/tags/home-widgets/photo-stream.tag
+++ b/src/web/app/desktop/tags/home-widgets/photo-stream.tag
@@ -57,31 +57,31 @@
</style>
<script>
- @mixin \api
- @mixin \stream
+ this.mixin('api');
+ this.mixin('stream');
- @images = []
- @initializing = true
+ this.images = []
+ this.initializing = true
- @on \mount ~>
- @stream.on \drive_file_created @on-stream-drive-file-created
+ this.on('mount', () => {
+ @stream.on 'drive_file_created' this.on-stream-drive-file-created
- @api \drive/stream do
+ this.api 'drive/stream' do
type: 'image/*'
limit: 9images
- .then (images) ~>
- @initializing = false
- @images = images
- @update!
+ .then (images) =>
+ this.initializing = false
+ this.images = images
+ this.update();
- @on \unmount ~>
- @stream.off \drive_file_created @on-stream-drive-file-created
+ this.on('unmount', () => {
+ @stream.off 'drive_file_created' this.on-stream-drive-file-created
- @on-stream-drive-file-created = (file) ~>
+ on-stream-drive-file-created(file) {
if /^image\/.+$/.test file.type
@images.unshift file
if @images.length > 9
@images.pop!
- @update!
+ this.update();
</script>
</mk-photo-stream-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/profile.tag b/src/web/app/desktop/tags/home-widgets/profile.tag
index 9f11072b7a..d8d1f61071 100644
--- a/src/web/app/desktop/tags/home-widgets/profile.tag
+++ b/src/web/app/desktop/tags/home-widgets/profile.tag
@@ -41,15 +41,15 @@
</style>
<script>
- @mixin \i
- @mixin \user-preview
- @mixin \update-avatar
- @mixin \update-banner
+ this.mixin('i');
+ this.mixin('user-preview');
+ this.mixin('update-avatar');
+ this.mixin('update-banner');
- @set-avatar = ~>
+ set-avatar() {
@update-avatar @I
- @set-banner = ~>
+ set-banner() {
@update-banner @I
</script>
</mk-profile-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/rss-reader.tag b/src/web/app/desktop/tags/home-widgets/rss-reader.tag
index 0efd5cbecc..6778ea3bbb 100644
--- a/src/web/app/desktop/tags/home-widgets/rss-reader.tag
+++ b/src/web/app/desktop/tags/home-widgets/rss-reader.tag
@@ -64,31 +64,31 @@
</style>
<script>
- @mixin \api
- @mixin \NotImplementedException
+ this.mixin('api');
+ this.mixin('NotImplementedException');
- @url = 'http://news.yahoo.co.jp/pickup/rss.xml'
- @items = []
- @initializing = true
+ this.url = 'http://news.yahoo.co.jp/pickup/rss.xml'
+ this.items = []
+ this.initializing = true
- @on \mount ~>
+ this.on('mount', () => {
@fetch!
- @clock = set-interval @fetch, 60000ms
+ this.clock = set-interval @fetch, 60000ms
- @on \unmount ~>
+ this.on('unmount', () => {
clear-interval @clock
- @fetch = ~>
- @api CONFIG.url + '/api:rss' do
+ fetch() {
+ this.api CONFIG.url + '/api:rss' do
url: @url
- .then (feed) ~>
- @items = feed.rss.channel.item
- @initializing = false
- @update!
+ .then (feed) =>
+ this.items = feed.rss.channel.item
+ this.initializing = false
+ this.update();
.catch (err) ->
console.error err
- @settings = ~>
+ settings() {
@NotImplementedException!
</script>
</mk-rss-reader-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/timeline.tag b/src/web/app/desktop/tags/home-widgets/timeline.tag
index 9f5bb3890e..10918b5e0c 100644
--- a/src/web/app/desktop/tags/home-widgets/timeline.tag
+++ b/src/web/app/desktop/tags/home-widgets/timeline.tag
@@ -32,78 +32,78 @@
</style>
<script>
- @mixin \i
- @mixin \api
- @mixin \stream
+ this.mixin('i');
+ this.mixin('api');
+ this.mixin('stream');
- @is-loading = true
- @is-empty = false
- @more-loading = false
- @no-following = @I.following_count == 0
+ this.is-loading = true
+ this.is-empty = false
+ this.more-loading = false
+ this.no-following = @I.following_count == 0
- @on \mount ~>
- @stream.on \post @on-stream-post
- @stream.on \follow @on-stream-follow
- @stream.on \unfollow @on-stream-unfollow
+ this.on('mount', () => {
+ @stream.on 'post' this.on-stream-post
+ @stream.on 'follow' this.on-stream-follow
+ @stream.on 'unfollow' this.on-stream-unfollow
- document.add-event-listener \keydown @on-document-keydown
- window.add-event-listener \scroll @on-scroll
+ document.add-event-listener 'keydown' this.on-document-keydown
+ window.add-event-listener 'scroll' this.on-scroll
- @load ~>
- @trigger \loaded
+ @load =>
+ this.trigger('loaded');
- @on \unmount ~>
- @stream.off \post @on-stream-post
- @stream.off \follow @on-stream-follow
- @stream.off \unfollow @on-stream-unfollow
+ this.on('unmount', () => {
+ @stream.off 'post' this.on-stream-post
+ @stream.off 'follow' this.on-stream-follow
+ @stream.off 'unfollow' this.on-stream-unfollow
- document.remove-event-listener \keydown @on-document-keydown
- window.remove-event-listener \scroll @on-scroll
+ document.remove-event-listener 'keydown' this.on-document-keydown
+ window.remove-event-listener 'scroll' this.on-scroll
- @on-document-keydown = (e) ~>
+ on-document-keydown(e) {
tag = e.target.tag-name.to-lower-case!
- if tag != \input and tag != \textarea
- if e.which == 84 # t
- @refs.timeline.focus!
+ if tag != 'input' and tag != 'textarea'
+ if e.which == 84 // t
+ this.refs.timeline.focus();
- @load = (cb) ~>
- @api \posts/timeline
- .then (posts) ~>
- @is-loading = false
- @is-empty = posts.length == 0
- @update!
- @refs.timeline.set-posts posts
+ load(cb) {
+ this.api 'posts/timeline'
+ .then (posts) =>
+ this.is-loading = false
+ this.is-empty = posts.length == 0
+ this.update();
+ this.refs.timeline.set-posts posts
if cb? then cb!
- .catch (err) ~>
+ .catch (err) =>
console.error err
if cb? then cb!
- @more = ~>
- if @more-loading or @is-loading or @refs.timeline.posts.length == 0
+ more() {
+ if @more-loading or @is-loading or this.refs.timeline.posts.length == 0
return
- @more-loading = true
- @update!
- @api \posts/timeline do
- max_id: @refs.timeline.tail!.id
- .then (posts) ~>
- @more-loading = false
- @update!
- @refs.timeline.prepend-posts posts
- .catch (err) ~>
+ this.more-loading = true
+ this.update();
+ this.api 'posts/timeline' do
+ max_id: this.refs.timeline.tail!.id
+ .then (posts) =>
+ this.more-loading = false
+ this.update();
+ this.refs.timeline.prepend-posts posts
+ .catch (err) =>
console.error err
- @on-stream-post = (post) ~>
- @is-empty = false
- @update!
- @refs.timeline.add-post post
+ on-stream-post(post) {
+ this.is-empty = false
+ this.update();
+ this.refs.timeline.add-post post
- @on-stream-follow = ~>
+ on-stream-follow() {
@load!
- @on-stream-unfollow = ~>
+ on-stream-unfollow() {
@load!
- @on-scroll = ~>
+ on-scroll() {
current = window.scroll-y + window.inner-height
if current > document.body.offset-height - 8
@more!
diff --git a/src/web/app/desktop/tags/home-widgets/tips.tag b/src/web/app/desktop/tags/home-widgets/tips.tag
index 2552c266d7..c28514bbf2 100644
--- a/src/web/app/desktop/tags/home-widgets/tips.tag
+++ b/src/web/app/desktop/tags/home-widgets/tips.tag
@@ -29,7 +29,7 @@
</style>
<script>
- @tips = [
+ this.tips = [
'<kbd>t</kbd>でタイムラインにフォーカスできます'
'<kbd>p</kbd>または<kbd>n</kbd>で投稿フォームを開きます'
'投稿フォームにはファイルをドラッグ&ドロップできます'
@@ -41,31 +41,31 @@
'MisskeyはMIT Licenseです'
]
- @on \mount ~>
+ this.on('mount', () => {
@set!
- @clock = set-interval @change, 20000ms
+ this.clock = set-interval @change, 20000ms
- @on \unmount ~>
+ this.on('unmount', () => {
clear-interval @clock
- @set = ~>
- @refs.text.innerHTML = @tips[Math.floor Math.random! * @tips.length]
- @update!
+ set() {
+ this.refs.text.innerHTML = @tips[Math.floor Math.random! * @tips.length]
+ this.update();
- @change = ~>
- Velocity @refs.tip, {
+ change() {
+ Velocity this.refs.tip, {
opacity: 0
} {
duration: 500ms
- easing: \linear
+ easing: 'linear'
complete: @set
}
- Velocity @refs.tip, {
+ Velocity this.refs.tip, {
opacity: 1
} {
duration: 500ms
- easing: \linear
+ easing: 'linear'
}
</script>
</mk-tips-home-widget>
diff --git a/src/web/app/desktop/tags/home-widgets/user-recommendation.tag b/src/web/app/desktop/tags/home-widgets/user-recommendation.tag
index 8e94090dc9..b2ec4ba888 100644
--- a/src/web/app/desktop/tags/home-widgets/user-recommendation.tag
+++ b/src/web/app/desktop/tags/home-widgets/user-recommendation.tag
@@ -109,42 +109,42 @@
</style>
<script>
- @mixin \api
- @mixin \user-preview
+ this.mixin('api');
+ this.mixin('user-preview');
- @users = null
- @loading = true
+ this.users = null
+ this.loading = true
- @limit = 3users
- @page = 0
+ this.limit = 3users
+ this.page = 0
- @on \mount ~>
+ this.on('mount', () => {
@fetch!
- @clock = set-interval ~>
+ this.clock = set-interval =>
if @users.length < @limit
@fetch true
, 60000ms
- @on \unmount ~>
+ this.on('unmount', () => {
clear-interval @clock
- @fetch = (quiet = false) ~>
- @loading = true
- @users = null
- if not quiet then @update!
- @api \users/recommendation do
+ fetch(quiet = false) {
+ this.loading = true
+ this.users = null
+ if not quiet then this.update();
+ this.api 'users/recommendation' do
limit: @limit
offset: @limit * @page
- .then (users) ~>
- @loading = false
- @users = users
- @update!
+ .then (users) =>
+ this.loading = false
+ this.users = users
+ this.update();
.catch (err, text-status) ->
console.error err
- @refresh = ~>
+ refresh() {
if @users.length < @limit
- @page = 0
+ this.page = 0
else
@page++
@fetch!
diff --git a/src/web/app/desktop/tags/home.tag b/src/web/app/desktop/tags/home.tag
index b2ba4e2806..182f557b78 100644
--- a/src/web/app/desktop/tags/home.tag
+++ b/src/web/app/desktop/tags/home.tag
@@ -58,33 +58,33 @@
</style>
<script>
- @mixin \i
- @mode = @opts.mode || \timeline
+ this.mixin('i');
+ this.mode = this.opts.mode || 'timeline'
- # https://github.com/riot/riot/issues/2080
- if @mode == '' then @mode = \timeline
+ // https://github.com/riot/riot/issues/2080
+ if @mode == '' then this.mode = 'timeline'
- @home = []
+ this.home = []
- @on \mount ~>
- @refs.tl.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.tl.on('loaded', () => {
+ this.trigger('loaded');
- @I.data.home.for-each (widget) ~>
+ @I.data.home.for-each (widget) =>
try
- el = document.create-element \mk- + widget.name + \-home-widget
+ el = document.createElement 'mk-' + widget.name + '-home-widget'
switch widget.place
- | \left => @refs.left.append-child el
- | \right => @refs.right.append-child el
+ | 'left' => this.refs.left.appendChild el
+ | 'right' => this.refs.right.appendChild el
@home.push (riot.mount el, do
id: widget.id
data: widget.data
.0)
catch e
- # noop
+ // noop
- @on \unmount ~>
- @home.for-each (widget) ~>
+ this.on('unmount', () => {
+ @home.for-each (widget) =>
widget.unmount!
</script>
</mk-home>
diff --git a/src/web/app/desktop/tags/image-dialog.tag b/src/web/app/desktop/tags/image-dialog.tag
index d7660bb953..ae42a968bd 100644
--- a/src/web/app/desktop/tags/image-dialog.tag
+++ b/src/web/app/desktop/tags/image-dialog.tag
@@ -35,41 +35,41 @@
</style>
<script>
- @image = @opts.image
+ this.image = this.opts.image
- @on \mount ~>
- Velocity @root, {
+ this.on('mount', () => {
+ Velocity this.root, {
opacity: 1
} {
duration: 100ms
- easing: \linear
+ easing: 'linear'
}
#Velocity @img, {
- # scale: 1
- # opacity: 1
+ // scale: 1
+ // opacity: 1
#} {
- # duration: 200ms
- # easing: \ease-out
+ // duration: 200ms
+ // easing: 'ease-out'
#}
- @close = ~>
- Velocity @root, {
+ close() {
+ Velocity this.root, {
opacity: 0
} {
duration: 100ms
- easing: \linear
- complete: ~> @unmount!
+ easing: 'linear'
+ complete: => this.unmount();
}
#Velocity @img, {
- # scale: 0.9
- # opacity: 0
+ // scale: 0.9
+ // opacity: 0
#} {
- # duration: 200ms
- # easing: \ease-in
- # complete: ~>
- # @unmount!
+ // duration: 200ms
+ // easing: 'ease-in'
+ // complete: =>
+ // this.unmount();
#}
</script>
</mk-image-dialog>
diff --git a/src/web/app/desktop/tags/images-viewer.tag b/src/web/app/desktop/tags/images-viewer.tag
index 017395e7b4..7d552bc9ff 100644
--- a/src/web/app/desktop/tags/images-viewer.tag
+++ b/src/web/app/desktop/tags/images-viewer.tag
@@ -26,19 +26,19 @@
</style>
<script>
- @images = @opts.images
- @image = @images.0
+ this.images = this.opts.images
+ this.image = @images.0
- @mousemove = (e) ~>
- rect = @refs.view.get-bounding-client-rect!
+ mousemove(e) {
+ rect = this.refs.view.get-bounding-client-rect!
mouse-x = e.client-x - rect.left
mouse-y = e.client-y - rect.top
- xp = mouse-x / @refs.view.offset-width * 100
- yp = mouse-y / @refs.view.offset-height * 100
- @refs.view.style.background-position = xp + '% ' + yp + '%'
+ xp = mouse-x / this.refs.view.offset-width * 100
+ yp = mouse-y / this.refs.view.offset-height * 100
+ this.refs.view.style.background-position = xp + '% ' + yp + '%'
- @click = ~>
- dialog = document.body.append-child document.create-element \mk-image-dialog
+ click() {
+ dialog = document.body.appendChild document.createElement 'mk-image-dialog'
riot.mount dialog, do
image: @image
</script>
diff --git a/src/web/app/desktop/tags/input-dialog.tag b/src/web/app/desktop/tags/input-dialog.tag
index d9f4ae3f41..a7dfdb807f 100644
--- a/src/web/app/desktop/tags/input-dialog.tag
+++ b/src/web/app/desktop/tags/input-dialog.tag
@@ -116,40 +116,40 @@
</style>
<script>
- @done = false
+ this.done = false
- @title = @opts.title
- @placeholder = @opts.placeholder
- @default = @opts.default
- @allow-empty = if @opts.allow-empty? then @opts.allow-empty else true
+ this.title = this.opts.title
+ this.placeholder = this.opts.placeholder
+ this.default = this.opts.default
+ this.allow-empty = if this.opts.allow-empty? then this.opts.allow-empty else true
- @on \mount ~>
- @text = @refs.window.refs.text
+ this.on('mount', () => {
+ this.text = this.refs.window.refs.text
if @default?
@text.value = @default
- @text.focus!
+ @text.focus();
- @refs.window.on \closing ~>
+ this.refs.window.on('closing', () => {
if @done
- @opts.on-ok @text.value
+ this.opts.on-ok @text.value
else
- if @opts.on-cancel?
- @opts.on-cancel!
+ if this.opts.on-cancel?
+ this.opts.on-cancel!
- @refs.window.on \closed ~>
- @unmount!
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @cancel = ~>
- @done = false
- @refs.window.close!
+ cancel() {
+ this.done = false
+ this.refs.window.close!
- @ok = ~>
+ ok() {
if not @allow-empty and @text.value == '' then return
- @done = true
- @refs.window.close!
+ this.done = true
+ this.refs.window.close!
- @on-keydown = (e) ~>
- if e.which == 13 # Enter
+ on-keydown(e) {
+ if e.which == 13 // Enter
e.prevent-default!
e.stop-propagation!
@ok!
diff --git a/src/web/app/desktop/tags/list-user.tag b/src/web/app/desktop/tags/list-user.tag
index 03dda494aa..133efd2d1e 100644
--- a/src/web/app/desktop/tags/list-user.tag
+++ b/src/web/app/desktop/tags/list-user.tag
@@ -93,5 +93,5 @@
right 16px
</style>
- <script>@user = @opts.user</script>
+ <script>this.user = this.opts.user</script>
</mk-list-user>
diff --git a/src/web/app/desktop/tags/messaging/room-window.tag b/src/web/app/desktop/tags/messaging/room-window.tag
index a7eddb591e..3cf10ffe16 100644
--- a/src/web/app/desktop/tags/messaging/room-window.tag
+++ b/src/web/app/desktop/tags/messaging/room-window.tag
@@ -19,10 +19,10 @@
</style>
<script>
- @user = @opts.user
+ this.user = this.opts.user
- @on \mount ~>
- @refs.window.on \closed ~>
- @unmount!
+ this.on('mount', () => {
+ this.refs.window.on('closed', () => {
+ this.unmount();
</script>
</mk-messaging-room-window>
diff --git a/src/web/app/desktop/tags/messaging/window.tag b/src/web/app/desktop/tags/messaging/window.tag
index f81fd6681b..2d9a060d6b 100644
--- a/src/web/app/desktop/tags/messaging/window.tag
+++ b/src/web/app/desktop/tags/messaging/window.tag
@@ -19,12 +19,12 @@
</style>
<script>
- @on \mount ~>
- @refs.window.on \closed ~>
- @unmount!
+ this.on('mount', () => {
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @refs.window.refs.index.on \navigate-user (user) ~>
- w = document.body.append-child document.create-element \mk-messaging-room-window
+ this.refs.window.refs.index.on('navigate-user', user => {
+ w = document.body.appendChild document.createElement 'mk-messaging-room-window'
riot.mount w, do
user: user
</script>
diff --git a/src/web/app/desktop/tags/notifications.tag b/src/web/app/desktop/tags/notifications.tag
index 58851786b6..7ef13ad7eb 100644
--- a/src/web/app/desktop/tags/notifications.tag
+++ b/src/web/app/desktop/tags/notifications.tag
@@ -177,34 +177,34 @@
</style>
<script>
- @mixin \api
- @mixin \stream
- @mixin \user-preview
- @mixin \get-post-summary
+ this.mixin('api');
+ this.mixin('stream');
+ this.mixin('user-preview');
+ this.mixin('get-post-summary');
- @notifications = []
- @loading = true
+ this.notifications = []
+ this.loading = true
- @on \mount ~>
- @api \i/notifications
- .then (notifications) ~>
- @notifications = notifications
- @loading = false
- @update!
+ this.on('mount', () => {
+ this.api 'i/notifications'
+ .then (notifications) =>
+ this.notifications = notifications
+ this.loading = false
+ this.update();
.catch (err, text-status) ->
console.error err
- @stream.on \notification @on-notification
+ @stream.on 'notification' this.on-notification
- @on \unmount ~>
- @stream.off \notification @on-notification
+ this.on('unmount', () => {
+ @stream.off 'notification' this.on-notification
- @on-notification = (notification) ~>
+ on-notification(notification) {
@notifications.unshift notification
- @update!
+ this.update();
- @on \update ~>
- @notifications.for-each (notification) ~>
+ this.on('update', () => {
+ @notifications.for-each (notification) =>
date = (new Date notification.created_at).get-date!
month = (new Date notification.created_at).get-month! + 1
notification._date = date
diff --git a/src/web/app/desktop/tags/pages/entrance.tag b/src/web/app/desktop/tags/pages/entrance.tag
index 57d11217cc..227aec3885 100644
--- a/src/web/app/desktop/tags/pages/entrance.tag
+++ b/src/web/app/desktop/tags/pages/entrance.tag
@@ -63,18 +63,18 @@
</style>
<script>
- @mode = \signin
+ this.mode = 'signin'
- @signup = ~>
- @mode = \signup
- @update!
+ signup() {
+ this.mode = 'signup'
+ this.update();
- @signin = ~>
- @mode = \signin
- @update!
+ signin() {
+ this.mode = 'signin'
+ this.update();
- @introduction = ~>
- @mode = \introduction
- @update!
+ introduction() {
+ this.mode = 'introduction'
+ this.update();
</script>
</mk-entrance>
diff --git a/src/web/app/desktop/tags/pages/entrance/signin.tag b/src/web/app/desktop/tags/pages/entrance/signin.tag
index 1a5baac67e..67a449a73d 100644
--- a/src/web/app/desktop/tags/pages/entrance/signin.tag
+++ b/src/web/app/desktop/tags/pages/entrance/signin.tag
@@ -119,12 +119,12 @@
</style>
<script>
- @on \mount ~>
- @refs.signin.on \user (user) ~>
+ this.on('mount', () => {
+ this.refs.signin.on('user', (user) => {
@update do
user: user
- @introduction = ~>
- @parent.introduction!
+ introduction() {
+ this.parent.introduction!
</script>
</mk-entrance-signin>
diff --git a/src/web/app/desktop/tags/pages/home.tag b/src/web/app/desktop/tags/pages/home.tag
index 51e5767704..348762d2d2 100644
--- a/src/web/app/desktop/tags/pages/home.tag
+++ b/src/web/app/desktop/tags/pages/home.tag
@@ -8,40 +8,40 @@
</style>
<script>
- @mixin \i
- @mixin \api
- @mixin \ui-progress
- @mixin \stream
- @mixin \get-post-summary
+ this.mixin('i');
+ this.mixin('api');
+ this.mixin('ui-progress');
+ this.mixin('stream');
+ this.mixin('get-post-summary');
- @unread-count = 0
+ this.unread-count = 0
- @page = switch @opts.mode
- | \timelie => \home
- | \mentions => \mentions
- | _ => \home
+ this.page = switch this.opts.mode
+ | 'timelie' => 'home'
+ | 'mentions' => 'mentions'
+ | _ => 'home'
- @on \mount ~>
- @refs.ui.refs.home.on \loaded ~>
- @Progress.done!
+ this.on('mount', () => {
+ this.refs.ui.refs.home.on('loaded', () => {
+ this.Progress.done();
document.title = 'Misskey'
- @Progress.start!
- @stream.on \post @on-stream-post
- document.add-event-listener \visibilitychange @window-on-visibilitychange, false
+ this.Progress.start();
+ @stream.on 'post' this.on-stream-post
+ document.add-event-listener 'visibilitychange' @window-on-visibilitychange, false
- @on \unmount ~>
- @stream.off \post @on-stream-post
- document.remove-event-listener \visibilitychange @window-on-visibilitychange
+ this.on('unmount', () => {
+ @stream.off 'post' this.on-stream-post
+ document.remove-event-listener 'visibilitychange' @window-on-visibilitychange
- @on-stream-post = (post) ~>
+ on-stream-post(post) {
if document.hidden and post.user_id !== @I.id
@unread-count++
document.title = '(' + @unread-count + ') ' + @get-post-summary post
- @window-on-visibilitychange = ~>
+ window-on-visibilitychange() {
if !document.hidden
- @unread-count = 0
+ this.unread-count = 0
document.title = 'Misskey'
</script>
</mk-home-page>
diff --git a/src/web/app/desktop/tags/pages/post.tag b/src/web/app/desktop/tags/pages/post.tag
index fddc21deab..c3298b890c 100644
--- a/src/web/app/desktop/tags/pages/post.tag
+++ b/src/web/app/desktop/tags/pages/post.tag
@@ -16,17 +16,17 @@
</style>
<script>
- @mixin \ui-progress
+ this.mixin('ui-progress');
- @post = @opts.post
+ this.post = this.opts.post
- @on \mount ~>
- @Progress.start!
+ this.on('mount', () => {
+ this.Progress.start();
- @refs.ui.refs.detail.on \post-fetched ~>
- @Progress.set 0.5
+ this.refs.ui.refs.detail.on('post-fetched', () => {
+ this.Progress.set(0.5);
- @refs.ui.refs.detail.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.detail.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-post-page>
diff --git a/src/web/app/desktop/tags/pages/search.tag b/src/web/app/desktop/tags/pages/search.tag
index 0c5a23c795..fa0ebee0a9 100644
--- a/src/web/app/desktop/tags/pages/search.tag
+++ b/src/web/app/desktop/tags/pages/search.tag
@@ -8,12 +8,12 @@
</style>
<script>
- @mixin \ui-progress
+ this.mixin('ui-progress');
- @on \mount ~>
- @Progress.start!
+ this.on('mount', () => {
+ this.Progress.start();
- @refs.ui.refs.search.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.search.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-search-page>
diff --git a/src/web/app/desktop/tags/pages/user.tag b/src/web/app/desktop/tags/pages/user.tag
index be0501e045..3bbfbe859c 100644
--- a/src/web/app/desktop/tags/pages/user.tag
+++ b/src/web/app/desktop/tags/pages/user.tag
@@ -8,18 +8,18 @@
</style>
<script>
- @mixin \ui-progress
+ this.mixin('ui-progress');
- @user = @opts.user
+ this.user = this.opts.user
- @on \mount ~>
- @Progress.start!
+ this.on('mount', () => {
+ this.Progress.start();
- @refs.ui.refs.user.on \user-fetched (user) ~>
- @Progress.set 0.5
+ this.refs.ui.refs.user.on('user-fetched', (user) => {
+ this.Progress.set(0.5);
document.title = user.name + ' | Misskey'
- @refs.ui.refs.user.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.user.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-user-page>
diff --git a/src/web/app/desktop/tags/post-detail-sub.tag b/src/web/app/desktop/tags/post-detail-sub.tag
index c4a651e371..ccb475c768 100644
--- a/src/web/app/desktop/tags/post-detail-sub.tag
+++ b/src/web/app/desktop/tags/post-detail-sub.tag
@@ -103,38 +103,38 @@
</style>
<script>
- @mixin \api
- @mixin \text
- @mixin \date-stringify
- @mixin \user-preview
+ this.mixin('api');
+ this.mixin('text');
+ this.mixin('date-stringify');
+ this.mixin('user-preview');
- @post = @opts.post
+ this.post = this.opts.post
- @url = CONFIG.url + '/' + @post.user.username + '/' + @post.id
+ this.url = CONFIG.url + '/' + @post.user.username + '/' + @post.id
- @title = @date-stringify @post.created_at
+ this.title = @date-stringify @post.created_at
- @on \mount ~>
+ this.on('mount', () => {
if @post.text?
tokens = @analyze @post.text
- @refs.text.innerHTML = @compile tokens
+ this.refs.text.innerHTML = @compile tokens
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
- @like = ~>
+ like() {
if @post.is_liked
- @api \posts/likes/delete do
+ this.api 'posts/likes/delete' do
post_id: @post.id
- .then ~>
+ .then =>
@post.is_liked = false
- @update!
+ this.update();
else
- @api \posts/likes/create do
+ this.api 'posts/likes/create' do
post_id: @post.id
- .then ~>
+ .then =>
@post.is_liked = true
- @update!
+ this.update();
</script>
</mk-post-detail-sub>
diff --git a/src/web/app/desktop/tags/post-detail.tag b/src/web/app/desktop/tags/post-detail.tag
index 3c99babaaa..0443ff8836 100644
--- a/src/web/app/desktop/tags/post-detail.tag
+++ b/src/web/app/desktop/tags/post-detail.tag
@@ -329,108 +329,108 @@
</style>
<script>
- @mixin \api
- @mixin \text
- @mixin \user-preview
- @mixin \date-stringify
- @mixin \NotImplementedException
+ this.mixin('api');
+ this.mixin('text');
+ this.mixin('user-preview');
+ this.mixin('date-stringify');
+ this.mixin('NotImplementedException');
- @fetching = true
- @loading-context = false
- @content = null
- @post = null
+ this.fetching = true
+ this.loading-context = false
+ this.content = null
+ this.post = null
- @on \mount ~>
+ this.on('mount', () => {
- @api \posts/show do
- post_id: @opts.post
- .then (post) ~>
- @fetching = false
- @post = post
- @trigger \loaded
+ this.api 'posts/show' do
+ post_id: this.opts.post
+ .then (post) =>
+ this.fetching = false
+ this.post = post
+ this.trigger('loaded');
- @is-repost = @post.repost?
- @p = if @is-repost then @post.repost else @post
+ this.is-repost = @post.repost?
+ this.p = if @is-repost then @post.repost else @post
- @title = @date-stringify @p.created_at
+ this.title = @date-stringify @p.created_at
- @update!
+ this.update();
if @p.text?
tokens = @analyze @p.text
- @refs.text.innerHTML = @compile tokens
+ this.refs.text.innerHTML = @compile tokens
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
- # URLをプレビュー
+ // URLをプレビュー
tokens
- .filter (t) -> t.type == \link
- .map (t) ~>
- @preview = @refs.text.append-child document.create-element \mk-url-preview
+ .filter (t) -> t.type == 'link'
+ .map (t) =>
+ this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
riot.mount @preview, do
url: t.content
- # Get likes
- @api \posts/likes do
+ // Get likes
+ this.api 'posts/likes' do
post_id: @p.id
limit: 8
- .then (likes) ~>
- @likes = likes
- @update!
+ .then (likes) =>
+ this.likes = likes
+ this.update();
- # Get reposts
- @api \posts/reposts do
+ // Get reposts
+ this.api 'posts/reposts' do
post_id: @p.id
limit: 8
- .then (reposts) ~>
- @reposts = reposts
- @update!
+ .then (reposts) =>
+ this.reposts = reposts
+ this.update();
- # Get replies
- @api \posts/replies do
+ // Get replies
+ this.api 'posts/replies' do
post_id: @p.id
limit: 8
- .then (replies) ~>
- @replies = replies
- @update!
+ .then (replies) =>
+ this.replies = replies
+ this.update();
- @update!
+ this.update();
- @reply = ~>
- form = document.body.append-child document.create-element \mk-post-form-window
+ reply() {
+ form = document.body.appendChild document.createElement 'mk-post-form-window'
riot.mount form, do
reply: @p
- @repost = ~>
- form = document.body.append-child document.create-element \mk-repost-form-window
+ repost() {
+ form = document.body.appendChild document.createElement 'mk-repost-form-window'
riot.mount form, do
post: @p
- @like = ~>
+ like() {
if @p.is_liked
- @api \posts/likes/delete do
+ this.api 'posts/likes/delete' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = false
- @update!
+ this.update();
else
- @api \posts/likes/create do
+ this.api 'posts/likes/create' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = true
- @update!
+ this.update();
- @load-context = ~>
- @loading-context = true
+ load-context() {
+ this.loading-context = true
- # Get context
- @api \posts/context do
+ // Get context
+ this.api 'posts/context' do
post_id: @p.reply_to_id
- .then (context) ~>
- @context = context.reverse!
- @loading-context = false
- @update!
+ .then (context) =>
+ this.context = context.reverse!
+ this.loading-context = false
+ this.update();
</script>
</mk-post-detail>
diff --git a/src/web/app/desktop/tags/post-form-window.tag b/src/web/app/desktop/tags/post-form-window.tag
index fc1a254e20..bb68de5f06 100644
--- a/src/web/app/desktop/tags/post-form-window.tag
+++ b/src/web/app/desktop/tags/post-form-window.tag
@@ -32,24 +32,24 @@
</style>
<script>
- @uploading-files = []
- @files = []
+ this.uploading-files = []
+ this.files = []
- @on \mount ~>
- @refs.window.refs.form.focus!
+ this.on('mount', () => {
+ this.refs.window.refs.form.focus();
- @refs.window.on \closed ~>
- @unmount!
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @refs.window.refs.form.on \post ~>
- @refs.window.close!
+ this.refs.window.refs.form.on('post', () => {
+ this.refs.window.close!
- @refs.window.refs.form.on \change-uploading-files (files) ~>
- @uploading-files = files
- @update!
+ this.refs.window.refs.form.on('change-uploading-files', (files) => {
+ this.uploading-files = files
+ this.update();
- @refs.window.refs.form.on \change-files (files) ~>
- @files = files
- @update!
+ this.refs.window.refs.form.on('change-files', (files) => {
+ this.files = files
+ this.update();
</script>
</mk-post-form-window>
diff --git a/src/web/app/desktop/tags/post-form.tag b/src/web/app/desktop/tags/post-form.tag
index a0b6ea7d07..760a585ce8 100644
--- a/src/web/app/desktop/tags/post-form.tag
+++ b/src/web/app/desktop/tags/post-form.tag
@@ -305,161 +305,161 @@
</style>
<script>
- get-cat = require '../../common/scripts/get-cat'
+ get-cat = require('../../common/scripts/get-cat');
- @mixin \api
- @mixin \notify
- @mixin \autocomplete
+ this.mixin('api');
+ this.mixin('notify');
+ this.mixin('autocomplete');
- @wait = false
- @uploadings = []
- @files = []
- @autocomplete = null
- @poll = false
+ this.wait = false
+ this.uploadings = []
+ this.files = []
+ this.autocomplete = null
+ this.poll = false
- @in-reply-to-post = @opts.reply
+ this.in-reply-to-post = this.opts.reply
- # https://github.com/riot/riot/issues/2080
- if @in-reply-to-post == '' then @in-reply-to-post = null
+ // https://github.com/riot/riot/issues/2080
+ if @in-reply-to-post == '' then this.in-reply-to-post = null
- @on \mount ~>
- @refs.uploader.on \uploaded (file) ~>
+ this.on('mount', () => {
+ this.refs.uploader.on('uploaded', (file) => {
@add-file file
- @refs.uploader.on \change-uploads (uploads) ~>
- @trigger \change-uploading-files uploads
+ this.refs.uploader.on('change-uploads', (uploads) => {
+ this.trigger 'change-uploading-files' uploads
- @autocomplete = new @Autocomplete @refs.text
+ this.autocomplete = new @Autocomplete this.refs.text
@autocomplete.attach!
- @on \unmount ~>
+ this.on('unmount', () => {
@autocomplete.detach!
- @focus = ~>
- @refs.text.focus!
+ focus() {
+ this.refs.text.focus();
- @clear = ~>
- @refs.text.value = ''
- @files = []
- @trigger \change-files
- @update!
+ clear() {
+ this.refs.text.value = ''
+ this.files = []
+ this.trigger('change-files');
+ this.update();
- @ondragover = (e) ~>
+ ondragover(e) {
e.stop-propagation!
- @draghover = true
- # ドラッグされてきたものがファイルだったら
- if e.data-transfer.effect-allowed == \all
- e.data-transfer.drop-effect = \copy
+ this.draghover = true
+ // ドラッグされてきたものがファイルだったら
+ if e.data-transfer.effect-allowed == 'all'
+ e.data-transfer.drop-effect = 'copy'
else
- e.data-transfer.drop-effect = \move
+ e.data-transfer.drop-effect = 'move'
return false
- @ondragenter = (e) ~>
- @draghover = true
+ ondragenter(e) {
+ this.draghover = true
- @ondragleave = (e) ~>
- @draghover = false
+ ondragleave(e) {
+ this.draghover = false
- @ondrop = (e) ~>
+ ondrop(e) {
e.prevent-default!
e.stop-propagation!
- @draghover = false
+ this.draghover = false
- # ファイルだったら
+ // ファイルだったら
if e.data-transfer.files.length > 0
- Array.prototype.for-each.call e.data-transfer.files, (file) ~>
+ Array.prototype.for-each.call e.data-transfer.files, (file) =>
@upload file
return false
- # データ取得
+ // データ取得
data = e.data-transfer.get-data 'text'
if !data?
return false
try
- # パース
+ // パース
obj = JSON.parse data
- # (ドライブの)ファイルだったら
- if obj.type == \file
+ // (ドライブの)ファイルだったら
+ if obj.type == 'file'
@add-file obj.file
catch
- # ignore
+ // ignore
return false
- @onkeydown = (e) ~>
- if (e.which == 10 || e.which == 13) && (e.ctrl-key || e.meta-key)
+ onkeydown(e) {
+ if (e.which == 10 || e.which == 13) && (e.ctrlKey || e.meta-key)
@post!
- @onpaste = (e) ~>
- data = e.clipboard-data
+ onpaste(e) {
+ data = e.clipboardData
items = data.items
for i from 0 to items.length - 1
item = items[i]
switch (item.kind)
- | \file =>
- @upload item.get-as-file!
+ | 'file' =>
+ @upload item.getAsFile();
- @select-file = ~>
- @refs.file.click!
+ select-file() {
+ this.refs.file.click!
- @select-file-from-drive = ~>
- browser = document.body.append-child document.create-element \mk-select-file-from-drive-window
+ select-file-from-drive() {
+ browser = document.body.appendChild document.createElement 'mk-select-file-from-drive-window'
i = riot.mount browser, do
multiple: true
- i[0].one \selected (files) ~>
+ i[0].one 'selected' (files) =>
files.for-each @add-file
- @change-file = ~>
- files = @refs.file.files
+ change-file() {
+ files = this.refs.file.files
for i from 0 to files.length - 1
file = files.item i
@upload file
- @upload = (file) ~>
- @refs.uploader.upload file
+ upload(file) {
+ this.refs.uploader.upload file
- @add-file = (file) ~>
- file._remove = ~>
- @files = @files.filter (x) -> x.id != file.id
- @trigger \change-files @files
- @update!
+ add-file(file) {
+ file._remove = =>
+ this.files = @files.filter (x) -> x.id != file.id
+ this.trigger 'change-files' @files
+ this.update();
@files.push file
- @trigger \change-files @files
- @update!
+ this.trigger 'change-files' @files
+ this.update();
- @add-poll = ~>
- @poll = true
+ add-poll() {
+ this.poll = true
- @on-poll-destroyed = ~>
+ on-poll-destroyed() {
@update do
poll: false
- @post = (e) ~>
- @wait = true
+ post(e) {
+ this.wait = true
files = if @files? and @files.length > 0
then @files.map (f) -> f.id
else undefined
- @api \posts/create do
- text: @refs.text.value
+ this.api 'posts/create' do
+ text: this.refs.text.value
media_ids: files
reply_to_id: if @in-reply-to-post? then @in-reply-to-post.id else undefined
- poll: if @poll then @refs.poll.get! else undefined
- .then (data) ~>
- @trigger \post
+ poll: if @poll then this.refs.poll.get! else undefined
+ .then (data) =>
+ this.trigger('post');
@notify if @in-reply-to-post? then '返信しました！' else '投稿しました！'
- .catch (err) ~>
+ .catch (err) =>
console.error err
@notify '投稿できませんでした'
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
- @cat = ~>
- @refs.text.value = @refs.text.value + get-cat!
+ cat() {
+ this.refs.text.value = this.refs.text.value + get-cat!
</script>
</mk-post-form>
diff --git a/src/web/app/desktop/tags/post-preview.tag b/src/web/app/desktop/tags/post-preview.tag
index c0514c323e..5ee0a6065d 100644
--- a/src/web/app/desktop/tags/post-preview.tag
+++ b/src/web/app/desktop/tags/post-preview.tag
@@ -83,11 +83,11 @@
</style>
<script>
- @mixin \date-stringify
- @mixin \user-preview
+ this.mixin('date-stringify');
+ this.mixin('user-preview');
- @post = @opts.post
+ this.post = this.opts.post
- @title = @date-stringify @post.created_at
+ this.title = @date-stringify @post.created_at
</script>
</mk-post-preview>
diff --git a/src/web/app/desktop/tags/post-status-graph.tag b/src/web/app/desktop/tags/post-status-graph.tag
index f7c6ea7b11..039c676b10 100644
--- a/src/web/app/desktop/tags/post-status-graph.tag
+++ b/src/web/app/desktop/tags/post-status-graph.tag
@@ -9,64 +9,64 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
+ this.mixin('api');
+ this.mixin('is-promise');
- @post = null
- @post-promise = if @is-promise @opts.post then @opts.post else Promise.resolve @opts.post
+ this.post = null
+ this.post-promise = if @is-promise this.opts.post then this.opts.post else Promise.resolve this.opts.post
- @on \mount ~>
+ this.on('mount', () => {
post <~ @post-promise.then
- @post = post
- @update!
+ this.post = post
+ this.update();
- @api \aggregation/posts/like do
+ this.api 'aggregation/posts/like' do
post_id: @post.id
limit: 30days
- .then (likes) ~>
+ .then (likes) =>
likes = likes.reverse!
- @api \aggregation/posts/repost do
+ this.api 'aggregation/posts/repost' do
post_id: @post.id
limit: 30days
- .then (repost) ~>
+ .then (repost) =>
repost = repost.reverse!
- @api \aggregation/posts/reply do
+ this.api 'aggregation/posts/reply' do
post_id: @post.id
limit: 30days
- .then (replies) ~>
+ .then (replies) =>
replies = replies.reverse!
- new Chart @refs.canv, do
- type: \bar
+ new Chart this.refs.canv, do
+ type: 'bar'
data:
- labels: likes.map (x, i) ~> if i % 3 == 2 then x.date.day + '日' else ''
+ labels: likes.map (x, i) => if i % 3 == 2 then x.date.day + '日' else ''
datasets: [
{
- label: \いいね
- type: \line
- data: likes.map (x) ~> x.count
+ label: 'いいね'
+ type: 'line'
+ data: likes.map (x) => x.count
line-tension: 0
border-width: 2
fill: true
background-color: 'rgba(247, 121, 108, 0.2)'
- point-background-color: \#fff
+ point-background-color: '#fff'
point-radius: 4
point-border-width: 2
- border-color: \#F7796C
+ border-color: '#F7796C'
},
{
- label: \返信
- type: \bar
- data: replies.map (x) ~> x.count
- background-color: \#555
+ label: '返信'
+ type: 'bar'
+ data: replies.map (x) => x.count
+ background-color: '#555'
},
{
- label: \Repost
- type: \bar
- data: repost.map (x) ~> x.count
- background-color: \#a2d61e
+ label: 'Repost'
+ type: 'bar'
+ data: repost.map (x) => x.count
+ background-color: '#a2d61e'
}
]
options:
diff --git a/src/web/app/desktop/tags/progress-dialog.tag b/src/web/app/desktop/tags/progress-dialog.tag
index c60746257b..bb5dea8b43 100644
--- a/src/web/app/desktop/tags/progress-dialog.tag
+++ b/src/web/app/desktop/tags/progress-dialog.tag
@@ -75,20 +75,20 @@
</style>
<script>
- @title = @opts.title
- @value = parse-int @opts.value, 10
- @max = parse-int @opts.max, 10
+ this.title = this.opts.title
+ this.value = parse-int this.opts.value, 10
+ this.max = parse-int this.opts.max, 10
- @on \mount ~>
- @refs.window.on \closed ~>
- @unmount!
+ this.on('mount', () => {
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @update-progress = (value, max) ~>
- @value = parse-int value, 10
- @max = parse-int max, 10
- @update!
+ update-progress(value, max) {
+ this.value = parse-int value, 10
+ this.max = parse-int max, 10
+ this.update();
- @close = ~>
- @refs.window.close!
+ close() {
+ this.refs.window.close!
</script>
</mk-progress-dialog>
diff --git a/src/web/app/desktop/tags/repost-form-window.tag b/src/web/app/desktop/tags/repost-form-window.tag
index 45a0cdae6d..d66f98bb85 100644
--- a/src/web/app/desktop/tags/repost-form-window.tag
+++ b/src/web/app/desktop/tags/repost-form-window.tag
@@ -12,25 +12,25 @@
</style>
<script>
- @on-document-keydown = (e) ~>
+ on-document-keydown(e) {
tag = e.target.tag-name.to-lower-case!
- if tag != \input and tag != \textarea
- if e.which == 27 # Esc
- @refs.window.close!
+ if tag != 'input' and tag != 'textarea'
+ if e.which == 27 // Esc
+ this.refs.window.close!
- @on \mount ~>
- @refs.window.refs.form.on \cancel ~>
- @refs.window.close!
+ this.on('mount', () => {
+ this.refs.window.refs.form.on('cancel', () => {
+ this.refs.window.close!
- @refs.window.refs.form.on \posted ~>
- @refs.window.close!
+ this.refs.window.refs.form.on('posted', () => {
+ this.refs.window.close!
- document.add-event-listener \keydown @on-document-keydown
+ document.add-event-listener 'keydown' this.on-document-keydown
- @refs.window.on \closed ~>
- @unmount!
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @on \unmount ~>
- document.remove-event-listener \keydown @on-document-keydown
+ this.on('unmount', () => {
+ document.remove-event-listener 'keydown' this.on-document-keydown
</script>
</mk-repost-form-window>
diff --git a/src/web/app/desktop/tags/repost-form.tag b/src/web/app/desktop/tags/repost-form.tag
index 2c07ff4b16..58ef564bac 100644
--- a/src/web/app/desktop/tags/repost-form.tag
+++ b/src/web/app/desktop/tags/repost-form.tag
@@ -114,31 +114,31 @@
</style>
<script>
- @mixin \api
- @mixin \notify
+ this.mixin('api');
+ this.mixin('notify');
- @wait = false
- @quote = false
+ this.wait = false
+ this.quote = false
- @cancel = ~>
- @trigger \cancel
+ cancel() {
+ this.trigger('cancel');
- @ok = ~>
- @wait = true
- @api \posts/create do
- repost_id: @opts.post.id
- text: if @quote then @refs.text.value else undefined
- .then (data) ~>
- @trigger \posted
+ ok() {
+ this.wait = true
+ this.api 'posts/create' do
+ repost_id: this.opts.post.id
+ text: if @quote then this.refs.text.value else undefined
+ .then (data) =>
+ this.trigger('posted');
@notify 'Repostしました！'
- .catch (err) ~>
+ .catch (err) =>
console.error err
@notify 'Repostできませんでした'
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
- @onquote = ~>
- @quote = true
+ onquote() {
+ this.quote = true
</script>
</mk-repost-form>
diff --git a/src/web/app/desktop/tags/search-posts.tag b/src/web/app/desktop/tags/search-posts.tag
index 2cc9b788ae..a61a0a0614 100644
--- a/src/web/app/desktop/tags/search-posts.tag
+++ b/src/web/app/desktop/tags/search-posts.tag
@@ -28,59 +28,59 @@
</style>
<script>
- @mixin \api
- @mixin \get-post-summary
+ this.mixin('api');
+ this.mixin('get-post-summary');
- @query = @opts.query
- @is-loading = true
- @is-empty = false
- @more-loading = false
- @page = 0
+ this.query = this.opts.query
+ this.is-loading = true
+ this.is-empty = false
+ this.more-loading = false
+ this.page = 0
- @on \mount ~>
- document.add-event-listener \keydown @on-document-keydown
- window.add-event-listener \scroll @on-scroll
+ this.on('mount', () => {
+ document.add-event-listener 'keydown' this.on-document-keydown
+ window.add-event-listener 'scroll' this.on-scroll
- @api \posts/search do
+ this.api 'posts/search' do
query: @query
- .then (posts) ~>
- @is-loading = false
- @is-empty = posts.length == 0
- @update!
- @refs.timeline.set-posts posts
- @trigger \loaded
- .catch (err) ~>
+ .then (posts) =>
+ this.is-loading = false
+ this.is-empty = posts.length == 0
+ this.update();
+ this.refs.timeline.set-posts posts
+ this.trigger('loaded');
+ .catch (err) =>
console.error err
- @on \unmount ~>
- document.remove-event-listener \keydown @on-document-keydown
- window.remove-event-listener \scroll @on-scroll
+ this.on('unmount', () => {
+ document.remove-event-listener 'keydown' this.on-document-keydown
+ window.remove-event-listener 'scroll' this.on-scroll
- @on-document-keydown = (e) ~>
+ on-document-keydown(e) {
tag = e.target.tag-name.to-lower-case!
- if tag != \input and tag != \textarea
- if e.which == 84 # t
- @refs.timeline.focus!
+ if tag != 'input' and tag != 'textarea'
+ if e.which == 84 // t
+ this.refs.timeline.focus();
- @more = ~>
+ more() {
if @more-loading or @is-loading or @timeline.posts.length == 0
return
- @more-loading = true
- @update!
- @api \posts/search do
+ this.more-loading = true
+ this.update();
+ this.api 'posts/search' do
query: @query
page: @page + 1
- .then (posts) ~>
- @more-loading = false
+ .then (posts) =>
+ this.more-loading = false
@page++
- @update!
- @refs.timeline.prepend-posts posts
- .catch (err) ~>
+ this.update();
+ this.refs.timeline.prepend-posts posts
+ .catch (err) =>
console.error err
- @on-scroll = ~>
+ on-scroll() {
current = window.scroll-y + window.inner-height
- if current > document.body.offset-height - 16 # 遊び
+ if current > document.body.offset-height - 16 // 遊び
@more!
</script>
</mk-search-posts>
diff --git a/src/web/app/desktop/tags/search.tag b/src/web/app/desktop/tags/search.tag
index d2561dfdca..82a1d79860 100644
--- a/src/web/app/desktop/tags/search.tag
+++ b/src/web/app/desktop/tags/search.tag
@@ -23,10 +23,10 @@
</style>
<script>
- @query = @opts.query
+ this.query = this.opts.query
- @on \mount ~>
- @refs.posts.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.posts.on('loaded', () => {
+ this.trigger('loaded');
</script>
</mk-search>
diff --git a/src/web/app/desktop/tags/select-file-from-drive-window.tag b/src/web/app/desktop/tags/select-file-from-drive-window.tag
index f9ba9e3cc0..f4cfd5503b 100644
--- a/src/web/app/desktop/tags/select-file-from-drive-window.tag
+++ b/src/web/app/desktop/tags/select-file-from-drive-window.tag
@@ -131,31 +131,31 @@
</style>
<script>
- @file = []
+ this.file = []
- @multiple = if @opts.multiple? then @opts.multiple else false
- @title = @opts.title || '<i class="fa fa-file-o"></i>ファイルを選択'
+ this.multiple = if this.opts.multiple? then this.opts.multiple else false
+ this.title = this.opts.title || '<i class="fa fa-file-o"></i>ファイルを選択'
- @on \mount ~>
- @refs.window.refs.browser.on \selected (file) ~>
- @file = file
+ this.on('mount', () => {
+ this.refs.window.refs.browser.on('selected', (file) => {
+ this.file = file
@ok!
- @refs.window.refs.browser.on \change-selection (files) ~>
- @file = files
- @update!
+ this.refs.window.refs.browser.on('change-selection', (files) => {
+ this.file = files
+ this.update();
- @refs.window.on \closed ~>
- @unmount!
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @close = ~>
- @refs.window.close!
+ close() {
+ this.refs.window.close!
- @upload = ~>
- @refs.window.refs.browser.select-local-file!
+ upload() {
+ this.refs.window.refs.browser.select-local-file!
- @ok = ~>
- @trigger \selected @file
- @refs.window.close!
+ ok() {
+ this.trigger 'selected' @file
+ this.refs.window.close!
</script>
</mk-select-file-from-drive-window>
diff --git a/src/web/app/desktop/tags/set-avatar-suggestion.tag b/src/web/app/desktop/tags/set-avatar-suggestion.tag
index 22a0de0f3a..858838743e 100644
--- a/src/web/app/desktop/tags/set-avatar-suggestion.tag
+++ b/src/web/app/desktop/tags/set-avatar-suggestion.tag
@@ -31,15 +31,15 @@
</style>
<script>
- @mixin \i
- @mixin \update-avatar
+ this.mixin('i');
+ this.mixin('update-avatar');
- @set = ~>
+ set() {
@update-avatar @I
- @close = (e) ~>
+ close(e) {
e.prevent-default!
e.stop-propagation!
- @unmount!
+ this.unmount();
</script>
</mk-set-avatar-suggestion>
diff --git a/src/web/app/desktop/tags/set-banner-suggestion.tag b/src/web/app/desktop/tags/set-banner-suggestion.tag
index 3ccaab108d..2a4ba8dbb7 100644
--- a/src/web/app/desktop/tags/set-banner-suggestion.tag
+++ b/src/web/app/desktop/tags/set-banner-suggestion.tag
@@ -31,15 +31,15 @@
</style>
<script>
- @mixin \i
- @mixin \update-banner
+ this.mixin('i');
+ this.mixin('update-banner');
- @set = ~>
+ set() {
@update-banner @I
- @close = (e) ~>
+ close(e) {
e.prevent-default!
e.stop-propagation!
- @unmount!
+ this.unmount();
</script>
</mk-set-banner-suggestion>
diff --git a/src/web/app/desktop/tags/settings-window.tag b/src/web/app/desktop/tags/settings-window.tag
index 10bb48de76..4ffc5f2250 100644
--- a/src/web/app/desktop/tags/settings-window.tag
+++ b/src/web/app/desktop/tags/settings-window.tag
@@ -15,11 +15,11 @@
</style>
<script>
- @on \mount ~>
- @refs.window.on \closed ~>
- @unmount!
+ this.on('mount', () => {
+ this.refs.window.on('closed', () => {
+ this.unmount();
- @close = ~>
- @refs.window.close!
+ close() {
+ this.refs.window.close!
</script>
</mk-settings-window>
diff --git a/src/web/app/desktop/tags/settings.tag b/src/web/app/desktop/tags/settings.tag
index 1c14514ac0..16369c2f4e 100644
--- a/src/web/app/desktop/tags/settings.tag
+++ b/src/web/app/desktop/tags/settings.tag
@@ -198,45 +198,45 @@
</style>
<script>
- @mixin \i
- @mixin \api
- @mixin \dialog
- @mixin \update-avatar
+ this.mixin('i');
+ this.mixin('api');
+ this.mixin('dialog');
+ this.mixin('update-avatar');
- @page = \account
+ this.page = 'account'
- @set-page = (page) ~>
- @page = page
+ set-page(page) {
+ this.page = page
- @avatar = ~>
+ avatar() {
@update-avatar @I
- @update-account = ~>
- @api \i/update do
- name: @refs.account-name.value
- location: @refs.account-location.value
- bio: @refs.account-bio.value
- birthday: @refs.account-birthday.value
- .then (i) ~>
- alert \ok
- .catch (err) ~>
+ update-account() {
+ this.api 'i/update' do
+ name: this.refs.account-name.value
+ location: this.refs.account-location.value
+ bio: this.refs.account-bio.value
+ birthday: this.refs.account-birthday.value
+ .then (i) =>
+ alert 'ok'
+ .catch (err) =>
console.error err
- @update-cache = ~>
+ update-cache() {
@I.data.cache = !@I.data.cache
- @api \i/appdata/set do
+ this.api 'i/appdata/set' do
data: JSON.stringify do
cache: @I.data.cache
- @update-debug = ~>
+ update-debug() {
@I.data.debug = !@I.data.debug
- @api \i/appdata/set do
+ this.api 'i/appdata/set' do
data: JSON.stringify do
debug: @I.data.debug
- @update-nya = ~>
+ update-nya() {
@I.data.nya = !@I.data.nya
- @api \i/appdata/set do
+ this.api 'i/appdata/set' do
data: JSON.stringify do
nya: @I.data.nya
</script>
diff --git a/src/web/app/desktop/tags/stream-indicator.tag b/src/web/app/desktop/tags/stream-indicator.tag
index d2ab34574d..caa727dd8c 100644
--- a/src/web/app/desktop/tags/stream-indicator.tag
+++ b/src/web/app/desktop/tags/stream-indicator.tag
@@ -27,27 +27,27 @@
</style>
<script>
- @mixin \stream
+ this.mixin('stream');
- @on \before-mount ~>
- @state = @get-stream-state!
+ this.on('before-mount', () => {
+ this.state = @get-stream-state!
- if @state == \connected
- @root.style.opacity = 0
+ if @state == 'connected'
+ this.root.style.opacity = 0
- @stream-state-ev.on \connected ~>
- @state = @get-stream-state!
- @update!
- set-timeout ~>
- Velocity @root, {
+ @stream-state-ev.on('connected', () => {
+ this.state = @get-stream-state!
+ this.update();
+ setTimeout =>
+ Velocity this.root, {
opacity: 0
- } 200ms \linear
+ } 200ms 'linear'
, 1000ms
- @stream-state-ev.on \closed ~>
- @state = @get-stream-state!
- @update!
- Velocity @root, {
+ @stream-state-ev.on('closed', () => {
+ this.state = @get-stream-state!
+ this.update();
+ Velocity this.root, {
opacity: 1
} 0ms
</script>
diff --git a/src/web/app/desktop/tags/sub-post-content.tag b/src/web/app/desktop/tags/sub-post-content.tag
index 72f570dd6a..0fdd049ec2 100644
--- a/src/web/app/desktop/tags/sub-post-content.tag
+++ b/src/web/app/desktop/tags/sub-post-content.tag
@@ -28,18 +28,18 @@
</style>
<script>
- @mixin \text
- @mixin \user-preview
+ this.mixin('text');
+ this.mixin('user-preview');
- @post = @opts.post
+ this.post = this.opts.post
- @on \mount ~>
+ this.on('mount', () => {
if @post.text?
tokens = @analyze @post.text
- @refs.text.innerHTML = @compile tokens, false
+ this.refs.text.innerHTML = @compile tokens, false
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
</script>
</mk-sub-post-content>
diff --git a/src/web/app/desktop/tags/timeline-post-sub.tag b/src/web/app/desktop/tags/timeline-post-sub.tag
index 5884927d75..bdeffea181 100644
--- a/src/web/app/desktop/tags/timeline-post-sub.tag
+++ b/src/web/app/desktop/tags/timeline-post-sub.tag
@@ -9,12 +9,12 @@
</div>
</article>
<script>
- @mixin \date-stringify
- @mixin \user-preview
+ this.mixin('date-stringify');
+ this.mixin('user-preview');
- @post = @opts.post
+ this.post = this.opts.post
- @title = @date-stringify @post.created_at
+ this.title = @date-stringify @post.created_at
</script>
<style>
diff --git a/src/web/app/desktop/tags/timeline-post.tag b/src/web/app/desktop/tags/timeline-post.tag
index 1549151fdb..8ccf2b57c3 100644
--- a/src/web/app/desktop/tags/timeline-post.tag
+++ b/src/web/app/desktop/tags/timeline-post.tag
@@ -312,83 +312,83 @@
</style>
<script>
- @mixin \api
- @mixin \text
- @mixin \date-stringify
- @mixin \user-preview
- @mixin \NotImplementedException
+ this.mixin('api');
+ this.mixin('text');
+ this.mixin('date-stringify');
+ this.mixin('user-preview');
+ this.mixin('NotImplementedException');
- @post = @opts.post
- @is-repost = @post.repost? and !@post.text?
- @p = if @is-repost then @post.repost else @post
+ this.post = this.opts.post
+ this.is-repost = @post.repost? and !@post.text?
+ this.p = if @is-repost then @post.repost else @post
- @title = @date-stringify @p.created_at
+ this.title = @date-stringify @p.created_at
- @url = CONFIG.url + '/' + @p.user.username + '/' + @p.id
- @is-detail-opened = false
+ this.url = CONFIG.url + '/' + @p.user.username + '/' + @p.id
+ this.is-detail-opened = false
- @on \mount ~>
+ this.on('mount', () => {
if @p.text?
tokens = if @p._highlight?
then @analyze @p._highlight
else @analyze @p.text
- @refs.text.innerHTML = @refs.text.innerHTML.replace '<p class="dummy"></p>' if @p._highlight?
+ this.refs.text.innerHTML = this.refs.text.innerHTML.replace '<p class="dummy"></p>' if @p._highlight?
then @compile tokens, true, false
else @compile tokens
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
- # URLをプレビュー
+ // URLをプレビュー
tokens
- .filter (t) -> t.type == \link
- .map (t) ~>
- @preview = @refs.text.append-child document.create-element \mk-url-preview
+ .filter (t) -> t.type == 'link'
+ .map (t) =>
+ this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
riot.mount @preview, do
url: t.content
- @reply = ~>
- form = document.body.append-child document.create-element \mk-post-form-window
+ reply() {
+ form = document.body.appendChild document.createElement 'mk-post-form-window'
riot.mount form, do
reply: @p
- @repost = ~>
- form = document.body.append-child document.create-element \mk-repost-form-window
+ repost() {
+ form = document.body.appendChild document.createElement 'mk-repost-form-window'
riot.mount form, do
post: @p
- @like = ~>
+ like() {
if @p.is_liked
- @api \posts/likes/delete do
+ this.api 'posts/likes/delete' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = false
- @update!
+ this.update();
else
- @api \posts/likes/create do
+ this.api 'posts/likes/create' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = true
- @update!
+ this.update();
- @toggle-detail = ~>
- @is-detail-opened = !@is-detail-opened
- @update!
+ toggle-detail() {
+ this.is-detail-opened = !@is-detail-opened
+ this.update();
- @on-key-down = (e) ~>
+ on-key-down(e) {
should-be-cancel = true
switch
- | e.which == 38 or e.which == 74 or (e.which == 9 and e.shift-key) => # ↑, j or Shift+Tab
- focus @root, (e) -> e.previous-element-sibling
- | e.which == 40 or e.which == 75 or e.which == 9 => # ↓, k or Tab
- focus @root, (e) -> e.next-element-sibling
- | e.which == 81 or e.which == 69 => # q or e
+ | e.which == 38 or e.which == 74 or (e.which == 9 and e.shift-key) => // ↑, j or Shift+Tab
+ focus this.root, (e) -> e.previous-element-sibling
+ | e.which == 40 or e.which == 75 or e.which == 9 => // ↓, k or Tab
+ focus this.root, (e) -> e.next-element-sibling
+ | e.which == 81 or e.which == 69 => // q or e
@repost!
- | e.which == 70 or e.which == 76 => # f or l
+ | e.which == 70 or e.which == 76 => // f or l
@like!
- | e.which == 82 => # r
+ | e.which == 82 => // r
@reply!
| _ =>
should-be-cancel = false
@@ -399,8 +399,8 @@
function focus(el, fn)
target = fn el
if target?
- if target.has-attribute \tabindex
- target.focus!
+ if target.has-attribute 'tabindex'
+ target.focus();
else
focus target, fn
</script>
diff --git a/src/web/app/desktop/tags/timeline.tag b/src/web/app/desktop/tags/timeline.tag
index 3439a426e3..5967c2efdd 100644
--- a/src/web/app/desktop/tags/timeline.tag
+++ b/src/web/app/desktop/tags/timeline.tag
@@ -44,36 +44,36 @@
</style>
<script>
- @posts = []
+ this.posts = []
- @set-posts = (posts) ~>
- @posts = posts
- @update!
+ set-posts(posts) {
+ this.posts = posts
+ this.update();
- @prepend-posts = (posts) ~>
- posts.for-each (post) ~>
+ prepend-posts(posts) {
+ posts.for-each (post) =>
@posts.push post
- @update!
+ this.update();
- @add-post = (post) ~>
+ add-post(post) {
@posts.unshift post
- @update!
+ this.update();
- @clear = ~>
- @posts = []
- @update!
+ clear() {
+ this.posts = []
+ this.update();
- @focus = ~>
- @root.children.0.focus!
+ focus() {
+ this.root.children.0.focus();
- @on \update ~>
- @posts.for-each (post) ~>
+ this.on('update', () => {
+ @posts.for-each (post) =>
date = (new Date post.created_at).get-date!
month = (new Date post.created_at).get-month! + 1
post._date = date
post._datetext = month + '月 ' + date + '日'
- @tail = ~>
+ tail() {
@posts[@posts.length - 1]
</script>
</mk-timeline>
diff --git a/src/web/app/desktop/tags/ui-header-account.tag b/src/web/app/desktop/tags/ui-header-account.tag
index 6071995cec..a5308b014c 100644
--- a/src/web/app/desktop/tags/ui-header-account.tag
+++ b/src/web/app/desktop/tags/ui-header-account.tag
@@ -159,47 +159,47 @@
</style>
<script>
- @mixin \i
- @mixin \signout
+ this.mixin('i');
+ this.mixin('signout');
- @is-open = false
+ this.is-open = false
- @on \before-unmount ~>
+ this.on('before-unmount', () => {
@close!
- @toggle = ~>
+ toggle() {
if @is-open
@close!
else
@open!
- @open = ~>
- @is-open = true
- @update!
+ open() {
+ this.is-open = true
+ this.update();
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.add-event-listener \mousedown @mousedown
+ Array.prototype.for-each.call all, (el) =>
+ el.add-event-listener 'mousedown' @mousedown
- @close = ~>
- @is-open = false
- @update!
+ close() {
+ this.is-open = false
+ this.update();
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.remove-event-listener \mousedown @mousedown
+ Array.prototype.for-each.call all, (el) =>
+ el.remove-event-listener 'mousedown' @mousedown
- @mousedown = (e) ~>
+ mousedown(e) {
e.prevent-default!
- if (!contains @root, e.target) and (@root != e.target)
+ if (!contains this.root, e.target) and (this.root != e.target)
@close!
return false
- @drive = ~>
+ drive() {
@close!
- riot.mount document.body.append-child document.create-element \mk-drive-browser-window
+ riot.mount document.body.appendChild document.createElement 'mk-drive-browser-window'
- @settings = ~>
+ settings() {
@close!
- riot.mount document.body.append-child document.create-element \mk-settings-window
+ riot.mount document.body.appendChild document.createElement 'mk-settings-window'
function contains(parent, child)
node = child.parent-node
diff --git a/src/web/app/desktop/tags/ui-header-clock.tag b/src/web/app/desktop/tags/ui-header-clock.tag
index 50536705bc..339951fb6f 100644
--- a/src/web/app/desktop/tags/ui-header-clock.tag
+++ b/src/web/app/desktop/tags/ui-header-clock.tag
@@ -58,7 +58,7 @@
</style>
<script>
- @draw = ~>
+ draw() {
now = new Date!
yyyy = now.get-full-year!
@@ -71,17 +71,17 @@
hhmm = "<span class='hhmm'>#hh:#mm</span>"
if now.get-seconds! % 2 == 0
- hhmm .= replace \: '<span style=\'visibility:visible\'>:</span>'
+ hhmm .= replace ':' '<span style=\'visibility:visible\'>:</span>'
else
- hhmm .= replace \: '<span style=\'visibility:hidden\'>:</span>'
+ hhmm .= replace ':' '<span style=\'visibility:hidden\'>:</span>'
- @refs.time.innerHTML = "#yyyymmdd<br>#hhmm"
+ this.refs.time.innerHTML = "#yyyymmdd<br>#hhmm"
- @on \mount ~>
+ this.on('mount', () => {
@draw!
- @clock = set-interval @draw, 1000ms
+ this.clock = set-interval @draw, 1000ms
- @on \unmount ~>
+ this.on('unmount', () => {
clear-interval @clock
</script>
</mk-ui-header-clock>
diff --git a/src/web/app/desktop/tags/ui-header-nav.tag b/src/web/app/desktop/tags/ui-header-nav.tag
index 707a9366e8..8f710600f9 100644
--- a/src/web/app/desktop/tags/ui-header-nav.tag
+++ b/src/web/app/desktop/tags/ui-header-nav.tag
@@ -77,37 +77,37 @@
</style>
<script>
- @mixin \i
- @mixin \api
- @mixin \stream
+ this.mixin('i');
+ this.mixin('api');
+ this.mixin('stream');
- @page = @opts.page
+ this.page = this.opts.page
- @on \mount ~>
- @stream.on \read_all_messaging_messages @on-read-all-messaging-messages
- @stream.on \unread_messaging_message @on-unread-messaging-message
+ this.on('mount', () => {
+ @stream.on 'read_all_messaging_messages' this.on-read-all-messaging-messages
+ @stream.on 'unread_messaging_message' this.on-unread-messaging-message
- # Fetch count of unread messaging messages
- @api \messaging/unread
- .then (count) ~>
+ // Fetch count of unread messaging messages
+ this.api 'messaging/unread'
+ .then (count) =>
if count.count > 0
- @has-unread-messaging-messages = true
- @update!
+ this.has-unread-messaging-messages = true
+ this.update();
- @on \unmount ~>
- @stream.off \read_all_messaging_messages @on-read-all-messaging-messages
- @stream.off \unread_messaging_message @on-unread-messaging-message
+ this.on('unmount', () => {
+ @stream.off 'read_all_messaging_messages' this.on-read-all-messaging-messages
+ @stream.off 'unread_messaging_message' this.on-unread-messaging-message
- @on-read-all-messaging-messages = ~>
- @has-unread-messaging-messages = false
- @update!
+ on-read-all-messaging-messages() {
+ this.has-unread-messaging-messages = false
+ this.update();
- @on-unread-messaging-message = ~>
- @has-unread-messaging-messages = true
- @update!
+ on-unread-messaging-message() {
+ this.has-unread-messaging-messages = true
+ this.update();
- @messaging = ~>
- riot.mount document.body.append-child document.create-element \mk-messaging-window
+ messaging() {
+ riot.mount document.body.appendChild document.createElement 'mk-messaging-window'
</script>
</ul>
</mk-ui-header-nav>
diff --git a/src/web/app/desktop/tags/ui-header-notifications.tag b/src/web/app/desktop/tags/ui-header-notifications.tag
index 65330a14e3..d166df36ee 100644
--- a/src/web/app/desktop/tags/ui-header-notifications.tag
+++ b/src/web/app/desktop/tags/ui-header-notifications.tag
@@ -75,31 +75,31 @@
</style>
<script>
- @is-open = false
+ this.is-open = false
- @toggle = ~>
+ toggle() {
if @is-open
@close!
else
@open!
- @open = ~>
- @is-open = true
- @update!
+ open() {
+ this.is-open = true
+ this.update();
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.add-event-listener \mousedown @mousedown
+ Array.prototype.for-each.call all, (el) =>
+ el.add-event-listener 'mousedown' @mousedown
- @close = ~>
- @is-open = false
- @update!
+ close() {
+ this.is-open = false
+ this.update();
all = document.query-selector-all 'body *'
- Array.prototype.for-each.call all, (el) ~>
- el.remove-event-listener \mousedown @mousedown
+ Array.prototype.for-each.call all, (el) =>
+ el.remove-event-listener 'mousedown' @mousedown
- @mousedown = (e) ~>
+ mousedown(e) {
e.prevent-default!
- if (!contains @root, e.target) and (@root != e.target)
+ if (!contains this.root, e.target) and (this.root != e.target)
@close!
return false
diff --git a/src/web/app/desktop/tags/ui-header-post-button.tag b/src/web/app/desktop/tags/ui-header-post-button.tag
index 071af0a158..3d391ed2e9 100644
--- a/src/web/app/desktop/tags/ui-header-post-button.tag
+++ b/src/web/app/desktop/tags/ui-header-post-button.tag
@@ -35,7 +35,7 @@
</style>
<script>
- @post = (e) ~>
- @parent.parent.open-post-form!
+ post(e) {
+ this.parent.parent.open-post-form!
</script>
</mk-ui-header-post-button>
diff --git a/src/web/app/desktop/tags/ui-header-search.tag b/src/web/app/desktop/tags/ui-header-search.tag
index 10ebe1da98..702c70efc8 100644
--- a/src/web/app/desktop/tags/ui-header-search.tag
+++ b/src/web/app/desktop/tags/ui-header-search.tag
@@ -32,10 +32,10 @@
</style>
<script>
- @mixin \page
+ this.mixin('page');
- @onsubmit = (e) ~>
+ onsubmit(e) {
e.prevent-default!
- @page '/search:' + @refs.q.value
+ @page '/search:' + this.refs.q.value
</script>
</mk-ui-header-search>
diff --git a/src/web/app/desktop/tags/ui-header.tag b/src/web/app/desktop/tags/ui-header.tag
index 41b74181f9..05d1ff6655 100644
--- a/src/web/app/desktop/tags/ui-header.tag
+++ b/src/web/app/desktop/tags/ui-header.tag
@@ -81,5 +81,5 @@
</style>
- <script>@mixin \i</script>
+ <script>this.mixin('i');</script>
</mk-ui-header>
diff --git a/src/web/app/desktop/tags/ui-notification.tag b/src/web/app/desktop/tags/ui-notification.tag
index 5f8583a391..22ba98df91 100644
--- a/src/web/app/desktop/tags/ui-notification.tag
+++ b/src/web/app/desktop/tags/ui-notification.tag
@@ -22,22 +22,22 @@
</style>
<script>
- @on \mount ~>
- Velocity @root, {
- top: \0px
+ this.on('mount', () => {
+ Velocity this.root, {
+ top: '0px'
} {
duration: 500ms
- easing: \ease-out
+ easing: 'ease-out'
}
- set-timeout ~>
- Velocity @root, {
- top: \-64px
+ setTimeout =>
+ Velocity this.root, {
+ top: '-64px'
} {
duration: 500ms
- easing: \ease-out
- complete: ~>
- @unmount!
+ easing: 'ease-out'
+ complete: =>
+ this.unmount();
}
, 6000ms
</script>
diff --git a/src/web/app/desktop/tags/ui.tag b/src/web/app/desktop/tags/ui.tag
index e40e5c88e2..78bf6117cc 100644
--- a/src/web/app/desktop/tags/ui.tag
+++ b/src/web/app/desktop/tags/ui.tag
@@ -12,25 +12,25 @@
</style>
<script>
- @mixin \i
+ this.mixin('i');
- @open-post-form = ~>
- riot.mount document.body.append-child document.create-element \mk-post-form-window
+ open-post-form() {
+ riot.mount document.body.appendChild document.createElement 'mk-post-form-window'
- @set-root-layout = ~>
- @root.style.padding-top = @refs.header.root.client-height + \px
+ set-root-layout() {
+ this.root.style.padding-top = this.refs.header.root.client-height + 'px'
- @on \mount ~>
+ this.on('mount', () => {
@set-root-layout!
- document.add-event-listener \keydown @onkeydown
+ document.add-event-listener 'keydown' this.onkeydown
- @on \unmount ~>
- document.remove-event-listener \keydown @onkeydown
+ this.on('unmount', () => {
+ document.remove-event-listener 'keydown' this.onkeydown
- @onkeydown = (e) ~>
+ onkeydown(e) {
tag = e.target.tag-name.to-lower-case!
- if tag != \input and tag != \textarea
- if e.which == 80 or e.which == 78 # p or n
+ if tag != 'input' and tag != 'textarea'
+ if e.which == 80 or e.which == 78 // p or n
e.prevent-default!
@open-post-form!
</script>
diff --git a/src/web/app/desktop/tags/user-followers-window.tag b/src/web/app/desktop/tags/user-followers-window.tag
index e70682c19a..a4a24d6673 100644
--- a/src/web/app/desktop/tags/user-followers-window.tag
+++ b/src/web/app/desktop/tags/user-followers-window.tag
@@ -15,5 +15,5 @@
border-radius 4px
</style>
- <script>@user = @opts.user</script>
+ <script>this.user = this.opts.user</script>
</mk-user-followers-window>
diff --git a/src/web/app/desktop/tags/user-followers.tag b/src/web/app/desktop/tags/user-followers.tag
index 14f20b831e..0ae29a2099 100644
--- a/src/web/app/desktop/tags/user-followers.tag
+++ b/src/web/app/desktop/tags/user-followers.tag
@@ -7,12 +7,12 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @user = @opts.user
+ this.user = this.opts.user
- @fetch = (iknow, limit, cursor, cb) ~>
- @api \users/followers do
+ fetch(iknow, limit, cursor, cb) {
+ this.api 'users/followers' do
user_id: @user.id
iknow: iknow
limit: limit
diff --git a/src/web/app/desktop/tags/user-following-window.tag b/src/web/app/desktop/tags/user-following-window.tag
index 4e25e8a3ca..6dbf3b05e9 100644
--- a/src/web/app/desktop/tags/user-following-window.tag
+++ b/src/web/app/desktop/tags/user-following-window.tag
@@ -15,5 +15,5 @@
border-radius 4px
</style>
- <script>@user = @opts.user</script>
+ <script>this.user = this.opts.user</script>
</mk-user-following-window>
diff --git a/src/web/app/desktop/tags/user-following.tag b/src/web/app/desktop/tags/user-following.tag
index e21d391d4d..f640ee7b62 100644
--- a/src/web/app/desktop/tags/user-following.tag
+++ b/src/web/app/desktop/tags/user-following.tag
@@ -7,12 +7,12 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @user = @opts.user
+ this.user = this.opts.user
- @fetch = (iknow, limit, cursor, cb) ~>
- @api \users/following do
+ fetch(iknow, limit, cursor, cb) {
+ this.api 'users/following' do
user_id: @user.id
iknow: iknow
limit: limit
diff --git a/src/web/app/desktop/tags/user-friends-graph.tag b/src/web/app/desktop/tags/user-friends-graph.tag
index ce7343494b..923ea6fe99 100644
--- a/src/web/app/desktop/tags/user-friends-graph.tag
+++ b/src/web/app/desktop/tags/user-friends-graph.tag
@@ -8,57 +8,57 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
+ this.mixin('api');
+ this.mixin('is-promise');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
- @on \mount ~>
+ this.on('mount', () => {
user <~ @user-promise.then
- @user = user
- @update!
+ this.user = user
+ this.update();
- @api \aggregation/users/followers do
+ this.api 'aggregation/users/followers' do
user_id: @user.id
limit: 30days
- .then (followers) ~>
+ .then (followers) =>
followers = followers.reverse!
- @api \aggregation/users/following do
+ this.api 'aggregation/users/following' do
user_id: @user.id
limit: 30days
- .then (following) ~>
+ .then (following) =>
following = following.reverse!
- new Chart @refs.canv, do
- type: \line
+ new Chart this.refs.canv, do
+ type: 'line'
data:
- labels: following.map (x, i) ~> if i % 3 == 2 then x.date.day + '日' else ''
+ labels: following.map (x, i) => if i % 3 == 2 then x.date.day + '日' else ''
datasets: [
{
- label: \フォロー
- data: following.map (x) ~> x.count
+ label: 'フォロー'
+ data: following.map (x) => x.count
line-tension: 0
border-width: 2
fill: true
background-color: 'rgba(127, 221, 64, 0.2)'
- point-background-color: \#fff
+ point-background-color: '#fff'
point-radius: 4
point-border-width: 2
- border-color: \#7fdd40
+ border-color: '#7fdd40'
},
{
- label: \フォロワー
- data: followers.map (x) ~> x.count
+ label: 'フォロワー'
+ data: followers.map (x) => x.count
line-tension: 0
border-width: 2
fill: true
background-color: 'rgba(255, 99, 132, 0.2)'
- point-background-color: \#fff
+ point-background-color: '#fff'
point-radius: 4
point-border-width: 2
- border-color: \#FF6384
+ border-color: '#FF6384'
}
]
options:
diff --git a/src/web/app/desktop/tags/user-graphs.tag b/src/web/app/desktop/tags/user-graphs.tag
index 6d49c990ae..ad1c4d7ee5 100644
--- a/src/web/app/desktop/tags/user-graphs.tag
+++ b/src/web/app/desktop/tags/user-graphs.tag
@@ -34,7 +34,7 @@
</style>
<script>
- @on \mount ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.trigger('loaded');
</script>
</mk-user-graphs>
diff --git a/src/web/app/desktop/tags/user-header.tag b/src/web/app/desktop/tags/user-header.tag
index d49b6498b5..dc7abb5124 100644
--- a/src/web/app/desktop/tags/user-header.tag
+++ b/src/web/app/desktop/tags/user-header.tag
@@ -104,39 +104,39 @@
</style>
<script>
- @mixin \i
- @mixin \update-banner
- @mixin \NotImplementedException
+ this.mixin('i');
+ this.mixin('update-banner');
+ this.mixin('NotImplementedException');
- @user = @opts.user
+ this.user = this.opts.user
- @on \mount ~>
- window.add-event-listener \load @scroll
- window.add-event-listener \scroll @scroll
- window.add-event-listener \resize @scroll
+ this.on('mount', () => {
+ window.add-event-listener 'load' @scroll
+ window.add-event-listener 'scroll' @scroll
+ window.add-event-listener 'resize' @scroll
- @on \unmount ~>
- window.remove-event-listener \load @scroll
- window.remove-event-listener \scroll @scroll
- window.remove-event-listener \resize @scroll
+ this.on('unmount', () => {
+ window.remove-event-listener 'load' @scroll
+ window.remove-event-listener 'scroll' @scroll
+ window.remove-event-listener 'resize' @scroll
- @scroll = ~>
+ scroll() {
top = window.scroll-y
height = 280px
pos = 50 - ((top / height) * 50)
- @refs.banner.style.background-position = 'center ' + pos + '%'
+ this.refs.banner.style.background-position = 'center ' + pos + '%'
blur = top / 32
if blur <= 10
- @refs.banner.style.filter = 'blur(' + blur + 'px)'
+ this.refs.banner.style.filter = 'blur(' + blur + 'px)'
- @on-update-banner = ~>
+ on-update-banner() {
if not @SIGNIN or @I.id != @user.id
return
- @update-banner @I, (i) ~>
+ @update-banner @I, (i) =>
@user.banner_url = i.banner_url
- @update!
+ this.update();
</script>
</mk-user-header>
diff --git a/src/web/app/desktop/tags/user-home.tag b/src/web/app/desktop/tags/user-home.tag
index 50fe1cbfad..db155edb1a 100644
--- a/src/web/app/desktop/tags/user-home.tag
+++ b/src/web/app/desktop/tags/user-home.tag
@@ -35,10 +35,10 @@
</style>
<script>
- @user = @opts.user
+ this.user = this.opts.user
- @on \mount ~>
- @refs.tl.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.tl.on('loaded', () => {
+ this.trigger('loaded');
</script>
</mk-user-home>
diff --git a/src/web/app/desktop/tags/user-likes-graph.tag b/src/web/app/desktop/tags/user-likes-graph.tag
index cec80164a5..099040133e 100644
--- a/src/web/app/desktop/tags/user-likes-graph.tag
+++ b/src/web/app/desktop/tags/user-likes-graph.tag
@@ -8,32 +8,32 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
+ this.mixin('api');
+ this.mixin('is-promise');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
- @on \mount ~>
+ this.on('mount', () => {
user <~ @user-promise.then
- @user = user
- @update!
+ this.user = user
+ this.update();
- @api \aggregation/users/like do
+ this.api 'aggregation/users/like' do
user_id: @user.id
limit: 30days
- .then (likes) ~>
+ .then (likes) =>
likes = likes.reverse!
- new Chart @refs.canv, do
- type: \bar
+ new Chart this.refs.canv, do
+ type: 'bar'
data:
- labels: likes.map (x, i) ~> if i % 3 == 2 then x.date.day + '日' else ''
+ labels: likes.map (x, i) => if i % 3 == 2 then x.date.day + '日' else ''
datasets: [
{
- label: \いいねした数
- data: likes.map (x) ~> x.count
- background-color: \#F7796C
+ label: 'いいねした数'
+ data: likes.map (x) => x.count
+ background-color: '#F7796C'
}
]
options:
diff --git a/src/web/app/desktop/tags/user-photos.tag b/src/web/app/desktop/tags/user-photos.tag
index 3d24422dea..89453b4606 100644
--- a/src/web/app/desktop/tags/user-photos.tag
+++ b/src/web/app/desktop/tags/user-photos.tag
@@ -57,30 +57,30 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
+ this.mixin('api');
+ this.mixin('is-promise');
- @images = []
- @initializing = true
+ this.images = []
+ this.initializing = true
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
- @on \mount ~>
- @user-promise.then (user) ~>
- @user = user
- @update!
+ this.on('mount', () => {
+ @user-promise.then (user) =>
+ this.user = user
+ this.update();
- @api \users/posts do
+ this.api 'users/posts' do
user_id: @user.id
with_media: true
limit: 9posts
- .then (posts) ~>
- @initializing = false
- posts.for-each (post) ~>
- post.media.for-each (image) ~>
+ .then (posts) =>
+ this.initializing = false
+ posts.for-each (post) =>
+ post.media.for-each (image) =>
if @images.length < 9
@images.push image
- @update!
+ this.update();
</script>
</mk-user-photos>
diff --git a/src/web/app/desktop/tags/user-posts-graph.tag b/src/web/app/desktop/tags/user-posts-graph.tag
index dacfd61321..0efc613107 100644
--- a/src/web/app/desktop/tags/user-posts-graph.tag
+++ b/src/web/app/desktop/tags/user-posts-graph.tag
@@ -8,50 +8,50 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
+ this.mixin('api');
+ this.mixin('is-promise');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
- @on \mount ~>
+ this.on('mount', () => {
user <~ @user-promise.then
- @user = user
- @update!
+ this.user = user
+ this.update();
- @api \aggregation/users/post do
+ this.api 'aggregation/users/post' do
user_id: @user.id
limit: 30days
- .then (data) ~>
+ .then (data) =>
data = data.reverse!
- new Chart @refs.canv, do
- type: \line
+ new Chart this.refs.canv, do
+ type: 'line'
data:
- labels: data.map (x, i) ~> if i % 3 == 2 then x.date.day + '日' else ''
+ labels: data.map (x, i) => if i % 3 == 2 then x.date.day + '日' else ''
datasets: [
{
- label: \投稿
- data: data.map (x) ~> x.posts
+ label: '投稿'
+ data: data.map (x) => x.posts
line-tension: 0
point-radius: 0
- background-color: \#555
- border-color: \transparent
+ background-color: '#555'
+ border-color: 'transparent'
},
{
- label: \Repost
- data: data.map (x) ~> x.reposts
+ label: 'Repost'
+ data: data.map (x) => x.reposts
line-tension: 0
point-radius: 0
- background-color: \#a2d61e
- border-color: \transparent
+ background-color: '#a2d61e'
+ border-color: 'transparent'
},
{
- label: \返信
- data: data.map (x) ~> x.replies
+ label: '返信'
+ data: data.map (x) => x.replies
line-tension: 0
point-radius: 0
- background-color: \#F7796C
- border-color: \transparent
+ background-color: '#F7796C'
+ border-color: 'transparent'
}
]
options:
diff --git a/src/web/app/desktop/tags/user-preview.tag b/src/web/app/desktop/tags/user-preview.tag
index 7d140c0957..d17f7557d2 100644
--- a/src/web/app/desktop/tags/user-preview.tag
+++ b/src/web/app/desktop/tags/user-preview.tag
@@ -97,47 +97,47 @@
</style>
<script>
- @mixin \i
- @mixin \api
+ this.mixin('i');
+ this.mixin('api');
- @u = @opts.user
- @user = null
- @user-promise =
- if typeof @u == \string
- new Promise (resolve, reject) ~>
- @api \users/show do
- user_id: if @u.0 == \@ then undefined else @u
- username: if @u.0 == \@ then @u.substr 1 else undefined
- .then (user) ~>
+ this.u = this.opts.user
+ this.user = null
+ this.user-promise =
+ if typeof @u == 'string'
+ new Promise (resolve, reject) =>
+ this.api 'users/show' do
+ user_id: if @u.0 == '@' then undefined else @u
+ username: if @u.0 == '@' then @u.substr 1 else undefined
+ .then (user) =>
resolve user
else
Promise.resolve @u
- @on \mount ~>
- @user-promise.then (user) ~>
- @user = user
- @update!
+ this.on('mount', () => {
+ @user-promise.then (user) =>
+ this.user = user
+ this.update();
- Velocity @root, {
+ Velocity this.root, {
opacity: 0
- 'margin-top': \-8px
+ 'margin-top': '-8px'
} 0ms
- Velocity @root, {
+ Velocity this.root, {
opacity: 1
'margin-top': 0
} {
duration: 200ms
- easing: \ease-out
+ easing: 'ease-out'
}
- @close = ~>
- Velocity @root, {
+ close() {
+ Velocity this.root, {
opacity: 0
- 'margin-top': \-8px
+ 'margin-top': '-8px'
} {
duration: 200ms
- easing: \ease-out
- complete: ~> @unmount!
+ easing: 'ease-out'
+ complete: => this.unmount();
}
</script>
</mk-user-preview>
diff --git a/src/web/app/desktop/tags/user-profile.tag b/src/web/app/desktop/tags/user-profile.tag
index d8984e971d..a94f50c7bf 100644
--- a/src/web/app/desktop/tags/user-profile.tag
+++ b/src/web/app/desktop/tags/user-profile.tag
@@ -80,19 +80,19 @@
</style>
<script>
- @age = require \s-age
+ this.age = require 's-age'
- @mixin \i
+ this.mixin('i');
- @user = @opts.user
+ this.user = this.opts.user
- @show-following = ~>
- window = document.body.append-child document.create-element \mk-user-following-window
+ show-following() {
+ window = document.body.appendChild document.createElement 'mk-user-following-window'
riot.mount window, do
user: @user
- @show-followers = ~>
- window = document.body.append-child document.create-element \mk-user-followers-window
+ show-followers() {
+ window = document.body.appendChild document.createElement 'mk-user-followers-window'
riot.mount window, do
user: @user
</script>
diff --git a/src/web/app/desktop/tags/user-timeline.tag b/src/web/app/desktop/tags/user-timeline.tag
index b0ed542a43..b8e39b7307 100644
--- a/src/web/app/desktop/tags/user-timeline.tag
+++ b/src/web/app/desktop/tags/user-timeline.tag
@@ -46,91 +46,91 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
- @mixin \get-post-summary
+ this.mixin('api');
+ this.mixin('is-promise');
+ this.mixin('get-post-summary');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
- @is-loading = true
- @is-empty = false
- @more-loading = false
- @unread-count = 0
- @mode = \default
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
+ this.is-loading = true
+ this.is-empty = false
+ this.more-loading = false
+ this.unread-count = 0
+ this.mode = 'default'
- @on \mount ~>
- document.add-event-listener \visibilitychange @window-on-visibilitychange, false
- document.add-event-listener \keydown @on-document-keydown
- window.add-event-listener \scroll @on-scroll
+ this.on('mount', () => {
+ document.add-event-listener 'visibilitychange' @window-on-visibilitychange, false
+ document.add-event-listener 'keydown' this.on-document-keydown
+ window.add-event-listener 'scroll' this.on-scroll
- @user-promise.then (user) ~>
- @user = user
- @update!
+ @user-promise.then (user) =>
+ this.user = user
+ this.update();
- @fetch ~>
- @trigger \loaded
+ @fetch =>
+ this.trigger('loaded');
- @on \unmount ~>
- document.remove-event-listener \visibilitychange @window-on-visibilitychange
- document.remove-event-listener \keydown @on-document-keydown
- window.remove-event-listener \scroll @on-scroll
+ this.on('unmount', () => {
+ document.remove-event-listener 'visibilitychange' @window-on-visibilitychange
+ document.remove-event-listener 'keydown' this.on-document-keydown
+ window.remove-event-listener 'scroll' this.on-scroll
- @on-document-keydown = (e) ~>
+ on-document-keydown(e) {
tag = e.target.tag-name.to-lower-case!
- if tag != \input and tag != \textarea
- if e.which == 84 # t
- @refs.timeline.focus!
+ if tag != 'input' and tag != 'textarea'
+ if e.which == 84 // t
+ this.refs.timeline.focus();
- @fetch = (cb) ~>
- @api \users/posts do
+ fetch(cb) {
+ this.api 'users/posts' do
user_id: @user.id
- with_replies: @mode == \with-replies
- .then (posts) ~>
- @is-loading = false
- @is-empty = posts.length == 0
- @update!
- @refs.timeline.set-posts posts
+ with_replies: @mode == 'with-replies'
+ .then (posts) =>
+ this.is-loading = false
+ this.is-empty = posts.length == 0
+ this.update();
+ this.refs.timeline.set-posts posts
if cb? then cb!
- .catch (err) ~>
+ .catch (err) =>
console.error err
if cb? then cb!
- @more = ~>
- if @more-loading or @is-loading or @refs.timeline.posts.length == 0
+ more() {
+ if @more-loading or @is-loading or this.refs.timeline.posts.length == 0
return
- @more-loading = true
- @update!
- @api \users/posts do
+ this.more-loading = true
+ this.update();
+ this.api 'users/posts' do
user_id: @user.id
- with_replies: @mode == \with-replies
- max_id: @refs.timeline.tail!.id
- .then (posts) ~>
- @more-loading = false
- @update!
- @refs.timeline.prepend-posts posts
- .catch (err) ~>
+ with_replies: @mode == 'with-replies'
+ max_id: this.refs.timeline.tail!.id
+ .then (posts) =>
+ this.more-loading = false
+ this.update();
+ this.refs.timeline.prepend-posts posts
+ .catch (err) =>
console.error err
- @on-stream-post = (post) ~>
- @is-empty = false
- @update!
- @refs.timeline.add-post post
+ on-stream-post(post) {
+ this.is-empty = false
+ this.update();
+ this.refs.timeline.add-post post
if document.hidden
@unread-count++
document.title = '(' + @unread-count + ') ' + @get-post-summary post
- @window-on-visibilitychange = ~>
+ window-on-visibilitychange() {
if !document.hidden
- @unread-count = 0
+ this.unread-count = 0
document.title = 'Misskey'
- @on-scroll = ~>
+ on-scroll() {
current = window.scroll-y + window.inner-height
- if current > document.body.offset-height - 16 # 遊び
+ if current > document.body.offset-height - 16 // 遊び
@more!
- @set-mode = (mode) ~>
+ set-mode(mode) {
@update do
mode: mode
@fetch!
diff --git a/src/web/app/desktop/tags/user.tag b/src/web/app/desktop/tags/user.tag
index 24f2e958a3..8e151c831d 100644
--- a/src/web/app/desktop/tags/user.tag
+++ b/src/web/app/desktop/tags/user.tag
@@ -32,20 +32,20 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @username = @opts.user
- @page = if @opts.page? then @opts.page else \home
- @fetching = true
- @user = null
+ this.username = this.opts.user
+ this.page = if this.opts.page? then this.opts.page else 'home'
+ this.fetching = true
+ this.user = null
- @on \mount ~>
- @api \users/show do
+ this.on('mount', () => {
+ this.api 'users/show' do
username: @username
- .then (user) ~>
- @fetching = false
- @user = user
- @update!
- @trigger \loaded
+ .then (user) =>
+ this.fetching = false
+ this.user = user
+ this.update();
+ this.trigger('loaded');
</script>
</mk-user>
diff --git a/src/web/app/desktop/tags/users-list.tag b/src/web/app/desktop/tags/users-list.tag
index 51edd2ee30..af0f35d634 100644
--- a/src/web/app/desktop/tags/users-list.tag
+++ b/src/web/app/desktop/tags/users-list.tag
@@ -88,44 +88,44 @@
</style>
<script>
- @mixin \i
+ this.mixin('i');
- @limit = 30users
- @mode = \all
+ this.limit = 30users
+ this.mode = 'all'
- @fetching = true
- @more-fetching = false
+ this.fetching = true
+ this.more-fetching = false
- @on \mount ~>
- @fetch ~>
- @trigger \loaded
+ this.on('mount', () => {
+ @fetch =>
+ this.trigger('loaded');
- @fetch = (cb) ~>
- @fetching = true
- @update!
- obj <~ @opts.fetch do
- @mode == \iknow
+ fetch(cb) {
+ this.fetching = true
+ this.update();
+ obj <~ this.opts.fetch do
+ @mode == 'iknow'
@limit
null
- @users = obj.users
- @next = obj.next
- @fetching = false
- @update!
+ this.users = obj.users
+ this.next = obj.next
+ this.fetching = false
+ this.update();
if cb? then cb!
- @more = ~>
- @more-fetching = true
- @update!
- obj <~ @opts.fetch do
- @mode == \iknow
+ more() {
+ this.more-fetching = true
+ this.update();
+ obj <~ this.opts.fetch do
+ @mode == 'iknow'
@limit
@cursor
- @users = @users.concat obj.users
- @next = obj.next
- @more-fetching = false
- @update!
+ this.users = @users.concat obj.users
+ this.next = obj.next
+ this.more-fetching = false
+ this.update();
- @set-mode = (mode) ~>
+ set-mode(mode) {
@update do
mode: mode
diff --git a/src/web/app/desktop/tags/window.tag b/src/web/app/desktop/tags/window.tag
index 323c294c2c..f3d8ff7bea 100644
--- a/src/web/app/desktop/tags/window.tag
+++ b/src/web/app/desktop/tags/window.tag
@@ -192,101 +192,101 @@
</style>
<script>
- @min-height = 40px
- @min-width = 200px
+ this.min-height = 40px
+ this.min-width = 200px
- @is-modal = if @opts.is-modal? then @opts.is-modal else false
- @can-close = if @opts.can-close? then @opts.can-close else true
- @is-flexible = !@opts.height?
- @can-resize = not @is-flexible
+ this.is-modal = if this.opts.is-modal? then this.opts.is-modal else false
+ this.can-close = if this.opts.can-close? then this.opts.can-close else true
+ this.is-flexible = !this.opts.height?
+ this.can-resize = not @is-flexible
- @on \mount ~>
- @refs.main.style.width = @opts.width || \530px
- @refs.main.style.height = @opts.height || \auto
+ this.on('mount', () => {
+ this.refs.main.style.width = this.opts.width || '530px'
+ this.refs.main.style.height = this.opts.height || 'auto'
- @refs.main.style.top = \15%
- @refs.main.style.left = (window.inner-width / 2) - (@refs.main.offset-width / 2) + \px
+ this.refs.main.style.top = '15%'
+ this.refs.main.style.left = (window.inner-width / 2) - (this.refs.main.offset-width / 2) + 'px'
- @refs.header.add-event-listener \contextmenu (e) ~>
+ this.refs.header.add-event-listener 'contextmenu' (e) =>
e.prevent-default!
- window.add-event-listener \resize @on-browser-resize
+ window.add-event-listener 'resize' this.on-browser-resize
@open!
- @on \unmount ~>
- window.remove-event-listener \resize @on-browser-resize
+ this.on('unmount', () => {
+ window.remove-event-listener 'resize' this.on-browser-resize
- @on-browser-resize = ~>
- position = @refs.main.get-bounding-client-rect!
+ on-browser-resize() {
+ position = this.refs.main.get-bounding-client-rect!
browser-width = window.inner-width
browser-height = window.inner-height
- window-width = @refs.main.offset-width
- window-height = @refs.main.offset-height
+ window-width = this.refs.main.offset-width
+ window-height = this.refs.main.offset-height
if position.left < 0
- @refs.main.style.left = 0
+ this.refs.main.style.left = 0
if position.top < 0
- @refs.main.style.top = 0
+ this.refs.main.style.top = 0
if position.left + window-width > browser-width
- @refs.main.style.left = browser-width - window-width + \px
+ this.refs.main.style.left = browser-width - window-width + 'px'
if position.top + window-height > browser-height
- @refs.main.style.top = browser-height - window-height + \px
+ this.refs.main.style.top = browser-height - window-height + 'px'
- @open = ~>
- @trigger \opening
+ open() {
+ this.trigger('opening');
@top!
if @is-modal
- @refs.bg.style.pointer-events = \auto
- Velocity @refs.bg, \finish true
- Velocity @refs.bg, {
+ this.refs.bg.style.pointer-events = 'auto'
+ Velocity this.refs.bg, 'finish' true
+ Velocity this.refs.bg, {
opacity: 1
} {
queue: false
duration: 100ms
- easing: \linear
+ easing: 'linear'
}
- @refs.main.style.pointer-events = \auto
- Velocity @refs.main, \finish true
- Velocity @refs.main, {scale: 1.1} 0ms
- Velocity @refs.main, {
+ this.refs.main.style.pointer-events = 'auto'
+ Velocity this.refs.main, 'finish' true
+ Velocity this.refs.main, {scale: 1.1} 0ms
+ Velocity this.refs.main, {
opacity: 1
scale: 1
} {
queue: false
duration: 200ms
- easing: \ease-out
+ easing: 'ease-out'
}
- #@refs.main.focus!
+ #this.refs.main.focus();
- set-timeout ~>
- @trigger \opened
+ setTimeout =>
+ this.trigger('opened');
, 300ms
- @close = ~>
- @trigger \closing
+ close() {
+ this.trigger('closing');
if @is-modal
- @refs.bg.style.pointer-events = \none
- Velocity @refs.bg, \finish true
- Velocity @refs.bg, {
+ this.refs.bg.style.pointer-events = 'none'
+ Velocity this.refs.bg, 'finish' true
+ Velocity this.refs.bg, {
opacity: 0
} {
queue: false
duration: 300ms
- easing: \linear
+ easing: 'linear'
}
- @refs.main.style.pointer-events = \none
- Velocity @refs.main, \finish true
- Velocity @refs.main, {
+ this.refs.main.style.pointer-events = 'none'
+ Velocity this.refs.main, 'finish' true
+ Velocity this.refs.main, {
opacity: 0
scale: 0.8
} {
@@ -295,45 +295,45 @@
easing: [ 0.5, -0.5, 1, 0.5 ]
}
- set-timeout ~>
- @trigger \closed
+ setTimeout =>
+ this.trigger('closed');
, 300ms
- # 最前面へ移動します
- @top = ~>
+ // 最前面へ移動します
+ top() {
z = 0
- ws = document.query-selector-all \mk-window
- ws.for-each (w) !~>
- if w == @root then return
+ ws = document.query-selector-all 'mk-window'
+ ws.for-each (w) !=>
+ if w == this.root then return
m = w.query-selector ':scope > .main'
mz = Number(document.default-view.get-computed-style m, null .z-index)
if mz > z then z := mz
if z > 0
- @refs.main.style.z-index = z + 1
- if @is-modal then @refs.bg.style.z-index = z + 1
+ this.refs.main.style.z-index = z + 1
+ if @is-modal then this.refs.bg.style.z-index = z + 1
- @repel-move = (e) ~>
+ repel-move(e) {
e.stop-propagation!
return true
- @bg-click = ~>
+ bg-click() {
if @can-close
@close!
- @on-body-mousedown = (e) ~>
+ on-body-mousedown(e) {
@top!
true
- # ヘッダー掴み時
- @on-header-mousedown = (e) ~>
+ // ヘッダー掴み時
+ on-header-mousedown(e) {
e.prevent-default!
- if not contains @refs.main, document.active-element
- @refs.main.focus!
+ if not contains this.refs.main, document.active-element
+ this.refs.main.focus();
- position = @refs.main.get-bounding-client-rect!
+ position = this.refs.main.get-bounding-client-rect!
click-x = e.client-x
click-y = e.client-y
@@ -341,168 +341,168 @@
move-base-y = click-y - position.top
browser-width = window.inner-width
browser-height = window.inner-height
- window-width = @refs.main.offset-width
- window-height = @refs.main.offset-height
+ window-width = this.refs.main.offset-width
+ window-height = this.refs.main.offset-height
- # 動かした時
- drag-listen (me) ~>
+ // 動かした時
+ drag-listen (me) =>
move-left = me.client-x - move-base-x
move-top = me.client-y - move-base-y
- # 上はみ出し
+ // 上はみ出し
if move-top < 0
move-top = 0
- # 左はみ出し
+ // 左はみ出し
if move-left < 0
move-left = 0
- # 下はみ出し
+ // 下はみ出し
if move-top + window-height > browser-height
move-top = browser-height - window-height
- # 右はみ出し
+ // 右はみ出し
if move-left + window-width > browser-width
move-left = browser-width - window-width
- @refs.main.style.left = move-left + \px
- @refs.main.style.top = move-top + \px
+ this.refs.main.style.left = move-left + 'px'
+ this.refs.main.style.top = move-top + 'px'
- # 上ハンドル掴み時
- @on-top-handle-mousedown = (e) ~>
+ // 上ハンドル掴み時
+ on-top-handle-mousedown(e) {
e.prevent-default!
base = e.client-y
- height = parse-int((get-computed-style @refs.main, '').height, 10)
- top = parse-int((get-computed-style @refs.main, '').top, 10)
+ height = parse-int((get-computed-style this.refs.main, '').height, 10)
+ top = parse-int((get-computed-style this.refs.main, '').top, 10)
- # 動かした時
- drag-listen (me) ~>
+ // 動かした時
+ drag-listen (me) =>
move = me.client-y - base
if top + move > 0
if height + -move > @min-height
@apply-transform-height height + -move
@apply-transform-top top + move
- else # 最小の高さより小さくなろうとした時
+ else // 最小の高さより小さくなろうとした時
@apply-transform-height @min-height
@apply-transform-top top + (height - @min-height)
- else # 上のはみ出し時
+ else // 上のはみ出し時
@apply-transform-height top + height
@apply-transform-top 0
- # 右ハンドル掴み時
- @on-right-handle-mousedown = (e) ~>
+ // 右ハンドル掴み時
+ on-right-handle-mousedown(e) {
e.prevent-default!
base = e.client-x
- width = parse-int((get-computed-style @refs.main, '').width, 10)
- left = parse-int((get-computed-style @refs.main, '').left, 10)
+ width = parse-int((get-computed-style this.refs.main, '').width, 10)
+ left = parse-int((get-computed-style this.refs.main, '').left, 10)
browser-width = window.inner-width
- # 動かした時
- drag-listen (me) ~>
+ // 動かした時
+ drag-listen (me) =>
move = me.client-x - base
if left + width + move < browser-width
if width + move > @min-width
@apply-transform-width width + move
- else # 最小の幅より小さくなろうとした時
+ else // 最小の幅より小さくなろうとした時
@apply-transform-width @min-width
- else # 右のはみ出し時
+ else // 右のはみ出し時
@apply-transform-width browser-width - left
- # 下ハンドル掴み時
- @on-bottom-handle-mousedown = (e) ~>
+ // 下ハンドル掴み時
+ on-bottom-handle-mousedown(e) {
e.prevent-default!
base = e.client-y
- height = parse-int((get-computed-style @refs.main, '').height, 10)
- top = parse-int((get-computed-style @refs.main, '').top, 10)
+ height = parse-int((get-computed-style this.refs.main, '').height, 10)
+ top = parse-int((get-computed-style this.refs.main, '').top, 10)
browser-height = window.inner-height
- # 動かした時
- drag-listen (me) ~>
+ // 動かした時
+ drag-listen (me) =>
move = me.client-y - base
if top + height + move < browser-height
if height + move > @min-height
@apply-transform-height height + move
- else # 最小の高さより小さくなろうとした時
+ else // 最小の高さより小さくなろうとした時
@apply-transform-height @min-height
- else # 下のはみ出し時
+ else // 下のはみ出し時
@apply-transform-height browser-height - top
- # 左ハンドル掴み時
- @on-left-handle-mousedown = (e) ~>
+ // 左ハンドル掴み時
+ on-left-handle-mousedown(e) {
e.prevent-default!
base = e.client-x
- width = parse-int((get-computed-style @refs.main, '').width, 10)
- left = parse-int((get-computed-style @refs.main, '').left, 10)
+ width = parse-int((get-computed-style this.refs.main, '').width, 10)
+ left = parse-int((get-computed-style this.refs.main, '').left, 10)
- # 動かした時
- drag-listen (me) ~>
+ // 動かした時
+ drag-listen (me) =>
move = me.client-x - base
if left + move > 0
if width + -move > @min-width
@apply-transform-width width + -move
@apply-transform-left left + move
- else # 最小の幅より小さくなろうとした時
+ else // 最小の幅より小さくなろうとした時
@apply-transform-width @min-width
@apply-transform-left left + (width - @min-width)
- else # 左のはみ出し時
+ else // 左のはみ出し時
@apply-transform-width left + width
@apply-transform-left 0
- # 左上ハンドル掴み時
- @on-top-left-handle-mousedown = (e) ~>
- @on-top-handle-mousedown e
- @on-left-handle-mousedown e
+ // 左上ハンドル掴み時
+ on-top-left-handle-mousedown(e) {
+ this.on-top-handle-mousedown e
+ this.on-left-handle-mousedown e
- # 右上ハンドル掴み時
- @on-top-right-handle-mousedown = (e) ~>
- @on-top-handle-mousedown e
- @on-right-handle-mousedown e
+ // 右上ハンドル掴み時
+ on-top-right-handle-mousedown(e) {
+ this.on-top-handle-mousedown e
+ this.on-right-handle-mousedown e
- # 右下ハンドル掴み時
- @on-bottom-right-handle-mousedown = (e) ~>
- @on-bottom-handle-mousedown e
- @on-right-handle-mousedown e
+ // 右下ハンドル掴み時
+ on-bottom-right-handle-mousedown(e) {
+ this.on-bottom-handle-mousedown e
+ this.on-right-handle-mousedown e
- # 左下ハンドル掴み時
- @on-bottom-left-handle-mousedown = (e) ~>
- @on-bottom-handle-mousedown e
- @on-left-handle-mousedown e
+ // 左下ハンドル掴み時
+ on-bottom-left-handle-mousedown(e) {
+ this.on-bottom-handle-mousedown e
+ this.on-left-handle-mousedown e
- # 高さを適用
- @apply-transform-height = (height) ~>
- @refs.main.style.height = height + \px
+ // 高さを適用
+ apply-transform-height(height) {
+ this.refs.main.style.height = height + 'px'
- # 幅を適用
- @apply-transform-width = (width) ~>
- @refs.main.style.width = width + \px
+ // 幅を適用
+ apply-transform-width(width) {
+ this.refs.main.style.width = width + 'px'
- # Y座標を適用
- @apply-transform-top = (top) ~>
- @refs.main.style.top = top + \px
+ // Y座標を適用
+ apply-transform-top(top) {
+ this.refs.main.style.top = top + 'px'
- # X座標を適用
- @apply-transform-left = (left) ~>
- @refs.main.style.left = left + \px
+ // X座標を適用
+ apply-transform-left(left) {
+ this.refs.main.style.left = left + 'px'
function drag-listen fn
- window.add-event-listener \mousemove fn
- window.add-event-listener \mouseleave drag-clear.bind null fn
- window.add-event-listener \mouseup drag-clear.bind null fn
+ window.add-event-listener 'mousemove' fn
+ window.add-event-listener 'mouseleave' drag-clear.bind null fn
+ window.add-event-listener 'mouseup' drag-clear.bind null fn
function drag-clear fn
- window.remove-event-listener \mousemove fn
- window.remove-event-listener \mouseleave drag-clear
- window.remove-event-listener \mouseup drag-clear
+ window.remove-event-listener 'mousemove' fn
+ window.remove-event-listener 'mouseleave' drag-clear
+ window.remove-event-listener 'mouseup' drag-clear
- @ondragover = (e) ~>
- e.data-transfer.drop-effect = \none
+ ondragover(e) {
+ e.data-transfer.drop-effect = 'none'
- @on-keydown = (e) ~>
- if e.which == 27 # Esc
+ on-keydown(e) {
+ if e.which == 27 // Esc
if @can-close
e.prevent-default!
e.stop-propagation!
diff --git a/src/web/app/dev/tags/new-app-form.tag b/src/web/app/dev/tags/new-app-form.tag
index 86e694e94e..a298d5ce0a 100644
--- a/src/web/app/dev/tags/new-app-form.tag
+++ b/src/web/app/dev/tags/new-app-form.tag
@@ -178,64 +178,64 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @nid-state = null
+ this.nid-state = null
- @on-change-nid = ~>
- nid = @refs.nid.value
+ on-change-nid() {
+ nid = this.refs.nid.value
if nid == ''
- @nid-state = null
- @update!
+ this.nid-state = null
+ this.update();
return
err = switch
- | not nid.match /^[a-zA-Z0-9\-]+$/ => \invalid-format
- | nid.length < 3chars => \min-range
- | nid.length > 30chars => \max-range
+ | not nid.match /^[a-zA-Z0-9\-]+$/ => 'invalid-format'
+ | nid.length < 3chars => 'min-range'
+ | nid.length > 30chars => 'max-range'
| _ => null
if err?
- @nid-state = err
- @update!
+ this.nid-state = err
+ this.update();
else
- @nid-state = \wait
- @update!
+ this.nid-state = 'wait'
+ this.update();
- @api \app/name_id/available do
+ this.api 'app/name_id/available' do
name_id: nid
- .then (result) ~>
+ .then (result) =>
if result.available
- @nid-state = \ok
+ this.nid-state = 'ok'
else
- @nid-state = \unavailable
- @update!
- .catch (err) ~>
- @nid-state = \error
- @update!
+ this.nid-state = 'unavailable'
+ this.update();
+ .catch (err) =>
+ this.nid-state = 'error'
+ this.update();
- @onsubmit = ~>
- name = @refs.name.value
- nid = @refs.nid.value
- description = @refs.description.value
- cb = @refs.cb.value
+ onsubmit() {
+ name = this.refs.name.value
+ nid = this.refs.nid.value
+ description = this.refs.description.value
+ cb = this.refs.cb.value
permission = []
- @refs.permission.query-selector-all \input .for-each (el) ~>
+ this.refs.permission.query-selector-all 'input' .for-each (el) =>
if el.checked then permission.push el.value
- locker = document.body.append-child document.create-element \mk-locker
+ locker = document.body.appendChild document.createElement 'mk-locker'
- @api \app/create do
+ this.api 'app/create' do
name: name
name_id: nid
description: description
callback_url: cb
- permission: permission.join \,
- .then ~>
+ permission: permission.join ','
+ .then =>
location.href = '/apps'
- .catch ~>
+ .catch =>
alert 'アプリの作成に失敗しました。再度お試しください。'
locker.parent-node.remove-child locker
diff --git a/src/web/app/dev/tags/pages/app.tag b/src/web/app/dev/tags/pages/app.tag
index 7eaf9decf6..3512dd7477 100644
--- a/src/web/app/dev/tags/pages/app.tag
+++ b/src/web/app/dev/tags/pages/app.tag
@@ -15,16 +15,16 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @fetching = true
+ this.fetching = true
- @on \mount ~>
- @api \app/show do
- app_id: @opts.app
- .then (app) ~>
- @app = app
- @fetching = false
- @update!
+ this.on('mount', () => {
+ this.api 'app/show' do
+ app_id: this.opts.app
+ .then (app) =>
+ this.app = app
+ this.fetching = false
+ this.update();
</script>
</mk-app-page>
diff --git a/src/web/app/dev/tags/pages/apps.tag b/src/web/app/dev/tags/pages/apps.tag
index 03806c6da5..58e09e24e0 100644
--- a/src/web/app/dev/tags/pages/apps.tag
+++ b/src/web/app/dev/tags/pages/apps.tag
@@ -16,15 +16,15 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @fetching = true
+ this.fetching = true
- @on \mount ~>
- @api \my/apps
- .then (apps) ~>
- @fetching = false
- @apps = apps
- @update!
+ this.on('mount', () => {
+ this.api 'my/apps'
+ .then (apps) =>
+ this.fetching = false
+ this.apps = apps
+ this.update();
</script>
</mk-apps-page>
diff --git a/src/web/app/mobile/tags/drive-selector.tag b/src/web/app/mobile/tags/drive-selector.tag
index 7039ac26a3..d1ecc29b57 100644
--- a/src/web/app/mobile/tags/drive-selector.tag
+++ b/src/web/app/mobile/tags/drive-selector.tag
@@ -56,19 +56,19 @@
</style>
<script>
- @files = []
+ this.files = []
- @on \mount ~>
- @refs.browser.on \change-selected (files) ~>
- @files = files
- @update!
+ this.on('mount', () => {
+ this.refs.browser.on('change-selected', (files) => {
+ this.files = files
+ this.update();
- @cancel = ~>
- @trigger \canceled
- @unmount!
+ cancel() {
+ this.trigger('canceled');
+ this.unmount();
- @ok = ~>
- @trigger \selected @files
- @unmount!
+ ok() {
+ this.trigger 'selected' @files
+ this.unmount();
</script>
</mk-drive-selector>
diff --git a/src/web/app/mobile/tags/drive.tag b/src/web/app/mobile/tags/drive.tag
index 06ed54e762..f7fc07f00a 100644
--- a/src/web/app/mobile/tags/drive.tag
+++ b/src/web/app/mobile/tags/drive.tag
@@ -128,91 +128,91 @@
</style>
<script>
- @mixin \api
- @mixin \stream
+ this.mixin('api');
+ this.mixin('stream');
- @files = []
- @folders = []
- @hierarchy-folders = []
- @selected-files = []
+ this.files = []
+ this.folders = []
+ this.hierarchy-folders = []
+ this.selected-files = []
- # 現在の階層(フォルダ)
- # * null でルートを表す
- @folder = null
+ // 現在の階層(フォルダ)
+ // * null でルートを表す
+ this.folder = null
- @file = null
+ this.file = null
- @is-select-mode = @opts.select? and @opts.select
- @multiple = if @opts.multiple? then @opts.multiple else false
+ this.is-select-mode = this.opts.select? and this.opts.select
+ this.multiple = if this.opts.multiple? then this.opts.multiple else false
- @on \mount ~>
- @stream.on \drive_file_created @on-stream-drive-file-created
- @stream.on \drive_file_updated @on-stream-drive-file-updated
- @stream.on \drive_folder_created @on-stream-drive-folder-created
- @stream.on \drive_folder_updated @on-stream-drive-folder-updated
+ this.on('mount', () => {
+ @stream.on 'drive_file_created' this.on-stream-drive-file-created
+ @stream.on 'drive_file_updated' this.on-stream-drive-file-updated
+ @stream.on 'drive_folder_created' this.on-stream-drive-folder-created
+ @stream.on 'drive_folder_updated' this.on-stream-drive-folder-updated
- # Riotのバグでnullを渡しても""になる
- # https://github.com/riot/riot/issues/2080
- #if @opts.folder?
- if @opts.folder? and @opts.folder != ''
- @cd @opts.folder, true
- else if @opts.file? and @opts.file != ''
- @cf @opts.file, true
+ // Riotのバグでnullを渡しても""になる
+ // https://github.com/riot/riot/issues/2080
+ #if this.opts.folder?
+ if this.opts.folder? and this.opts.folder != ''
+ @cd this.opts.folder, true
+ else if this.opts.file? and this.opts.file != ''
+ @cf this.opts.file, true
else
@load!
- @on \unmount ~>
- @stream.off \drive_file_created @on-stream-drive-file-created
- @stream.off \drive_file_updated @on-stream-drive-file-updated
- @stream.off \drive_folder_created @on-stream-drive-folder-created
- @stream.off \drive_folder_updated @on-stream-drive-folder-updated
+ this.on('unmount', () => {
+ @stream.off 'drive_file_created' this.on-stream-drive-file-created
+ @stream.off 'drive_file_updated' this.on-stream-drive-file-updated
+ @stream.off 'drive_folder_created' this.on-stream-drive-folder-created
+ @stream.off 'drive_folder_updated' this.on-stream-drive-folder-updated
- @on-stream-drive-file-created = (file) ~>
+ on-stream-drive-file-created(file) {
@add-file file, true
- @on-stream-drive-file-updated = (file) ~>
+ on-stream-drive-file-updated(file) {
current = if @folder? then @folder.id else null
if current != file.folder_id
@remove-file file
else
@add-file file, true
- @on-stream-drive-folder-created = (folder) ~>
+ on-stream-drive-folder-created(folder) {
@add-folder folder, true
- @on-stream-drive-folder-updated = (folder) ~>
+ on-stream-drive-folder-updated(folder) {
current = if @folder? then @folder.id else null
if current != folder.parent_id
@remove-folder folder
else
@add-folder folder, true
- @_move = (ev) ~>
+ @_move = (ev) =>
@move ev.item.folder
- @move = (target-folder) ~>
+ move(target-folder) {
@cd target-folder
- @cd = (target-folder, silent = false) ~>
- @file = null
+ cd(target-folder, silent = false) {
+ this.file = null
- if target-folder? and typeof target-folder == \object
+ if target-folder? and typeof target-folder == 'object'
target-folder = target-folder.id
if target-folder == null
@go-root!
return
- @loading = true
- @update!
+ this.loading = true
+ this.update();
- @api \drive/folders/show do
+ this.api 'drive/folders/show' do
folder_id: target-folder
- .then (folder) ~>
- @folder = folder
- @hierarchy-folders = []
+ .then (folder) =>
+ this.folder = folder
+ this.hierarchy-folders = []
- x = (f) ~>
+ x = (f) =>
@hierarchy-folders.unshift f
if f.parent?
x f.parent
@@ -220,18 +220,18 @@
if folder.parent?
x folder.parent
- @update!
- @trigger \open-folder @folder, silent
+ this.update();
+ this.trigger 'open-folder' @folder, silent
@load!
.catch (err, text-status) ->
console.error err
- @add-folder = (folder, unshift = false) ~>
+ add-folder(folder, unshift = false) {
current = if @folder? then @folder.id else null
if current != folder.parent_id
return
- if (@folders.some (f) ~> f.id == folder.id)
+ if (@folders.some (f) => f.id == folder.id)
return
if unshift
@@ -239,17 +239,17 @@
else
@folders.push folder
- @update!
+ this.update();
- @add-file = (file, unshift = false) ~>
+ add-file(file, unshift = false) {
current = if @folder? then @folder.id else null
if current != file.folder_id
return
- if (@files.some (f) ~> f.id == file.id)
+ if (@files.some (f) => f.id == file.id)
exist = (@files.map (f) -> f.id).index-of file.id
@files[exist] = file
- @update!
+ this.update();
return
if unshift
@@ -257,38 +257,38 @@
else
@files.push file
- @update!
+ this.update();
- @remove-folder = (folder) ~>
- if typeof folder == \object
+ remove-folder(folder) {
+ if typeof folder == 'object'
folder = folder.id
- @folders = @folders.filter (f) -> f.id != folder
- @update!
+ this.folders = @folders.filter (f) -> f.id != folder
+ this.update();
- @remove-file = (file) ~>
- if typeof file == \object
+ remove-file(file) {
+ if typeof file == 'object'
file = file.id
- @files = @files.filter (f) -> f.id != file
- @update!
+ this.files = @files.filter (f) -> f.id != file
+ this.update();
- @go-root = ~>
+ go-root() {
if @folder != null or @file != null
- @file = null
- @folder = null
- @hierarchy-folders = []
- @update!
- @trigger \move-root
+ this.file = null
+ this.folder = null
+ this.hierarchy-folders = []
+ this.update();
+ this.trigger('move-root');
@load!
- @load = ~>
- @folders = []
- @files = []
- @more-folders = false
- @more-files = false
- @loading = true
- @update!
+ load() {
+ this.folders = []
+ this.files = []
+ this.more-folders = false
+ this.more-files = false
+ this.loading = true
+ this.update();
- @trigger \begin-load
+ this.trigger('begin-load');
load-folders = null
load-files = null
@@ -296,74 +296,74 @@
folders-max = 20
files-max = 20
- # フォルダ一覧取得
- @api \drive/folders do
+ // フォルダ一覧取得
+ this.api 'drive/folders' do
folder_id: if @folder? then @folder.id else null
limit: folders-max + 1
- .then (folders) ~>
+ .then (folders) =>
if folders.length == folders-max + 1
- @more-folders = true
+ this.more-folders = true
folders.pop!
load-folders := folders
complete!
- .catch (err, text-status) ~>
+ .catch (err, text-status) =>
console.error err
- # ファイル一覧取得
- @api \drive/files do
+ // ファイル一覧取得
+ this.api 'drive/files' do
folder_id: if @folder? then @folder.id else null
limit: files-max + 1
- .then (files) ~>
+ .then (files) =>
if files.length == files-max + 1
- @more-files = true
+ this.more-files = true
files.pop!
load-files := files
complete!
- .catch (err, text-status) ~>
+ .catch (err, text-status) =>
console.error err
flag = false
- complete = ~>
+ complete = =>
if flag
- load-folders.for-each (folder) ~>
+ load-folders.for-each (folder) =>
@add-folder folder
- load-files.for-each (file) ~>
+ load-files.for-each (file) =>
@add-file file
- @loading = false
- @update!
+ this.loading = false
+ this.update();
- @trigger \loaded
+ this.trigger('loaded');
else
flag := true
- @trigger \load-mid
+ this.trigger('load-mid');
- @choose-file = (file) ~>
+ choose-file(file) {
if @is-select-mode
- exist = @selected-files.some (f) ~> f.id == file.id
+ exist = @selected-files.some (f) => f.id == file.id
if exist
- @selected-files = (@selected-files.filter (f) ~> f.id != file.id)
+ selected-files(@selected-files.filter (f) { f.id != file.id)
else
@selected-files.push file
- @update!
- @trigger \change-selected @selected-files
+ this.update();
+ this.trigger 'change-selected' @selected-files
else
@cf file
- @cf = (file, silent = false) ~>
- if typeof file == \object
+ cf(file, silent = false) {
+ if typeof file == 'object'
file = file.id
- @loading = true
- @update!
+ this.loading = true
+ this.update();
- @api \drive/files/show do
+ this.api 'drive/files/show' do
file_id: file
- .then (file) ~>
- @file = file
- @folder = null
- @hierarchy-folders = []
+ .then (file) =>
+ this.file = file
+ this.folder = null
+ this.hierarchy-folders = []
- x = (f) ~>
+ x = (f) =>
@hierarchy-folders.unshift f
if f.parent?
x f.parent
@@ -371,7 +371,7 @@
if file.folder?
x file.folder
- @update!
- @trigger \open-file @file, silent
+ this.update();
+ this.trigger 'open-file' @file, silent
</script>
</mk-drive>
diff --git a/src/web/app/mobile/tags/drive/file-viewer.tag b/src/web/app/mobile/tags/drive/file-viewer.tag
index a0d4c44453..86f6ca0c5e 100644
--- a/src/web/app/mobile/tags/drive/file-viewer.tag
+++ b/src/web/app/mobile/tags/drive/file-viewer.tag
@@ -180,22 +180,22 @@
</style>
<script>
- @bytes-to-size = require '../../../common/scripts/bytes-to-size.js'
- @get-gcd = require '../../../common/scripts/gcd.js'
+ this.bytes-to-size = require('../../../common/scripts/bytes-to-size.js');
+ this.get-gcd = require('../../../common/scripts/gcd.js');
- @mixin \api
+ this.mixin('api');
- @file = @opts.file
- @kind = @file.type.split \/ .0
+ this.file = this.opts.file
+ this.kind = @file.type.split '/' .0
- @rename = ~>
+ rename() {
name = window.prompt '名前を変更' @file.name
if name? and name != '' and name != @file.name
- @api \drive/files/update do
+ this.api 'drive/files/update' do
file_id: @file.id
name: name
- .then ~>
- @parent.cf @file, true
+ .then =>
+ this.parent.cf @file, true
</script>
</mk-drive-file-viewer>
diff --git a/src/web/app/mobile/tags/drive/file.tag b/src/web/app/mobile/tags/drive/file.tag
index 95f91e5ebc..16fa74b4bf 100644
--- a/src/web/app/mobile/tags/drive/file.tag
+++ b/src/web/app/mobile/tags/drive/file.tag
@@ -122,16 +122,16 @@
</style>
<script>
- @bytes-to-size = require '../../../common/scripts/bytes-to-size.js'
+ this.bytes-to-size = require('../../../common/scripts/bytes-to-size.js');
- @browser = @parent
- @file = @opts.file
- @is-selected = @browser.selected-files.some (f) ~> f.id == @file.id
+ this.browser = this.parent
+ this.file = this.opts.file
+ this.is-selected = @browser.selected-files.some (f) => f.id == @file.id
- @browser.on \change-selected (selects) ~>
- @is-selected = selects.some (f) ~> f.id == @file.id
+ @browser.on('change-selected', (selects) => {
+ this.is-selected = selects.some (f) => f.id == @file.id
- @onclick = ~>
+ onclick() {
@browser.choose-file @file
</script>
</mk-drive-file>
diff --git a/src/web/app/mobile/tags/drive/folder.tag b/src/web/app/mobile/tags/drive/folder.tag
index 82bef02625..aeb1601a61 100644
--- a/src/web/app/mobile/tags/drive/folder.tag
+++ b/src/web/app/mobile/tags/drive/folder.tag
@@ -37,10 +37,10 @@
</style>
<script>
- @browser = @parent
- @folder = @opts.folder
+ this.browser = this.parent
+ this.folder = this.opts.folder
- @onclick = ~>
+ onclick() {
@browser.move @folder
</script>
</mk-drive-folder>
diff --git a/src/web/app/mobile/tags/follow-button.tag b/src/web/app/mobile/tags/follow-button.tag
index ac7058aebd..99936530c8 100644
--- a/src/web/app/mobile/tags/follow-button.tag
+++ b/src/web/app/mobile/tags/follow-button.tag
@@ -48,58 +48,58 @@
</style>
<script>
- @mixin \api
- @mixin \is-promise
- @mixin \stream
+ this.mixin('api');
+ this.mixin('is-promise');
+ this.mixin('stream');
- @user = null
- @user-promise = if @is-promise @opts.user then @opts.user else Promise.resolve @opts.user
- @init = true
- @wait = false
+ this.user = null
+ this.user-promise = if @is-promise this.opts.user then this.opts.user else Promise.resolve this.opts.user
+ this.init = true
+ this.wait = false
- @on \mount ~>
- @user-promise.then (user) ~>
- @user = user
- @init = false
- @update!
- @stream.on \follow @on-stream-follow
- @stream.on \unfollow @on-stream-unfollow
+ this.on('mount', () => {
+ @user-promise.then (user) =>
+ this.user = user
+ this.init = false
+ this.update();
+ @stream.on 'follow' this.on-stream-follow
+ @stream.on 'unfollow' this.on-stream-unfollow
- @on \unmount ~>
- @stream.off \follow @on-stream-follow
- @stream.off \unfollow @on-stream-unfollow
+ this.on('unmount', () => {
+ @stream.off 'follow' this.on-stream-follow
+ @stream.off 'unfollow' this.on-stream-unfollow
- @on-stream-follow = (user) ~>
+ on-stream-follow(user) {
if user.id == @user.id
- @user = user
- @update!
+ this.user = user
+ this.update();
- @on-stream-unfollow = (user) ~>
+ on-stream-unfollow(user) {
if user.id == @user.id
- @user = user
- @update!
+ this.user = user
+ this.update();
- @onclick = ~>
- @wait = true
+ onclick() {
+ this.wait = true
if @user.is_following
- @api \following/delete do
+ this.api 'following/delete' do
user_id: @user.id
- .then ~>
+ .then =>
@user.is_following = false
.catch (err) ->
console.error err
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
else
- @api \following/create do
+ this.api 'following/create' do
user_id: @user.id
- .then ~>
+ .then =>
@user.is_following = true
.catch (err) ->
console.error err
- .then ~>
- @wait = false
- @update!
+ .then =>
+ this.wait = false
+ this.update();
</script>
</mk-follow-button>
diff --git a/src/web/app/mobile/tags/home-timeline.tag b/src/web/app/mobile/tags/home-timeline.tag
index 2aa9127144..98c3a08215 100644
--- a/src/web/app/mobile/tags/home-timeline.tag
+++ b/src/web/app/mobile/tags/home-timeline.tag
@@ -6,38 +6,38 @@
</style>
<script>
- @mixin \api
- @mixin \stream
+ this.mixin('api');
+ this.mixin('stream');
- @init = new Promise (res, rej) ~>
- @api \posts/timeline
- .then (posts) ~>
+ this.init = new Promise (res, rej) =>
+ this.api 'posts/timeline'
+ .then (posts) =>
res posts
- @trigger \loaded
+ this.trigger('loaded');
- @on \mount ~>
- @stream.on \post @on-stream-post
- @stream.on \follow @on-stream-follow
- @stream.on \unfollow @on-stream-unfollow
+ this.on('mount', () => {
+ @stream.on 'post' this.on-stream-post
+ @stream.on 'follow' this.on-stream-follow
+ @stream.on 'unfollow' this.on-stream-unfollow
- @on \unmount ~>
- @stream.off \post @on-stream-post
- @stream.off \follow @on-stream-follow
- @stream.off \unfollow @on-stream-unfollow
+ this.on('unmount', () => {
+ @stream.off 'post' this.on-stream-post
+ @stream.off 'follow' this.on-stream-follow
+ @stream.off 'unfollow' this.on-stream-unfollow
- @more = ~>
- @api \posts/timeline do
- max_id: @refs.timeline.tail!.id
+ more() {
+ this.api 'posts/timeline' do
+ max_id: this.refs.timeline.tail!.id
- @on-stream-post = (post) ~>
- @is-empty = false
- @update!
- @refs.timeline.add-post post
+ on-stream-post(post) {
+ this.is-empty = false
+ this.update();
+ this.refs.timeline.add-post post
- @on-stream-follow = ~>
+ on-stream-follow() {
@fetch!
- @on-stream-unfollow = ~>
+ on-stream-unfollow() {
@fetch!
</script>
</mk-home-timeline>
diff --git a/src/web/app/mobile/tags/home.tag b/src/web/app/mobile/tags/home.tag
index 78141ca9a7..0ca62cdb00 100644
--- a/src/web/app/mobile/tags/home.tag
+++ b/src/web/app/mobile/tags/home.tag
@@ -13,8 +13,8 @@
</style>
<script>
- @on \mount ~>
- @refs.tl.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.tl.on('loaded', () => {
+ this.trigger('loaded');
</script>
</mk-home>
diff --git a/src/web/app/mobile/tags/images-viewer.tag b/src/web/app/mobile/tags/images-viewer.tag
index 05dc744cdb..6ff03ba637 100644
--- a/src/web/app/mobile/tags/images-viewer.tag
+++ b/src/web/app/mobile/tags/images-viewer.tag
@@ -18,10 +18,10 @@
</style>
<script>
- @images = @opts.images
- @image = @images.0
+ this.images = this.opts.images
+ this.image = @images.0
- @click = ~>
+ click() {
window.open @image.url
</script>
</mk-images-viewer>
diff --git a/src/web/app/mobile/tags/notification-preview.tag b/src/web/app/mobile/tags/notification-preview.tag
index c146c6f0f7..800d1b4345 100644
--- a/src/web/app/mobile/tags/notification-preview.tag
+++ b/src/web/app/mobile/tags/notification-preview.tag
@@ -107,7 +107,7 @@
</style>
<script>
- @mixin \get-post-summary
- @notification = @opts.notification
+ this.mixin('get-post-summary');
+ this.notification = this.opts.notification
</script>
</mk-notification-preview>
diff --git a/src/web/app/mobile/tags/notification.tag b/src/web/app/mobile/tags/notification.tag
index b619c66980..9cf61fe40e 100644
--- a/src/web/app/mobile/tags/notification.tag
+++ b/src/web/app/mobile/tags/notification.tag
@@ -167,7 +167,7 @@
</style>
<script>
- @mixin \get-post-summary
- @notification = @opts.notification
+ this.mixin('get-post-summary');
+ this.notification = this.opts.notification
</script>
</mk-notification>
diff --git a/src/web/app/mobile/tags/notifications.tag b/src/web/app/mobile/tags/notifications.tag
index 8207495795..59bcebaa40 100644
--- a/src/web/app/mobile/tags/notifications.tag
+++ b/src/web/app/mobile/tags/notifications.tag
@@ -57,34 +57,34 @@
</style>
<script>
- @mixin \api
- @mixin \stream
- @mixin \get-post-summary
+ this.mixin('api');
+ this.mixin('stream');
+ this.mixin('get-post-summary');
- @notifications = []
- @loading = true
+ this.notifications = []
+ this.loading = true
- @on \mount ~>
- @api \i/notifications
- .then (notifications) ~>
- @notifications = notifications
- @loading = false
- @update!
- @trigger \loaded
+ this.on('mount', () => {
+ this.api 'i/notifications'
+ .then (notifications) =>
+ this.notifications = notifications
+ this.loading = false
+ this.update();
+ this.trigger('loaded');
.catch (err, text-status) ->
console.error err
- @stream.on \notification @on-notification
+ @stream.on 'notification' this.on-notification
- @on \unmount ~>
- @stream.off \notification @on-notification
+ this.on('unmount', () => {
+ @stream.off 'notification' this.on-notification
- @on-notification = (notification) ~>
+ on-notification(notification) {
@notifications.unshift notification
- @update!
+ this.update();
- @on \update ~>
- @notifications.for-each (notification) ~>
+ this.on('update', () => {
+ @notifications.for-each (notification) =>
date = (new Date notification.created_at).get-date!
month = (new Date notification.created_at).get-month! + 1
notification._date = date
diff --git a/src/web/app/mobile/tags/notify.tag b/src/web/app/mobile/tags/notify.tag
index aa45ce0cff..5d27860e41 100644
--- a/src/web/app/mobile/tags/notify.tag
+++ b/src/web/app/mobile/tags/notify.tag
@@ -16,22 +16,22 @@
</style>
<script>
- @on \mount ~>
- Velocity @root, {
- bottom: \0px
+ this.on('mount', () => {
+ Velocity this.root, {
+ bottom: '0px'
} {
duration: 500ms
- easing: \ease-out
+ easing: 'ease-out'
}
- set-timeout ~>
- Velocity @root, {
- bottom: \-64px
+ setTimeout =>
+ Velocity this.root, {
+ bottom: '-64px'
} {
duration: 500ms
- easing: \ease-out
- complete: ~>
- @unmount!
+ easing: 'ease-out'
+ complete: =>
+ this.unmount();
}
, 6000ms
</script>
diff --git a/src/web/app/mobile/tags/page/drive.tag b/src/web/app/mobile/tags/page/drive.tag
index ef83e4d5ba..c3e16a704e 100644
--- a/src/web/app/mobile/tags/page/drive.tag
+++ b/src/web/app/mobile/tags/page/drive.tag
@@ -8,53 +8,53 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
+ this.mixin('ui');
+ this.mixin('ui-progress');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey Drive'
- @ui.trigger \title '<i class="fa fa-cloud"></i>ドライブ'
+ this.ui.trigger('title', '<i class="fa fa-cloud"></i>ドライブ');
- @refs.ui.refs.browser.on \begin-load ~>
- @Progress.start!
+ this.refs.ui.refs.browser.on('begin-load', () => {
+ this.Progress.start();
- @refs.ui.refs.browser.on \loaded-mid ~>
- @Progress.set 0.5
+ this.refs.ui.refs.browser.on('loaded-mid', () => {
+ this.Progress.set(0.5);
- @refs.ui.refs.browser.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.browser.on('loaded', () => {
+ this.Progress.done();
- @refs.ui.refs.browser.on \move-root ~>
+ this.refs.ui.refs.browser.on('move-root', () => {
title = 'Misskey Drive'
- # Rewrite URL
- history.push-state null, title, '/i/drive'
+ // Rewrite URL
+ history.pushState null, title, '/i/drive'
document.title = title
- @ui.trigger \title '<i class="fa fa-cloud"></i>ドライブ'
+ this.ui.trigger('title', '<i class="fa fa-cloud"></i>ドライブ');
- @refs.ui.refs.browser.on \open-folder (folder, silent) ~>
+ this.refs.ui.refs.browser.on('open-folder', (folder, silent) => {
title = folder.name + ' | Misskey Drive'
if !silent
- # Rewrite URL
- history.push-state null, title, '/i/drive/folder/' + folder.id
+ // Rewrite URL
+ history.pushState null, title, '/i/drive/folder/' + folder.id
document.title = title
- # TODO: escape html characters in folder.name
- @ui.trigger \title '<i class="fa fa-folder-open"></i>' + folder.name
+ // TODO: escape html characters in folder.name
+ this.ui.trigger('title', '<i class="fa fa-folder-open"></i>' + folder.name);
- @refs.ui.refs.browser.on \open-file (file, silent) ~>
+ this.refs.ui.refs.browser.on('open-file', (file, silent) => {
title = file.name + ' | Misskey Drive'
if !silent
- # Rewrite URL
- history.push-state null, title, '/i/drive/file/' + file.id
+ // Rewrite URL
+ history.pushState null, title, '/i/drive/file/' + file.id
document.title = title
- # TODO: escape html characters in file.name
- @ui.trigger \title '<mk-file-type-icon class="icon"></mk-file-type-icon>' + file.name
- riot.mount \mk-file-type-icon do
+ // TODO: escape html characters in file.name
+ this.ui.trigger('title', '<mk-file-type-icon class="icon"></mk-file-type-icon>' + file.name);
+ riot.mount 'mk-file-type-icon' do
type: file.type
</script>
diff --git a/src/web/app/mobile/tags/page/entrance.tag b/src/web/app/mobile/tags/page/entrance.tag
index 424c58da5d..3ec43f0f61 100644
--- a/src/web/app/mobile/tags/page/entrance.tag
+++ b/src/web/app/mobile/tags/page/entrance.tag
@@ -43,18 +43,18 @@
</style>
<script>
- @mode = \signin
+ this.mode = 'signin'
- @signup = ~>
- @mode = \signup
- @update!
+ signup() {
+ this.mode = 'signup'
+ this.update();
- @signin = ~>
- @mode = \signin
- @update!
+ signin() {
+ this.mode = 'signin'
+ this.update();
- @introduction = ~>
- @mode = \introduction
- @update!
+ introduction() {
+ this.mode = 'introduction'
+ this.update();
</script>
</mk-entrance>
diff --git a/src/web/app/mobile/tags/page/home.tag b/src/web/app/mobile/tags/page/home.tag
index 947e119b09..db87483a90 100644
--- a/src/web/app/mobile/tags/page/home.tag
+++ b/src/web/app/mobile/tags/page/home.tag
@@ -8,38 +8,38 @@
</style>
<script>
- @mixin \i
- @mixin \ui
- @mixin \ui-progress
- @mixin \stream
- @mixin \get-post-summary
+ this.mixin('i');
+ this.mixin('ui');
+ this.mixin('ui-progress');
+ this.mixin('stream');
+ this.mixin('get-post-summary');
- @unread-count = 0
+ this.unread-count = 0
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey'
- @ui.trigger \title '<i class="fa fa-home"></i>ホーム'
+ this.ui.trigger('title', '<i class="fa fa-home"></i>ホーム');
- @Progress.start!
+ this.Progress.start();
- @stream.on \post @on-stream-post
- document.add-event-listener \visibilitychange @window-on-visibilitychange, false
+ @stream.on 'post' this.on-stream-post
+ document.add-event-listener 'visibilitychange' @window-on-visibilitychange, false
- @refs.ui.refs.home.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.home.on('loaded', () => {
+ this.Progress.done();
- @on \unmount ~>
- @stream.off \post @on-stream-post
- document.remove-event-listener \visibilitychange @window-on-visibilitychange
+ this.on('unmount', () => {
+ @stream.off 'post' this.on-stream-post
+ document.remove-event-listener 'visibilitychange' @window-on-visibilitychange
- @on-stream-post = (post) ~>
+ on-stream-post(post) {
if document.hidden and post.user_id !== @I.id
@unread-count++
document.title = '(' + @unread-count + ') ' + @get-post-summary post
- @window-on-visibilitychange = ~>
+ window-on-visibilitychange() {
if !document.hidden
- @unread-count = 0
+ this.unread-count = 0
document.title = 'Misskey'
</script>
</mk-home-page>
diff --git a/src/web/app/mobile/tags/page/messaging-room.tag b/src/web/app/mobile/tags/page/messaging-room.tag
index 2216d0c460..6b699143ce 100644
--- a/src/web/app/mobile/tags/page/messaging-room.tag
+++ b/src/web/app/mobile/tags/page/messaging-room.tag
@@ -7,21 +7,21 @@
display block
</style>
<script>
- @mixin \api
- @mixin \ui
+ this.mixin('api');
+ this.mixin('ui');
- @fetching = true
+ this.fetching = true
- @on \mount ~>
- @api \users/show do
- username: @opts.username
- .then (user) ~>
- @fetching = false
- @user = user
- @update!
+ this.on('mount', () => {
+ this.api 'users/show' do
+ username: this.opts.username
+ .then (user) =>
+ this.fetching = false
+ this.user = user
+ this.update();
document.title = 'メッセージ: ' + user.name + ' | Misskey'
- # TODO: ユーザー名をエスケープ
- @ui.trigger \title '<i class="fa fa-comments-o"></i>' + user.name
+ // TODO: ユーザー名をエスケープ
+ this.ui.trigger('title', '<i class="fa fa-comments-o"></i>'); + user.name
</script>
</mk-messaging-room-page>
diff --git a/src/web/app/mobile/tags/page/messaging.tag b/src/web/app/mobile/tags/page/messaging.tag
index dd277f46e9..1af983b1db 100644
--- a/src/web/app/mobile/tags/page/messaging.tag
+++ b/src/web/app/mobile/tags/page/messaging.tag
@@ -7,14 +7,14 @@
display block
</style>
<script>
- @mixin \ui
- @mixin \page
+ this.mixin('ui');
+ this.mixin('page');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | メッセージ'
- @ui.trigger \title '<i class="fa fa-comments-o"></i>メッセージ'
+ this.ui.trigger('title', '<i class="fa fa-comments-o"></i>メッセージ');
- @refs.ui.refs.index.on \navigate-user (user) ~>
+ this.refs.ui.refs.index.on('navigate-user', (user) => {
@page '/i/messaging/' + user.username
</script>
diff --git a/src/web/app/mobile/tags/page/notifications.tag b/src/web/app/mobile/tags/page/notifications.tag
index 18b6cc2834..b33386fb85 100644
--- a/src/web/app/mobile/tags/page/notifications.tag
+++ b/src/web/app/mobile/tags/page/notifications.tag
@@ -8,16 +8,16 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
+ this.mixin('ui');
+ this.mixin('ui-progress');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | 通知'
- @ui.trigger \title '<i class="fa fa-bell-o"></i>通知'
+ this.ui.trigger('title', '<i class="fa fa-bell-o"></i>通知');
- @Progress.start!
+ this.Progress.start();
- @refs.ui.refs.notifications.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.notifications.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-notifications-page>
diff --git a/src/web/app/mobile/tags/page/post.tag b/src/web/app/mobile/tags/page/post.tag
index a8ffb1c3c7..69a24c5528 100644
--- a/src/web/app/mobile/tags/page/post.tag
+++ b/src/web/app/mobile/tags/page/post.tag
@@ -18,21 +18,21 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
+ this.mixin('ui');
+ this.mixin('ui-progress');
- @post = @opts.post
+ this.post = this.opts.post
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey'
- @ui.trigger \title '<i class="fa fa-sticky-note-o"></i>投稿'
+ this.ui.trigger('title', '<i class="fa fa-sticky-note-o"></i>投稿');
- @Progress.start!
+ this.Progress.start();
- @refs.ui.refs.post.on \post-fetched ~>
- @Progress.set 0.5
+ this.refs.ui.refs.post.on('post-fetched', () => {
+ this.Progress.set(0.5);
- @refs.ui.refs.post.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.post.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-post-page>
diff --git a/src/web/app/mobile/tags/page/search.tag b/src/web/app/mobile/tags/page/search.tag
index 31de7d9625..4dde50ab8d 100644
--- a/src/web/app/mobile/tags/page/search.tag
+++ b/src/web/app/mobile/tags/page/search.tag
@@ -8,17 +8,17 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
+ this.mixin('ui');
+ this.mixin('ui-progress');
- @on \mount ~>
- document.title = '検索: ' + @opts.query + ' | Misskey'
- # TODO: クエリをHTMLエスケープ
- @ui.trigger \title '<i class="fa fa-search"></i>' + @opts.query
+ this.on('mount', () => {
+ document.title = '検索: ' + this.opts.query + ' | Misskey'
+ // TODO: クエリをHTMLエスケープ
+ this.ui.trigger('title', '<i class="fa fa-search"></i>'); + this.opts.query
- @Progress.start!
+ this.Progress.start();
- @refs.ui.refs.search.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.search.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-search-page>
diff --git a/src/web/app/mobile/tags/page/settings.tag b/src/web/app/mobile/tags/page/settings.tag
index 99e7569f5b..5e06a302ee 100644
--- a/src/web/app/mobile/tags/page/settings.tag
+++ b/src/web/app/mobile/tags/page/settings.tag
@@ -13,10 +13,10 @@
display block
</style>
<script>
- @mixin \ui
+ this.mixin('ui');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | 設定'
- @ui.trigger \title '<i class="fa fa-cog"></i>設定'
+ this.ui.trigger('title', '<i class="fa fa-cog"></i>設定');
</script>
</mk-settings-page>
diff --git a/src/web/app/mobile/tags/page/settings/api.tag b/src/web/app/mobile/tags/page/settings/api.tag
index 69f4a47db0..039792c0a8 100644
--- a/src/web/app/mobile/tags/page/settings/api.tag
+++ b/src/web/app/mobile/tags/page/settings/api.tag
@@ -7,10 +7,10 @@
display block
</style>
<script>
- @mixin \ui
+ this.mixin('ui');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | API'
- @ui.trigger \title '<i class="fa fa-key"></i>API'
+ this.ui.trigger('title', '<i class="fa fa-key"></i>API');
</script>
</mk-api-info-page>
diff --git a/src/web/app/mobile/tags/page/settings/authorized-apps.tag b/src/web/app/mobile/tags/page/settings/authorized-apps.tag
index abb8ba0fc0..1415f11d0a 100644
--- a/src/web/app/mobile/tags/page/settings/authorized-apps.tag
+++ b/src/web/app/mobile/tags/page/settings/authorized-apps.tag
@@ -7,10 +7,10 @@
display block
</style>
<script>
- @mixin \ui
+ this.mixin('ui');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | アプリケーション'
- @ui.trigger \title '<i class="fa fa-puzzle-piece"></i>アプリケーション'
+ this.ui.trigger('title', '<i class="fa fa-puzzle-piece"></i>アプリケーション');
</script>
</mk-authorized-apps-page>
diff --git a/src/web/app/mobile/tags/page/settings/signin.tag b/src/web/app/mobile/tags/page/settings/signin.tag
index 5886b53f9a..092cd64419 100644
--- a/src/web/app/mobile/tags/page/settings/signin.tag
+++ b/src/web/app/mobile/tags/page/settings/signin.tag
@@ -7,10 +7,10 @@
display block
</style>
<script>
- @mixin \ui
+ this.mixin('ui');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | ログイン履歴'
- @ui.trigger \title '<i class="fa fa-sign-in"></i>ログイン履歴'
+ this.ui.trigger('title', '<i class="fa fa-sign-in"></i>ログイン履歴');
</script>
</mk-signin-history-page>
diff --git a/src/web/app/mobile/tags/page/settings/twitter.tag b/src/web/app/mobile/tags/page/settings/twitter.tag
index f6cde2e5a5..87550efe28 100644
--- a/src/web/app/mobile/tags/page/settings/twitter.tag
+++ b/src/web/app/mobile/tags/page/settings/twitter.tag
@@ -7,10 +7,10 @@
display block
</style>
<script>
- @mixin \ui
+ this.mixin('ui');
- @on \mount ~>
+ this.on('mount', () => {
document.title = 'Misskey | Twitter連携'
- @ui.trigger \title '<i class="fa fa-twitter"></i>Twitter連携'
+ this.ui.trigger('title', '<i class="fa fa-twitter"></i>Twitter連携');
</script>
</mk-twitter-setting-page>
diff --git a/src/web/app/mobile/tags/page/user-followers.tag b/src/web/app/mobile/tags/page/user-followers.tag
index 5856e60e02..12338e7967 100644
--- a/src/web/app/mobile/tags/page/user-followers.tag
+++ b/src/web/app/mobile/tags/page/user-followers.tag
@@ -8,29 +8,29 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
- @mixin \api
+ this.mixin('ui');
+ this.mixin('ui-progress');
+ this.mixin('api');
- @fetching = true
- @user = null
+ this.fetching = true
+ this.user = null
- @on \mount ~>
- @Progress.start!
+ this.on('mount', () => {
+ this.Progress.start();
- @api \users/show do
- username: @opts.user
- .then (user) ~>
- @user = user
- @fetching = false
+ this.api 'users/show' do
+ username: this.opts.user
+ .then (user) =>
+ this.user = user
+ this.fetching = false
document.title = user.name + 'のフォロワー | Misskey'
- # TODO: ユーザー名をエスケープ
- @ui.trigger \title '<img src="' + user.avatar_url + '?thumbnail&size=64">' + user.name + 'のフォロワー'
+ // TODO: ユーザー名をエスケープ
+ this.ui.trigger('title', '<img src="'); + user.avatar_url + '?thumbnail&size=64">' + user.name + 'のフォロワー'
- @update!
+ this.update();
- @refs.ui.refs.list.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.list.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-user-followers-page>
diff --git a/src/web/app/mobile/tags/page/user-following.tag b/src/web/app/mobile/tags/page/user-following.tag
index 14b006d3f9..088c458328 100644
--- a/src/web/app/mobile/tags/page/user-following.tag
+++ b/src/web/app/mobile/tags/page/user-following.tag
@@ -8,29 +8,29 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
- @mixin \api
+ this.mixin('ui');
+ this.mixin('ui-progress');
+ this.mixin('api');
- @fetching = true
- @user = null
+ this.fetching = true
+ this.user = null
- @on \mount ~>
- @Progress.start!
+ this.on('mount', () => {
+ this.Progress.start();
- @api \users/show do
- username: @opts.user
- .then (user) ~>
- @user = user
- @fetching = false
+ this.api 'users/show' do
+ username: this.opts.user
+ .then (user) =>
+ this.user = user
+ this.fetching = false
document.title = user.name + 'のフォロー | Misskey'
- # TODO: ユーザー名をエスケープ
- @ui.trigger \title '<img src="' + user.avatar_url + '?thumbnail&size=64">' + user.name + 'のフォロー'
+ // TODO: ユーザー名をエスケープ
+ this.ui.trigger('title', '<img src="'); + user.avatar_url + '?thumbnail&size=64">' + user.name + 'のフォロー'
- @update!
+ this.update();
- @refs.ui.refs.list.on \loaded ~>
- @Progress.done!
+ this.refs.ui.refs.list.on('loaded', () => {
+ this.Progress.done();
</script>
</mk-user-following-page>
diff --git a/src/web/app/mobile/tags/page/user.tag b/src/web/app/mobile/tags/page/user.tag
index 0ac8ed4e25..4215ca2c35 100644
--- a/src/web/app/mobile/tags/page/user.tag
+++ b/src/web/app/mobile/tags/page/user.tag
@@ -8,18 +8,18 @@
</style>
<script>
- @mixin \ui
- @mixin \ui-progress
+ this.mixin('ui');
+ this.mixin('ui-progress');
- @user = @opts.user
+ this.user = this.opts.user
- @on \mount ~>
- @Progress.start!
+ this.on('mount', () => {
+ this.Progress.start();
- @refs.ui.refs.user.on \loaded (user) ~>
- @Progress.done!
+ this.refs.ui.refs.user.on('loaded', (user) => {
+ this.Progress.done();
document.title = user.name + ' | Misskey'
- # TODO: ユーザー名をエスケープ
- @ui.trigger \title '<i class="fa fa-user"></i>' + user.name
+ // TODO: ユーザー名をエスケープ
+ this.ui.trigger('title', '<i class="fa fa-user"></i>'); + user.name
</script>
</mk-user-page>
diff --git a/src/web/app/mobile/tags/post-detail.tag b/src/web/app/mobile/tags/post-detail.tag
index 3856df0800..7d19a96d54 100644
--- a/src/web/app/mobile/tags/post-detail.tag
+++ b/src/web/app/mobile/tags/post-detail.tag
@@ -329,102 +329,102 @@
</style>
<script>
- @mixin \api
- @mixin \text
- @mixin \get-post-summary
- @mixin \open-post-form
+ this.mixin('api');
+ this.mixin('text');
+ this.mixin('get-post-summary');
+ this.mixin('open-post-form');
- @fetching = true
- @loading-context = false
- @content = null
- @post = null
+ this.fetching = true
+ this.loading-context = false
+ this.content = null
+ this.post = null
- @on \mount ~>
- @api \posts/show do
- post_id: @opts.post
- .then (post) ~>
- @post = post
- @is-repost = @post.repost?
- @p = if @is-repost then @post.repost else @post
- @summary = @get-post-summary @p
- @trigger \loaded
- @fetching = false
- @update!
+ this.on('mount', () => {
+ this.api 'posts/show' do
+ post_id: this.opts.post
+ .then (post) =>
+ this.post = post
+ this.is-repost = @post.repost?
+ this.p = if @is-repost then @post.repost else @post
+ this.summary = @get-post-summary @p
+ this.trigger('loaded');
+ this.fetching = false
+ this.update();
if @p.text?
tokens = @analyze @p.text
- @refs.text.innerHTML = @compile tokens
+ this.refs.text.innerHTML = @compile tokens
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
- # URLをプレビュー
+ // URLをプレビュー
tokens
- .filter (t) -> t.type == \link
- .map (t) ~>
- @preview = @refs.text.append-child document.create-element \mk-url-preview
+ .filter (t) -> t.type == 'link'
+ .map (t) =>
+ this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
riot.mount @preview, do
url: t.content
- # Get likes
- @api \posts/likes do
+ // Get likes
+ this.api 'posts/likes' do
post_id: @p.id
limit: 8
- .then (likes) ~>
- @likes = likes
- @update!
+ .then (likes) =>
+ this.likes = likes
+ this.update();
- # Get reposts
- @api \posts/reposts do
+ // Get reposts
+ this.api 'posts/reposts' do
post_id: @p.id
limit: 8
- .then (reposts) ~>
- @reposts = reposts
- @update!
+ .then (reposts) =>
+ this.reposts = reposts
+ this.update();
- # Get replies
- @api \posts/replies do
+ // Get replies
+ this.api 'posts/replies' do
post_id: @p.id
limit: 8
- .then (replies) ~>
- @replies = replies
- @update!
+ .then (replies) =>
+ this.replies = replies
+ this.update();
- @reply = ~>
+ reply() {
@open-post-form do
reply: @p
- @repost = ~>
+ repost() {
text = window.prompt '「' + @summary + '」をRepost'
if text?
- @api \posts/create do
+ this.api 'posts/create' do
repost_id: @p.id
text: if text == '' then undefined else text
- @like = ~>
+ like() {
if @p.is_liked
- @api \posts/likes/delete do
+ this.api 'posts/likes/delete' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = false
- @update!
+ this.update();
else
- @api \posts/likes/create do
+ this.api 'posts/likes/create' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = true
- @update!
+ this.update();
- @load-context = ~>
- @loading-context = true
+ load-context() {
+ this.loading-context = true
- # Get context
- @api \posts/context do
+ // Get context
+ this.api 'posts/context' do
post_id: @p.reply_to_id
- .then (context) ~>
- @context = context.reverse!
- @loading-context = false
- @update!
+ .then (context) =>
+ this.context = context.reverse!
+ this.loading-context = false
+ this.update();
</script>
</mk-post-detail>
diff --git a/src/web/app/mobile/tags/post-form.tag b/src/web/app/mobile/tags/post-form.tag
index 3d98a9832f..e53339dd47 100644
--- a/src/web/app/mobile/tags/post-form.tag
+++ b/src/web/app/mobile/tags/post-form.tag
@@ -182,103 +182,103 @@
</style>
<script>
- get-cat = require '../../common/scripts/get-cat'
+ get-cat = require('../../common/scripts/get-cat');
- @mixin \api
+ this.mixin('api');
- @wait = false
- @uploadings = []
- @files = []
- @poll = false
+ this.wait = false
+ this.uploadings = []
+ this.files = []
+ this.poll = false
- @on \mount ~>
- @refs.uploader.on \uploaded (file) ~>
+ this.on('mount', () => {
+ this.refs.uploader.on('uploaded', (file) => {
@add-file file
- @refs.uploader.on \change-uploads (uploads) ~>
- @trigger \change-uploading-files uploads
+ this.refs.uploader.on('change-uploads', (uploads) => {
+ this.trigger 'change-uploading-files' uploads
- @refs.text.focus!
+ this.refs.text.focus();
- @onkeypress = (e) ~>
- if (e.char-code == 10 || e.char-code == 13) && e.ctrl-key
+ onkeypress(e) {
+ if (e.char-code == 10 || e.char-code == 13) && e.ctrlKey
@post!
else
return true
- @onpaste = (e) ~>
- data = e.clipboard-data
+ onpaste(e) {
+ data = e.clipboardData
items = data.items
for i from 0 to items.length - 1
item = items[i]
switch (item.kind)
- | \file =>
- @upload item.get-as-file!
+ | 'file' =>
+ @upload item.getAsFile();
return true
- @select-file = ~>
- @refs.file.click!
+ select-file() {
+ this.refs.file.click!
- @select-file-from-drive = ~>
- browser = document.body.append-child document.create-element \mk-drive-selector
+ select-file-from-drive() {
+ browser = document.body.appendChild document.createElement 'mk-drive-selector'
browser = riot.mount browser, do
multiple: true
.0
- browser.on \selected (files) ~>
+ browser.on('selected', (files) => {
files.for-each @add-file
- @change-file = ~>
- files = @refs.file.files
+ change-file() {
+ files = this.refs.file.files
for i from 0 to files.length - 1
file = files.item i
@upload file
- @upload = (file) ~>
- @refs.uploader.upload file
+ upload(file) {
+ this.refs.uploader.upload file
- @add-file = (file) ~>
- file._remove = ~>
- @files = @files.filter (x) -> x.id != file.id
- @trigger \change-files @files
- @update!
+ add-file(file) {
+ file._remove = =>
+ this.files = @files.filter (x) -> x.id != file.id
+ this.trigger 'change-files' @files
+ this.update();
@files.push file
- @trigger \change-files @files
- @update!
+ this.trigger 'change-files' @files
+ this.update();
- @add-poll = ~>
- @poll = true
+ add-poll() {
+ this.poll = true
- @on-poll-destroyed = ~>
+ on-poll-destroyed() {
@update do
poll: false
- @post = ~>
- @wait = true
+ post() {
+ this.wait = true
files = if @files? and @files.length > 0
then @files.map (f) -> f.id
else undefined
- @api \posts/create do
- text: @refs.text.value
+ this.api 'posts/create' do
+ text: this.refs.text.value
media_ids: files
- reply_to_id: if @opts.reply? then @opts.reply.id else undefined
- poll: if @poll then @refs.poll.get! else undefined
- .then (data) ~>
- @trigger \post
- @unmount!
- .catch (err) ~>
+ reply_to_id: if this.opts.reply? then this.opts.reply.id else undefined
+ poll: if @poll then this.refs.poll.get! else undefined
+ .then (data) =>
+ this.trigger('post');
+ this.unmount();
+ .catch (err) =>
console.error err
- #@opts.ui.trigger \notification 'Error!'
- @wait = false
- @update!
+ #this.opts.ui.trigger 'notification' 'Error!'
+ this.wait = false
+ this.update();
- @cancel = ~>
- @trigger \cancel
- @unmount!
+ cancel() {
+ this.trigger('cancel');
+ this.unmount();
- @cat = ~>
- @refs.text.value = @refs.text.value + get-cat!
+ cat() {
+ this.refs.text.value = this.refs.text.value + get-cat!
</script>
</mk-post-form>
diff --git a/src/web/app/mobile/tags/post-preview.tag b/src/web/app/mobile/tags/post-preview.tag
index d86ca86df6..aa1d5f9b29 100644
--- a/src/web/app/mobile/tags/post-preview.tag
+++ b/src/web/app/mobile/tags/post-preview.tag
@@ -90,5 +90,5 @@
color #717171
</style>
- <script>@post = @opts.post</script>
+ <script>this.post = this.opts.post</script>
</mk-post-preview>
diff --git a/src/web/app/mobile/tags/search-posts.tag b/src/web/app/mobile/tags/search-posts.tag
index 18d538c327..120df41407 100644
--- a/src/web/app/mobile/tags/search-posts.tag
+++ b/src/web/app/mobile/tags/search-posts.tag
@@ -7,24 +7,24 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @max = 30
- @offset = 0
+ this.max = 30
+ this.offset = 0
- @query = @opts.query
- @with-media = @opts.with-media
+ this.query = this.opts.query
+ this.with-media = this.opts.with-media
- @init = new Promise (res, rej) ~>
- @api \posts/search do
+ this.init = new Promise (res, rej) =>
+ this.api 'posts/search' do
query: @query
- .then (posts) ~>
+ .then (posts) =>
res posts
- @trigger \loaded
+ this.trigger('loaded');
- @more = ~>
+ more() {
@offset += @max
- @api \posts/search do
+ this.api 'posts/search' do
query: @query
max: @max
offset: @offset
diff --git a/src/web/app/mobile/tags/search.tag b/src/web/app/mobile/tags/search.tag
index 3cca973a26..ab7ba4fd26 100644
--- a/src/web/app/mobile/tags/search.tag
+++ b/src/web/app/mobile/tags/search.tag
@@ -6,10 +6,10 @@
</style>
<script>
- @query = @opts.query
+ this.query = this.opts.query
- @on \mount ~>
- @refs.posts.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.posts.on('loaded', () => {
+ this.trigger('loaded');
</script>
</mk-search>
diff --git a/src/web/app/mobile/tags/stream-indicator.tag b/src/web/app/mobile/tags/stream-indicator.tag
index d2ab34574d..caa727dd8c 100644
--- a/src/web/app/mobile/tags/stream-indicator.tag
+++ b/src/web/app/mobile/tags/stream-indicator.tag
@@ -27,27 +27,27 @@
</style>
<script>
- @mixin \stream
+ this.mixin('stream');
- @on \before-mount ~>
- @state = @get-stream-state!
+ this.on('before-mount', () => {
+ this.state = @get-stream-state!
- if @state == \connected
- @root.style.opacity = 0
+ if @state == 'connected'
+ this.root.style.opacity = 0
- @stream-state-ev.on \connected ~>
- @state = @get-stream-state!
- @update!
- set-timeout ~>
- Velocity @root, {
+ @stream-state-ev.on('connected', () => {
+ this.state = @get-stream-state!
+ this.update();
+ setTimeout =>
+ Velocity this.root, {
opacity: 0
- } 200ms \linear
+ } 200ms 'linear'
, 1000ms
- @stream-state-ev.on \closed ~>
- @state = @get-stream-state!
- @update!
- Velocity @root, {
+ @stream-state-ev.on('closed', () => {
+ this.state = @get-stream-state!
+ this.update();
+ Velocity this.root, {
opacity: 1
} 0ms
</script>
diff --git a/src/web/app/mobile/tags/sub-post-content.tag b/src/web/app/mobile/tags/sub-post-content.tag
index 2256bb3486..91bd5ac1d3 100644
--- a/src/web/app/mobile/tags/sub-post-content.tag
+++ b/src/web/app/mobile/tags/sub-post-content.tag
@@ -28,17 +28,17 @@
</style>
<script>
- @mixin \text
+ this.mixin('text');
- @post = @opts.post
+ this.post = this.opts.post
- @on \mount ~>
+ this.on('mount', () => {
if @post.text?
tokens = @analyze @post.text
- @refs.text.innerHTML = @compile tokens, false
+ this.refs.text.innerHTML = @compile tokens, false
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
</script>
</mk-sub-post-content>
diff --git a/src/web/app/mobile/tags/timeline-post-sub.tag b/src/web/app/mobile/tags/timeline-post-sub.tag
index 8ffe84bbc9..5a944db733 100644
--- a/src/web/app/mobile/tags/timeline-post-sub.tag
+++ b/src/web/app/mobile/tags/timeline-post-sub.tag
@@ -97,5 +97,5 @@
font-size 80%
</style>
- <script>@post = @opts.post</script>
+ <script>this.post = this.opts.post</script>
</mk-timeline-post-sub>
diff --git a/src/web/app/mobile/tags/timeline-post.tag b/src/web/app/mobile/tags/timeline-post.tag
index 9ffa2c918c..faa05ec7a9 100644
--- a/src/web/app/mobile/tags/timeline-post.tag
+++ b/src/web/app/mobile/tags/timeline-post.tag
@@ -286,62 +286,62 @@
</style>
<script>
- @mixin \api
- @mixin \text
- @mixin \get-post-summary
- @mixin \open-post-form
+ this.mixin('api');
+ this.mixin('text');
+ this.mixin('get-post-summary');
+ this.mixin('open-post-form');
- @post = @opts.post
- @is-repost = @post.repost? and !@post.text?
- @p = if @is-repost then @post.repost else @post
- @summary = @get-post-summary @p
- @url = CONFIG.url + '/' + @p.user.username + '/' + @p.id
+ this.post = this.opts.post
+ this.is-repost = @post.repost? and !@post.text?
+ this.p = if @is-repost then @post.repost else @post
+ this.summary = @get-post-summary @p
+ this.url = CONFIG.url + '/' + @p.user.username + '/' + @p.id
- @on \mount ~>
+ this.on('mount', () => {
if @p.text?
tokens = if @p._highlight?
then @analyze @p._highlight
else @analyze @p.text
- @refs.text.innerHTML = @refs.text.innerHTML.replace '<p class="dummy"></p>' if @p._highlight?
+ this.refs.text.innerHTML = this.refs.text.innerHTML.replace '<p class="dummy"></p>' if @p._highlight?
then @compile tokens, true, false
else @compile tokens
- @refs.text.children.for-each (e) ~>
- if e.tag-name == \MK-URL
+ this.refs.text.children.for-each (e) =>
+ if e.tag-name == 'MK-URL'
riot.mount e
- # URLをプレビュー
+ // URLをプレビュー
tokens
- .filter (t) -> t.type == \link
- .map (t) ~>
- @preview = @refs.text.append-child document.create-element \mk-url-preview
+ .filter (t) -> t.type == 'link'
+ .map (t) =>
+ this.preview = this.refs.text.appendChild document.createElement 'mk-url-preview'
riot.mount @preview, do
url: t.content
- @reply = ~>
+ reply() {
@open-post-form do
reply: @p
- @repost = ~>
+ repost() {
text = window.prompt '「' + @summary + '」をRepost'
if text?
- @api \posts/create do
+ this.api 'posts/create' do
repost_id: @p.id
text: if text == '' then undefined else text
- @like = ~>
+ like() {
if @p.is_liked
- @api \posts/likes/delete do
+ this.api 'posts/likes/delete' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = false
- @update!
+ this.update();
else
- @api \posts/likes/create do
+ this.api 'posts/likes/create' do
post_id: @p.id
- .then ~>
+ .then =>
@p.is_liked = true
- @update!
+ this.update();
</script>
</mk-timeline-post>
diff --git a/src/web/app/mobile/tags/timeline.tag b/src/web/app/mobile/tags/timeline.tag
index c41016076e..156c4e4294 100644
--- a/src/web/app/mobile/tags/timeline.tag
+++ b/src/web/app/mobile/tags/timeline.tag
@@ -74,45 +74,45 @@
</style>
<script>
- @posts = []
- @init = true
- @fetching = false
- @can-fetch-more = true
+ this.posts = []
+ this.init = true
+ this.fetching = false
+ this.can-fetch-more = true
- @on \mount ~>
- @opts.init.then (posts) ~>
- @init = false
+ this.on('mount', () => {
+ this.opts.init.then (posts) =>
+ this.init = false
@set-posts posts
- @on \update ~>
- @posts.for-each (post) ~>
+ this.on('update', () => {
+ @posts.for-each (post) =>
date = (new Date post.created_at).get-date!
month = (new Date post.created_at).get-month! + 1
post._date = date
post._datetext = month + '月 ' + date + '日'
- @more = ~>
+ more() {
if @init or @fetching or @posts.length == 0 then return
- @fetching = true
- @update!
- @opts.more!.then (posts) ~>
- @fetching = false
+ this.fetching = true
+ this.update();
+ this.opts.more!.then (posts) =>
+ this.fetching = false
@prepend-posts posts
- @set-posts = (posts) ~>
- @posts = posts
- @update!
+ set-posts(posts) {
+ this.posts = posts
+ this.update();
- @prepend-posts = (posts) ~>
- posts.for-each (post) ~>
+ prepend-posts(posts) {
+ posts.for-each (post) =>
@posts.push post
- @update!
+ this.update();
- @add-post = (post) ~>
+ add-post(post) {
@posts.unshift post
- @update!
+ this.update();
- @tail = ~>
+ tail() {
@posts[@posts.length - 1]
</script>
</mk-timeline>
diff --git a/src/web/app/mobile/tags/ui-header.tag b/src/web/app/mobile/tags/ui-header.tag
index d47c3610f9..f4f44e972a 100644
--- a/src/web/app/mobile/tags/ui-header.tag
+++ b/src/web/app/mobile/tags/ui-header.tag
@@ -88,17 +88,17 @@
</style>
<script>
- @mixin \ui
- @mixin \open-post-form
+ this.mixin('ui');
+ this.mixin('open-post-form');
- @on \mount ~>
- @opts.ready!
+ this.on('mount', () => {
+ this.opts.ready!
- @ui.on \title (title) ~>
- if @refs.title?
- @refs.title.innerHTML = title
+ this.ui.on('title', (title) => {
+ if this.refs.title?
+ this.refs.title.innerHTML = title
- @post = ~>
+ post() {
@open-post-form!
</script>
</mk-ui-header>
diff --git a/src/web/app/mobile/tags/ui-nav.tag b/src/web/app/mobile/tags/ui-nav.tag
index a5dbd4cbaf..efdec8e14d 100644
--- a/src/web/app/mobile/tags/ui-nav.tag
+++ b/src/web/app/mobile/tags/ui-nav.tag
@@ -117,14 +117,14 @@
</style>
<script>
- @mixin \i
- @mixin \page
+ this.mixin('i');
+ this.mixin('page');
- @on \mount ~>
- @opts.ready!
+ this.on('mount', () => {
+ this.opts.ready!
- @search = ~>
- query = window.prompt \検索
+ search() {
+ query = window.prompt '検索'
if query? and query != ''
@page '/search:' + query
</script>
diff --git a/src/web/app/mobile/tags/ui.tag b/src/web/app/mobile/tags/ui.tag
index c3ffe90978..cb87469c01 100644
--- a/src/web/app/mobile/tags/ui.tag
+++ b/src/web/app/mobile/tags/ui.tag
@@ -14,37 +14,37 @@
background #fff
</style>
<script>
- @mixin \stream
+ this.mixin('stream');
- @ready-count = 0
- @is-drawer-opening = false
+ this.ready-count = 0
+ this.is-drawer-opening = false
- #@ui.on \notification (text) ~>
- # alert text
+ #this.ui.on('notification', (text) => {
+ // alert text
- @on \mount ~>
- @stream.on \notification @on-stream-notification
+ this.on('mount', () => {
+ @stream.on 'notification' this.on-stream-notification
@ready!
- @on \unmount ~>
- @stream.off \notification @on-stream-notification
+ this.on('unmount', () => {
+ @stream.off 'notification' this.on-stream-notification
- @ready = ~>
+ ready() {
@ready-count++
if @ready-count == 2
@init-view-position!
- @init-view-position = ~>
- top = @refs.header.root.offset-height
- @refs.main.style.padding-top = top + \px
+ init-view-position() {
+ top = this.refs.header.root.offset-height
+ this.refs.main.style.padding-top = top + 'px'
- @toggle-drawer = ~>
- @is-drawer-opening = !@is-drawer-opening
- @refs.nav.root.style.display = if @is-drawer-opening then \block else \none
+ toggle-drawer() {
+ this.is-drawer-opening = !@is-drawer-opening
+ this.refs.nav.root.style.display = if @is-drawer-opening then 'block' else 'none'
- @on-stream-notification = (notification) ~>
- el = document.body.append-child document.create-element \mk-notify
+ on-stream-notification(notification) {
+ el = document.body.appendChild document.createElement 'mk-notify'
riot.mount el, do
notification: notification
</script>
diff --git a/src/web/app/mobile/tags/user-followers.tag b/src/web/app/mobile/tags/user-followers.tag
index f328ab61de..49091421eb 100644
--- a/src/web/app/mobile/tags/user-followers.tag
+++ b/src/web/app/mobile/tags/user-followers.tag
@@ -6,20 +6,20 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @user = @opts.user
+ this.user = this.opts.user
- @fetch = (iknow, limit, cursor, cb) ~>
- @api \users/followers do
+ fetch(iknow, limit, cursor, cb) {
+ this.api 'users/followers' do
user_id: @user.id
iknow: iknow
limit: limit
cursor: if cursor? then cursor else undefined
.then cb
- @on \mount ~>
- @refs.list.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.list.on('loaded', () => {
+ this.trigger('loaded');
</script>
</mk-user-followers>
diff --git a/src/web/app/mobile/tags/user-following.tag b/src/web/app/mobile/tags/user-following.tag
index 29f3680b65..c00894a4c0 100644
--- a/src/web/app/mobile/tags/user-following.tag
+++ b/src/web/app/mobile/tags/user-following.tag
@@ -6,20 +6,20 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @user = @opts.user
+ this.user = this.opts.user
- @fetch = (iknow, limit, cursor, cb) ~>
- @api \users/following do
+ fetch(iknow, limit, cursor, cb) {
+ this.api 'users/following' do
user_id: @user.id
iknow: iknow
limit: limit
cursor: if cursor? then cursor else undefined
.then cb
- @on \mount ~>
- @refs.list.on \loaded ~>
- @trigger \loaded
+ this.on('mount', () => {
+ this.refs.list.on('loaded', () => {
+ this.trigger('loaded');
</script>
</mk-user-following>
diff --git a/src/web/app/mobile/tags/user-preview.tag b/src/web/app/mobile/tags/user-preview.tag
index 2e600a8171..09cfeb49e7 100644
--- a/src/web/app/mobile/tags/user-preview.tag
+++ b/src/web/app/mobile/tags/user-preview.tag
@@ -85,5 +85,5 @@
color #717171
</style>
- <script>@user = @opts.user</script>
+ <script>this.user = this.opts.user</script>
</mk-user-preview>
diff --git a/src/web/app/mobile/tags/user-timeline.tag b/src/web/app/mobile/tags/user-timeline.tag
index 9646dda9e7..a05fd84228 100644
--- a/src/web/app/mobile/tags/user-timeline.tag
+++ b/src/web/app/mobile/tags/user-timeline.tag
@@ -9,23 +9,23 @@
</style>
<script>
- @mixin \api
+ this.mixin('api');
- @user = @opts.user
- @with-media = @opts.with-media
+ this.user = this.opts.user
+ this.with-media = this.opts.with-media
- @init = new Promise (res, rej) ~>
- @api \users/posts do
+ this.init = new Promise (res, rej) =>
+ this.api 'users/posts' do
user_id: @user.id
with_media: @with-media
- .then (posts) ~>
+ .then (posts) =>
res posts
- @trigger \loaded
+ this.trigger('loaded');
- @more = ~>
- @api \users/posts do
+ more() {
+ this.api 'users/posts' do
user_id: @user.id
with_media: @with-media
- max_id: @refs.timeline.tail!.id
+ max_id: this.refs.timeline.tail!.id
</script>
</mk-user-timeline>
diff --git a/src/web/app/mobile/tags/user.tag b/src/web/app/mobile/tags/user.tag
index 37900bb617..6cd815a37f 100644
--- a/src/web/app/mobile/tags/user.tag
+++ b/src/web/app/mobile/tags/user.tag
@@ -154,38 +154,38 @@
</style>
<script>
- @age = require \s-age
+ this.age = require 's-age'
- @mixin \i
- @mixin \api
+ this.mixin('i');
+ this.mixin('api');
- @username = @opts.user
- @page = if @opts.page? then @opts.page else \posts
- @fetching = true
+ this.username = this.opts.user
+ this.page = if this.opts.page? then this.opts.page else 'posts'
+ this.fetching = true
- @on \mount ~>
- @api \users/show do
+ this.on('mount', () => {
+ this.api 'users/show' do
username: @username
- .then (user) ~>
- @fetching = false
- @user = user
- @trigger \loaded user
- @update!
+ .then (user) =>
+ this.fetching = false
+ this.user = user
+ this.trigger 'loaded' user
+ this.update();
- @go-posts = ~>
- @page = \posts
- @update!
+ go-posts() {
+ this.page = 'posts'
+ this.update();
- @go-media = ~>
- @page = \media
- @update!
+ go-media() {
+ this.page = 'media'
+ this.update();
- @go-graphs = ~>
- @page = \graphs
- @update!
+ go-graphs() {
+ this.page = 'graphs'
+ this.update();
- @go-likes = ~>
- @page = \likes
- @update!
+ go-likes() {
+ this.page = 'likes'
+ this.update();
</script>
</mk-user>
diff --git a/src/web/app/mobile/tags/users-list.tag b/src/web/app/mobile/tags/users-list.tag
index a45d2a9e07..6d45c32c31 100644
--- a/src/web/app/mobile/tags/users-list.tag
+++ b/src/web/app/mobile/tags/users-list.tag
@@ -70,44 +70,44 @@
</style>
<script>
- @mixin \i
+ this.mixin('i');
- @limit = 30users
- @mode = \all
+ this.limit = 30users
+ this.mode = 'all'
- @fetching = true
- @more-fetching = false
+ this.fetching = true
+ this.more-fetching = false
- @on \mount ~>
- @fetch ~>
- @trigger \loaded
+ this.on('mount', () => {
+ @fetch =>
+ this.trigger('loaded');
- @fetch = (cb) ~>
- @fetching = true
- @update!
- obj <~ @opts.fetch do
- @mode == \iknow
+ fetch(cb) {
+ this.fetching = true
+ this.update();
+ obj <~ this.opts.fetch do
+ @mode == 'iknow'
@limit
null
- @users = obj.users
- @next = obj.next
- @fetching = false
- @update!
+ this.users = obj.users
+ this.next = obj.next
+ this.fetching = false
+ this.update();
if cb? then cb!
- @more = ~>
- @more-fetching = true
- @update!
- obj <~ @opts.fetch do
- @mode == \iknow
+ more() {
+ this.more-fetching = true
+ this.update();
+ obj <~ this.opts.fetch do
+ @mode == 'iknow'
@limit
@cursor
- @users = @users.concat obj.users
- @next = obj.next
- @more-fetching = false
- @update!
+ this.users = @users.concat obj.users
+ this.next = obj.next
+ this.more-fetching = false
+ this.update();
- @set-mode = (mode) ~>
+ set-mode(mode) {
@update do
mode: mode