wip
This commit is contained in:
parent
0350673862
commit
65d03dc9da
4 changed files with 143 additions and 140 deletions
|
@ -305,161 +305,159 @@
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
get-cat = require('../../common/scripts/get-cat');
|
getCat = require('../../common/scripts/get-cat');
|
||||||
|
|
||||||
this.mixin('api');
|
this.mixin('api');
|
||||||
this.mixin('notify');
|
this.mixin('notify');
|
||||||
this.mixin('autocomplete');
|
this.mixin('autocomplete');
|
||||||
|
|
||||||
this.wait = false
|
this.wait = false;
|
||||||
this.uploadings = []
|
this.uploadings = [];
|
||||||
this.files = []
|
this.files = [];
|
||||||
this.autocomplete = null
|
this.autocomplete = null;
|
||||||
this.poll = false
|
this.poll = false;
|
||||||
|
|
||||||
this.in-reply-to-post = this.opts.reply
|
this.inReplyToPost = this.opts.reply;
|
||||||
|
|
||||||
// https://github.com/riot/riot/issues/2080
|
// https://github.com/riot/riot/issues/2080
|
||||||
if @in-reply-to-post == '' then this.in-reply-to-post = null
|
if (this.inReplyToPost == '') this.inReplyToPost = null;
|
||||||
|
|
||||||
this.on('mount', () => {
|
this.on('mount', () => {
|
||||||
this.refs.uploader.on('uploaded', (file) => {
|
this.refs.uploader.on('uploaded', file => {
|
||||||
this.addFile file
|
this.addFile(file);
|
||||||
|
});
|
||||||
|
|
||||||
this.refs.uploader.on('change-uploads', (uploads) => {
|
this.refs.uploader.on('change-uploads', uploads => {
|
||||||
this.trigger 'change-uploading-files' uploads
|
this.trigger('change-uploading-files', uploads);
|
||||||
|
});
|
||||||
|
|
||||||
this.autocomplete = new @Autocomplete this.refs.text
|
this.autocomplete = new this.Autocomplete(this.refs.text);
|
||||||
@autocomplete.attach!
|
this.autocomplete.attach();
|
||||||
|
});
|
||||||
|
|
||||||
this.on('unmount', () => {
|
this.on('unmount', () => {
|
||||||
@autocomplete.detach!
|
this.autocomplete.detach();
|
||||||
|
});
|
||||||
|
|
||||||
this.focus = () => {
|
this.focus = () => {
|
||||||
this.refs.text.focus();
|
this.refs.text.focus();
|
||||||
|
};
|
||||||
|
|
||||||
this.clear = () => {
|
this.clear = () => {
|
||||||
this.refs.text.value = ''
|
this.refs.text.value = '';
|
||||||
this.files = []
|
this.files = [];
|
||||||
this.trigger('change-files');
|
this.trigger('change-files');
|
||||||
this.update();
|
this.update();
|
||||||
|
};
|
||||||
|
|
||||||
this.ondragover = (e) => {
|
this.ondragover = e => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
this.draghover = true
|
this.draghover = true;
|
||||||
// ドラッグされてきたものがファイルだったら
|
e.dataTransfer.dropEffect = e.dataTransfer.effectAllowed == 'all' ? 'copy' : 'move';
|
||||||
if e.dataTransfer.effectAllowed == 'all'
|
return false;
|
||||||
e.dataTransfer.dropEffect = 'copy'
|
};
|
||||||
else
|
|
||||||
e.dataTransfer.dropEffect = 'move'
|
|
||||||
return false
|
|
||||||
|
|
||||||
this.ondragenter = (e) => {
|
this.ondragenter = e => {
|
||||||
this.draghover = true
|
this.draghover = true;
|
||||||
|
};
|
||||||
|
|
||||||
this.ondragleave = (e) => {
|
this.ondragleave = e => {
|
||||||
this.draghover = false
|
this.draghover = false;
|
||||||
|
};
|
||||||
|
|
||||||
this.ondrop = (e) => {
|
this.ondrop = e => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
this.draghover = false
|
this.draghover = false;
|
||||||
|
|
||||||
// ファイルだったら
|
// ファイルだったら
|
||||||
if e.dataTransfer.files.length > 0
|
if (e.dataTransfer.files.length > 0) {
|
||||||
Array.prototype.forEach.call e.dataTransfer.files, (file) =>
|
e.dataTransfer.files.forEach(this.upload);
|
||||||
@upload file
|
}
|
||||||
return false
|
|
||||||
|
|
||||||
// データ取得
|
return false;
|
||||||
data = e.dataTransfer.get-data 'text'
|
};
|
||||||
if !data?
|
|
||||||
return false
|
|
||||||
|
|
||||||
try
|
this.onkeydown = e => {
|
||||||
// パース
|
if ((e.which == 10 || e.which == 13) && (e.ctrlKey || e.meta-key)) this.post();
|
||||||
obj = JSON.parse data
|
};
|
||||||
|
|
||||||
// (ドライブの)ファイルだったら
|
this.onpaste = e => {
|
||||||
if obj.type == 'file'
|
e.clipboardData.items.forEach(item => {
|
||||||
this.addFile obj.file
|
if (item.kind == 'file') {
|
||||||
catch
|
this.upload(item.getAsFile());
|
||||||
// ignore
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
return false
|
this.selectFile = () => {
|
||||||
|
|
||||||
this.onkeydown = (e) => {
|
|
||||||
if (e.which == 10 || e.which == 13) && (e.ctrlKey || e.meta-key)
|
|
||||||
this.post!
|
|
||||||
|
|
||||||
this.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.getAsFile();
|
|
||||||
|
|
||||||
this.select-file = () => {
|
|
||||||
this.refs.file.click();
|
this.refs.file.click();
|
||||||
|
};
|
||||||
|
|
||||||
this.select-file-from-drive = () => {
|
this.selectFileFromDrive = () => {
|
||||||
browser = document.body.appendChild(document.createElement('mk-select-file-from-drive-window'));
|
const i = riot.mount(document.body.appendChild(document.createElement('mk-select-file-from-drive-window')), {
|
||||||
i = riot.mount browser, do
|
|
||||||
multiple: true
|
multiple: true
|
||||||
i[0].one 'selected' (files) =>
|
})[0];
|
||||||
files.forEach this.addFile
|
i.one('selected', files => {
|
||||||
|
files.forEach(this.addFile);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
this.change-file = () => {
|
this.changeFile = () => {
|
||||||
files = this.refs.file.files
|
this.refs.file.files.forEach(this.upload);
|
||||||
for i from 0 to files.length - 1
|
};
|
||||||
file = files.item i
|
|
||||||
@upload file
|
|
||||||
|
|
||||||
this.upload = (file) => {
|
this.upload = file => {
|
||||||
this.refs.uploader.upload file
|
this.refs.uploader.upload(file);
|
||||||
|
};
|
||||||
|
|
||||||
this.add-file = (file) => {
|
this.addFile = file => {
|
||||||
file._remove = =>
|
file._remove = () => {
|
||||||
this.files = this.files.filter (x) -> x.id != file.id
|
this.files = this.files.filter(x => x.id != file.id);
|
||||||
this.trigger 'change-files' this.files
|
this.trigger('change-files', this.files);
|
||||||
this.update();
|
this.update();
|
||||||
|
};
|
||||||
|
|
||||||
this.files.push file
|
this.files.push(file);
|
||||||
this.trigger 'change-files' this.files
|
this.trigger('change-files', this.files);
|
||||||
this.update();
|
this.update();
|
||||||
|
};
|
||||||
|
|
||||||
this.add-poll = () => {
|
this.addPoll = () => {
|
||||||
this.poll = true
|
this.poll = true;
|
||||||
|
};
|
||||||
|
|
||||||
this.on-poll-destroyed = () => {
|
this.onPollDestroyed = () => {
|
||||||
@update do
|
this.update({
|
||||||
poll: false
|
poll: false
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
this.post = (e) => {
|
this.post = e => {
|
||||||
this.wait = true
|
this.wait = true;
|
||||||
|
|
||||||
files = if this.files? and this.files.length > 0
|
const files = this.files && this.files.length > 0
|
||||||
then this.files.map (f) -> f.id
|
? this.files.map(f => f.id)
|
||||||
else undefined
|
: undefined;
|
||||||
|
|
||||||
this.api('posts/create', {
|
this.api('posts/create', {
|
||||||
text: this.refs.text.value
|
text: this.refs.text.value,
|
||||||
media_ids: files
|
media_ids: files,
|
||||||
reply_to_id: if @in-reply-to-post? then @in-reply-to-post.id else undefined
|
reply_to_id: this.inReplyToPost ? this.inReplyToPost.id : undefined,
|
||||||
poll: if this.poll then this.refs.poll.get! else undefined
|
poll: this.poll ? this.refs.poll.get() : undefined
|
||||||
}).then((data) => {
|
}).then(data => {
|
||||||
this.trigger('post');
|
this.trigger('post');
|
||||||
@notify if @in-reply-to-post? then '返信しました!' else '投稿しました!'
|
this.notify(this.inReplyToPost ? '返信しました!' : '投稿しました!');
|
||||||
.catch (err) =>
|
}).catch(err => {
|
||||||
console.error err
|
this.notify('投稿できませんでした');
|
||||||
@notify '投稿できませんでした'
|
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
this.wait = false
|
this.update({
|
||||||
this.update();
|
wait: false
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
this.cat = () => {
|
this.cat = () => {
|
||||||
this.refs.text.value = this.refs.text.value + get-cat!
|
this.refs.text.value += getCat();
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
</mk-post-form>
|
</mk-post-form>
|
||||||
|
|
|
@ -18,8 +18,11 @@
|
||||||
this.on('mount', () => {
|
this.on('mount', () => {
|
||||||
this.refs.window.on('closed', () => {
|
this.refs.window.on('closed', () => {
|
||||||
this.unmount();
|
this.unmount();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
this.close = () => {
|
this.close = () => {
|
||||||
this.refs.window.close();
|
this.refs.window.close();
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
</mk-settings-window>
|
</mk-settings-window>
|
||||||
|
|
|
@ -47,11 +47,6 @@
|
||||||
<p>読み込みを高速化する</p>
|
<p>読み込みを高速化する</p>
|
||||||
<p>API通信時に新鮮なユーザー情報をキャッシュすることでフェッチのオーバーヘッドを無くします。(実験的)</p>
|
<p>API通信時に新鮮なユーザー情報をキャッシュすることでフェッチのオーバーヘッドを無くします。(実験的)</p>
|
||||||
</label>
|
</label>
|
||||||
<label class="checkbox">
|
|
||||||
<input type="checkbox" checked={ I.data.debug } onclick={ updateDebug }/>
|
|
||||||
<p>開発者モード</p>
|
|
||||||
<p>デバッグ等の開発者モードを有効にします。</p>
|
|
||||||
</label>
|
|
||||||
<label class="checkbox">
|
<label class="checkbox">
|
||||||
<input type="checkbox" checked={ I.data.nya } onclick={ updateNya }/>
|
<input type="checkbox" checked={ I.data.nya } onclick={ updateNya }/>
|
||||||
<p><i>な</i>を<i>にゃ</i>に変換する</p>
|
<p><i>な</i>を<i>にゃ</i>に変換する</p>
|
||||||
|
@ -200,44 +195,47 @@
|
||||||
<script>
|
<script>
|
||||||
this.mixin('i');
|
this.mixin('i');
|
||||||
this.mixin('api');
|
this.mixin('api');
|
||||||
|
this.mixin('notify');
|
||||||
this.mixin('dialog');
|
this.mixin('dialog');
|
||||||
this.mixin('update-avatar');
|
this.mixin('update-avatar');
|
||||||
|
|
||||||
this.page = 'account'
|
this.page = 'account';
|
||||||
|
|
||||||
this.set-page = (page) => {
|
this.setPage = page => {
|
||||||
this.page = page
|
this.page = page;
|
||||||
|
};
|
||||||
|
|
||||||
this.avatar = () => {
|
this.avatar = () => {
|
||||||
@update-avatar this.I
|
this.updateAvatar(this.I);
|
||||||
|
};
|
||||||
|
|
||||||
this.update-account = () => {
|
this.updateAccount = () => {
|
||||||
this.api('i/update', {
|
this.api('i/update', {
|
||||||
name: this.refs.account-name.value
|
name: this.refs.accountName.value,
|
||||||
location: this.refs.account-location.value
|
location: this.refs.accountLocation.value,
|
||||||
bio: this.refs.account-bio.value
|
bio: this.refs.accountBio.value,
|
||||||
birthday: this.refs.account-birthday.value
|
birthday: this.refs.accountBirthday.value
|
||||||
}).then((i) => {
|
}).then(() => {
|
||||||
alert 'ok'
|
this.notify('プロフィールを更新しました');
|
||||||
.catch (err) =>
|
});
|
||||||
console.error err
|
};
|
||||||
|
|
||||||
this.update-cache = () => {
|
this.updateCache = () => {
|
||||||
this.I.data.cache = !this.I.data.cache
|
this.I.data.cache = !this.I.data.cache;
|
||||||
this.api('i/appdata/set', {
|
this.api('i/appdata/set', {
|
||||||
data: JSON.stringify do
|
data: JSON.stringify({
|
||||||
cache: this.I.data.cache
|
cache: this.I.data.cache
|
||||||
|
})
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
this.update-debug = () => {
|
this.updateNya = () => {
|
||||||
this.I.data.debug = !this.I.data.debug
|
this.I.data.nya = !this.I.data.nya;
|
||||||
this.api('i/appdata/set', {
|
this.api('i/appdata/set', {
|
||||||
data: JSON.stringify do
|
data: JSON.stringify({
|
||||||
debug: this.I.data.debug
|
|
||||||
|
|
||||||
this.update-nya = () => {
|
|
||||||
this.I.data.nya = !this.I.data.nya
|
|
||||||
this.api('i/appdata/set', {
|
|
||||||
data: JSON.stringify do
|
|
||||||
nya: this.I.data.nya
|
nya: this.I.data.nya
|
||||||
|
})
|
||||||
|
});
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
</mk-settings>
|
</mk-settings>
|
||||||
|
|
|
@ -32,23 +32,27 @@
|
||||||
this.on('before-mount', () => {
|
this.on('before-mount', () => {
|
||||||
this.state = this.getStreamState();
|
this.state = this.getStreamState();
|
||||||
|
|
||||||
if this.state == 'connected'
|
if (this.state == 'connected') {
|
||||||
this.root.style.opacity = 0
|
this.root.style.opacity = 0;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
this.stream-state-ev.on('connected', () => {
|
this.streamStateEv.on('connected', () => {
|
||||||
this.state = this.getStreamState();
|
this.state = this.getStreamState();
|
||||||
this.update();
|
this.update();
|
||||||
setTimeout =>
|
setTimeout(() => {
|
||||||
Velocity(this.root, {
|
Velocity(this.root, {
|
||||||
opacity: 0
|
opacity: 0
|
||||||
} 200ms 'linear'
|
}, 200, 'linear');
|
||||||
, 1000ms
|
}, 1000);
|
||||||
|
});
|
||||||
|
|
||||||
this.stream-state-ev.on('closed', () => {
|
this.streamStateEv.on('closed', () => {
|
||||||
this.state = this.getStreamState();
|
this.state = this.getStreamState();
|
||||||
this.update();
|
this.update();
|
||||||
Velocity(this.root, {
|
Velocity(this.root, {
|
||||||
opacity: 1
|
opacity: 1
|
||||||
} 0ms
|
}, 0);
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
</mk-stream-indicator>
|
</mk-stream-indicator>
|
||||||
|
|
Loading…
Reference in a new issue