Skip to content
Snippets Groups Projects
Commit 8f5bdd34 authored by syuilo's avatar syuilo
Browse files

#359

parent f51ad26f
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
locales/en.yml
+ 4
− 0
View file @ 8f5bdd34
......@@ -236,6 +236,9 @@ desktop:
add-reaction: "Add your reaction"
detail: "Show detail"
mk-notifications:
more: "More"
mk-notifications-home-widget:
title: "Notifications"
settings: "Notification settings"
......@@ -356,6 +359,7 @@ mobile:
empty-timeline: "There is no posts"
mk-notifications:
more: "More"
empty: "No notifications"
mk-post-detail:
......
locales/ja.yml
+ 4
− 0
View file @ 8f5bdd34
......@@ -236,6 +236,9 @@ desktop:
add-reaction: "リアクション"
detail: "詳細"
mk-notifications:
more: "もっと見る"
mk-notifications-home-widget:
title: "通知"
settings: "通知の設定"
......@@ -356,6 +359,7 @@ mobile:
empty-timeline: "表示する投稿がありません。誰かしらをフォローするなどしましょう。"
mk-notifications:
more: "もっと見る"
empty: "ありません！"
mk-post-detail:
......
src/web/app/desktop/tags/notifications.tag
+ 50
− 7
View file @ 8f5bdd34
......@@ -63,8 +63,11 @@
<p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span><i class="fa fa-angle-up"></i>{ notification._datetext }</span><span><i class="fa fa-angle-down"></i>{ notifications[i + 1]._datetext }</span></p>
</virtual>
</div>
<button class="more" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }>
{ fetchingMoreNotifications ? '%i18n:common.loading%' : '%i18n:desktop.tags.mk-notifications.more%' }
</button>
<p class="empty" if={ notifications.length == 0 && !loading }>ありません！</p>
<p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>読み込んでいます<mk-ellipsis/></p>
<p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>%i18n:common.loading%<mk-ellipsis/></p>
<style>
:scope
display block
......@@ -168,6 +171,12 @@
i
margin-right 8px
> .more
display block
width 100%
padding 16px
color #555
> .empty
margin 0
padding 16px
......@@ -197,7 +206,16 @@
this.loading = true;
this.on('mount', () => {
this.api('i/notifications').then(notifications => {
const max = 10;
this.api('i/notifications', {
limit: max + 1
}).then(notifications => {
if (notifications.length == max + 1) {
this.moreNotifications = true;
notifications.pop();
}
this.update({
loading: false,
notifications: notifications
......@@ -211,11 +229,6 @@
this.stream.off('notification', this.onNotification);
});
this.onNotification = notification => {
this.notifications.unshift(notification);
this.update();
};
this.on('update', () => {
this.notifications.forEach(notification => {
const date = new Date(notification.created_at).getDate();
......@@ -224,5 +237,35 @@
notification._datetext = `${month}月 ${date}日`;
});
});
this.onNotification = notification => {
this.notifications.unshift(notification);
this.update();
};
this.fetchMoreNotifications = () => {
this.update({
fetchingMoreNotifications: true
});
const max = 30;
this.api('i/notifications', {
folder_id: this.folder ? this.folder.id : null,
limit: max + 1,
max_id: this.notifications[this.notifications.length - 1]._id
}).then(notifications => {
if (notifications.length == max + 1) {
this.moreNotifications = true;
notifications.pop();
} else {
this.moreNotifications = false;
}
this.update({
notifications: this.notifications.concat(notifications),
fetchingMoreNotifications: false
});
});
};
</script>
</mk-notifications>
src/web/app/mobile/tags/notifications.tag
+ 49
− 6
View file @ 8f5bdd34
......@@ -5,6 +5,9 @@
<p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span><i class="fa fa-angle-up"></i>{ notification._datetext }</span><span><i class="fa fa-angle-down"></i>{ notifications[i + 1]._datetext }</span></p>
</virtual>
</div>
<button class="more" if={ moreNotifications } onclick={ fetchMoreNotifications } disabled={ fetchingMoreNotifications }>
{ fetchingMoreNotifications ? '%i18n:common.loading%' : '%i18n:mobile.tags.mk-notifications.more%' }
</button>
<p class="empty" if={ notifications.length == 0 && !loading }>%i18n:mobile.tags.mk-notifications.empty%</p>
<p class="loading" if={ loading }><i class="fa fa-spinner fa-pulse fa-fw"></i>%i18n:common.loading%<mk-ellipsis/></p>
<style>
......@@ -38,6 +41,12 @@
i
margin-right 8px
> .more
display block
width 100%
padding 16px
color #555
> .empty
margin 0
padding 16px
......@@ -65,7 +74,16 @@
this.loading = true;
this.on('mount', () => {
this.api('i/notifications').then(notifications => {
const max = 10;
this.api('i/notifications', {
limit: max + 1
}).then(notifications => {
if (notifications.length == max + 1) {
this.moreNotifications = true;
notifications.pop();
}
this.update({
loading: false,
notifications: notifications
......@@ -81,11 +99,6 @@
this.stream.off('notification', this.onNotification);
});
this.onNotification = notification => {
this.notifications.unshift(notification);
this.update();
};
this.on('update', () => {
this.notifications.forEach(notification => {
const date = new Date(notification.created_at).getDate();
......@@ -94,5 +107,35 @@
notification._datetext = `${month}月 ${date}日`;
});
});
this.onNotification = notification => {
this.notifications.unshift(notification);
this.update();
};
this.fetchMoreNotifications = () => {
this.update({
fetchingMoreNotifications: true
});
const max = 30;
this.api('i/notifications', {
folder_id: this.folder ? this.folder.id : null,
limit: max + 1,
max_id: this.notifications[this.notifications.length - 1]._id
}).then(notifications => {
if (notifications.length == max + 1) {
this.moreNotifications = true;
notifications.pop();
} else {
this.moreNotifications = false;
}
this.update({
notifications: this.notifications.concat(notifications),
fetchingMoreNotifications: false
});
});
};
</script>
</mk-notifications>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment