+
@@ -7,9 +7,9 @@
{{$props.username}}
{{status.statusName}}
-
+
- {{notificationss}}
+ {{notifications}}
@@ -36,6 +36,10 @@ export default {
},
async openChat() {
bus.$emit('closeLeftMenu');
+ // dismiss notification if exists
+ if (this.notifications && this.notifications >= 1 && document.hasFocus()) {
+ this.$socket.emit('notification:dismiss', {channelID: this.channelID});
+ }
this.$store.dispatch('selectedChannelID', this.$props.channelID);
this.$store.dispatch('setChannelName', this.$props.username);
if (this.$store.getters.channels[this.$props.channelID] && !this.$store.getters.messages[this.$props.channelID]) return this.getMessages();
@@ -50,12 +54,12 @@ export default {
}
},
computed: {
- notificationss () {
+ notifications () {
const channelID = this.$props.channelID;
const notifications = this.$store.getters.notifications.find(function(e) {
return e.channelID == channelID
})
- if (!notifications) return;
+ if (!notifications || (this.$props.channelID === this.$store.getters.selectedChannelID && document.hasFocus())) return;
return notifications.count;
},
user() {
diff --git a/src/messageFormatter.js b/src/messageFormatter.js
new file mode 100644
index 0000000..eb35eb5
--- /dev/null
+++ b/src/messageFormatter.js
@@ -0,0 +1,56 @@
+import futoji from 'futoji'
+
+export default (message) => {
+ message = escapeHtml(message)
+
+ futoji.addTransformer({
+ name: 'bold-and-italic',
+ symbol: '***',
+ transformer: text => `
${text}`
+ })
+
+ futoji.addTransformer({
+ name: 'bold',
+ symbol: '**',
+ transformer: text => `
${text}`
+ })
+
+ futoji.addTransformer({
+ name: 'italic',
+ symbol: '*',
+ transformer: text => `
${text}`
+ })
+
+ futoji.addTransformer({
+ name: 'underline',
+ symbol: '__',
+ transformer: text => `
${text}`
+ })
+ futoji.addTransformer({
+ name: 'srike',
+ symbol: '~~',
+ transformer: text => `
${text.trim()}`
+ })
+
+ futoji.addTransformer({
+ name: 'code-block',
+ symbol: '``\`',
+ transformer: text => `
${text.trim()}
`
+ })
+
+ futoji.addTransformer({
+ name: 'code',
+ symbol: '`',
+ transformer: text => `
${text}`
+ })
+ return futoji.format(message);
+}
+
+function escapeHtml(unsafe) {
+ return unsafe
+ .replace(/&/g, "&")
+ .replace(//g, ">")
+ .replace(/"/g, """)
+ .replace(/'/g, "'");
+ }
\ No newline at end of file
diff --git a/src/notificationSound.js b/src/notificationSound.js
new file mode 100644
index 0000000..e845244
--- /dev/null
+++ b/src/notificationSound.js
@@ -0,0 +1,13 @@
+import notificationSound from '@/assets/sounds/Notification.mp3';
+import newFriendSound from '@/assets/sounds/FriendRequest.mp3';
+
+export default {
+ notification: () => {
+ const audio = new Audio(notificationSound);
+ audio.play();
+ },
+ newFriend: () => {
+ const audio = new Audio(newFriendSound);
+ audio.play();
+ }
+}
\ No newline at end of file
diff --git a/src/store/modules/notificationsModule.js b/src/store/modules/notificationsModule.js
index 3ab252a..112a3ec 100644
--- a/src/store/modules/notificationsModule.js
+++ b/src/store/modules/notificationsModule.js
@@ -1,6 +1,7 @@
import {bus} from '../../main'
import {router} from './../../router'
import Vue from 'vue';
+import NotificationSounds from '@/notificationSound';
const state = {
notifications: []
@@ -18,8 +19,13 @@ const actions = {
},
messageCreatedNotification(context, notification) {
const {guildID, channelID, lastMessageID, sender} = notification;
-
-
+ if (!document.hasFocus())
+ bus.$emit('title:change', "Someone sent a message.");
+
+ // dont display a notification if the channel is selected.
+ if (context.rootState.channelModule.selectedChannelID !== channelID || !document.hasFocus()) {
+ NotificationSounds.notification();
+ }
let find = context.state.notifications.find(item => {
return item.channelID === channelID
})
@@ -28,10 +34,22 @@ const actions = {
}
context.commit('messageCreatedNotification', {exists: false, notification: {channelID, lastMessageID, sender, count: 1}});
+ },
+ dismissNotification(context, channelID) {
+ const notifications = context.state.notifications
+ for (let index = 0; index < notifications.length; index++) {
+ if (notifications[index].channelID === channelID){
+ context.commit('dismissNotification', index)
+ break;
+ }
+ }
}
}
const mutations = {
+ dismissNotification(state, index) {
+ Vue.delete(state.notifications, index)
+ },
addAllNotifications(state, notifications){
Vue.set(state, 'notifications', notifications);
},
diff --git a/src/store/modules/socketIOModule.js b/src/store/modules/socketIOModule.js
index 6e4b1bc..e7c0b98 100644
--- a/src/store/modules/socketIOModule.js
+++ b/src/store/modules/socketIOModule.js
@@ -1,5 +1,6 @@
import {bus} from '../../main'
import {router} from './../../router'
+import Vue from 'vue';
const state = {
@@ -64,6 +65,9 @@ const actions = {
tempID: data.tempID
})
}
+ if (context.rootState.channelModule.selectedChannelID == data.message.channelID && document.hasFocus()) {
+ this._vm.$socket.emit('notification:dismiss', {channelID: data.message.channelID});
+ }
// send notification if other users message the recipient
if (data.message.creator.uniqueID === context.getters.user.uniqueID) return;
const notification = {
@@ -92,6 +96,10 @@ const actions = {
const {channel} = data;
// rename to 'channel' to setchannel
context.dispatch('channel', channel);
+ },
+ ['socket_notification:dismiss'](context, data){
+ const {channelID} = data;
+ context.dispatch('dismissNotification', channelID);
}
}
diff --git a/src/store/modules/userModule.js b/src/store/modules/userModule.js
index 16a4c2c..70631f4 100644
--- a/src/store/modules/userModule.js
+++ b/src/store/modules/userModule.js
@@ -2,6 +2,7 @@ import axios from 'axios'
import Vue from 'vue'
import {bus} from '../../main'
import VueRouter from 'vue-router';
+import NotificationSounds from '@/notificationSound';
const state = {
token: localStorage.getItem('hauthid') || null,
@@ -77,6 +78,10 @@ const mutations = {
friends[friend.recipient.uniqueID] = friend;
state.user.friends = Object.assign({}, friends)
+
+ if (friend.status == 1) {
+ NotificationSounds.newFriend();
+ }
},
removeFriend(state, uniqueID) {
const friends = state.user.friends;
diff --git a/src/views/App.vue b/src/views/App.vue
index 773465f..90d5897 100644
--- a/src/views/App.vue
+++ b/src/views/App.vue
@@ -1,6 +1,6 @@
-
+
@@ -37,7 +37,8 @@ export default {
data() {
return {
showLeftPanel: false,
- showSettings: false
+ showSettings: false,
+ title: "Nertivia"
}
},
methods: {
@@ -62,6 +63,9 @@ export default {
bus.$on('closeSettings', () => {
this.showSettings = false;
})
+ bus.$on('title:change', (title) => {
+ this.title = title;
+ })
},
computed: {
loggedIn() {
diff --git a/src/views/HomePage.vue b/src/views/HomePage.vue
index f35ab92..2cb9dd5 100644
--- a/src/views/HomePage.vue
+++ b/src/views/HomePage.vue
@@ -1,6 +1,6 @@