mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-29 07:18:13 +09:00
Code

#271

Browse Source
This commit is contained in:
syuilo 2017-06-13 03:42:24 +09:00
parent 72b7c84139
commit 7466ec3b0f
2 changed files with 88 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
src/web/app/mobile/tags/ui-header.tag
View File

@ -4,6 +4,7 @@
<div class="backdrop"></div>
<div class="content">
<button class="nav" onclick={ parent.toggleDrawer }><i class="fa fa-bars"></i></button>
<i class="fa fa-circle" if={ hasUnreadMessagingMessages }></i>
<h1 ref="title">Misskey</h1>
<button if={ func } onclick={ func }><i class="fa fa-{ funcIcon }"></i></button>
</div>
@ -74,6 +75,14 @@
> i
transition all 0.2s ease
> i
position absolute
top 8px
left 8px
pointer-events none
font-size 10px
color $theme-color
> button:last-child
display block
position absolute
@ -90,14 +99,46 @@
<script>
import ui from '../scripts/ui-event';
this.mixin('api');
this.mixin('stream');
this.func = null;
this.funcIcon = null;
this.on('mount', () => {
this.stream.on('read_all_messaging_messages', this.onReadAllMessagingMessages);
this.stream.on('unread_messaging_message', this.onUnreadMessagingMessage);
// Fetch count of unread messaging messages
this.api('messaging/unread').then(res => {
if (res.count > 0) {
this.update({
hasUnreadMessagingMessages: true
});
}
});
});
this.on('unmount', () => {
this.stream.off('read_all_messaging_messages', this.onReadAllMessagingMessages);
this.stream.off('unread_messaging_message', this.onUnreadMessagingMessage);
ui.off('title', this.setTitle);
ui.off('func', this.setFunc);
});
this.onReadAllMessagingMessages = () => {
this.update({
hasUnreadMessagingMessages: false
});
};
this.onUnreadMessagingMessage = () => {
this.update({
hasUnreadMessagingMessages: true
});
};
this.setTitle = title => {
this.refs.title.innerHTML = title;
};

55
src/web/app/mobile/tags/ui-nav.tag
View File

@ -7,18 +7,18 @@
</a>
<div class="links">
<ul>
<li class="home"><a href="/"><i class="icon fa fa-home"></i>%i18n:mobile.tags.mk-ui-nav.home%<i class="angle fa fa-angle-right"></i></a></li>
<li class="notifications"><a href="/i/notifications"><i class="icon fa fa-bell-o"></i>%i18n:mobile.tags.mk-ui-nav.notifications%<i class="angle fa fa-angle-right"></i></a></li>
<li class="messaging"><a href="/i/messaging"><i class="icon fa fa-comments-o"></i>%i18n:mobile.tags.mk-ui-nav.messaging%<i class="angle fa fa-angle-right"></i></a></li>
<li><a href="/"><i class="fa fa-home"></i>%i18n:mobile.tags.mk-ui-nav.home%<i class="fa fa-angle-right"></i></a></li>
<li><a href="/i/notifications"><i class="fa fa-bell-o"></i>%i18n:mobile.tags.mk-ui-nav.notifications%<i class="fa fa-angle-right"></i></a></li>
<li><a href="/i/messaging"><i class="fa fa-comments-o"></i>%i18n:mobile.tags.mk-ui-nav.messaging%<i class="i fa fa-circle" if={ hasUnreadMessagingMessages }></i><i class="fa fa-angle-right"></i></a></li>
</ul>
<ul>
<li class="settings"><a onclick={ search }><i class="icon fa fa-search"></i>%i18n:mobile.tags.mk-ui-nav.search%<i class="angle fa fa-angle-right"></i></a></li>
<li><a onclick={ search }><i class="fa fa-search"></i>%i18n:mobile.tags.mk-ui-nav.search%<i class="fa fa-angle-right"></i></a></li>
</ul>
<ul>
<li class="settings"><a href="/i/drive"><i class="icon fa fa-cloud"></i>%i18n:mobile.tags.mk-ui-nav.drive%<i class="angle fa fa-angle-right"></i></a></li>
<li><a href="/i/drive"><i class="fa fa-cloud"></i>%i18n:mobile.tags.mk-ui-nav.drive%<i class="fa fa-angle-right"></i></a></li>
</ul>
<ul>
<li class="settings"><a href="/i/settings"><i class="icon fa fa-cog"></i>%i18n:mobile.tags.mk-ui-nav.settings%<i class="angle fa fa-angle-right"></i></a></li>
<li><a href="/i/settings"><i class="fa fa-cog"></i>%i18n:mobile.tags.mk-ui-nav.settings%<i class="fa fa-angle-right"></i></a></li>
</ul>
</div>
<a href={ CONFIG.aboutUrl }><p class="about">%i18n:mobile.tags.mk-ui-nav.about%</p></a>
@ -94,10 +94,16 @@
color #777
text-decoration none
> .icon
> i:first-child
margin-right 0.5em
> .angle
> .i
margin-left 6px
vertical-align super
font-size 10px
color $theme-color
> i:last-child
position absolute
top 0
right 0
@ -120,6 +126,39 @@
<script>
this.mixin('i');
this.mixin('page');
this.mixin('api');
this.mixin('stream');
this.on('mount', () => {
this.stream.on('read_all_messaging_messages', this.onReadAllMessagingMessages);
this.stream.on('unread_messaging_message', this.onUnreadMessagingMessage);
// Fetch count of unread messaging messages
this.api('messaging/unread').then(res => {
if (res.count > 0) {
this.update({
hasUnreadMessagingMessages: true
});
}
});
});
this.on('unmount', () => {
this.stream.off('read_all_messaging_messages', this.onReadAllMessagingMessages);
this.stream.off('unread_messaging_message', this.onUnreadMessagingMessage);
});
this.onReadAllMessagingMessages = () => {
this.update({
hasUnreadMessagingMessages: false
});
};
this.onUnreadMessagingMessage = () => {
this.update({
hasUnreadMessagingMessages: true
});
};
this.search = () => {
const query = window.prompt('%i18n:mobile.tags.mk-ui-nav.search%');