From 07efc8e1504450b4eb6bc29f43986a9d538d0680 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E3=81=93=E3=81=B4=E3=81=AA=E3=81=9F=E3=81=BF=E3=81=BD?= Date: Wed, 7 Feb 2018 18:17:59 +0900 Subject: [PATCH] wip --- src/web/app/auth/tags/index.tag | 4 +- src/web/app/ch/tags/channel.tag | 12 +-- src/web/app/common/tags/messaging/form.tag | 6 +- src/web/app/common/tags/messaging/index.tag | 10 +-- src/web/app/common/tags/messaging/message.tag | 6 +- src/web/app/common/tags/messaging/room.tag | 2 +- src/web/app/common/tags/poll-editor.tag | 2 +- src/web/app/common/tags/post-menu.tag | 26 +++--- src/web/app/common/tags/reaction-picker.vue | 68 +++++++------- src/web/app/common/tags/signin-history.tag | 2 +- src/web/app/common/tags/signin.tag | 20 ++--- src/web/app/common/tags/signup.tag | 14 +-- src/web/app/desktop/tags/analog-clock.tag | 6 +- .../desktop/tags/autocomplete-suggestion.tag | 6 +- src/web/app/desktop/tags/crop-window.tag | 8 +- .../app/desktop/tags/detailed-post-window.tag | 4 +- src/web/app/desktop/tags/dialog.tag | 18 ++-- .../desktop/tags/drive/base-contextmenu.tag | 10 +-- .../app/desktop/tags/drive/browser-window.tag | 6 +- src/web/app/desktop/tags/drive/browser.tag | 42 ++++----- .../desktop/tags/drive/file-contextmenu.tag | 14 +-- src/web/app/desktop/tags/drive/file.tag | 2 +- .../desktop/tags/drive/folder-contextmenu.tag | 12 +-- .../desktop/tags/home-widgets/access-log.tag | 2 +- .../desktop/tags/home-widgets/activity.tag | 4 +- .../app/desktop/tags/home-widgets/channel.tag | 8 +- .../desktop/tags/home-widgets/mentions.tag | 10 +-- .../desktop/tags/home-widgets/messaging.tag | 2 +- .../desktop/tags/home-widgets/post-form.tag | 4 +- .../app/desktop/tags/home-widgets/server.tag | 6 +- .../desktop/tags/home-widgets/slideshow.tag | 12 +-- .../desktop/tags/home-widgets/timeline.tag | 12 +-- .../app/desktop/tags/home-widgets/tips.tag | 6 +- src/web/app/desktop/tags/home.tag | 44 +++++----- src/web/app/desktop/tags/images.tag | 12 +-- src/web/app/desktop/tags/input-dialog.tag | 10 +-- .../desktop/tags/messaging/room-window.tag | 2 +- src/web/app/desktop/tags/messaging/window.tag | 4 +- src/web/app/desktop/tags/pages/drive.tag | 4 +- src/web/app/desktop/tags/pages/entrance.tag | 2 +- src/web/app/desktop/tags/pages/home.tag | 2 +- src/web/app/desktop/tags/pages/search.tag | 2 +- .../app/desktop/tags/pages/selectdrive.tag | 6 +- src/web/app/desktop/tags/pages/user.tag | 4 +- src/web/app/desktop/tags/post-detail-sub.tag | 4 +- src/web/app/desktop/tags/post-detail.tag | 10 +-- src/web/app/desktop/tags/post-form-window.tag | 12 +-- src/web/app/desktop/tags/post-form.tag | 34 +++---- src/web/app/desktop/tags/progress-dialog.tag | 4 +- .../app/desktop/tags/repost-form-window.tag | 12 +-- src/web/app/desktop/tags/repost-form.tag | 4 +- src/web/app/desktop/tags/search-posts.tag | 6 +- src/web/app/desktop/tags/search.tag | 2 +- .../tags/select-file-from-drive-window.tag | 12 +-- .../tags/select-folder-from-drive-window.tag | 8 +- src/web/app/desktop/tags/settings-window.tag | 4 +- src/web/app/desktop/tags/settings.tag | 10 +-- src/web/app/desktop/tags/sub-post-content.tag | 4 +- src/web/app/desktop/tags/timeline.tag | 14 +-- src/web/app/desktop/tags/ui.tag | 2 +- src/web/app/desktop/tags/user-timeline.tag | 10 +-- src/web/app/desktop/tags/user.tag | 12 +-- src/web/app/desktop/tags/window.tag | 88 +++++++++---------- src/web/app/dev/tags/new-app-form.tag | 12 +-- .../app/mobile/tags/drive-folder-selector.tag | 2 +- src/web/app/mobile/tags/drive-selector.tag | 4 +- src/web/app/mobile/tags/drive.tag | 6 +- src/web/app/mobile/tags/drive/file-viewer.tag | 2 +- src/web/app/mobile/tags/home-timeline.tag | 6 +- src/web/app/mobile/tags/home.tag | 2 +- src/web/app/mobile/tags/page/drive.tag | 14 +-- src/web/app/mobile/tags/page/home.tag | 2 +- src/web/app/mobile/tags/page/messaging.tag | 2 +- .../app/mobile/tags/page/notifications.tag | 2 +- src/web/app/mobile/tags/page/search.tag | 2 +- src/web/app/mobile/tags/page/selectdrive.tag | 6 +- .../app/mobile/tags/page/settings/profile.tag | 8 +- .../app/mobile/tags/page/user-followers.tag | 2 +- .../app/mobile/tags/page/user-following.tag | 2 +- src/web/app/mobile/tags/page/user.tag | 2 +- src/web/app/mobile/tags/post-detail.tag | 10 +-- src/web/app/mobile/tags/post-form.tag | 22 ++--- src/web/app/mobile/tags/search.tag | 2 +- src/web/app/mobile/tags/sub-post-content.tag | 4 +- src/web/app/mobile/tags/timeline.tag | 14 +-- src/web/app/mobile/tags/ui.tag | 4 +- src/web/app/mobile/tags/user-followers.tag | 2 +- src/web/app/mobile/tags/user-following.tag | 2 +- src/web/app/mobile/tags/user-timeline.tag | 2 +- src/web/app/status/tags/index.tag | 4 +- 90 files changed, 427 insertions(+), 425 deletions(-) diff --git a/src/web/app/auth/tags/index.tag b/src/web/app/auth/tags/index.tag index e71214f4a3..8d70a4162b 100644 --- a/src/web/app/auth/tags/index.tag +++ b/src/web/app/auth/tags/index.tag @@ -114,13 +114,13 @@ state: 'waiting' }); - this.refs.form.on('denied', () => { + this.$refs.form.on('denied', () => { this.update({ state: 'denied' }); }); - this.refs.form.on('accepted', this.accepted); + this.$refs.form.on('accepted', this.accepted); } }).catch(error => { this.update({ diff --git a/src/web/app/ch/tags/channel.tag b/src/web/app/ch/tags/channel.tag index 7e76778f9a..fec542500d 100644 --- a/src/web/app/ch/tags/channel.tag +++ b/src/web/app/ch/tags/channel.tag @@ -289,7 +289,7 @@ this.files = null; this.on('mount', () => { - this.refs.uploader.on('uploaded', file => { + this.$refs.uploader.on('uploaded', file => { this.update({ files: [file] }); @@ -297,7 +297,7 @@ }); this.upload = file => { - this.refs.uploader.upload(file); + this.$refs.uploader.upload(file); }; this.clearReply = () => { @@ -311,7 +311,7 @@ this.update({ files: null }); - this.refs.text.value = ''; + this.$refs.text.value = ''; }; this.post = () => { @@ -324,7 +324,7 @@ : undefined; this.api('posts/create', { - text: this.refs.text.value == '' ? undefined : this.refs.text.value, + text: this.$refs.text.value == '' ? undefined : this.$refs.text.value, media_ids: files, reply_id: this.reply ? this.reply.id : undefined, channel_id: this.channel.id @@ -340,11 +340,11 @@ }; this.changeFile = () => { - Array.from(this.refs.file.files).forEach(this.upload); + Array.from(this.$refs.file.files).forEach(this.upload); }; this.selectFile = () => { - this.refs.file.click(); + this.$refs.file.click(); }; this.drive = () => { diff --git a/src/web/app/common/tags/messaging/form.tag b/src/web/app/common/tags/messaging/form.tag index a5de32e3fd..93733e8d7a 100644 --- a/src/web/app/common/tags/messaging/form.tag +++ b/src/web/app/common/tags/messaging/form.tag @@ -136,7 +136,7 @@ }; this.selectFile = () => { - this.refs.file.click(); + this.$refs.file.click(); }; this.selectFileFromDrive = () => { @@ -155,7 +155,7 @@ this.sending = true; this.api('messaging/messages/create', { user_id: this.opts.user.id, - text: this.refs.text.value + text: this.$refs.text.value }).then(message => { this.clear(); }).catch(err => { @@ -167,7 +167,7 @@ }; this.clear = () => { - this.refs.text.value = ''; + this.$refs.text.value = ''; this.files = []; this.update(); }; diff --git a/src/web/app/common/tags/messaging/index.tag b/src/web/app/common/tags/messaging/index.tag index 547727da27..d38569999d 100644 --- a/src/web/app/common/tags/messaging/index.tag +++ b/src/web/app/common/tags/messaging/index.tag @@ -389,7 +389,7 @@ }; this.search = () => { - const q = this.refs.search.value; + const q = this.$refs.search.value; if (q == '') { this.searchResult = []; return; @@ -416,7 +416,7 @@ case 40: // [↓] e.preventDefault(); e.stopPropagation(); - this.refs.searchResult.childNodes[0].focus(); + this.$refs.searchResult.childNodes[0].focus(); break; } }; @@ -435,19 +435,19 @@ case e.which == 27: // [ESC] cancel(); - this.refs.search.focus(); + this.$refs.search.focus(); break; case e.which == 9 && e.shiftKey: // [TAB] + [Shift] case e.which == 38: // [↑] cancel(); - (this.refs.searchResult.childNodes[i].previousElementSibling || this.refs.searchResult.childNodes[this.searchResult.length - 1]).focus(); + (this.$refs.searchResult.childNodes[i].previousElementSibling || this.$refs.searchResult.childNodes[this.searchResult.length - 1]).focus(); break; case e.which == 9: // [TAB] case e.which == 40: // [↓] cancel(); - (this.refs.searchResult.childNodes[i].nextElementSibling || this.refs.searchResult.childNodes[0]).focus(); + (this.$refs.searchResult.childNodes[i].nextElementSibling || this.$refs.searchResult.childNodes[0]).focus(); break; } }; diff --git a/src/web/app/common/tags/messaging/message.tag b/src/web/app/common/tags/messaging/message.tag index 354022d7df..f211b10b55 100644 --- a/src/web/app/common/tags/messaging/message.tag +++ b/src/web/app/common/tags/messaging/message.tag @@ -217,9 +217,9 @@ if (this.message.text) { const tokens = this.message.ast; - this.refs.text.innerHTML = compile(tokens); + this.$refs.text.innerHTML = compile(tokens); - Array.from(this.refs.text.children).forEach(e => { + Array.from(this.$refs.text.children).forEach(e => { if (e.tagName == 'MK-URL') riot.mount(e); }); @@ -227,7 +227,7 @@ tokens .filter(t => t.type == 'link') .map(t => { - const el = this.refs.text.appendChild(document.createElement('mk-url-preview')); + const el = this.$refs.text.appendChild(document.createElement('mk-url-preview')); riot.mount(el, { url: t.content }); diff --git a/src/web/app/common/tags/messaging/room.tag b/src/web/app/common/tags/messaging/room.tag index a42e0ea949..2fdf50457b 100644 --- a/src/web/app/common/tags/messaging/room.tag +++ b/src/web/app/common/tags/messaging/room.tag @@ -296,7 +296,7 @@ this.scrollToBottom(); n.parentNode.removeChild(n); }; - this.refs.notifications.appendChild(n); + this.$refs.notifications.appendChild(n); setTimeout(() => { n.style.opacity = 0; diff --git a/src/web/app/common/tags/poll-editor.tag b/src/web/app/common/tags/poll-editor.tag index 73e783ddbd..f660032c92 100644 --- a/src/web/app/common/tags/poll-editor.tag +++ b/src/web/app/common/tags/poll-editor.tag @@ -95,7 +95,7 @@ this.add = () => { this.choices.push(''); this.update(); - this.refs.choices.childNodes[this.choices.length - 1].childNodes[0].focus(); + this.$refs.choices.childNodes[this.choices.length - 1].childNodes[0].focus(); }; this.remove = (i) => { diff --git a/src/web/app/common/tags/post-menu.tag b/src/web/app/common/tags/post-menu.tag index dd2a273d4e..92b2801f59 100644 --- a/src/web/app/common/tags/post-menu.tag +++ b/src/web/app/common/tags/post-menu.tag @@ -85,29 +85,29 @@ this.on('mount', () => { const rect = this.source.getBoundingClientRect(); - const width = this.refs.popover.offsetWidth; - const height = this.refs.popover.offsetHeight; + const width = this.$refs.popover.offsetWidth; + const height = this.$refs.popover.offsetHeight; if (this.opts.compact) { const x = rect.left + window.pageXOffset + (this.source.offsetWidth / 2); const y = rect.top + window.pageYOffset + (this.source.offsetHeight / 2); - this.refs.popover.style.left = (x - (width / 2)) + 'px'; - this.refs.popover.style.top = (y - (height / 2)) + 'px'; + this.$refs.popover.style.left = (x - (width / 2)) + 'px'; + this.$refs.popover.style.top = (y - (height / 2)) + 'px'; } else { const x = rect.left + window.pageXOffset + (this.source.offsetWidth / 2); const y = rect.top + window.pageYOffset + this.source.offsetHeight; - this.refs.popover.style.left = (x - (width / 2)) + 'px'; - this.refs.popover.style.top = y + 'px'; + this.$refs.popover.style.left = (x - (width / 2)) + 'px'; + this.$refs.popover.style.top = y + 'px'; } anime({ - targets: this.refs.backdrop, + targets: this.$refs.backdrop, opacity: 1, duration: 100, easing: 'linear' }); anime({ - targets: this.refs.popover, + targets: this.$refs.popover, opacity: 1, scale: [0.5, 1], duration: 500 @@ -124,7 +124,7 @@ }; this.categorize = () => { - const category = this.refs.categorySelect.options[this.refs.categorySelect.selectedIndex].value; + const category = this.$refs.categorySelect.options[this.$refs.categorySelect.selectedIndex].value; this.api('posts/categorize', { post_id: this.post.id, category: category @@ -135,17 +135,17 @@ }; this.close = () => { - this.refs.backdrop.style.pointerEvents = 'none'; + this.$refs.backdrop.style.pointerEvents = 'none'; anime({ - targets: this.refs.backdrop, + targets: this.$refs.backdrop, opacity: 0, duration: 200, easing: 'linear' }); - this.refs.popover.style.pointerEvents = 'none'; + this.$refs.popover.style.pointerEvents = 'none'; anime({ - targets: this.refs.popover, + targets: this.$refs.popover, opacity: 0, scale: 0.5, duration: 200, diff --git a/src/web/app/common/tags/reaction-picker.vue b/src/web/app/common/tags/reaction-picker.vue index 970b7036de..4157372088 100644 --- a/src/web/app/common/tags/reaction-picker.vue +++ b/src/web/app/common/tags/reaction-picker.vue @@ -25,10 +25,40 @@ const placeholder = '%i18n:common.tags.mk-reaction-picker.choose-reaction%'; export default { - props: ['post', 'cb'], + props: ['post', 'source', 'compact', 'cb'], data: { title: placeholder }, + created: function() { + const rect = this.source.getBoundingClientRect(); + const width = this.$refs.popover.offsetWidth; + const height = this.$refs.popover.offsetHeight; + if (this.compact) { + const x = rect.left + window.pageXOffset + (this.source.offsetWidth / 2); + const y = rect.top + window.pageYOffset + (this.source.offsetHeight / 2); + this.$refs.popover.style.left = (x - (width / 2)) + 'px'; + this.$refs.popover.style.top = (y - (height / 2)) + 'px'; + } else { + const x = rect.left + window.pageXOffset + (this.source.offsetWidth / 2); + const y = rect.top + window.pageYOffset + this.source.offsetHeight; + this.$refs.popover.style.left = (x - (width / 2)) + 'px'; + this.$refs.popover.style.top = y + 'px'; + } + + anime({ + targets: this.$refs.backdrop, + opacity: 1, + duration: 100, + easing: 'linear' + }); + + anime({ + targets: this.$refs.popover, + opacity: 1, + scale: [0.5, 1], + duration: 500 + }); + }, methods: { react: function(reaction) { api('posts/reactions/create', { @@ -54,34 +84,6 @@ this.source = this.opts.source; this.on('mount', () => { - const rect = this.source.getBoundingClientRect(); - const width = this.refs.popover.offsetWidth; - const height = this.refs.popover.offsetHeight; - if (this.opts.compact) { - const x = rect.left + window.pageXOffset + (this.source.offsetWidth / 2); - const y = rect.top + window.pageYOffset + (this.source.offsetHeight / 2); - this.refs.popover.style.left = (x - (width / 2)) + 'px'; - this.refs.popover.style.top = (y - (height / 2)) + 'px'; - } else { - const x = rect.left + window.pageXOffset + (this.source.offsetWidth / 2); - const y = rect.top + window.pageYOffset + this.source.offsetHeight; - this.refs.popover.style.left = (x - (width / 2)) + 'px'; - this.refs.popover.style.top = y + 'px'; - } - - anime({ - targets: this.refs.backdrop, - opacity: 1, - duration: 100, - easing: 'linear' - }); - - anime({ - targets: this.refs.popover, - opacity: 1, - scale: [0.5, 1], - duration: 500 - }); }); this.react = reaction => { @@ -89,17 +91,17 @@ }; this.close = () => { - this.refs.backdrop.style.pointerEvents = 'none'; + this.$refs.backdrop.style.pointerEvents = 'none'; anime({ - targets: this.refs.backdrop, + targets: this.$refs.backdrop, opacity: 0, duration: 200, easing: 'linear' }); - this.refs.popover.style.pointerEvents = 'none'; + this.$refs.popover.style.pointerEvents = 'none'; anime({ - targets: this.refs.popover, + targets: this.$refs.popover, opacity: 0, scale: 0.5, duration: 200, diff --git a/src/web/app/common/tags/signin-history.tag b/src/web/app/common/tags/signin-history.tag index 10729789c6..9f02fc687d 100644 --- a/src/web/app/common/tags/signin-history.tag +++ b/src/web/app/common/tags/signin-history.tag @@ -104,7 +104,7 @@ this.show = false; this.on('mount', () => { - hljs.highlightBlock(this.refs.headers); + hljs.highlightBlock(this.$refs.headers); }); this.toggle = () => { diff --git a/src/web/app/common/tags/signin.tag b/src/web/app/common/tags/signin.tag index f5a2be94ed..2ee188bbcb 100644 --- a/src/web/app/common/tags/signin.tag +++ b/src/web/app/common/tags/signin.tag @@ -108,7 +108,7 @@ this.oninput = () => { this.api('users/show', { - username: this.refs.username.value + username: this.$refs.username.value }).then(user => { this.user = user; this.trigger('user', user); @@ -119,16 +119,16 @@ this.onsubmit = e => { e.preventDefault(); - if (this.refs.username.value == '') { - this.refs.username.focus(); + if (this.$refs.username.value == '') { + this.$refs.username.focus(); return false; } - if (this.refs.password.value == '') { - this.refs.password.focus(); + if (this.$refs.password.value == '') { + this.$refs.password.focus(); return false; } - if (this.user && this.user.two_factor_enabled && this.refs.token.value == '') { - this.refs.token.focus(); + if (this.user && this.user.two_factor_enabled && this.$refs.token.value == '') { + this.$refs.token.focus(); return false; } @@ -137,9 +137,9 @@ }); this.api('signin', { - username: this.refs.username.value, - password: this.refs.password.value, - token: this.user && this.user.two_factor_enabled ? this.refs.token.value : undefined + username: this.$refs.username.value, + password: this.$refs.password.value, + token: this.user && this.user.two_factor_enabled ? this.$refs.token.value : undefined }).then(() => { location.reload(); }).catch(() => { diff --git a/src/web/app/common/tags/signup.tag b/src/web/app/common/tags/signup.tag index d0bd769074..0b2ddf6d76 100644 --- a/src/web/app/common/tags/signup.tag +++ b/src/web/app/common/tags/signup.tag @@ -208,7 +208,7 @@ }); this.onChangeUsername = () => { - const username = this.refs.username.value; + const username = this.$refs.username.value; if (username == '') { this.update({ @@ -248,7 +248,7 @@ }; this.onChangePassword = () => { - const password = this.refs.password.value; + const password = this.$refs.password.value; if (password == '') { this.passwordStrength = ''; @@ -258,12 +258,12 @@ const strength = getPasswordStrength(password); this.passwordStrength = strength > 0.7 ? 'high' : strength > 0.3 ? 'medium' : 'low'; this.update(); - this.refs.passwordMetar.style.width = `${strength * 100}%`; + this.$refs.passwordMetar.style.width = `${strength * 100}%`; }; this.onChangePasswordRetype = () => { - const password = this.refs.password.value; - const retypedPassword = this.refs.passwordRetype.value; + const password = this.$refs.password.value; + const retypedPassword = this.$refs.passwordRetype.value; if (retypedPassword == '') { this.passwordRetypeState = null; @@ -276,8 +276,8 @@ this.onsubmit = e => { e.preventDefault(); - const username = this.refs.username.value; - const password = this.refs.password.value; + const username = this.$refs.username.value; + const password = this.$refs.password.value; const locker = document.body.appendChild(document.createElement('mk-locker')); diff --git a/src/web/app/desktop/tags/analog-clock.tag b/src/web/app/desktop/tags/analog-clock.tag index c0489d3feb..35661405db 100644 --- a/src/web/app/desktop/tags/analog-clock.tag +++ b/src/web/app/desktop/tags/analog-clock.tag @@ -28,9 +28,9 @@ const m = now.getMinutes(); const h = now.getHours(); - const ctx = this.refs.canvas.getContext('2d'); - const canvW = this.refs.canvas.width; - const canvH = this.refs.canvas.height; + const ctx = this.$refs.canvas.getContext('2d'); + const canvW = this.$refs.canvas.width; + const canvH = this.$refs.canvas.height; ctx.clearRect(0, 0, canvW, canvH); { // 背景 diff --git a/src/web/app/desktop/tags/autocomplete-suggestion.tag b/src/web/app/desktop/tags/autocomplete-suggestion.tag index 5304875c17..cf22f3a275 100644 --- a/src/web/app/desktop/tags/autocomplete-suggestion.tag +++ b/src/web/app/desktop/tags/autocomplete-suggestion.tag @@ -177,12 +177,12 @@ }; this.applySelect = () => { - Array.from(this.refs.users.children).forEach(el => { + Array.from(this.$refs.users.children).forEach(el => { el.removeAttribute('data-selected'); }); - this.refs.users.children[this.select].setAttribute('data-selected', 'true'); - this.refs.users.children[this.select].focus(); + this.$refs.users.children[this.select].setAttribute('data-selected', 'true'); + this.$refs.users.children[this.select].focus(); }; this.complete = user => { diff --git a/src/web/app/desktop/tags/crop-window.tag b/src/web/app/desktop/tags/crop-window.tag index b74b46b77e..80f3f4657a 100644 --- a/src/web/app/desktop/tags/crop-window.tag +++ b/src/web/app/desktop/tags/crop-window.tag @@ -168,7 +168,7 @@ this.cropper = null; this.on('mount', () => { - this.img = this.refs.window.refs.img; + this.img = this.$refs.window.refs.img; this.cropper = new Cropper(this.img, { aspectRatio: this.aspectRatio, highlight: false, @@ -179,18 +179,18 @@ this.ok = () => { this.cropper.getCroppedCanvas().toBlob(blob => { this.trigger('cropped', blob); - this.refs.window.close(); + this.$refs.window.close(); }); }; this.skip = () => { this.trigger('skipped'); - this.refs.window.close(); + this.$refs.window.close(); }; this.cancel = () => { this.trigger('canceled'); - this.refs.window.close(); + this.$refs.window.close(); }; diff --git a/src/web/app/desktop/tags/detailed-post-window.tag b/src/web/app/desktop/tags/detailed-post-window.tag index a0bcdc79ac..93df377c4f 100644 --- a/src/web/app/desktop/tags/detailed-post-window.tag +++ b/src/web/app/desktop/tags/detailed-post-window.tag @@ -62,8 +62,8 @@ }); this.close = () => { - this.refs.bg.style.pointerEvents = 'none'; - this.refs.main.style.pointerEvents = 'none'; + this.$refs.bg.style.pointerEvents = 'none'; + this.$refs.main.style.pointerEvents = 'none'; anime({ targets: this.root, opacity: 0, diff --git a/src/web/app/desktop/tags/dialog.tag b/src/web/app/desktop/tags/dialog.tag index f213211730..9299e97334 100644 --- a/src/web/app/desktop/tags/dialog.tag +++ b/src/web/app/desktop/tags/dialog.tag @@ -94,19 +94,19 @@ }); this.on('mount', () => { - this.refs.header.innerHTML = this.opts.title; - this.refs.body.innerHTML = this.opts.text; + this.$refs.header.innerHTML = this.opts.title; + this.$refs.body.innerHTML = this.opts.text; - this.refs.bg.style.pointerEvents = 'auto'; + this.$refs.bg.style.pointerEvents = 'auto'; anime({ - targets: this.refs.bg, + targets: this.$refs.bg, opacity: 1, duration: 100, easing: 'linear' }); anime({ - targets: this.refs.main, + targets: this.$refs.main, opacity: 1, scale: [1.2, 1], duration: 300, @@ -115,17 +115,17 @@ }); this.close = () => { - this.refs.bg.style.pointerEvents = 'none'; + this.$refs.bg.style.pointerEvents = 'none'; anime({ - targets: this.refs.bg, + targets: this.$refs.bg, opacity: 0, duration: 300, easing: 'linear' }); - this.refs.main.style.pointerEvents = 'none'; + this.$refs.main.style.pointerEvents = 'none'; anime({ - targets: this.refs.main, + targets: this.$refs.main, opacity: 0, scale: 0.8, duration: 300, diff --git a/src/web/app/desktop/tags/drive/base-contextmenu.tag b/src/web/app/desktop/tags/drive/base-contextmenu.tag index 2d7796c682..eb97ccccc1 100644 --- a/src/web/app/desktop/tags/drive/base-contextmenu.tag +++ b/src/web/app/desktop/tags/drive/base-contextmenu.tag @@ -16,29 +16,29 @@ this.browser = this.opts.browser; this.on('mount', () => { - this.refs.ctx.on('closed', () => { + this.$refs.ctx.on('closed', () => { this.trigger('closed'); this.unmount(); }); }); this.open = pos => { - this.refs.ctx.open(pos); + this.$refs.ctx.open(pos); }; this.createFolder = () => { this.browser.createFolder(); - this.refs.ctx.close(); + this.$refs.ctx.close(); }; this.upload = () => { this.browser.selectLocalFile(); - this.refs.ctx.close(); + this.$refs.ctx.close(); }; this.urlUpload = () => { this.browser.urlUpload(); - this.refs.ctx.close(); + this.$refs.ctx.close(); }; diff --git a/src/web/app/desktop/tags/drive/browser-window.tag b/src/web/app/desktop/tags/drive/browser-window.tag index 57042f0163..01cb4b1af8 100644 --- a/src/web/app/desktop/tags/drive/browser-window.tag +++ b/src/web/app/desktop/tags/drive/browser-window.tag @@ -33,7 +33,7 @@ this.folder = this.opts.folder ? this.opts.folder : null; this.popout = () => { - const folder = this.refs.window.refs.browser.folder; + const folder = this.$refs.window.refs.browser.folder; if (folder) { return `${_URL_}/i/drive/folder/${folder.id}`; } else { @@ -42,7 +42,7 @@ }; this.on('mount', () => { - this.refs.window.on('closed', () => { + this.$refs.window.on('closed', () => { this.unmount(); }); @@ -54,7 +54,7 @@ }); this.close = () => { - this.refs.window.close(); + this.$refs.window.close(); }; diff --git a/src/web/app/desktop/tags/drive/browser.tag b/src/web/app/desktop/tags/drive/browser.tag index f9dea51271..7e9f4662fe 100644 --- a/src/web/app/desktop/tags/drive/browser.tag +++ b/src/web/app/desktop/tags/drive/browser.tag @@ -275,11 +275,11 @@ this.isDragSource = false; this.on('mount', () => { - this.refs.uploader.on('uploaded', file => { + this.$refs.uploader.on('uploaded', file => { this.addFile(file, true); }); - this.refs.uploader.on('change-uploads', uploads => { + this.$refs.uploader.on('change-uploads', uploads => { this.update({ uploads: uploads }); @@ -332,35 +332,35 @@ }; this.onmousedown = e => { - if (contains(this.refs.foldersContainer, e.target) || contains(this.refs.filesContainer, e.target)) return true; + if (contains(this.$refs.foldersContainer, e.target) || contains(this.$refs.filesContainer, e.target)) return true; - const rect = this.refs.main.getBoundingClientRect(); + const rect = this.$refs.main.getBoundingClientRect(); - const left = e.pageX + this.refs.main.scrollLeft - rect.left - window.pageXOffset - const top = e.pageY + this.refs.main.scrollTop - rect.top - window.pageYOffset + const left = e.pageX + this.$refs.main.scrollLeft - rect.left - window.pageXOffset + const top = e.pageY + this.$refs.main.scrollTop - rect.top - window.pageYOffset const move = e => { - this.refs.selection.style.display = 'block'; + this.$refs.selection.style.display = 'block'; - const cursorX = e.pageX + this.refs.main.scrollLeft - rect.left - window.pageXOffset; - const cursorY = e.pageY + this.refs.main.scrollTop - rect.top - window.pageYOffset; + const cursorX = e.pageX + this.$refs.main.scrollLeft - rect.left - window.pageXOffset; + const cursorY = e.pageY + this.$refs.main.scrollTop - rect.top - window.pageYOffset; const w = cursorX - left; const h = cursorY - top; if (w > 0) { - this.refs.selection.style.width = w + 'px'; - this.refs.selection.style.left = left + 'px'; + this.$refs.selection.style.width = w + 'px'; + this.$refs.selection.style.left = left + 'px'; } else { - this.refs.selection.style.width = -w + 'px'; - this.refs.selection.style.left = cursorX + 'px'; + this.$refs.selection.style.width = -w + 'px'; + this.$refs.selection.style.left = cursorX + 'px'; } if (h > 0) { - this.refs.selection.style.height = h + 'px'; - this.refs.selection.style.top = top + 'px'; + this.$refs.selection.style.height = h + 'px'; + this.$refs.selection.style.top = top + 'px'; } else { - this.refs.selection.style.height = -h + 'px'; - this.refs.selection.style.top = cursorY + 'px'; + this.$refs.selection.style.height = -h + 'px'; + this.$refs.selection.style.top = cursorY + 'px'; } }; @@ -368,7 +368,7 @@ document.documentElement.removeEventListener('mousemove', move); document.documentElement.removeEventListener('mouseup', up); - this.refs.selection.style.display = 'none'; + this.$refs.selection.style.display = 'none'; }; document.documentElement.addEventListener('mousemove', move); @@ -482,7 +482,7 @@ }; this.selectLocalFile = () => { - this.refs.fileInput.click(); + this.$refs.fileInput.click(); }; this.urlUpload = () => { @@ -516,14 +516,14 @@ }; this.changeFileInput = () => { - Array.from(this.refs.fileInput.files).forEach(file => { + Array.from(this.$refs.fileInput.files).forEach(file => { this.upload(file, this.folder); }); }; this.upload = (file, folder) => { if (folder && typeof folder == 'object') folder = folder.id; - this.refs.uploader.upload(file, folder); + this.$refs.uploader.upload(file, folder); }; this.chooseFile = file => { diff --git a/src/web/app/desktop/tags/drive/file-contextmenu.tag b/src/web/app/desktop/tags/drive/file-contextmenu.tag index 31ab05c23b..25721372b7 100644 --- a/src/web/app/desktop/tags/drive/file-contextmenu.tag +++ b/src/web/app/desktop/tags/drive/file-contextmenu.tag @@ -48,18 +48,18 @@ this.file = this.opts.file; this.on('mount', () => { - this.refs.ctx.on('closed', () => { + this.$refs.ctx.on('closed', () => { this.trigger('closed'); this.unmount(); }); }); this.open = pos => { - this.refs.ctx.open(pos); + this.$refs.ctx.open(pos); }; this.rename = () => { - this.refs.ctx.close(); + this.$refs.ctx.close(); inputDialog('%i18n:desktop.tags.mk-drive-browser-file-contextmenu.rename-file%', '%i18n:desktop.tags.mk-drive-browser-file-contextmenu.input-new-file-name%', this.file.name, name => { this.api('drive/files/update', { @@ -71,7 +71,7 @@ this.copyUrl = () => { copyToClipboard(this.file.url); - this.refs.ctx.close(); + this.$refs.ctx.close(); dialog('%fa:check%%i18n:desktop.tags.mk-drive-browser-file-contextmenu.copied%', '%i18n:desktop.tags.mk-drive-browser-file-contextmenu.copied-url-to-clipboard%', [{ text: '%i18n:common.ok%' @@ -79,16 +79,16 @@ }; this.download = () => { - this.refs.ctx.close(); + this.$refs.ctx.close(); }; this.setAvatar = () => { - this.refs.ctx.close(); + this.$refs.ctx.close(); updateAvatar(this.I, null, this.file); }; this.setBanner = () => { - this.refs.ctx.close(); + this.$refs.ctx.close(); updateBanner(this.I, null, this.file); }; diff --git a/src/web/app/desktop/tags/drive/file.tag b/src/web/app/desktop/tags/drive/file.tag index 2a1519dc7e..467768db1e 100644 --- a/src/web/app/desktop/tags/drive/file.tag +++ b/src/web/app/desktop/tags/drive/file.tag @@ -206,7 +206,7 @@ this.onload = () => { if (this.file.properties.average_color) { anime({ - targets: this.refs.thumbnail, + targets: this.$refs.thumbnail, backgroundColor: `rgba(${this.file.properties.average_color.join(',')}, 0)`, duration: 100, easing: 'linear' diff --git a/src/web/app/desktop/tags/drive/folder-contextmenu.tag b/src/web/app/desktop/tags/drive/folder-contextmenu.tag index eb8cad52a7..d424482faa 100644 --- a/src/web/app/desktop/tags/drive/folder-contextmenu.tag +++ b/src/web/app/desktop/tags/drive/folder-contextmenu.tag @@ -26,9 +26,9 @@ this.folder = this.opts.folder; this.open = pos => { - this.refs.ctx.open(pos); + this.$refs.ctx.open(pos); - this.refs.ctx.on('closed', () => { + this.$refs.ctx.on('closed', () => { this.trigger('closed'); this.unmount(); }); @@ -36,21 +36,21 @@ this.move = () => { this.browser.move(this.folder.id); - this.refs.ctx.close(); + this.$refs.ctx.close(); }; this.newWindow = () => { this.browser.newWindow(this.folder.id); - this.refs.ctx.close(); + this.$refs.ctx.close(); }; this.createFolder = () => { this.browser.createFolder(); - this.refs.ctx.close(); + this.$refs.ctx.close(); }; this.rename = () => { - this.refs.ctx.close(); + this.$refs.ctx.close(); inputDialog('%i18n:desktop.tags.mk-drive-browser-folder-contextmenu.rename-folder%', '%i18n:desktop.tags.mk-drive-browser-folder-contextmenu.input-new-folder-name%', this.folder.name, name => { this.api('drive/folders/update', { diff --git a/src/web/app/desktop/tags/home-widgets/access-log.tag b/src/web/app/desktop/tags/home-widgets/access-log.tag index 91a71022a7..ecf121d58f 100644 --- a/src/web/app/desktop/tags/home-widgets/access-log.tag +++ b/src/web/app/desktop/tags/home-widgets/access-log.tag @@ -84,7 +84,7 @@ if (this.requests.length > 30) this.requests.shift(); this.update(); - this.refs.log.scrollTop = this.refs.log.scrollHeight; + this.$refs.log.scrollTop = this.$refs.log.scrollHeight; }; this.func = () => { diff --git a/src/web/app/desktop/tags/home-widgets/activity.tag b/src/web/app/desktop/tags/home-widgets/activity.tag index 2274e84162..f2e9cf8246 100644 --- a/src/web/app/desktop/tags/home-widgets/activity.tag +++ b/src/web/app/desktop/tags/home-widgets/activity.tag @@ -15,7 +15,7 @@ this.initializing = true; this.on('mount', () => { - this.refs.activity.on('view-changed', view => { + this.$refs.activity.on('view-changed', view => { this.data.view = view; this.save(); }); @@ -23,7 +23,7 @@ this.func = () => { if (++this.data.design == 3) this.data.design = 0; - this.refs.activity.update({ + this.$refs.activity.update({ design: this.data.design }); this.save(); diff --git a/src/web/app/desktop/tags/home-widgets/channel.tag b/src/web/app/desktop/tags/home-widgets/channel.tag index 0e40caa1e2..c51ca07524 100644 --- a/src/web/app/desktop/tags/home-widgets/channel.tag +++ b/src/web/app/desktop/tags/home-widgets/channel.tag @@ -82,7 +82,7 @@ channel: channel }); - this.refs.channel.zap(channel); + this.$refs.channel.zap(channel); }); }; @@ -185,7 +185,7 @@ }; this.scrollToBottom = () => { - this.refs.posts.scrollTop = this.refs.posts.scrollHeight; + this.$refs.posts.scrollTop = this.$refs.posts.scrollHeight; }; @@ -279,7 +279,7 @@ this.mixin('api'); this.clear = () => { - this.refs.text.value = ''; + this.$refs.text.value = ''; }; this.onkeydown = e => { @@ -291,7 +291,7 @@ wait: true }); - let text = this.refs.text.value; + let text = this.$refs.text.value; let reply = null; if (/^>>([0-9]+) /.test(text)) { diff --git a/src/web/app/desktop/tags/home-widgets/mentions.tag b/src/web/app/desktop/tags/home-widgets/mentions.tag index 94329f0304..5177b2db1f 100644 --- a/src/web/app/desktop/tags/home-widgets/mentions.tag +++ b/src/web/app/desktop/tags/home-widgets/mentions.tag @@ -76,7 +76,7 @@ this.onDocumentKeydown = e => { if (e.target.tagName != 'INPUT' && tag != 'TEXTAREA') { if (e.which == 84) { // t - this.refs.timeline.focus(); + this.$refs.timeline.focus(); } } }; @@ -89,24 +89,24 @@ isLoading: false, isEmpty: posts.length == 0 }); - this.refs.timeline.setPosts(posts); + this.$refs.timeline.setPosts(posts); if (cb) cb(); }); }; this.more = () => { - if (this.moreLoading || this.isLoading || this.refs.timeline.posts.length == 0) return; + if (this.moreLoading || this.isLoading || this.$refs.timeline.posts.length == 0) return; this.update({ moreLoading: true }); this.api('posts/mentions', { following: this.mode == 'following', - until_id: this.refs.timeline.tail().id + until_id: this.$refs.timeline.tail().id }).then(posts => { this.update({ moreLoading: false }); - this.refs.timeline.prependPosts(posts); + this.$refs.timeline.prependPosts(posts); }); }; diff --git a/src/web/app/desktop/tags/home-widgets/messaging.tag b/src/web/app/desktop/tags/home-widgets/messaging.tag index f2c7c35896..695e1babfc 100644 --- a/src/web/app/desktop/tags/home-widgets/messaging.tag +++ b/src/web/app/desktop/tags/home-widgets/messaging.tag @@ -37,7 +37,7 @@ this.mixin('widget'); this.on('mount', () => { - this.refs.index.on('navigate-user', user => { + this.$refs.index.on('navigate-user', user => { riot.mount(document.body.appendChild(document.createElement('mk-messaging-room-window')), { user: user }); diff --git a/src/web/app/desktop/tags/home-widgets/post-form.tag b/src/web/app/desktop/tags/home-widgets/post-form.tag index b6310d6aa3..bf6374dd3c 100644 --- a/src/web/app/desktop/tags/home-widgets/post-form.tag +++ b/src/web/app/desktop/tags/home-widgets/post-form.tag @@ -84,7 +84,7 @@ }); this.api('posts/create', { - text: this.refs.text.value + text: this.$refs.text.value }).then(data => { this.clear(); }).catch(err => { @@ -97,7 +97,7 @@ }; this.clear = () => { - this.refs.text.value = ''; + this.$refs.text.value = ''; }; diff --git a/src/web/app/desktop/tags/home-widgets/server.tag b/src/web/app/desktop/tags/home-widgets/server.tag index 6eb4ce15b7..6749a46b1a 100644 --- a/src/web/app/desktop/tags/home-widgets/server.tag +++ b/src/web/app/desktop/tags/home-widgets/server.tag @@ -284,7 +284,7 @@ }); this.onStats = stats => { - this.refs.pie.render(stats.cpu_usage); + this.$refs.pie.render(stats.cpu_usage); }; @@ -344,7 +344,7 @@ this.onStats = stats => { stats.mem.used = stats.mem.total - stats.mem.free; - this.refs.pie.render(stats.mem.used / stats.mem.total); + this.$refs.pie.render(stats.mem.used / stats.mem.total); this.update({ total: stats.mem.total, @@ -411,7 +411,7 @@ this.onStats = stats => { stats.disk.used = stats.disk.total - stats.disk.free; - this.refs.pie.render(stats.disk.used / stats.disk.total); + this.$refs.pie.render(stats.disk.used / stats.disk.total); this.update({ total: stats.disk.total, diff --git a/src/web/app/desktop/tags/home-widgets/slideshow.tag b/src/web/app/desktop/tags/home-widgets/slideshow.tag index af54fd893d..21b778bae7 100644 --- a/src/web/app/desktop/tags/home-widgets/slideshow.tag +++ b/src/web/app/desktop/tags/home-widgets/slideshow.tag @@ -101,17 +101,17 @@ const index = Math.floor(Math.random() * this.images.length); const img = `url(${ this.images[index].url }?thumbnail&size=1024)`; - this.refs.slideB.style.backgroundImage = img; + this.$refs.slideB.style.backgroundImage = img; anime({ - targets: this.refs.slideB, + targets: this.$refs.slideB, opacity: 1, duration: 1000, easing: 'linear', complete: () => { - this.refs.slideA.style.backgroundImage = img; + this.$refs.slideA.style.backgroundImage = img; anime({ - targets: this.refs.slideB, + targets: this.$refs.slideB, opacity: 0, duration: 0 }); @@ -133,8 +133,8 @@ fetching: false, images: images }); - this.refs.slideA.style.backgroundImage = ''; - this.refs.slideB.style.backgroundImage = ''; + this.$refs.slideA.style.backgroundImage = ''; + this.$refs.slideB.style.backgroundImage = ''; this.change(); }); }; diff --git a/src/web/app/desktop/tags/home-widgets/timeline.tag b/src/web/app/desktop/tags/home-widgets/timeline.tag index 9571b09f34..f44023daa7 100644 --- a/src/web/app/desktop/tags/home-widgets/timeline.tag +++ b/src/web/app/desktop/tags/home-widgets/timeline.tag @@ -75,7 +75,7 @@ this.onDocumentKeydown = e => { if (e.target.tagName != 'INPUT' && e.target.tagName != 'TEXTAREA') { if (e.which == 84) { // t - this.refs.timeline.focus(); + this.$refs.timeline.focus(); } } }; @@ -92,23 +92,23 @@ isLoading: false, isEmpty: posts.length == 0 }); - this.refs.timeline.setPosts(posts); + this.$refs.timeline.setPosts(posts); if (cb) cb(); }); }; this.more = () => { - if (this.moreLoading || this.isLoading || this.refs.timeline.posts.length == 0) return; + if (this.moreLoading || this.isLoading || this.$refs.timeline.posts.length == 0) return; this.update({ moreLoading: true }); this.api('posts/timeline', { - until_id: this.refs.timeline.tail().id + until_id: this.$refs.timeline.tail().id }).then(posts => { this.update({ moreLoading: false }); - this.refs.timeline.prependPosts(posts); + this.$refs.timeline.prependPosts(posts); }); }; @@ -116,7 +116,7 @@ this.update({ isEmpty: false }); - this.refs.timeline.addPost(post); + this.$refs.timeline.addPost(post); }; this.onStreamFollow = () => { diff --git a/src/web/app/desktop/tags/home-widgets/tips.tag b/src/web/app/desktop/tags/home-widgets/tips.tag index 53b61dca91..9246d0e10c 100644 --- a/src/web/app/desktop/tags/home-widgets/tips.tag +++ b/src/web/app/desktop/tags/home-widgets/tips.tag @@ -69,12 +69,12 @@ }); this.set = () => { - this.refs.text.innerHTML = this.tips[Math.floor(Math.random() * this.tips.length)]; + this.$refs.text.innerHTML = this.tips[Math.floor(Math.random() * this.tips.length)]; }; this.change = () => { anime({ - targets: this.refs.tip, + targets: this.$refs.tip, opacity: 0, duration: 500, easing: 'linear', @@ -83,7 +83,7 @@ setTimeout(() => { anime({ - targets: this.refs.tip, + targets: this.$refs.tip, opacity: 1, duration: 500, easing: 'linear' diff --git a/src/web/app/desktop/tags/home.tag b/src/web/app/desktop/tags/home.tag index 90486f7d2b..2047607960 100644 --- a/src/web/app/desktop/tags/home.tag +++ b/src/web/app/desktop/tags/home.tag @@ -197,7 +197,7 @@ this.bakedHomeData = this.bakeHomeData(); this.on('mount', () => { - this.refs.tl.on('loaded', () => { + this.$refs.tl.on('loaded', () => { this.trigger('loaded'); }); @@ -212,11 +212,11 @@ }); if (!this.opts.customize) { - if (this.refs.left.children.length == 0) { - this.refs.left.parentNode.removeChild(this.refs.left); + if (this.$refs.left.children.length == 0) { + this.$refs.left.parentNode.removeChild(this.$refs.left); } - if (this.refs.right.children.length == 0) { - this.refs.right.parentNode.removeChild(this.refs.right); + if (this.$refs.right.children.length == 0) { + this.$refs.right.parentNode.removeChild(this.$refs.right); } } @@ -242,10 +242,10 @@ } }; - new Sortable(this.refs.left, sortableOption); - new Sortable(this.refs.right, sortableOption); - new Sortable(this.refs.maintop, sortableOption); - new Sortable(this.refs.trash, Object.assign({}, sortableOption, { + new Sortable(this.$refs.left, sortableOption); + new Sortable(this.$refs.right, sortableOption); + new Sortable(this.$refs.maintop, sortableOption); + new Sortable(this.$refs.trash, Object.assign({}, sortableOption, { onAdd: evt => { const el = evt.item; const id = el.getAttribute('data-widget-id'); @@ -257,8 +257,8 @@ } if (!this.opts.customize) { - this.scrollFollowerLeft = this.refs.left.parentNode ? new ScrollFollower(this.refs.left, this.root.getBoundingClientRect().top) : null; - this.scrollFollowerRight = this.refs.right.parentNode ? new ScrollFollower(this.refs.right, this.root.getBoundingClientRect().top) : null; + this.scrollFollowerLeft = this.$refs.left.parentNode ? new ScrollFollower(this.$refs.left, this.root.getBoundingClientRect().top) : null; + this.scrollFollowerRight = this.$refs.right.parentNode ? new ScrollFollower(this.$refs.right, this.root.getBoundingClientRect().top) : null; } }); @@ -299,23 +299,23 @@ switch (widget.place) { case 'left': if (prepend) { - this.refs.left.insertBefore(actualEl, this.refs.left.firstChild); + this.$refs.left.insertBefore(actualEl, this.$refs.left.firstChild); } else { - this.refs.left.appendChild(actualEl); + this.$refs.left.appendChild(actualEl); } break; case 'right': if (prepend) { - this.refs.right.insertBefore(actualEl, this.refs.right.firstChild); + this.$refs.right.insertBefore(actualEl, this.$refs.right.firstChild); } else { - this.refs.right.appendChild(actualEl); + this.$refs.right.appendChild(actualEl); } break; case 'main': if (this.opts.customize) { - this.refs.maintop.appendChild(actualEl); + this.$refs.maintop.appendChild(actualEl); } else { - this.refs.main.insertBefore(actualEl, this.refs.tl.root); + this.$refs.main.insertBefore(actualEl, this.$refs.tl.root); } break; } @@ -324,7 +324,7 @@ id: widget.id, data: widget.data, place: widget.place, - tl: this.refs.tl + tl: this.$refs.tl })[0]; this.home.push(tag); @@ -341,7 +341,7 @@ this.addWidget = () => { const widget = { - name: this.refs.widgetSelector.options[this.refs.widgetSelector.selectedIndex].value, + name: this.$refs.widgetSelector.options[this.$refs.widgetSelector.selectedIndex].value, id: uuid(), place: 'left', data: {} @@ -357,21 +357,21 @@ this.saveHome = () => { const data = []; - Array.from(this.refs.left.children).forEach(el => { + Array.from(this.$refs.left.children).forEach(el => { const id = el.getAttribute('data-widget-id'); const widget = this.I.client_settings.home.find(w => w.id == id); widget.place = 'left'; data.push(widget); }); - Array.from(this.refs.right.children).forEach(el => { + Array.from(this.$refs.right.children).forEach(el => { const id = el.getAttribute('data-widget-id'); const widget = this.I.client_settings.home.find(w => w.id == id); widget.place = 'right'; data.push(widget); }); - Array.from(this.refs.maintop.children).forEach(el => { + Array.from(this.$refs.maintop.children).forEach(el => { const id = el.getAttribute('data-widget-id'); const widget = this.I.client_settings.home.find(w => w.id == id); widget.place = 'main'; diff --git a/src/web/app/desktop/tags/images.tag b/src/web/app/desktop/tags/images.tag index 1c81af3d08..dcd664e722 100644 --- a/src/web/app/desktop/tags/images.tag +++ b/src/web/app/desktop/tags/images.tag @@ -86,17 +86,17 @@ }; this.mousemove = e => { - const rect = this.refs.view.getBoundingClientRect(); + const rect = this.$refs.view.getBoundingClientRect(); const mouseX = e.clientX - rect.left; const mouseY = e.clientY - rect.top; - const xp = mouseX / this.refs.view.offsetWidth * 100; - const yp = mouseY / this.refs.view.offsetHeight * 100; - this.refs.view.style.backgroundPosition = xp + '% ' + yp + '%'; - this.refs.view.style.backgroundImage = 'url("' + this.image.url + '?thumbnail")'; + const xp = mouseX / this.$refs.view.offsetWidth * 100; + const yp = mouseY / this.$refs.view.offsetHeight * 100; + this.$refs.view.style.backgroundPosition = xp + '% ' + yp + '%'; + this.$refs.view.style.backgroundImage = 'url("' + this.image.url + '?thumbnail")'; }; this.mouseleave = () => { - this.refs.view.style.backgroundPosition = ''; + this.$refs.view.style.backgroundPosition = ''; }; this.click = ev => { diff --git a/src/web/app/desktop/tags/input-dialog.tag b/src/web/app/desktop/tags/input-dialog.tag index 84dcedf935..bea8c2c22b 100644 --- a/src/web/app/desktop/tags/input-dialog.tag +++ b/src/web/app/desktop/tags/input-dialog.tag @@ -129,11 +129,11 @@ this.type = this.opts.type ? this.opts.type : 'text'; this.on('mount', () => { - this.text = this.refs.window.refs.text; + this.text = this.$refs.window.refs.text; if (this.default) this.text.value = this.default; this.text.focus(); - this.refs.window.on('closing', () => { + this.$refs.window.on('closing', () => { if (this.done) { this.opts.onOk(this.text.value); } else { @@ -141,20 +141,20 @@ } }); - this.refs.window.on('closed', () => { + this.$refs.window.on('closed', () => { this.unmount(); }); }); this.cancel = () => { this.done = false; - this.refs.window.close(); + this.$refs.window.close(); }; this.ok = () => { if (!this.allowEmpty && this.text.value == '') return; this.done = true; - this.refs.window.close(); + this.$refs.window.close(); }; this.onInput = () => { diff --git a/src/web/app/desktop/tags/messaging/room-window.tag b/src/web/app/desktop/tags/messaging/room-window.tag index 7c0bb0d76e..bae456200e 100644 --- a/src/web/app/desktop/tags/messaging/room-window.tag +++ b/src/web/app/desktop/tags/messaging/room-window.tag @@ -24,7 +24,7 @@ this.popout = `${_URL_}/i/messaging/${this.user.username}`; this.on('mount', () => { - this.refs.window.on('closed', () => { + this.$refs.window.on('closed', () => { this.unmount(); }); }); diff --git a/src/web/app/desktop/tags/messaging/window.tag b/src/web/app/desktop/tags/messaging/window.tag index 529db11af1..afe01c53e1 100644 --- a/src/web/app/desktop/tags/messaging/window.tag +++ b/src/web/app/desktop/tags/messaging/window.tag @@ -20,11 +20,11 @@ diff --git a/src/web/app/desktop/tags/repost-form-window.tag b/src/web/app/desktop/tags/repost-form-window.tag index dbc3f5a3c5..939ff4e383 100644 --- a/src/web/app/desktop/tags/repost-form-window.tag +++ b/src/web/app/desktop/tags/repost-form-window.tag @@ -19,23 +19,23 @@ this.onDocumentKeydown = e => { if (e.target.tagName != 'INPUT' && e.target.tagName != 'TEXTAREA') { if (e.which == 27) { // Esc - this.refs.window.close(); + this.$refs.window.close(); } } }; this.on('mount', () => { - this.refs.window.refs.form.on('cancel', () => { - this.refs.window.close(); + this.$refs.window.refs.form.on('cancel', () => { + this.$refs.window.close(); }); - this.refs.window.refs.form.on('posted', () => { - this.refs.window.close(); + this.$refs.window.refs.form.on('posted', () => { + this.$refs.window.close(); }); document.addEventListener('keydown', this.onDocumentKeydown); - this.refs.window.on('closed', () => { + this.$refs.window.on('closed', () => { this.unmount(); }); }); diff --git a/src/web/app/desktop/tags/repost-form.tag b/src/web/app/desktop/tags/repost-form.tag index 946871765b..b2ebbf4c46 100644 --- a/src/web/app/desktop/tags/repost-form.tag +++ b/src/web/app/desktop/tags/repost-form.tag @@ -117,11 +117,11 @@ quote: true }); - this.refs.form.on('post', () => { + this.$refs.form.on('post', () => { this.trigger('posted'); }); - this.refs.form.focus(); + this.$refs.form.focus(); }; diff --git a/src/web/app/desktop/tags/search-posts.tag b/src/web/app/desktop/tags/search-posts.tag index f7ec85a4fe..0c8dbcbf63 100644 --- a/src/web/app/desktop/tags/search-posts.tag +++ b/src/web/app/desktop/tags/search-posts.tag @@ -53,7 +53,7 @@ isLoading: false, isEmpty: posts.length == 0 }); - this.refs.timeline.setPosts(posts); + this.$refs.timeline.setPosts(posts); this.trigger('loaded'); }); }); @@ -66,7 +66,7 @@ this.onDocumentKeydown = e => { if (e.target.tagName != 'INPUT' && e.target.tagName != 'TEXTAREA') { if (e.which == 84) { // t - this.refs.timeline.focus(); + this.$refs.timeline.focus(); } } }; @@ -84,7 +84,7 @@ this.update({ moreLoading: false }); - this.refs.timeline.prependPosts(posts); + this.$refs.timeline.prependPosts(posts); }); }; diff --git a/src/web/app/desktop/tags/search.tag b/src/web/app/desktop/tags/search.tag index d5159fe4e9..e29a2b2737 100644 --- a/src/web/app/desktop/tags/search.tag +++ b/src/web/app/desktop/tags/search.tag @@ -26,7 +26,7 @@ this.query = this.opts.query; this.on('mount', () => { - this.refs.posts.on('loaded', () => { + this.$refs.posts.on('loaded', () => { this.trigger('loaded'); }); }); 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 6225145589..6d1e59413d 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 @@ -141,33 +141,33 @@ this.title = this.opts.title || '%fa:R file%ファイルを選択'; this.on('mount', () => { - this.refs.window.refs.browser.on('selected', file => { + this.$refs.window.refs.browser.on('selected', file => { this.files = [file]; this.ok(); }); - this.refs.window.refs.browser.on('change-selection', files => { + this.$refs.window.refs.browser.on('change-selection', files => { this.update({ files: files }); }); - this.refs.window.on('closed', () => { + this.$refs.window.on('closed', () => { this.unmount(); }); }); this.close = () => { - this.refs.window.close(); + this.$refs.window.close(); }; this.upload = () => { - this.refs.window.refs.browser.selectLocalFile(); + this.$refs.window.refs.browser.selectLocalFile(); }; this.ok = () => { this.trigger('selected', this.multiple ? this.files : this.files[0]); - this.refs.window.close(); + this.$refs.window.close(); }; diff --git a/src/web/app/desktop/tags/select-folder-from-drive-window.tag b/src/web/app/desktop/tags/select-folder-from-drive-window.tag index 45700420cc..7bfe5af357 100644 --- a/src/web/app/desktop/tags/select-folder-from-drive-window.tag +++ b/src/web/app/desktop/tags/select-folder-from-drive-window.tag @@ -95,18 +95,18 @@ this.title = this.opts.title || '%fa:R folder%フォルダを選択'; this.on('mount', () => { - this.refs.window.on('closed', () => { + this.$refs.window.on('closed', () => { this.unmount(); }); }); this.close = () => { - this.refs.window.close(); + this.$refs.window.close(); }; this.ok = () => { - this.trigger('selected', this.refs.window.refs.browser.folder); - this.refs.window.close(); + this.trigger('selected', this.$refs.window.refs.browser.folder); + this.$refs.window.close(); }; diff --git a/src/web/app/desktop/tags/settings-window.tag b/src/web/app/desktop/tags/settings-window.tag index 5a725af51e..e68a44a4f6 100644 --- a/src/web/app/desktop/tags/settings-window.tag +++ b/src/web/app/desktop/tags/settings-window.tag @@ -18,13 +18,13 @@ diff --git a/src/web/app/desktop/tags/settings.tag b/src/web/app/desktop/tags/settings.tag index efc5da83f1..084bde0095 100644 --- a/src/web/app/desktop/tags/settings.tag +++ b/src/web/app/desktop/tags/settings.tag @@ -179,10 +179,10 @@ this.updateAccount = () => { this.api('i/update', { - name: this.refs.accountName.value, - location: this.refs.accountLocation.value || null, - description: this.refs.accountDescription.value || null, - birthday: this.refs.accountBirthday.value || null + name: this.$refs.accountName.value, + location: this.$refs.accountLocation.value || null, + description: this.$refs.accountDescription.value || null, + birthday: this.$refs.accountBirthday.value || null }).then(() => { notify('プロフィールを更新しました'); }); @@ -320,7 +320,7 @@ this.submit = () => { this.api('i/2fa/done', { - token: this.refs.token.value + token: this.$refs.token.value }).then(() => { notify('%i18n:desktop.tags.mk-2fa-setting.success%'); this.I.two_factor_enabled = true; diff --git a/src/web/app/desktop/tags/sub-post-content.tag b/src/web/app/desktop/tags/sub-post-content.tag index 1a81b545b6..01e1fdb31e 100644 --- a/src/web/app/desktop/tags/sub-post-content.tag +++ b/src/web/app/desktop/tags/sub-post-content.tag @@ -43,9 +43,9 @@ this.on('mount', () => { if (this.post.text) { const tokens = this.post.ast; - this.refs.text.innerHTML = compile(tokens, false); + this.$refs.text.innerHTML = compile(tokens, false); - Array.from(this.refs.text.children).forEach(e => { + Array.from(this.$refs.text.children).forEach(e => { if (e.tagName == 'MK-URL') riot.mount(e); }); } diff --git a/src/web/app/desktop/tags/timeline.tag b/src/web/app/desktop/tags/timeline.tag index 0616a95f99..115b22c862 100644 --- a/src/web/app/desktop/tags/timeline.tag +++ b/src/web/app/desktop/tags/timeline.tag @@ -437,10 +437,10 @@ this.refresh = post => { this.set(post); this.update(); - if (this.refs.reactionsViewer) this.refs.reactionsViewer.update({ + if (this.$refs.reactionsViewer) this.$refs.reactionsViewer.update({ post }); - if (this.refs.pollViewer) this.refs.pollViewer.init(post); + if (this.$refs.pollViewer) this.$refs.pollViewer.init(post); }; this.onStreamPostUpdated = data => { @@ -484,9 +484,9 @@ if (this.p.text) { const tokens = this.p.ast; - this.refs.text.innerHTML = this.refs.text.innerHTML.replace('

', compile(tokens)); + this.$refs.text.innerHTML = this.$refs.text.innerHTML.replace('

', compile(tokens)); - Array.from(this.refs.text.children).forEach(e => { + Array.from(this.$refs.text.children).forEach(e => { if (e.tagName == 'MK-URL') riot.mount(e); }); @@ -494,7 +494,7 @@ tokens .filter(t => (t.type == 'url' || t.type == 'link') && !t.silent) .map(t => { - riot.mount(this.refs.text.appendChild(document.createElement('mk-url-preview')), { + riot.mount(this.$refs.text.appendChild(document.createElement('mk-url-preview')), { url: t.url }); }); @@ -521,14 +521,14 @@ this.react = () => { riot.mount(document.body.appendChild(document.createElement('mk-reaction-picker')), { - source: this.refs.reactButton, + source: this.$refs.reactButton, post: this.p }); }; this.menu = () => { riot.mount(document.body.appendChild(document.createElement('mk-post-menu')), { - source: this.refs.menuButton, + source: this.$refs.menuButton, post: this.p }); }; diff --git a/src/web/app/desktop/tags/ui.tag b/src/web/app/desktop/tags/ui.tag index 3e7b5c2eca..777624d7ba 100644 --- a/src/web/app/desktop/tags/ui.tag +++ b/src/web/app/desktop/tags/ui.tag @@ -180,7 +180,7 @@ this.onsubmit = e => { e.preventDefault(); - this.page('/search?q=' + encodeURIComponent(this.refs.q.value)); + this.page('/search?q=' + encodeURIComponent(this.$refs.q.value)); }; diff --git a/src/web/app/desktop/tags/user-timeline.tag b/src/web/app/desktop/tags/user-timeline.tag index 19ee2f3284..0bfad05c27 100644 --- a/src/web/app/desktop/tags/user-timeline.tag +++ b/src/web/app/desktop/tags/user-timeline.tag @@ -88,7 +88,7 @@ this.onDocumentKeydown = e => { if (e.target.tagName !== 'INPUT' && e.target.tagName !== 'TEXTAREA') { if (e.which == 84) { // [t] - this.refs.timeline.focus(); + this.$refs.timeline.focus(); } } }; @@ -103,25 +103,25 @@ isLoading: false, isEmpty: posts.length == 0 }); - this.refs.timeline.setPosts(posts); + this.$refs.timeline.setPosts(posts); if (cb) cb(); }); }; this.more = () => { - if (this.moreLoading || this.isLoading || this.refs.timeline.posts.length == 0) return; + if (this.moreLoading || this.isLoading || this.$refs.timeline.posts.length == 0) return; this.update({ moreLoading: true }); this.api('users/posts', { user_id: this.user.id, with_replies: this.mode == 'with-replies', - until_id: this.refs.timeline.tail().id + until_id: this.$refs.timeline.tail().id }).then(posts => { this.update({ moreLoading: false }); - this.refs.timeline.prependPosts(posts); + this.$refs.timeline.prependPosts(posts); }); }; diff --git a/src/web/app/desktop/tags/user.tag b/src/web/app/desktop/tags/user.tag index 5dc4175cf9..8eca3caaa3 100644 --- a/src/web/app/desktop/tags/user.tag +++ b/src/web/app/desktop/tags/user.tag @@ -206,10 +206,10 @@ const z = 1.25; // 奥行き(小さいほど奥) const pos = -(top / z); - this.refs.banner.style.backgroundPosition = `center calc(50% - ${pos}px)`; + this.$refs.banner.style.backgroundPosition = `center calc(50% - ${pos}px)`; const blur = top / 32 - if (blur <= 10) this.refs.banner.style.filter = `blur(${blur}px)`; + if (blur <= 10) this.$refs.banner.style.filter = `blur(${blur}px)`; }; this.onUpdateBanner = () => { @@ -715,12 +715,12 @@ this.user = this.opts.user; this.on('mount', () => { - this.refs.tl.on('loaded', () => { + this.$refs.tl.on('loaded', () => { this.trigger('loaded'); }); - this.scrollFollowerLeft = new ScrollFollower(this.refs.left, this.parent.root.getBoundingClientRect().top); - this.scrollFollowerRight = new ScrollFollower(this.refs.right, this.parent.root.getBoundingClientRect().top); + this.scrollFollowerLeft = new ScrollFollower(this.$refs.left, this.parent.root.getBoundingClientRect().top); + this.scrollFollowerRight = new ScrollFollower(this.$refs.right, this.parent.root.getBoundingClientRect().top); }); this.on('unmount', () => { @@ -729,7 +729,7 @@ }); this.warp = date => { - this.refs.tl.warp(date); + this.$refs.tl.warp(date); }; diff --git a/src/web/app/desktop/tags/window.tag b/src/web/app/desktop/tags/window.tag index ebc7382d5a..31830d9078 100644 --- a/src/web/app/desktop/tags/window.tag +++ b/src/web/app/desktop/tags/window.tag @@ -199,13 +199,13 @@ this.canResize = !this.isFlexible; this.on('mount', () => { - this.refs.main.style.width = this.opts.width || '530px'; - this.refs.main.style.height = this.opts.height || 'auto'; + this.$refs.main.style.width = this.opts.width || '530px'; + this.$refs.main.style.height = this.opts.height || 'auto'; - this.refs.main.style.top = '15%'; - this.refs.main.style.left = (window.innerWidth / 2) - (this.refs.main.offsetWidth / 2) + 'px'; + this.$refs.main.style.top = '15%'; + this.$refs.main.style.left = (window.innerWidth / 2) - (this.$refs.main.offsetWidth / 2) + 'px'; - this.refs.header.addEventListener('contextmenu', e => { + this.$refs.header.addEventListener('contextmenu', e => { e.preventDefault(); }); @@ -219,15 +219,15 @@ }); this.onBrowserResize = () => { - const position = this.refs.main.getBoundingClientRect(); + const position = this.$refs.main.getBoundingClientRect(); const browserWidth = window.innerWidth; const browserHeight = window.innerHeight; - const windowWidth = this.refs.main.offsetWidth; - const windowHeight = this.refs.main.offsetHeight; - if (position.left < 0) this.refs.main.style.left = 0; - if (position.top < 0) this.refs.main.style.top = 0; - if (position.left + windowWidth > browserWidth) this.refs.main.style.left = browserWidth - windowWidth + 'px'; - if (position.top + windowHeight > browserHeight) this.refs.main.style.top = browserHeight - windowHeight + 'px'; + const windowWidth = this.$refs.main.offsetWidth; + const windowHeight = this.$refs.main.offsetHeight; + if (position.left < 0) this.$refs.main.style.left = 0; + if (position.top < 0) this.$refs.main.style.top = 0; + if (position.left + windowWidth > browserWidth) this.$refs.main.style.left = browserWidth - windowWidth + 'px'; + if (position.top + windowHeight > browserHeight) this.$refs.main.style.top = browserHeight - windowHeight + 'px'; }; this.open = () => { @@ -236,25 +236,25 @@ this.top(); if (this.isModal) { - this.refs.bg.style.pointerEvents = 'auto'; + this.$refs.bg.style.pointerEvents = 'auto'; anime({ - targets: this.refs.bg, + targets: this.$refs.bg, opacity: 1, duration: 100, easing: 'linear' }); } - this.refs.main.style.pointerEvents = 'auto'; + this.$refs.main.style.pointerEvents = 'auto'; anime({ - targets: this.refs.main, + targets: this.$refs.main, opacity: 1, scale: [1.1, 1], duration: 200, easing: 'easeOutQuad' }); - //this.refs.main.focus(); + //this.$refs.main.focus(); setTimeout(() => { this.trigger('opened'); @@ -262,10 +262,10 @@ }; this.popout = () => { - const position = this.refs.main.getBoundingClientRect(); + const position = this.$refs.main.getBoundingClientRect(); - const width = parseInt(getComputedStyle(this.refs.main, '').width, 10); - const height = parseInt(getComputedStyle(this.refs.main, '').height, 10); + const width = parseInt(getComputedStyle(this.$refs.main, '').width, 10); + const height = parseInt(getComputedStyle(this.$refs.main, '').height, 10); const x = window.screenX + position.left; const y = window.screenY + position.top; @@ -281,19 +281,19 @@ this.trigger('closing'); if (this.isModal) { - this.refs.bg.style.pointerEvents = 'none'; + this.$refs.bg.style.pointerEvents = 'none'; anime({ - targets: this.refs.bg, + targets: this.$refs.bg, opacity: 0, duration: 300, easing: 'linear' }); } - this.refs.main.style.pointerEvents = 'none'; + this.$refs.main.style.pointerEvents = 'none'; anime({ - targets: this.refs.main, + targets: this.$refs.main, opacity: 0, scale: 0.8, duration: 300, @@ -318,8 +318,8 @@ }); if (z > 0) { - this.refs.main.style.zIndex = z + 1; - if (this.isModal) this.refs.bg.style.zIndex = z + 1; + this.$refs.main.style.zIndex = z + 1; + if (this.isModal) this.$refs.bg.style.zIndex = z + 1; } }; @@ -340,9 +340,9 @@ this.onHeaderMousedown = e => { e.preventDefault(); - if (!contains(this.refs.main, document.activeElement)) this.refs.main.focus(); + if (!contains(this.$refs.main, document.activeElement)) this.$refs.main.focus(); - const position = this.refs.main.getBoundingClientRect(); + const position = this.$refs.main.getBoundingClientRect(); const clickX = e.clientX; const clickY = e.clientY; @@ -350,8 +350,8 @@ const moveBaseY = clickY - position.top; const browserWidth = window.innerWidth; const browserHeight = window.innerHeight; - const windowWidth = this.refs.main.offsetWidth; - const windowHeight = this.refs.main.offsetHeight; + const windowWidth = this.$refs.main.offsetWidth; + const windowHeight = this.$refs.main.offsetHeight; // 動かした時 dragListen(me => { @@ -370,8 +370,8 @@ // 右はみ出し if (moveLeft + windowWidth > browserWidth) moveLeft = browserWidth - windowWidth; - this.refs.main.style.left = moveLeft + 'px'; - this.refs.main.style.top = moveTop + 'px'; + this.$refs.main.style.left = moveLeft + 'px'; + this.$refs.main.style.top = moveTop + 'px'; }); }; @@ -380,8 +380,8 @@ e.preventDefault(); const base = e.clientY; - const height = parseInt(getComputedStyle(this.refs.main, '').height, 10); - const top = parseInt(getComputedStyle(this.refs.main, '').top, 10); + const height = parseInt(getComputedStyle(this.$refs.main, '').height, 10); + const top = parseInt(getComputedStyle(this.$refs.main, '').top, 10); // 動かした時 dragListen(me => { @@ -406,8 +406,8 @@ e.preventDefault(); const base = e.clientX; - const width = parseInt(getComputedStyle(this.refs.main, '').width, 10); - const left = parseInt(getComputedStyle(this.refs.main, '').left, 10); + const width = parseInt(getComputedStyle(this.$refs.main, '').width, 10); + const left = parseInt(getComputedStyle(this.$refs.main, '').left, 10); const browserWidth = window.innerWidth; // 動かした時 @@ -430,8 +430,8 @@ e.preventDefault(); const base = e.clientY; - const height = parseInt(getComputedStyle(this.refs.main, '').height, 10); - const top = parseInt(getComputedStyle(this.refs.main, '').top, 10); + const height = parseInt(getComputedStyle(this.$refs.main, '').height, 10); + const top = parseInt(getComputedStyle(this.$refs.main, '').top, 10); const browserHeight = window.innerHeight; // 動かした時 @@ -454,8 +454,8 @@ e.preventDefault(); const base = e.clientX; - const width = parseInt(getComputedStyle(this.refs.main, '').width, 10); - const left = parseInt(getComputedStyle(this.refs.main, '').left, 10); + const width = parseInt(getComputedStyle(this.$refs.main, '').width, 10); + const left = parseInt(getComputedStyle(this.$refs.main, '').left, 10); // 動かした時 dragListen(me => { @@ -501,22 +501,22 @@ // 高さを適用 this.applyTransformHeight = height => { - this.refs.main.style.height = height + 'px'; + this.$refs.main.style.height = height + 'px'; }; // 幅を適用 this.applyTransformWidth = width => { - this.refs.main.style.width = width + 'px'; + this.$refs.main.style.width = width + 'px'; }; // Y座標を適用 this.applyTransformTop = top => { - this.refs.main.style.top = top + 'px'; + this.$refs.main.style.top = top + 'px'; }; // X座標を適用 this.applyTransformLeft = left => { - this.refs.main.style.left = left + 'px'; + this.$refs.main.style.left = left + 'px'; }; function dragListen(fn) { diff --git a/src/web/app/dev/tags/new-app-form.tag b/src/web/app/dev/tags/new-app-form.tag index c9518d8deb..aba6b1524f 100644 --- a/src/web/app/dev/tags/new-app-form.tag +++ b/src/web/app/dev/tags/new-app-form.tag @@ -183,7 +183,7 @@ this.nidState = null; this.onChangeNid = () => { - const nid = this.refs.nid.value; + const nid = this.$refs.nid.value; if (nid == '') { this.update({ @@ -223,13 +223,13 @@ }; this.onsubmit = () => { - const name = this.refs.name.value; - const nid = this.refs.nid.value; - const description = this.refs.description.value; - const cb = this.refs.cb.value; + const name = this.$refs.name.value; + const nid = this.$refs.nid.value; + const description = this.$refs.description.value; + const cb = this.$refs.cb.value; const permission = []; - this.refs.permission.querySelectorAll('input').forEach(el => { + this.$refs.permission.querySelectorAll('input').forEach(el => { if (el.checked) permission.push(el.value); }); diff --git a/src/web/app/mobile/tags/drive-folder-selector.tag b/src/web/app/mobile/tags/drive-folder-selector.tag index 82e22fed29..37d571d731 100644 --- a/src/web/app/mobile/tags/drive-folder-selector.tag +++ b/src/web/app/mobile/tags/drive-folder-selector.tag @@ -62,7 +62,7 @@ }; this.ok = () => { - this.trigger('selected', this.refs.browser.folder); + this.trigger('selected', this.$refs.browser.folder); this.unmount(); }; diff --git a/src/web/app/mobile/tags/drive-selector.tag b/src/web/app/mobile/tags/drive-selector.tag index 36fed8c327..ab67cc80c0 100644 --- a/src/web/app/mobile/tags/drive-selector.tag +++ b/src/web/app/mobile/tags/drive-selector.tag @@ -63,13 +63,13 @@ this.files = []; this.on('mount', () => { - this.refs.browser.on('change-selection', files => { + this.$refs.browser.on('change-selection', files => { this.update({ files: files }); }); - this.refs.browser.on('selected', file => { + this.$refs.browser.on('selected', file => { this.trigger('selected', file); this.unmount(); }); diff --git a/src/web/app/mobile/tags/drive.tag b/src/web/app/mobile/tags/drive.tag index d3ca1aff90..3d0396692d 100644 --- a/src/web/app/mobile/tags/drive.tag +++ b/src/web/app/mobile/tags/drive.tag @@ -209,7 +209,7 @@ } if (this.opts.isNaked) { - this.refs.nav.style.top = `${this.opts.top}px`; + this.$refs.nav.style.top = `${this.opts.top}px`; } }); @@ -517,7 +517,7 @@ }; this.selectLocalFile = () => { - this.refs.file.click(); + this.$refs.file.click(); }; this.createFolder = () => { @@ -574,7 +574,7 @@ }; this.changeLocalFile = () => { - Array.from(this.refs.file.files).forEach(f => this.refs.uploader.upload(f, this.folder)); + Array.from(this.$refs.file.files).forEach(f => this.$refs.uploader.upload(f, this.folder)); }; diff --git a/src/web/app/mobile/tags/drive/file-viewer.tag b/src/web/app/mobile/tags/drive/file-viewer.tag index 2d9338fd35..82fbb6609e 100644 --- a/src/web/app/mobile/tags/drive/file-viewer.tag +++ b/src/web/app/mobile/tags/drive/file-viewer.tag @@ -243,7 +243,7 @@ this.onImageLoaded = () => { const self = this; - EXIF.getData(this.refs.img, function() { + EXIF.getData(this.$refs.img, function() { const allMetaData = EXIF.getAllTags(this); self.update({ exif: allMetaData diff --git a/src/web/app/mobile/tags/home-timeline.tag b/src/web/app/mobile/tags/home-timeline.tag index 397d2b3980..aa3818007b 100644 --- a/src/web/app/mobile/tags/home-timeline.tag +++ b/src/web/app/mobile/tags/home-timeline.tag @@ -28,7 +28,7 @@ this.fetch = () => { this.api('posts/timeline').then(posts => { - this.refs.timeline.setPosts(posts); + this.$refs.timeline.setPosts(posts); }); }; @@ -47,7 +47,7 @@ this.more = () => { return this.api('posts/timeline', { - until_id: this.refs.timeline.tail().id + until_id: this.$refs.timeline.tail().id }); }; @@ -55,7 +55,7 @@ this.update({ isEmpty: false }); - this.refs.timeline.addPost(post); + this.$refs.timeline.addPost(post); }; this.onStreamFollow = () => { diff --git a/src/web/app/mobile/tags/home.tag b/src/web/app/mobile/tags/home.tag index d92e3ae4e5..2c07c286d2 100644 --- a/src/web/app/mobile/tags/home.tag +++ b/src/web/app/mobile/tags/home.tag @@ -15,7 +15,7 @@ diff --git a/src/web/app/mobile/tags/search.tag b/src/web/app/mobile/tags/search.tag index 2d299e0a77..15a861d7a5 100644 --- a/src/web/app/mobile/tags/search.tag +++ b/src/web/app/mobile/tags/search.tag @@ -8,7 +8,7 @@ this.query = this.opts.query; this.on('mount', () => { - this.refs.posts.on('loaded', () => { + this.$refs.posts.on('loaded', () => { this.trigger('loaded'); }); }); diff --git a/src/web/app/mobile/tags/sub-post-content.tag b/src/web/app/mobile/tags/sub-post-content.tag index adeb84dea0..7192cd0130 100644 --- a/src/web/app/mobile/tags/sub-post-content.tag +++ b/src/web/app/mobile/tags/sub-post-content.tag @@ -35,9 +35,9 @@ this.on('mount', () => { if (this.post.text) { const tokens = this.post.ast; - this.refs.text.innerHTML = compile(tokens, false); + this.$refs.text.innerHTML = compile(tokens, false); - Array.from(this.refs.text.children).forEach(e => { + Array.from(this.$refs.text.children).forEach(e => { if (e.tagName == 'MK-URL') riot.mount(e); }); } diff --git a/src/web/app/mobile/tags/timeline.tag b/src/web/app/mobile/tags/timeline.tag index 400fa5d85f..66f58ff0af 100644 --- a/src/web/app/mobile/tags/timeline.tag +++ b/src/web/app/mobile/tags/timeline.tag @@ -482,10 +482,10 @@ this.refresh = post => { this.set(post); this.update(); - if (this.refs.reactionsViewer) this.refs.reactionsViewer.update({ + if (this.$refs.reactionsViewer) this.$refs.reactionsViewer.update({ post }); - if (this.refs.pollViewer) this.refs.pollViewer.init(post); + if (this.$refs.pollViewer) this.$refs.pollViewer.init(post); }; this.onStreamPostUpdated = data => { @@ -529,9 +529,9 @@ if (this.p.text) { const tokens = this.p.ast; - this.refs.text.innerHTML = this.refs.text.innerHTML.replace('

', compile(tokens)); + this.$refs.text.innerHTML = this.$refs.text.innerHTML.replace('

', compile(tokens)); - Array.from(this.refs.text.children).forEach(e => { + Array.from(this.$refs.text.children).forEach(e => { if (e.tagName == 'MK-URL') riot.mount(e); }); @@ -539,7 +539,7 @@ tokens .filter(t => (t.type == 'url' || t.type == 'link') && !t.silent) .map(t => { - riot.mount(this.refs.text.appendChild(document.createElement('mk-url-preview')), { + riot.mount(this.$refs.text.appendChild(document.createElement('mk-url-preview')), { url: t.url }); }); @@ -569,7 +569,7 @@ this.react = () => { riot.mount(document.body.appendChild(document.createElement('mk-reaction-picker')), { - source: this.refs.reactButton, + source: this.$refs.reactButton, post: this.p, compact: true }); @@ -577,7 +577,7 @@ this.menu = () => { riot.mount(document.body.appendChild(document.createElement('mk-post-menu')), { - source: this.refs.menuButton, + source: this.$refs.menuButton, post: this.p, compact: true }); diff --git a/src/web/app/mobile/tags/ui.tag b/src/web/app/mobile/tags/ui.tag index b03534f925..c5dc4b2e4e 100644 --- a/src/web/app/mobile/tags/ui.tag +++ b/src/web/app/mobile/tags/ui.tag @@ -30,7 +30,7 @@ this.toggleDrawer = () => { this.isDrawerOpening = !this.isDrawerOpening; - this.refs.nav.root.style.display = this.isDrawerOpening ? 'block' : 'none'; + this.$refs.nav.root.style.display = this.isDrawerOpening ? 'block' : 'none'; }; this.onStreamNotification = notification => { @@ -209,7 +209,7 @@ }; this.setTitle = title => { - this.refs.title.innerHTML = title; + this.$refs.title.innerHTML = title; }; this.setFunc = (fn, icon) => { diff --git a/src/web/app/mobile/tags/user-followers.tag b/src/web/app/mobile/tags/user-followers.tag index b710e376c6..c4cdedba81 100644 --- a/src/web/app/mobile/tags/user-followers.tag +++ b/src/web/app/mobile/tags/user-followers.tag @@ -20,7 +20,7 @@ }; this.on('mount', () => { - this.refs.list.on('loaded', () => { + this.$refs.list.on('loaded', () => { this.trigger('loaded'); }); }); diff --git a/src/web/app/mobile/tags/user-following.tag b/src/web/app/mobile/tags/user-following.tag index 62ca091812..3a6a54dd76 100644 --- a/src/web/app/mobile/tags/user-following.tag +++ b/src/web/app/mobile/tags/user-following.tag @@ -20,7 +20,7 @@ }; this.on('mount', () => { - this.refs.list.on('loaded', () => { + this.$refs.list.on('loaded', () => { this.trigger('loaded'); }); }); diff --git a/src/web/app/mobile/tags/user-timeline.tag b/src/web/app/mobile/tags/user-timeline.tag index 86ead5971f..65203fec4b 100644 --- a/src/web/app/mobile/tags/user-timeline.tag +++ b/src/web/app/mobile/tags/user-timeline.tag @@ -26,7 +26,7 @@ return this.api('users/posts', { user_id: this.user.id, with_media: this.withMedia, - until_id: this.refs.timeline.tail().id + until_id: this.$refs.timeline.tail().id }); }; diff --git a/src/web/app/status/tags/index.tag b/src/web/app/status/tags/index.tag index dcadc66172..198aa89e38 100644 --- a/src/web/app/status/tags/index.tag +++ b/src/web/app/status/tags/index.tag @@ -93,7 +93,7 @@ }); this.onStats = stats => { - this.refs.chart.addData(1 - stats.cpu_usage); + this.$refs.chart.addData(1 - stats.cpu_usage); const percentage = (stats.cpu_usage * 100).toFixed(0); @@ -124,7 +124,7 @@ this.onStats = stats => { stats.mem.used = stats.mem.total - stats.mem.free; - this.refs.chart.addData(1 - (stats.mem.used / stats.mem.total)); + this.$refs.chart.addData(1 - (stats.mem.used / stats.mem.total)); const percentage = (stats.mem.used / stats.mem.total * 100).toFixed(0);