This commit is contained in:
syuilo 2017-03-11 18:47:21 +09:00
parent ae53687b01
commit ff29e7bb14
4 changed files with 49 additions and 28 deletions

View file

@ -1,13 +1,19 @@
<mk-post-form-window>
<mk-window ref="window" is-modal={ true } colored={ true }><yield to="header"><span if={ !parent.opts.reply }>新規投稿</span><span if={ parent.opts.reply }>返信</span><span class="files" if={ parent.files.length != 0 }>添付: { parent.files.length }ファイル</span><span class="uploading-files" if={ parent.uploadingFiles.length != 0 }>{ parent.uploadingFiles.length }個のファイルをアップロード中
<mk-ellipsis></mk-ellipsis></span></yield>
<yield to="content">
<div class="ref" if={ parent.opts.reply }>
<mk-post-preview post={ parent.opts.reply }></mk-post-preview>
</div>
<div class="body">
<mk-post-form ref="form" reply={ parent.opts.reply }></mk-post-form>
</div></yield>
<mk-window ref="window" is-modal={ true } colored={ true }>
<yield to="header">
<span if={ !parent.opts.reply }>新規投稿</span>
<span if={ parent.opts.reply }>返信</span>
<span class="files" if={ parent.files.length != 0 }>添付: { parent.files.length }ファイル</span>
<span class="uploading-files" if={ parent.uploadingFiles.length != 0 }>{ parent.uploadingFiles.length }個のファイルをアップロード中<mk-ellipsis></mk-ellipsis></span>
</yield>
<yield to="content">
<div class="ref" if={ parent.opts.reply }>
<mk-post-preview post={ parent.opts.reply }></mk-post-preview>
</div>
<div class="body">
<mk-post-form ref="form" reply={ parent.opts.reply }></mk-post-form>
</div>
</yield>
</mk-window>
<style>
:scope
@ -48,13 +54,13 @@
this.refs.window.refs.form.on('change-uploading-files', files => {
this.update({
uploadingFiles: files
uploadingFiles: files || []
});
});
this.refs.window.refs.form.on('change-files', files => {
this.update({
files: files
files: files || []
});
});
});

View file

@ -4,11 +4,12 @@
<div class="medias { with: poll }" if={ files.length != 0 }>
<ul>
<li each={ files }>
<div class="img" style="background-image: url({ url + '?thumbnail&size=64' })" title={ name }></div><img class="remove" onclick={ _remove } src="/resources/desktop/remove.png" title="添付取り消し" alt=""/>
<div class="img" style="background-image: url({ url + '?thumbnail&size=64' })" title={ name }></div>
<img class="remove" onclick={ removeFile } src="/resources/desktop/remove.png" title="添付取り消し" alt=""/>
</li>
<li class="add" if={ files.length < 4 } title="PCからファイルを添付" onclick={ selectFile }><i class="fa fa-plus"></i></li>
</ul>
<p class="remain">残り{ 4 - files.length }</p>
<p class="remain">{ 4 - files.length }/4</p>
</div>
<mk-poll-editor if={ poll } ref="poll" ondestroy={ onPollDestroyed }></mk-poll-editor>
</div>
@ -334,10 +335,18 @@
this.autocomplete = new this.Autocomplete(this.refs.text);
this.autocomplete.attach();
// 書きかけの投稿を復元
let draft = localStorage.getItem('post-draft');
if (draft) {
draft = JSON.parse(draft);
this.refs.text.value = draft.text;
this.files = draft.files;
if (draft.poll) {
this.poll = true;
this.update();
this.refs.poll.set(draft.poll);
}
this.trigger('change-files', this.files);
this.update();
}
});
@ -418,17 +427,18 @@
};
this.addFile = file => {
file._remove = () => {
this.files = this.files.filter(x => x.id != file.id);
this.trigger('change-files', this.files);
this.update();
};
this.files.push(file);
this.trigger('change-files', this.files);
this.update();
};
this.removeFile = e => {
const file = e.item;
this.files = this.files.filter(x => x.id != file.id);
this.trigger('change-files', this.files);
this.update();
};
this.addPoll = () => {
this.poll = true;
};
@ -477,7 +487,7 @@
const context = {
text: this.refs.text.value,
files: this.files,
poll: this.poll ? this.refs.poll.get() : undefined
poll: this.poll && this.refs.poll ? this.refs.poll.get() : undefined
};
localStorage.setItem('post-draft', JSON.stringify(context));