Madeorsk/rudeshark.net
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Client] 良い感じに

Browse Source
This commit is contained in:
syuilo 2017-02-24 18:53:22 +09:00
parent eb783ca256
commit a1ab312c81
2 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/web/app/common/tags/messaging/room.tag
View File

@ -1,13 +1,12 @@
<mk-messaging-room> <mk-messaging-room>
<div class="stream"> <div class="stream">
<p class="initializing" if={ init }><i class="fa fa-spinner fa-spin"></i>読み込み中</p> <p class="init" if={ init }><i class="fa fa-spinner fa-spin"></i>読み込み中</p>
<p class="empty" if={ !init && messages.length == 0 }><i class="fa fa-info-circle"></i>このユーザーとまだ会話したことがありません</p> <p class="empty" if={ !init && messages.length == 0 }><i class="fa fa-info-circle"></i>このユーザーと話したことはありません</p>
<virtual each={ message, i in messages }> <virtual each={ message, i in messages }>
<mk-messaging-message message={ message }></mk-messaging-message> <mk-messaging-message message={ message }></mk-messaging-message>
<p class="date" if={ i != messages.length - 1 && message._date != messages[i + 1]._date }><span>{ messages[i + 1]._datetext }</span></p> <p class="date" if={ i != messages.length - 1 && message._date != messages[i + 1]._date }><span>{ messages[i + 1]._datetext }</span></p>
</virtual> </virtual>
</div> </div>
<div class="typings"></div>
<footer> <footer>
<div ref="notifications"></div> <div ref="notifications"></div>
<div class="grippie" title="ドラッグしてフォームの広さを調整"></div> <div class="grippie" title="ドラッグしてフォームの広さを調整"></div>
@ -132,6 +131,7 @@
this.init = true; this.init = true;
this.sending = false; this.sending = false;
this.messages = []; this.messages = [];
this.isNaked = this.opts.isNaked;
this.connection = new this.MessagingStreamConnection(this.I, this.user.id); this.connection = new this.MessagingStreamConnection(this.I, this.user.id);
@ -169,7 +169,7 @@
}); });
this.onMessage = (message) => { this.onMessage = (message) => {
const isbottom = this.isBottom(); const isBottom = this.isBottom();
this.messages.push(message); this.messages.push(message);
if (message.user_id != this.I.id && !document.hidden) { if (message.user_id != this.I.id && !document.hidden) {
@ -201,13 +201,22 @@
}; };
this.isBottom = () => { this.isBottom = () => {
const current = this.root.scrollTop + this.root.offsetHeight; const asobi = 32;
const max = this.root.scrollHeight; const current = this.isNaked
return current > (max - 32); ? window.scrollY + window.innerHeight
: this.root.scrollTop + this.root.offsetHeight;
const max = this.isNaked
? document.body.offsetHeight
: this.root.scrollHeight;
return current > (max - asobi);
}; };
this.scrollToBottom = () => { this.scrollToBottom = () => {
if (this.isNaked) {
window.scroll(0, document.body.offsetHeight);
} else {
this.root.scrollTop = this.root.scrollHeight; this.root.scrollTop = this.root.scrollHeight;
}
}; };
this.notify = message => { this.notify = message => {

2
src/web/app/mobile/tags/page/messaging-room.tag
View File

@ -1,6 +1,6 @@
<mk-messaging-room-page> <mk-messaging-room-page>
<mk-ui ref="ui"> <mk-ui ref="ui">
<mk-messaging-room if={ !parent.fetching } user={ parent.user }></mk-messaging-room> <mk-messaging-room if={ !parent.fetching } user={ parent.user } is-naked={ true }></mk-messaging-room>
</mk-ui> </mk-ui>
<style> <style>
:scope :scope