This commit is contained in:
こぴなたみぽ
2018-02-07 18:17:59 +09:00
parent ea70350dcc
commit 07efc8e150
90 changed files with 427 additions and 425 deletions

View File

@@ -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();
};

View File

@@ -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;
}
};

View File

@@ -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
});

View File

@@ -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;

View File

@@ -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) => {

View File

@@ -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,

View File

@@ -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,

View File

@@ -104,7 +104,7 @@
this.show = false;
this.on('mount', () => {
hljs.highlightBlock(this.refs.headers);
hljs.highlightBlock(this.$refs.headers);
});
this.toggle = () => {

View File

@@ -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(() => {

View File

@@ -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'));