dan/Nertivia-Client
1
0
Fork 0
mirror of https://github.com/danbulant/Nertivia-Client synced 2026-06-16 04:51:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #8 from Brecert/LintFixes

Browse source 
Lint fixes
This commit is contained in:
Supertiger 2019-07-10 16:26:44 +01:00 committed by GitHub
commit 8c0678d72b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
61 changed files with 1974 additions and 1003 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.eslintrc.js
View file

@ -14,6 +14,7 @@ module.exports = {
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"parser": "babel-eslint",
"ecmaVersion": 2018
},
"plugins": [

4
package-lock.json generated
View file

@ -1,6 +1,6 @@
{
"name": "chatlol",
"version": "0.1.0",
"name": "nertivia-client",
"version": "0.4.7",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

4
package.json
View file

@ -30,13 +30,13 @@
"vuex": "^3.0.1"
},
"devDependencies": {
"@babel/core": "^7.5.0",
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
"@vue/cli-plugin-babel": "^3.0.5",
"@vue/cli-plugin-eslint": "^3.0.5",
"@vue/cli-service": "^3.6.0",
"@vue/eslint-plugin": "^4.2.0",
"babel-eslint": "^10.0.1",
"eslint": "^5.8.0",
"babel-eslint": "^10.0.2",
"eslint-plugin-vue": "^5.0.0-0",
"vue-template-compiler": "^2.5.17"
},

2
src/Main.vue
View file

@ -1,6 +1,6 @@
<template>
<div id="app">
<router-view></router-view>
<router-view />
</div>
</template>

14
src/components/Button.vue
View file

@ -1,7 +1,15 @@
<template>
<button type="submit" :disabled="$props.loading">
<div class="loading-icon" v-if="$props.loading" ></div>
<div class="text">{{$props.message}}</div>
<button
type="submit"
:disabled="$props.loading"
>
<div
v-if="$props.loading"
class="loading-icon"
/>
<div class="text">
{{ $props.message }}
</div>
</button>
</template>

50
src/components/ChangeLog.vue
View file

@ -1,42 +1,70 @@
<template>
<div class="change-log">
<div class="inner">
<div class="close-button" @click="close">
<div
class="close-button"
@click="close"
>
<i class="material-icons">
close
</i>
</div>
<div class="change-title">Change Log <div class="changelog-icon"><i class="material-icons ">update</i></div></div>
<div class="change-title">
Change Log <div class="changelog-icon">
<i class="material-icons ">update</i>
</div>
</div>
<div class="change-list">
<div class="change" v-for="change in changelog" :key="change.title">
<div class="date">{{change.date}}</div>
<div class="changes-title">{{change.title}}</div>
<div
v-for="change in changelog"
:key="change.title"
class="change"
>
<div class="date">
{{ change.date }}
</div>
<div class="changes-title">
{{ change.title }}
</div>
<div class="information">
<div v-if="change.new">
<strong>What's new?</strong><br>
<ul>
<li v-for="(wnew, index) in change.new" :key="index">{{wnew}}</li>
<li
v-for="(wnew, index) in change.new"
:key="index"
>
{{ wnew }}
</li>
</ul>
</div>
<div v-if="change.fix">
<strong>Issues fixed</strong><br>
<ul>
<li v-for="(wfix, index) in change.fix" :key="index">{{wfix}}</li>
<li
v-for="(wfix, index) in change.fix"
:key="index"
>
{{ wfix }}
</li>
</ul>
</div>
<div v-if="change.next">
<strong>Up next</strong><br>
<ul>
<li v-for="(wnext, index) in change.next" :key="index">{{wnext}}</li>
<li
v-for="(wnext, index) in change.next"
:key="index"
>
{{ wnext }}
</li>
</ul>
</div>
<div v-if="change.msg">
{{change.msg}}
{{ change.msg }}
</div>
</div>
</div>
</div>
</div>
</div>

15
src/components/ElectronJS/FrameButtons.vue
View file

@ -1,12 +1,21 @@
<template>
<div class="frame-buttons">
<div class="minimize" @click="minimizeWindow()">
<div
class="minimize"
@click="minimizeWindow()"
>
<i class="material-icons">minimize</i>
</div>
<div class="res-max" @click="maximizeWindow()">
<div
class="res-max"
@click="maximizeWindow()"
>
<i class="material-icons">check_box_outline_blank</i>
</div>
<div class="close" @click="closeWindow()">
<div
class="close"
@click="closeWindow()"
>
<i class="material-icons">close</i>
</div>
</div>

11
src/components/HeaderLoginTemplate.vue
View file

@ -1,10 +1,15 @@
<template>
<transition name="fade-in" appear >
<transition
name="fade-in"
appear
>
<div class="header">
<div class="cat">
<div class="eyes"></div>
<div class="eyes" />
</div>
<div class="title">
Nertivia
</div>
<div class="title">Nertivia</div>
</div>
</transition>
</template>

2
src/components/ParticlesJS.vue
View file

@ -1,5 +1,5 @@
<template>
<div id="particles-js"></div>
<div id="particles-js" />
</template>
<script>

2
src/components/ProfilePictureTemplate.vue
View file

@ -13,7 +13,7 @@
<div
:class="`inner-profile-picture ${$props.hover ? 'hoverable' : ''}`"
:style="`${status || status === 0 ? 'border: solid 3px ' + statusColor.statusColor : ''}; height: ${$props.size}; width: ${$props.size}; background-image: url(${$props.url})`"
></div>
/>
</div>
</div>
</template>

7
src/components/Recaptcha.vue
View file

@ -1,5 +1,10 @@
<template>
<vue-recaptcha ref="recaptcha" :sitekey="sitekey" theme="dark" @verify="submit"></vue-recaptcha>
<vue-recaptcha
ref="recaptcha"
:sitekey="sitekey"
theme="dark"
@verify="submit"
/>
</template>
<script>

12
src/components/Spinner.vue
View file

@ -1,7 +1,15 @@
<template>
<div class="loading-screen">
<div class="loading-animation" :style="`height: ${size}px ; width: ${size}px ;`"></div>
<div class="title" v-if="msg">{{$props.msg}}</div>
<div
class="loading-animation"
:style="`height: ${size}px ; width: ${size}px ;`"
/>
<div
v-if="msg"
class="title"
>
{{ $props.msg }}
</div>
</div>
</template>

8
src/components/app/ConnectingScreen.vue
View file

@ -2,10 +2,12 @@
<div class="connecting-screen">
<div class="center-box">
<div class="cat-face">
<div class="eyes"></div>
<div class="animation"></div>
<div class="eyes" />
<div class="animation" />
</div>
<div class="message">
Connecting...
</div>
<div class="message">Connecting...</div>
</div>
</div>
</template>

84
src/components/app/EmojiPanels/emojiPanel.vue
View file

@ -1,20 +1,25 @@
<template>
<div class="emoji-panel" v-click-outside="closePanel">
<div
v-click-outside="closePanel"
class="emoji-panel"
>
<div class="emoji-panel-inner">
<div class="emojis-list">
<!-- Recent Emojis Category -->
<div class="category">
<div class="category-name">Recent</div>
<div class="category-name">
Recent
</div>
<div class="list">
<div
class="emoji-item"
v-for="(recentEmoji, index) in this.recentEmojisList"
:key="index"
class="emoji-item"
@click="emojiClickEvent(recentEmoji)"
>
<img
class="panel emoji"
v-lazyload
class="panel emoji"
:data-url=" getCustomEmoji(recentEmoji) || emojiShortcodeToPath(':' + recentEmoji + ':')"
>
</div>
@ -23,55 +28,86 @@
<!-- Custom Emojis Category -->
<div class="category">
<div class="category-name">Custom Emojis</div>
<div class="category-name">
Custom Emojis
</div>
<div class="list">
<div
class="emoji-item"
v-for="(customEmoji, index) in this.customEmojisList"
:key="index"
class="emoji-item"
@click="customEmojiClickEvent(customEmoji)"
>
<img class="panel emoji" v-lazyload :data-url="customEmojiPath + customEmoji.emojiID">
<img
v-lazyload
class="panel emoji"
:data-url="customEmojiPath + customEmoji.emojiID"
>
</div>
</div>
</div>
<div class="category" v-for="(group, index) in groups" :key="group">
<div class="category-name">{{group}}</div>
<div
v-for="(group, index) in groups"
:key="group"
class="category"
>
<div class="category-name">
{{ group }}
</div>
<div class="list">
<div
class="emoji-item"
v-for="emojiSorted in emojiByGroup(index)"
:key="emojiSorted.shortcodes[0]"
class="emoji-item"
@click="emojiClickEvent(emojiSorted.shortcodes[0])"
>
<img class="panel emoji" v-lazyload :data-url="parseEmojiPath(emojiSorted.unicode)">
<img
v-lazyload
class="panel emoji"
:data-url="parseEmojiPath(emojiSorted.unicode)"
>
</div>
</div>
</div>
</div>
<div class="tabs">
<div class="tab" @click="scrollToCategory(0)">
<div
class="tab"
@click="scrollToCategory(0)"
>
<i class="material-icons">history</i>
<div class="tooltip">Recent</div>
</div>
<div class="tab" @click="scrollToCategory(1)">
<i class="material-icons">face</i>
<div class="tooltip">Custom Emojis</div>
<div class="tooltip">
Recent
</div>
</div>
<div
class="tab"
@click="scrollToCategory(1)"
>
<i class="material-icons">face</i>
<div class="tooltip">
Custom Emojis
</div>
</div>
<div
v-for="(emoji, index) in groupUnicodes"
:key="index"
class="tab"
@mouseenter="mouseHover(emoji, $event)"
@click="scrollToCategory(index + 2)"
>
<img class="panel-emoji" :src="selectRandom(emoji)">
<div class="tooltip">{{ groups[index]}}</div>
<img
class="panel-emoji"
:src="selectRandom(emoji)"
>
<div class="tooltip">
{{ groups[index] }}
</div>
</div>
</div>
</div>
<div class="triangle"></div>
<div class="triangle" />
</div>
</template>
@ -346,6 +382,10 @@ export default {
};
},
beforeMount() {
this.recentEmojisList = this.recentEmojis
this.customEmojisList = this.customEmojis
},
methods: {
getCustomEmoji(shortCode){
const customEmoji = emojiParser.getCustomEmojisByShortCode(shortCode)
@ -382,10 +422,6 @@ export default {
const elements = document.querySelectorAll(".category-name");
elements[index].scrollIntoView();
}
},
beforeMount() {
this.recentEmojisList = this.recentEmojis
this.customEmojisList = this.customEmojis
},
computed: {
...mapState('settingsModule', ['recentEmojis', 'customEmojis'])

50
src/components/app/EmojiPanels/emojiSuggestions.vue
View file

@ -2,18 +2,26 @@
<div class="emoji-suggetions-list">
<div
v-for="(emoji, index) in $props.emojiArray.slice(0,10)"
:key="emoji.hexcode || emoji.emojiID"
:class="{emojiItem: true, selected: index === emojiIndex}"
@mouseenter="hoverEvent"
@click="clickEvent"
:key="emoji.hexcode || emoji.emojiID"
>
<div class="preview">
<span v-if="emoji.unicode" v-html="emojiParser(emoji.unicode)"></span>
<span v-else >
<img class="custom-emoji" :src="customEmojiPath + emoji.emojiID" >
<span
v-if="emoji.unicode"
v-html="emojiParser(emoji.unicode)"
/>
<span v-else>
<img
class="custom-emoji"
:src="customEmojiPath + emoji.emojiID"
>
</span>
</div>
<div class="short-code">:{{emoji.name || emoji.shortcodes[0]}}:</div>
<div class="short-code">
:{{ emoji.name || emoji.shortcodes[0] }}:
</div>
</div>
</div>
</template>
@ -29,6 +37,22 @@ export default {
customEmojiPath: config.domain + "/files/"
}
},
computed: {
emojiIndex() {
return this.$store.getters.getEmojiIndex;
}
},
watch: {
emojiArray() {
this.$store.dispatch("changeIndex", 0);
}
},
mounted() {
bus.$on("emojiSuggestions:key", this.KeySwitch);
},
destroyed() {
bus.$off("emojiSuggestions:key", this.KeySwitch);
},
methods: {
emojiParser(emoji) {
return emojiParser.replaceEmojis(emoji);
@ -59,22 +83,6 @@ export default {
clickEvent() {
bus.$emit('emojiSuggestions:Selected')
}
},
mounted() {
bus.$on("emojiSuggestions:key", this.KeySwitch);
},
destroyed() {
bus.$off("emojiSuggestions:key", this.KeySwitch);
},
watch: {
emojiArray() {
this.$store.dispatch("changeIndex", 0);
}
},
computed: {
emojiIndex() {
return this.$store.getters.getEmojiIndex;
}
}
};
</script>

28
src/components/app/FriendsList.vue
View file

@ -2,19 +2,35 @@
<div class="left-panel">
<MyMiniInformation />
<div class="tabs">
<div :class="{selector: true, right: !isFriendsTab}"></div>
<div class="tab" @click="isFriendsTab = true">Friends</div>
<div class="tab" @click="isFriendsTab = false">Recents</div>
<div :class="{selector: true, right: !isFriendsTab}" />
<div
class="tab"
@click="isFriendsTab = true"
>
Friends
</div>
<div
class="tab"
@click="isFriendsTab = false"
>
Recents
</div>
</div>
<div class="list" v-if="isFriendsTab">
<div
v-if="isFriendsTab"
class="list"
>
<pending-friends />
<online-friends />
<offline-friends />
</div>
<div class="list" v-else>
<div
v-else
class="list"
>
<recent-friends />
</div>
<AddFriendPanel/>
<AddFriendPanel />
</div>
</template>

28
src/components/app/MemberTemplate.vue
View file

@ -1,16 +1,26 @@
<template>
<div class="member" @click="openUserInformation()">
<div
class="member"
@click="openUserInformation()"
>
<Profile-picture
class="avatar"
:url="userAvatar"
size="35px"
:uniqueID="user.uniqueID"
:unique-i-d="user.uniqueID"
:status="presense"
/>
<div class="information">
<div class="username">{{user.username}}</div>
<div class="username">
{{ user.username }}
</div>
</div>
<div
v-if="type === 'OWNER'"
class="type-box"
>
Owner
</div>
<div v-if="type === 'OWNER'" class="type-box">Owner</div>
</div>
</template>
@ -21,11 +31,6 @@ import config from '@/config';
export default {
components: { ProfilePicture },
props: ['user', 'avatar', 'type'],
methods: {
openUserInformation() {
this.$store.dispatch('setUserInformationPopout', this.user.uniqueID)
},
},
computed: {
userAvatar() {
return config.domain + "/avatars/" + this.avatar
@ -39,6 +44,11 @@ export default {
const userPresense = presences[this.user.uniqueID]
return userPresense || 0
}
},
methods: {
openUserInformation() {
this.$store.dispatch('setUserInformationPopout', this.user.uniqueID)
},
}
}

17
src/components/app/MembersList.vue
View file

@ -1,12 +1,19 @@
<template>
<div class="members-list">
<div class="header">
<div class="title">Members ({{members.length}})</div>
</div>
<div class="members">
<member-template v-for="(member, index) in members" :key="index" :type="member.type" :avatar="member.member.avatar" :user="member.member" />
<div class="title">
Members ({{ members.length }})
</div>
</div>
<div class="members">
<member-template
v-for="(member, index) in members"
:key="index"
:type="member.type"
:avatar="member.member.avatar"
:user="member.member"
/>
</div>
</div>
</template>

31
src/components/app/MessagePanel/Heading.vue
View file

@ -1,16 +1,29 @@
<template>
<div class="heading">
<div class="show-menu-button" @click="toggleLeftMenu">
<div
class="show-menu-button"
@click="toggleLeftMenu"
>
<i class="material-icons">menu</i>
</div>
<div
v-if="type === 1"
class="user-status"
:style="`box-shadow: 0px 0px 14px 3px ${statusColor}; background-color: ${statusColor};`"/>
:style="`box-shadow: 0px 0px 14px 3px ${statusColor}; background-color: ${statusColor};`"
/>
<div class="information">
<div :class="{name: true, clickable: !!uniqueID }" @click="openUserInfoPanel">{{name}}</div>
<div
:class="{name: true, clickable: !!uniqueID }"
@click="openUserInfoPanel"
>
{{ name }}
</div>
</div>
<div v-if="type === 2 && selectedServerID" class="show-members-button" @click="toggleMembersPanel">
<div
v-if="type === 2 && selectedServerID"
class="show-members-button"
@click="toggleMembersPanel"
>
<i class="material-icons">view_list</i>
</div>
</div>
@ -25,6 +38,11 @@ export default {
"name",
"uniqueID"
],
computed: {
selectedServerID() {
return this.$store.getters['servers/selectedServerID'];
}
},
methods: {
openUserInfoPanel() {
if (this.uniqueID)
@ -36,11 +54,6 @@ export default {
toggleMembersPanel() {
bus.$emit("toggleMembersPanel");
}
},
computed: {
selectedServerID() {
return this.$store.getters['servers/selectedServerID'];
}
}
};
</script>

68
src/components/app/MessageTemplate.vue
View file

@ -2,7 +2,7 @@
<div class="container">
<div
v-if="!type || type === 0"
:class="{message: true, ownMessage: user.uniqueID === $props.uniqueID, ownMessageLeft: user.uniqueID === $props.uniqueID && (apperance && apperance.own_message_right === true)} "
:class="{message: true, ownMessage: user.uniqueID === $props.uniqueID, ownMessageLeft: user.uniqueID === $props.uniqueID && (apperance && apperance.own_message_right === true)} "
>
<div class="avatar">
<profile-picture
@ -14,42 +14,78 @@
/>
</div>
<div class="triangle">
<div class="triangle-inner"></div>
<div class="triangle-inner" />
</div>
<div class="content">
<div class="user-info">
<div class="username" @click="openUserInformation">{{this.$props.username}}</div>
<div class="date">{{getDate}}</div>
<div
class="username"
@click="openUserInformation"
>
{{ this.$props.username }}
</div>
<div class="date">
{{ getDate }}
</div>
</div>
<div class="content-message" v-html="formatMessage"></div>
<div
class="content-message"
v-html="formatMessage"
/>
<div class="file-content" v-if="getFile">
<div
v-if="getFile"
class="file-content"
>
<div class="icon">
<i class="material-icons">insert_drive_file</i>
</div>
<div class="information">
<div class="info">{{getFile.fileName}}</div>
<a :href="getFile.url" target="_blank">
<div class="info">
{{ getFile.fileName }}
</div>
<a
:href="getFile.url"
target="_blank"
>
<div class="download-button">Download</div>
</a>
</div>
</div>
<div class="image-content" v-if="getImage">
<img :src="getImage" @click="imageClicked">
<div
v-if="getImage"
class="image-content"
>
<img
:src="getImage"
@click="imageClicked"
>
</div>
</div>
<div class="sending-status" v-html="statusMessage"></div>
<div
class="sending-status"
v-html="statusMessage"
/>
</div>
<div
v-if="type && (type === 1 || type === 2)"
:class="{'presence-message': true, green: type === 1, red: type === 2}"
:class="{'presence-message': true, green: type === 1, red: type === 2}"
>
<span>
<span class="username" @click="openUserInformation">{{this.$props.username}}</span>
<span class="text" v-if="type === 1">has joined the server!</span>
<span class="text" v-if="type === 2">has left the server.</span>
<span class="date">{{getDate}}</span>
<span
class="username"
@click="openUserInformation"
>{{ this.$props.username }}</span>
<span
v-if="type === 1"
class="text"
>has joined the server!</span>
<span
v-if="type === 2"
class="text"
>has left the server.</span>
<span class="date">{{ getDate }}</span>
</span>
</div>
</div>

90
src/components/app/MyMiniInformation.vue
View file

@ -1,30 +1,56 @@
<template>
<div class="my-mini-information" :style="{backgroundColor: getStatusColor}">
<div
class="my-mini-information"
:style="{backgroundColor: getStatusColor}"
>
<div class="profile-pic-outer">
<profile-picture :url="avatar" :admin="user.admin" size="50px" :hover="true" @click.native="openUserInformation"/>
<profile-picture
:url="avatar"
:admin="user.admin"
size="50px"
:hover="true"
@click.native="openUserInformation"
/>
</div>
<div class="information">
<div class="name">{{user.username}}</div>
<div class="tag">@{{user.tag}}</div>
<div class="name">
{{ user.username }}
</div>
<div class="tag">
@{{ user.tag }}
</div>
<div class="status" v-on:click="status.isPoppedOut = !status.isPoppedOut">
<img class="current-status" :src="getStatus">
<div
class="status"
@click="status.isPoppedOut = !status.isPoppedOut"
>
<img
class="current-status"
:src="getStatus"
>
<i class="material-icons expand-status-icon">expand_more</i>
<transition name="show-status-list">
<statusList v-if="status.isPoppedOut" v-click-outside="closeMenus" class="status-popout"/>
<statusList
v-if="status.isPoppedOut"
v-click-outside="closeMenus"
class="status-popout"
/>
</transition>
</div>
</div>
<div
class="setting-icon survay-button"
v-if="!user.survey_completed || user.survey_completed === false"
class="setting-icon survay-button"
@click="openSurvey"
>
<div class="survay-inner">
<i class="material-icons">error</i>
</div>
</div>
<div class="setting-icon" @click="openSettings">
<div
class="setting-icon"
@click="openSettings"
>
<i class="material-icons">settings</i>
</div>
</div>
@ -50,6 +76,29 @@ export default {
}
};
},
computed: {
user() {
return this.$store.getters.user;
},
avatar() {
return config.domain + "/avatars/" + this.$store.getters.user.avatar;
},
getStatus() {
return require(`./../../assets/status/${this.$store.getters.user.status ||
0}.svg`);
},
getStatusColor() {
const status = this.$store.getters.user.status || 0
return statuses[parseInt(status)].bgColor
}
},
created() {
//When user changes their own status (statusList.vue)
bus.$on("status-change", this.changeStatus);
},
beforeDestroy() {
bus.$off("status-change", this.changeStatus);
},
methods: {
openUserInformation() {
this.$store.dispatch('setUserInformationPopout', this.user.uniqueID)
@ -77,29 +126,6 @@ export default {
visibility: true
});
}
},
created() {
//When user changes their own status (statusList.vue)
bus.$on("status-change", this.changeStatus);
},
beforeDestroy() {
bus.$off("status-change", this.changeStatus);
},
computed: {
user() {
return this.$store.getters.user;
},
avatar() {
return config.domain + "/avatars/" + this.$store.getters.user.avatar;
},
getStatus() {
return require(`./../../assets/status/${this.$store.getters.user.status ||
0}.svg`);
},
getStatusColor() {
const status = this.$store.getters.user.status || 0
return statuses[parseInt(status)].bgColor
}
}
};
</script>

146
src/components/app/Popouts/Popouts/AddServer.vue
View file

@ -1,44 +1,128 @@
<template>
<div class="dark-background" @mousedown="backgroundClick">
<div
class="dark-background"
@mousedown="backgroundClick"
>
<div class="inner">
<div class="tabs">
<div :class="{tab: true, selected: tab == 0}" @click="tab = 0; slideBack(); ">Create</div>
<div :class="{tab: true, selected: tab == 1 || tab == 2}" @click="tab = 1; slideForward();">Join</div>
</div>
<transition-group tag="div" class="slider" :name="slideInDirection">
<div class="content" v-if="tab == 0" key="add-server">
<div class="title">Set your server's avatar</div>
<profile-picture class="avatar" size="90px" :url="tempImage"/>
<div class="button">Browse Avatar Coming Soon!</div>
<div class="input">
<div class="input-name">Server Name</div>
<input type="text" v-model="serverName" placeholder="Server Name">
</div>
<span v-if="serverNameError" class="warn">{{serverNameError}}</span>
<div class="button create-button" @click="createButton">Create</div>
<div
:class="{tab: true, selected: tab == 0}"
@click="tab = 0; slideBack(); "
>
Create
</div>
<div class="content" v-if="tab == 1" key="check-invite">
<div
:class="{tab: true, selected: tab == 1 || tab == 2}"
@click="tab = 1; slideForward();"
>
Join
</div>
</div>
<transition-group
tag="div"
class="slider"
:name="slideInDirection"
>
<div
v-if="tab == 0"
key="add-server"
class="content"
>
<div class="title">
Set your server's avatar
</div>
<profile-picture
class="avatar"
size="90px"
:url="tempImage"
/>
<div class="button">
Browse Avatar Coming Soon!
</div>
<div class="input">
<div class="input-name">
Server Name
</div>
<input
v-model="serverName"
type="text"
placeholder="Server Name"
>
</div>
<span
v-if="serverNameError"
class="warn"
>{{ serverNameError }}</span>
<div
class="button create-button"
@click="createButton"
>
Create
</div>
</div>
<div
v-if="tab == 1"
key="check-invite"
class="content"
>
<i class="material-icons icon">forum</i>
<div class="title">Join A Server</div>
<div class="title">
Join A Server
</div>
<div class="input">
<div class="input-name">
Invite Code
<span v-if="inviteCodeError" class="warn">- {{inviteCodeError}}</span>
<span
v-if="inviteCodeError"
class="warn"
>- {{ inviteCodeError }}</span>
</div>
<input type="text" v-model="inviteCode" placeholder="Invite code">
<input
v-model="inviteCode"
type="text"
placeholder="Invite code"
>
</div>
<div
class="button check-button"
@click="checkInviteCode"
>
Check
</div>
<div class="button check-button" @click="checkInviteCode">Check</div>
</div>
<div class="content server" v-if="tab == 2" key="join-server">
<profile-picture class="avatar" size="100px" :url="tempImage"/>
<div class="server-name">{{server.name}}</div>
<div
v-if="tab == 2"
key="join-server"
class="content server"
>
<profile-picture
class="avatar"
size="100px"
:url="tempImage"
/>
<div class="server-name">
{{ server.name }}
</div>
<div class="buttons">
<div class="button join-button" @click="joinButton" v-if="!servers[server.server_id]">Join</div>
<div class="button join-button button-clicked" v-if="servers[server.server_id]">Joined</div>
<div
v-if="!servers[server.server_id]"
class="button join-button"
@click="joinButton"
>
Join
</div>
<div
v-if="servers[server.server_id]"
class="button join-button button-clicked"
>
Joined
</div>
<div
class="button cancel-button"
@click="server = null; inviteCode = ''; tab = 1; slideBack();"
>Cancel</div>
>
Cancel
</div>
</div>
</div>
</transition-group>
@ -67,6 +151,11 @@ export default {
slideInDirection: "slide-forward"
};
},
computed: {
servers() {
return this.$store.getters['servers/servers'];
}
},
methods: {
closeMenu() {
this.$store.dispatch("setPopoutVisibility", {
@ -137,11 +226,6 @@ export default {
this.closeMenu();
}
}
},
computed: {
servers() {
return this.$store.getters['servers/servers'];
}
}
};
</script>

4
src/components/app/Popouts/Popouts/DragDropFileUploadDialog.vue
View file

@ -2,7 +2,9 @@
<div class="drop-background">
<div class="box">
<i class="material-icons">insert_drive_file</i>
<div class="info">Drop file</div>
<div class="info">
Drop file
</div>
</div>
</div>
</template>

44
src/components/app/Popouts/Popouts/GDriveLinkMenu.vue
View file

@ -1,19 +1,43 @@
<template>
<div class="dark-background" @click="backgroundClick">
<div
class="dark-background"
@click="backgroundClick"
>
<div class="inner">
<div
class="text"
>To upload files, images or set avatars, You must link your Google Drive account with your Nertivia account.</div>
<div class="images">
<div class="image GDrive-img"></div>
<div class="arrow">></div>
<div class="image nertivia-img"></div>
>
To upload files, images or set avatars, You must link your Google Drive account with your Nertivia account.
</div>
<div class="images">
<div class="image GDrive-img" />
<div class="arrow">
>
</div>
<div class="image nertivia-img" />
</div>
<div class="text">
If you would like to see Nertivia grow, and have its own storage CDN, donations would be appriciated.
</div>
<div class="text">If you would like to see Nertivia grow, and have its own storage CDN, donations would be appriciated.</div>
<div class="buttons">
<div class="button donate" @click="donateButton">Donate</div>
<div class="button deny" @click="closeMenu">No thanks</div>
<div class="button" @click="link">Link me</div>
<div
class="button donate"
@click="donateButton"
>
Donate
</div>
<div
class="button deny"
@click="closeMenu"
>
No thanks
</div>
<div
class="button"
@click="link"
>
Link me
</div>
</div>
</div>
</div>

53
src/components/app/Popouts/Popouts/ServerInvitePopout.vue
View file

@ -1,14 +1,33 @@
<template>
<div class="dark-background" @mousedown="backgroundClick">
<div
class="dark-background"
@mousedown="backgroundClick"
>
<div class="inner">
<div class="top">
<div class="button" @click="createInviteButton">Create New Invite</div>
<div
class="button"
@click="createInviteButton"
>
Create New Invite
</div>
</div>
<div class="bottom">
<div class="title">Invites created by you:</div>
<spinner v-if="invites === null"/>
<div class="invite-list" v-if="invites !== null">
<div class="invite" v-for="invite in invites.slice().reverse()" :key="invite">{{invite}}</div>
<div class="title">
Invites created by you:
</div>
<spinner v-if="invites === null" />
<div
v-if="invites !== null"
class="invite-list"
>
<div
v-for="invite in invites.slice().reverse()"
:key="invite"
class="invite"
>
{{ invite }}
</div>
</div>
</div>
</div>
@ -29,6 +48,17 @@ export default {
invites: null
};
},
async mounted() {
// get invites created by you
const {ok, error, result} = await ServerService.getInvites(this.serverID);
if (ok) {
let invites = [];
for (let invite of result.data) {
invites.push(invite.invite_code)
}
this.invites = invites;
}
},
methods: {
closeMenu() {
this.$store.dispatch("setPopoutVisibility", {
@ -53,17 +83,6 @@ export default {
}
},
async mounted() {
// get invites created by you
const {ok, error, result} = await ServerService.getInvites(this.serverID);
if (ok) {
let invites = [];
for (let invite of result.data) {
invites.push(invite.invite_code)
}
this.invites = invites;
}
},
computed: {
...mapState({
serverID: state => state.popoutsModule.serverIDContextMenu

61
src/components/app/Popouts/Popouts/SettingsPanels/DropDownTemplate.vue
View file

@ -1,27 +1,40 @@
<template>
<div class="drop-down">
<div class="main-name">{{name}}</div>
<div class="box" @click="opened = !opened">
<div class="main-name">
{{ name }}
</div>
<div
class="box"
@click="opened = !opened"
>
<div class="selected">
<div
class="emoji"
v-if="selected !== null && updateItems[selected]"
class="emoji"
v-html="updateItems[selected].emoji || ''"
></div>
{{selected === null ? 'Select One' : updateItems[selected].name}}
/>
{{ selected === null ? 'Select One' : updateItems[selected].name }}
</div>
<i class="material-icons">expand_more</i>
</div>
<div class="drop-down-menu" v-if="opened">
<div
v-if="opened"
class="drop-down-menu"
>
<div
class="item"
v-for="(item, index) in updateItems"
:key="index"
class="item"
@click="itemClickEvent(index)"
>
<div class="content">
<div class="emoji" v-html="item.emoji"></div>
<div class="name">{{item.name}}</div>
<div
class="emoji"
v-html="item.emoji"
/>
<div class="name">
{{ item.name }}
</div>
</div>
</div>
</div>
@ -43,21 +56,6 @@ export default {
selected: this.default || null
};
},
methods: {
itemClickEvent(index) {
this.selected = index;
this.$emit("change", index);
this.opened = false;
}
},
watch: {
updateItems() {
this.selected = null;
},
itemSelected() {
this.selected = this.itemSelected;
}
},
computed: {
updateItems() {
this.$emit("change", null);
@ -75,6 +73,21 @@ export default {
}
return newArr;
}
},
watch: {
updateItems() {
this.selected = null;
},
itemSelected() {
this.selected = this.itemSelected;
}
},
methods: {
itemClickEvent(index) {
this.selected = index;
this.$emit("change", index);
this.opened = false;
}
}
};
</script>

59
src/components/app/Popouts/Popouts/SettingsPanels/ManageEmojis.vue
View file

@ -3,15 +3,27 @@
<div class="info">
<div
class="title"
>Upload your own pretty emojis for free! Emojis must be 1MB or less. (png, jpg, gif)</div>
<div class="button" @click="addEmojiBtn">
>
Upload your own pretty emojis for free! Emojis must be 1MB or less. (png, jpg, gif)
</div>
<div
class="button"
@click="addEmojiBtn"
>
<i class="material-icons">add_box</i>Add Emoji
</div>
</div>
<div class="emojis-list">
<div class="emoji" v-for="emoji in customEmojis" :key="emoji.emojiID">
<img class="preview" :src="`${domain}${emoji.emojiID}`">
<div
v-for="emoji in customEmojis"
:key="emoji.emojiID"
class="emoji"
>
<img
class="preview"
:src="`${domain}${emoji.emojiID}`"
>
<div class="emoji-name">
<input
type="text"
@ -20,21 +32,44 @@
@blur="blurEvent(emoji.emojiID, $event)"
>
</div>
<div class="delete-button" @click="removeEmoji(emoji.emojiID)">
<div class="material-icons">close</div>
<div class="inner"></div>
<div
class="delete-button"
@click="removeEmoji(emoji.emojiID)"
>
<div class="material-icons">
close
</div>
<div class="inner" />
</div>
</div>
</div>
<input type="file" accept="image/*" ref="emojiBrowser" @change="emojiBrowse" class="hidden">
<input
ref="emojiBrowser"
type="file"
accept="image/*"
class="hidden"
@change="emojiBrowse"
>
<!-- <div class="option" @click="changePassword">Change Password</div> -->
<div class="alert-outer" v-if="alert.show">
<div
v-if="alert.show"
class="alert-outer"
>
<div class="alert">
<div class="alert-title">Error</div>
<div class="alert-content">{{alert.content}}</div>
<div class="alert-title">
Error
</div>
<div class="alert-content">
{{ alert.content }}
</div>
<div class="alert-buttons">
<div class="alert-button" @click="alert.show = false">Okay</div>
<div
class="alert-button"
@click="alert.show = false"
>
Okay
</div>
</div>
</div>
</div>

71
src/components/app/Popouts/Popouts/SettingsPanels/MessageDesign.vue
View file

@ -1,20 +1,53 @@
<template>
<div class="my-profile-panel">
<div class="title">Message Example</div>
<div class="message-example">
<message-template message="Hi" :username="user.username" :date="Date.now()" :uniqueID="user.uniqueID" :admin="user.admin" :avatar="user.avatar" />
<message-template message="Hello." username="Cool Dude" :date="Date.now()"/>
<message-template message="Whaddup" :username="user.username" :date="Date.now()" :uniqueID="user.uniqueID" :admin="user.admin" :avatar="user.avatar" />
<message-template message="Nothing, bye." username="Cool Dude" :date="Date.now()"/>
<div class="title">
Message Example
</div>
<div class="title">Options</div>
<div class="message-example">
<message-template
message="Hi"
:username="user.username"
:date="Date.now()"
:unique-i-d="user.uniqueID"
:admin="user.admin"
:avatar="user.avatar"
/>
<message-template
message="Hello."
username="Cool Dude"
:date="Date.now()"
/>
<message-template
message="Whaddup"
:username="user.username"
:date="Date.now()"
:unique-i-d="user.uniqueID"
:admin="user.admin"
:avatar="user.avatar"
/>
<message-template
message="Nothing, bye."
username="Cool Dude"
:date="Date.now()"
/>
</div>
<div class="title">
Options
</div>
<div class="switches">
<div class="checkbox" @click="toggleAppearance">
<div :class="`checkbox-box ${apperance && apperance.own_message_right && apperance.own_message_right === true ? 'selected' : '' }`"></div>
<div class="checkbox-name">Show my messages on the right side.</div>
<div
class="checkbox"
@click="toggleAppearance"
>
<div :class="`checkbox-box ${apperance && apperance.own_message_right && apperance.own_message_right === true ? 'selected' : '' }`" />
<div class="checkbox-name">
Show my messages on the right side.
</div>
</div>
</div>
<div class="title">Message Themes (Soon!)</div>
<div class="title">
Message Themes (Soon!)
</div>
</div>
</template>
@ -33,6 +66,14 @@ export default {
};
},
computed: {
apperance() {
return this.$store.getters['settingsModule/settings'].apperance;
},
user() {
return this.$store.getters.user
}
},
methods: {
toggleAppearance() {
if (!this.apperance || !this.apperance.own_message_right || this.apperance.own_message_right === false) {
@ -43,14 +84,6 @@ export default {
SettingsService.setApperance("own_message_right", false)
}
},
computed: {
apperance() {
return this.$store.getters['settingsModule/settings'].apperance;
},
user() {
return this.$store.getters.user
}
}
};
</script>

53
src/components/app/Popouts/Popouts/SettingsPanels/MyProfile.vue
View file

@ -6,39 +6,66 @@
:url="avatar"
:admin="user.admin"
size="100px"
emoteSize="30px"
animationPadding="5px"
emote-size="30px"
animation-padding="5px"
/>
<div class="information">
<div class="username">
<strong>Username:</strong>
{{user.username}}
{{ user.username }}
</div>
<div class="tag">
<strong>Tag:</strong>
@{{user.tag}}
@{{ user.tag }}
</div>
</div>
<div class="options">
<input
ref="avatarBrowser"
type="file"
accept="image/*"
ref="avatarBrowser"
@change="avatarBrowse"
class="hidden"
@change="avatarBrowse"
>
<div class="option" @click="editAvatarBtn">Edit Avatar</div>
<div class="option" @click="changePassword">Change Password</div>
<div class="option red" @click="logout">Logout</div>
<div
class="option"
@click="editAvatarBtn"
>
Edit Avatar
</div>
<div
class="option"
@click="changePassword"
>
Change Password
</div>
<div
class="option red"
@click="logout"
>
Logout
</div>
</div>
</div>
<survey />
<div class="alert-outer" v-if="alert.show">
<div
v-if="alert.show"
class="alert-outer"
>
<div class="alert">
<div class="alert-title">Error</div>
<div class="alert-content">{{alert.content}}</div>
<div class="alert-title">
Error
</div>
<div class="alert-content">
{{ alert.content }}
</div>
<div class="alert-buttons">
<div class="alert-button" @click="alert.show = false">Okay</div>
<div
class="alert-button"
@click="alert.show = false"
>
Okay
</div>
</div>
</div>
</div>

135
src/components/app/Popouts/Popouts/SettingsPanels/survey.vue
View file

@ -1,57 +1,90 @@
<template>
<div class="survey" v-show="previousLoaded">
<div
v-show="previousLoaded"
class="survey"
>
<div class="title">
<i class="material-icons">error</i>
Take Survey
</div>
<div class="notice">Note: Everyone will be able to see your survey in your profile.</div>
<div class="notice">
Note: Everyone will be able to see your survey in your profile.
</div>
<div class="survey-inner">
<!-- name -->
<div class="survey-box">
<div class="survey-title">What's your name?</div>
<input class="survey-input" v-model="selected.name" type="text" placeholder="Name">
<div class="survey-title">
What's your name?
</div>
<input
v-model="selected.name"
class="survey-input"
type="text"
placeholder="Name"
>
</div>
<!-- Gender -->
<div class="survey-box">
<drop-down
name="What is your gender?"
v-model="selected.gender"
name="What is your gender?"
:items="surveyItems.gender"
/>
</div>
<!-- Age -->
<div class="survey-box">
<drop-down name="What is your age?" v-model="selected.age" :items="surveyItems.age"/>
<drop-down
v-model="selected.age"
name="What is your age?"
:items="surveyItems.age"
/>
</div>
<!-- Continent -->
<div class="survey-box">
<drop-down
name="Pick a continent"
v-model="selected.continent"
name="Pick a continent"
:items="surveyItems.continents"
/>
</div>
<!-- Countries -->
<div class="survey-box">
<drop-down
name="Pick a country"
v-if="selected.continent != null"
v-model="selected.country"
name="Pick a country"
:items="filterCountry"
/>
</div>
<!-- About me -->
<div class="survey-box">
<div class="survey-title">About me (Formatting allowed)</div>
<div class="survey-title">
About me (Formatting allowed)
</div>
<textarea
class="survey-input textarea"
v-model="selected.about_me"
class="survey-input textarea"
placeholder="Hobbies, games, animals"
></textarea>
/>
</div>
<div
v-if="surveyErrorMessage"
class="survey-warning"
>
{{ surveyErrorMessage }}
</div>
<div
v-if="surveyValidMessage"
class="survey-valid"
>
{{ surveyValidMessage }}
</div>
<div
class="button"
@click="surveySubmitButton"
>
Save
</div>
<div class="survey-warning" v-if="surveyErrorMessage">{{surveyErrorMessage}}</div>
<div class="survey-valid" v-if="surveyValidMessage">{{surveyValidMessage}}</div>
<div class="button" @click="surveySubmitButton">Save</div>
</div>
</div>
</template>
@ -78,6 +111,43 @@ export default {
}
};
},
computed: {
filterCountry() {
const selectedContinentIndex = this.selected.continent;
const selectedContinent = this.surveyItems.continents[
selectedContinentIndex
];
const code = selectedContinent.code;
return this.surveyItems.countries.filter(element => {
return element.code == code || !element.code;
});
}
},
async mounted() {
const { ok, error, result } = await userService.getSurvey();
if (ok) {
this.selected.continent = result.data.result.continent;
this.selected.age = result.data.result.age;
this.selected.name = result.data.result.name;
this.selected.about_me = result.data.result.about_me;
this.selected.gender = result.data.result.gender;
//filter the country
if (result.data.result.country) {
setTimeout(() => {
const continentCode =
surveyItems.continents[this.selected.continent].code;
const filter = surveyItems.countries.filter(
e => e.code === continentCode
);
const countryName =
surveyItems.countries[result.data.result.country].name;
this.selected.country = filter.findIndex(e => e.name === countryName);
}, 500);
}
}
this.previousLoaded = true;
},
methods: {
async surveySubmitButton() {
this.surveyValidMessage = null;
@ -134,43 +204,6 @@ export default {
this.surveyErrorMessage = error.response.data.message;
}
}
},
async mounted() {
const { ok, error, result } = await userService.getSurvey();
if (ok) {
this.selected.continent = result.data.result.continent;
this.selected.age = result.data.result.age;
this.selected.name = result.data.result.name;
this.selected.about_me = result.data.result.about_me;
this.selected.gender = result.data.result.gender;
//filter the country
if (result.data.result.country) {
setTimeout(() => {
const continentCode =
surveyItems.continents[this.selected.continent].code;
const filter = surveyItems.countries.filter(
e => e.code === continentCode
);
const countryName =
surveyItems.countries[result.data.result.country].name;
this.selected.country = filter.findIndex(e => e.name === countryName);
}, 500);
}
}
this.previousLoaded = true;
},
computed: {
filterCountry() {
const selectedContinentIndex = this.selected.continent;
const selectedContinent = this.surveyItems.continents[
selectedContinentIndex
];
const code = selectedContinent.code;
return this.surveyItems.countries.filter(element => {
return element.code == code || !element.code;
});
}
}
};
</script>

22
src/components/app/Popouts/Popouts/TakeSurveyPopout.vue
View file

@ -4,11 +4,25 @@
<div class="survay-icon">
<i class="material-icons">error</i>
</div>
<div class="text">There is a survey you can complete about yourself. Would you like to take it?</div>
<div class="text">You can always take the survey again by going to settings.</div>
<div class="text">
There is a survey you can complete about yourself. Would you like to take it?
</div>
<div class="text">
You can always take the survey again by going to settings.
</div>
<div class="buttons">
<div class="button warning" @click="laterButtonClickEvent">Later</div>
<div class="button valid" @click="TakeThereClickEvent">Take Me There</div>
<div
class="button warning"
@click="laterButtonClickEvent"
>
Later
</div>
<div
class="button valid"
@click="TakeThereClickEvent"
>
Take Me There
</div>
</div>
</div>
</div>

19
src/components/app/Popouts/Popouts/imageLargePreview.vue
View file

@ -1,5 +1,8 @@
<template>
<div ref="background" class="drop-background">
<div
ref="background"
class="drop-background"
>
<div class="img-outer">
<img :src="$store.getters.popouts.ImagePreviewURL">
</div>
@ -7,13 +10,6 @@
</template>
<script>
export default {
methods: {
backgroundClickEvent(event) {
if(event.target.matches('.img-outer') || event.target.matches('.drop-background')){
this.$store.dispatch('setImagePreviewURL', event.target.src)
}
}
},
mounted() {
this.$refs["background"].addEventListener(
"click",
@ -25,6 +21,13 @@ export default {
"click",
this.backgroundClickEvent
);
},
methods: {
backgroundClickEvent(event) {
if(event.target.matches('.img-outer') || event.target.matches('.drop-background')){
this.$store.dispatch('setImagePreviewURL', event.target.src)
}
}
}
};
</script>

97
src/components/app/Popouts/Popouts/uploadDialog.vue
View file

@ -2,33 +2,56 @@
<div class="dark-background">
<div class="inner">
<div class="info">
<div class="preview-image" v-show="image" ref="preview-image"></div>
<div class="file-icon" v-if="!image">
<div
v-show="image"
ref="preview-image"
class="preview-image"
/>
<div
v-if="!image"
class="file-icon"
>
<i class="material-icons">insert_drive_file</i>
</div>
<div class="data">
<div class="name">
<strong>Name:</strong>
{{name}}
{{ name }}
</div>
<div class="size">
<strong>Size:</strong>
{{size}}
{{ size }}
</div>
</div>
</div>
<div class="message">Add a message</div>
<div class="message">
Add a message
</div>
<div class="message-area">
<textarea class="chat-input" v-model="message" placeholder></textarea>
<textarea
v-model="message"
class="chat-input"
placeholder
/>
</div>
<div class="bottom-panel">
<div class="close-button button" @click="closeButton">
<div
class="close-button button"
@click="closeButton"
>
<i class="material-icons">close</i>
<div class="text">Cancel</div>
<div class="text">
Cancel
</div>
</div>
<div class="send-button button" @click="send">
<div
class="send-button button"
@click="send"
>
<i class="material-icons">send</i>
<div class="text">Send</div>
<div class="text">
Send
</div>
</div>
</div>
</div>
@ -51,6 +74,33 @@ export default {
image: false
};
},
beforeMount() {
if (this.popouts.fileToUpload.size == 0) {
this.$store.dispatch("setPopoutVisibility", {
name: "uploadDialog",
visibility: false
});
}
if (!this.GDriveLinked) {
this.$store.dispatch("setPopoutVisibility", {
name: "uploadDialog",
visibility: false
});
this.$store.dispatch("setPopoutVisibility", {
name: "GDLinkMenu",
visibility: true
});
}
},
mounted() {
(this.name = this.popouts.fileToUpload.name),
(this.size = filesize(this.popouts.fileToUpload.size)),
this.loadFileInfo(this.popouts.fileToUpload);
document.addEventListener("keydown", this.keyDownEvent);
},
destroyed() {
document.removeEventListener("keydown", this.keyDownEvent);
},
methods: {
generateNum(n) {
var add = 1,
@ -134,33 +184,6 @@ export default {
}
}
},
beforeMount() {
if (this.popouts.fileToUpload.size == 0) {
this.$store.dispatch("setPopoutVisibility", {
name: "uploadDialog",
visibility: false
});
}
if (!this.GDriveLinked) {
this.$store.dispatch("setPopoutVisibility", {
name: "uploadDialog",
visibility: false
});
this.$store.dispatch("setPopoutVisibility", {
name: "GDLinkMenu",
visibility: true
});
}
},
mounted() {
(this.name = this.popouts.fileToUpload.name),
(this.size = filesize(this.popouts.fileToUpload.size)),
this.loadFileInfo(this.popouts.fileToUpload);
document.addEventListener("keydown", this.keyDownEvent);
},
destroyed() {
document.removeEventListener("keydown", this.keyDownEvent);
},
computed: {
...mapState('settingsModule', ['GDriveLinked']),
selectedChannelID() {

257
src/components/app/Popouts/Popouts/userInformationPopout.vue
View file

@ -1,113 +1,196 @@
<template>
<div class="drop-background" @click="backgroundClickEvent">
<div
class="drop-background"
@click="backgroundClickEvent"
>
<div class="box">
<spinner v-if="!user"/>
<div class="inner" v-else>
<spinner v-if="!user" />
<div
v-else
class="inner"
>
<div class="top">
<profile-picture
class="avatar"
size="90px"
emoteSize="28px"
animationPadding="5px"
:admin="user.admin"
:url="`${avatarDomain}${user.avatar}`"
/>
<profile-picture
class="avatar"
size="90px"
emote-size="28px"
animation-padding="5px"
:admin="user.admin"
:url="`${avatarDomain}${user.avatar}`"
/>
<div class="info">
<div class="username">{{user.username}}</div>
<div class="tag">@{{user.tag}}</div>
<div class="username">
{{ user.username }}
</div>
<div class="tag">
@{{ user.tag }}
</div>
</div>
</div>
<div class="bottom" v-if="selfUniqueID !== user.uniqueID">
<div class="button valid" v-if="this.relationshipStatus == null" @click="AddFriendButton">
<div class="material-icons">person_add</div>Add friend
<div
v-if="selfUniqueID !== user.uniqueID"
class="bottom"
>
<div
v-if="this.relationshipStatus == null"
class="button valid"
@click="AddFriendButton"
>
<div class="material-icons">
person_add
</div>Add friend
</div>
<div class="button valid" v-if="this.relationshipStatus == 0" @click="RemoveFriendButton">
<div class="material-icons">person_add</div>Request Sent!
<div
v-if="this.relationshipStatus == 0"
class="button valid"
@click="RemoveFriendButton"
>
<div class="material-icons">
person_add
</div>Request Sent!
</div>
<div class="button valid" v-if="this.relationshipStatus == 1" @click="AcceptFriendButton">
<div class="material-icons">person_add</div>Accept Friend
<div
v-if="this.relationshipStatus == 1"
class="button valid"
@click="AcceptFriendButton"
>
<div class="material-icons">
person_add
</div>Accept Friend
</div>
<div class="button warn" v-if="this.relationshipStatus == 2" @click="RemoveFriendButton">
<div class="material-icons">person_add_disabled</div>End Friendship
<div
v-if="this.relationshipStatus == 2"
class="button warn"
@click="RemoveFriendButton"
>
<div class="material-icons">
person_add_disabled
</div>End Friendship
</div>
<div class="button" @click="openChat">
<div class="material-icons">chat</div>Send Message
<div
class="button"
@click="openChat"
>
<div class="material-icons">
chat
</div>Send Message
</div>
<div class="button warn">
<div class="material-icons">block</div>Block
<div class="material-icons">
block
</div>Block
</div>
</div>
<div v-else class="cross"><i class="material-icons">close</i></div>
<div
v-else
class="cross"
>
<i class="material-icons">close</i>
</div>
</div>
<div class="about-me-box" v-if="user && user.about_me">
<div class="title">About {{user.username}}</div>
<div
v-if="user && user.about_me"
class="about-me-box"
>
<div class="title">
About {{ user.username }}
</div>
<div class="about-me-inner">
<div class="about-me-detail" v-if="user.about_me.name">
<div
v-if="user.about_me.name"
class="about-me-detail"
>
<div class="about-me-title">
<div class="main-title-about-me">Name:</div>
<div class="emoji-about-me"></div>
{{user.about_me.name}}
</div>
</div>
<div class="about-me-detail" v-if="user.about_me.gender == 0 || user.about_me.gender">
<div class="about-me-title">
<div class="main-title-about-me">Gender:</div>
<div
class="emoji-about-me"
v-html="emojiParse(surveyItems.gender[user.about_me.gender].emoji)"
></div>
{{surveyItems.gender[user.about_me.gender].name}}
</div>
</div>
<div class="about-me-detail" v-if="user.about_me.age == 0 || user.about_me.age">
<div class="about-me-title">
<div class="main-title-about-me">Age:</div>
<div
class="emoji-about-me"
v-html="emojiParse(surveyItems.age[user.about_me.age].emoji)"
></div>
{{surveyItems.age[user.about_me.age].name}}
<div class="main-title-about-me">
Name:
</div>
<div class="emoji-about-me" />
{{ user.about_me.name }}
</div>
</div>
<div
v-if="user.about_me.gender == 0 || user.about_me.gender"
class="about-me-detail"
v-if="user.about_me.continent == 0 || user.about_me.continent"
>
<div class="about-me-title">
<div class="main-title-about-me">Continent:</div>
<div class="main-title-about-me">
Gender:
</div>
<div
class="emoji-about-me"
v-html="emojiParse(surveyItems.gender[user.about_me.gender].emoji)"
/>
{{ surveyItems.gender[user.about_me.gender].name }}
</div>
</div>
<div
v-if="user.about_me.age == 0 || user.about_me.age"
class="about-me-detail"
>
<div class="about-me-title">
<div class="main-title-about-me">
Age:
</div>
<div
class="emoji-about-me"
v-html="emojiParse(surveyItems.age[user.about_me.age].emoji)"
/>
{{ surveyItems.age[user.about_me.age].name }}
</div>
</div>
<div
v-if="user.about_me.continent == 0 || user.about_me.continent"
class="about-me-detail"
>
<div class="about-me-title">
<div class="main-title-about-me">
Continent:
</div>
<div
class="emoji-about-me"
v-html="emojiParse(surveyItems.continents[user.about_me.continent].emoji)"
></div>
{{surveyItems.continents[user.about_me.continent].name}}
/>
{{ surveyItems.continents[user.about_me.continent].name }}
</div>
</div>
<div class="about-me-detail" v-if="user.about_me.country == 0 || user.about_me.country">
<div
v-if="user.about_me.country == 0 || user.about_me.country"
class="about-me-detail"
>
<div class="about-me-title">
<div class="main-title-about-me">Country:</div>
<div class="main-title-about-me">
Country:
</div>
<div
class="emoji-about-me"
v-html="emojiParse(surveyItems.countries[user.about_me.country].emoji)"
></div>
{{surveyItems.countries[user.about_me.country].name}}
/>
{{ surveyItems.countries[user.about_me.country].name }}
</div>
</div>
<div class="about-me-detail" v-if="user.about_me.about_me">
<div
v-if="user.about_me.about_me"
class="about-me-detail"
>
<div class="about-me-title about_me">
<div class="main-title-about-me">About Me:</div>
<div class="emoji-about-me"></div>
<div class="about-me-format" v-html="formatAboutMe(user.about_me.about_me)"></div>
<div class="main-title-about-me">
About Me:
</div>
<div class="emoji-about-me" />
<div
class="about-me-format"
v-html="formatAboutMe(user.about_me.about_me)"
/>
</div>
</div>
</div>
@ -133,6 +216,26 @@ export default {
avatarDomain: config.domain + "/avatars/"
};
},
computed: {
selfUniqueID() {
return this.$store.getters.user.uniqueID;
},
uniqueID() {
return this.$store.getters.popouts.userInformationPopoutID;
},
relationshipStatus() {
const userUniqueID = this.$store.getters.popouts.userInformationPopoutID;
const allFriend = this.$store.getters.user.friends;
if (!allFriend[userUniqueID]) return null;
return allFriend[userUniqueID].status;
}
},
async mounted() {
const { ok, error, result } = await userService.get(this.uniqueID);
if (ok) {
this.user = result.data.user;
}
},
methods: {
backgroundClickEvent(event) {
if (event.target.classList.contains("drop-background")) {
@ -169,26 +272,6 @@ export default {
formatAboutMe(string) {
return messageFormatter(string);
}
},
async mounted() {
const { ok, error, result } = await userService.get(this.uniqueID);
if (ok) {
this.user = result.data.user;
}
},
computed: {
selfUniqueID() {
return this.$store.getters.user.uniqueID;
},
uniqueID() {
return this.$store.getters.popouts.userInformationPopoutID;
},
relationshipStatus() {
const userUniqueID = this.$store.getters.popouts.userInformationPopoutID;
const allFriend = this.$store.getters.user.friends;
if (!allFriend[userUniqueID]) return null;
return allFriend[userUniqueID].status;
}
}
};
</script>

31
src/components/app/ServerList.vue
View file

@ -1,9 +1,18 @@
<template>
<div class="left-panel">
<MyMiniInformation/>
<MyMiniInformation />
<div class="list">
<server v-for="(data, index) in servers" :key="index.server_id" :server-data="data" @click.native="toggleChannel(data.server_id, $event)" :open-channel="openedServer !== null && openedServer === data.server_id"/>
<server mode="ADD_SERVER" @click.native="openAddServer"/>
<server
v-for="(data, index) in servers"
:key="index.server_id"
:server-data="data"
:open-channel="openedServer !== null && openedServer === data.server_id"
@click.native="toggleChannel(data.server_id, $event)"
/>
<server
mode="ADD_SERVER"
@click.native="openAddServer"
/>
</div>
</div>
</template>
@ -22,6 +31,14 @@ export default {
openedServer: null
};
},
computed: {
servers() {
const data = this.$store.getters['servers/servers'];
return Object.keys(data).map(key => {
return data[key];
}).slice().reverse()
}
},
methods: {
openAddServer() {
this.$store.dispatch("setPopoutVisibility", {
@ -40,14 +57,6 @@ export default {
this.$store.dispatch('servers/setSelectedServerID', serverID)
}
}
},
computed: {
servers() {
const data = this.$store.getters['servers/servers'];
return Object.keys(data).map(key => {
return data[key];
}).slice().reverse()
}
}
};
</script>

8
src/components/app/ServerTemplate/ChannelTemplate.vue
View file

@ -1,13 +1,15 @@
<template>
<div :class="{channel: true, notifyAnimation: hasNotifications}">
<div :class="{channel: true, notifyAnimation: hasNotifications}">
<i class="material-icons">storage</i>
<div class="channel-name">{{ChannelData.name}}</div>
<div class="channel-name">
{{ ChannelData.name }}
</div>
</div>
</template>
<script>
export default {
props: ["ChannelData"],
props: ["channelData"],
computed: {
hasNotifications() {
const notifications = this.$store.getters.notifications;

56
src/components/app/ServerTemplate/ChannelsList.vue
View file

@ -1,12 +1,22 @@
<template>
<div class="channels-list">
<spinner v-if="channels === undefined" size="40"/>
<div class="wrapper" v-if="channels">
<ChannelTemplate v-for="channel in channels" :key="channel.channelID" :channel-data="channel" @click.native="openChannel(channel)"/>
<spinner
v-if="channels === undefined"
size="40"
/>
<div
v-if="channels"
class="wrapper"
>
<ChannelTemplate
v-for="channel in channels"
:key="channel.channelID"
:channel-data="channel"
@click.native="openChannel(channel)"
/>
</div>
</div>
</template>
<script>
import Spinner from "@/components/Spinner.vue";
import ChannelTemplate from "@/components/app/ServerTemplate/ChannelTemplate.vue";
@ -16,16 +26,18 @@ import {bus} from '@/main.js'
export default {
components: { ChannelTemplate, Spinner },
props: ["serverID"],
methods: {
openChannel(channel) {
const notificationExists = this.$store.getters.notifications.find(n => n.channelID === channel.channelID)
if (notificationExists && document.hasFocus()) {
this.$socket.emit('notification:dismiss', {channelID: channel.channelID});
computed: {
channels() {
const channelsIds = this.$store.getters["servers/channelsIDs"][this.serverID];
if (channelsIds) {
let channels = [];
for ( let channelID of channelsIds ){
channels.push(this.$store.getters.channels[channelID])
}
return channels;
} else {
return false;
}
bus.$emit('closeLeftMenu');
this.$store.dispatch('openChannel', channel)
}
},
@ -51,16 +63,16 @@ export default {
});
}
},
computed: {
channels() {
const channelsIds = this.$store.getters["servers/channelsIDs"][this.serverID];
if (channelsIds) {
let channels = [];
for ( let channelID of channelsIds ){
channels.push(this.$store.getters.channels[channelID])
}
return channels;
methods: {
openChannel(channel) {
const notificationExists = this.$store.getters.notifications.find(n => n.channelID === channel.channelID)
if (notificationExists && document.hasFocus()) {
this.$socket.emit('notification:dismiss', {channelID: channel.channelID});
}
bus.$emit('closeLeftMenu');
this.$store.dispatch('openChannel', channel)
}
}
};

94
src/components/app/ServerTemplate/ServerTemplate.vue
View file

@ -1,40 +1,60 @@
<template>
<div :class="{server: true, 'add-server': mode === 'ADD_SERVER'}">
<div :class="{'small-view': true, notifyAnimation: notification}">
<profile-picture size="50px" v-if="!mode" :url="tempImage"/>
<div class="add-icon" v-if="mode === 'ADD_SERVER'">
<profile-picture
v-if="!mode"
size="50px"
:url="tempImage"
/>
<div
v-if="mode === 'ADD_SERVER'"
class="add-icon"
>
<i class="material-icons">add</i>
</div>
<div class="server-name">{{mode === 'ADD_SERVER'? 'Create / Join Server' : ServerData.name }}</div>
<div class="server-name">
{{ mode === 'ADD_SERVER'? 'Create / Join Server' : ServerData.name }}
</div>
<div
v-if="mode !== 'ADD_SERVER'"
ref="contextMenuButton"
class="options-context-button"
v-if="mode !== 'ADD_SERVER'"
@click="showContextMenu = !showContextMenu"
>
<i class="material-icons">more_vert</i>
</div>
<div class="options-context-menu" v-if="showContextMenu" v-click-outside="closeContextMenu">
<div class="menu-button" @click="createInvite(ServerData.server_id)">Manage Invites</div>
<div
class="menu-button warn"
@click="leaveServer(ServerData.server_id)"
v-if="ServerData.creator.uniqueID !== user.uniqueID"
>Leave Server</div>
<div
v-if="showContextMenu"
v-click-outside="closeContextMenu"
class="options-context-menu"
>
<div
class="menu-button"
@click="showSettings()"
v-if="ServerData.creator.uniqueID === user.uniqueID"
>Server Settings</div>
<!-- <div
@click="createInvite(ServerData.server_id)"
>
Manage Invites
</div>
<div
v-if="ServerData.creator.uniqueID !== user.uniqueID"
class="menu-button warn"
@click="leaveServer(ServerData.server_id)"
>
Leave Server
</div>
<div
v-if="ServerData.creator.uniqueID === user.uniqueID"
>Delete Server</div> -->
class="menu-button"
@click="showSettings()"
>
Server Settings
</div>
</div>
</div>
<div ref="container">
<channels-list v-if="openChannel" :serverID="ServerData.server_id"/>
<channels-list
v-if="openChannel"
:server-i-d="ServerData.server_id"
/>
</div>
</div>
</template>
@ -47,9 +67,9 @@ import ServerService from "@/services/ServerService";
import smoothReflow from "vue-smooth-reflow";
export default {
mixins: [smoothReflow],
props: ["ServerData", "openChannel", "mode"],
components: { ProfilePicture, ChannelsList },
mixins: [smoothReflow],
props: ["serverData", "openChannel", "mode"],
data() {
return {
showContextMenu: false,
@ -57,6 +77,24 @@ export default {
tempImage: config.domain + "/avatars/noob"
};
},
computed: {
user() {
return this.$store.getters.user;
},
notification() {
const notifications = this.$store.getters.notifications;
const channels = this.$store.getters.channels
const notification = notifications.find(e => {
return channels[e.channelID] && channels[e.channelID].server_id && this.ServerData && channels[e.channelID].server_id === this.ServerData.server_id
})
return notification;
}
},
mounted() {
this.$smoothReflow({
el: this.$refs.container
});
},
methods: {
showSettings() {
this.showContextMenu = false;
@ -82,24 +120,6 @@ export default {
this.showContextMenu = false;
const {ok, error, result} = await ServerService.leaveServer(serverID);
}
},
mounted() {
this.$smoothReflow({
el: this.$refs.container
});
},
computed: {
user() {
return this.$store.getters.user;
},
notification() {
const notifications = this.$store.getters.notifications;
const channels = this.$store.getters.channels
const notification = notifications.find(e => {
return channels[e.channelID] && channels[e.channelID].server_id && this.ServerData && channels[e.channelID].server_id === this.ServerData.server_id
})
return notification;
}
}
};
</script>

22
src/components/app/Tabs/DirectMessage.vue
View file

@ -2,12 +2,12 @@
<div class="direct-message-tab">
<transition name="slidein">
<friends-list
class="left-panel"
v-click-outside="hideLeftPanel"
v-show="$mq === 'mobile' && showLeftPanel || ($mq !== 'mobile')"
v-click-outside="hideLeftPanel"
class="left-panel"
/>
</transition>
<message-panel/>
<message-panel />
</div>
</template>
@ -27,6 +27,14 @@ export default {
showLeftPanel: false
};
},
mounted() {
bus.$on("toggleLeftMenu", () => {
this.showLeftPanel = !this.showLeftPanel;
});
bus.$on("closeLeftMenu", () => {
this.showLeftPanel = false;
});
},
methods: {
hideLeftPanel(event) {
if (this.showLeftPanel) {
@ -35,14 +43,6 @@ export default {
}
}
}
},
mounted() {
bus.$on("toggleLeftMenu", () => {
this.showLeftPanel = !this.showLeftPanel;
});
bus.$on("closeLeftMenu", () => {
this.showLeftPanel = false;
});
}
};
</script>

42
src/components/app/Tabs/News.vue
View file

@ -3,34 +3,60 @@
<div class="change-log">
<span class="news-title">Changes in this release</span>
<div class="change" v-for="change in changelog" :key="change.title">
<div class="heading" :style="change.headColor ? `background-color: ${change.headColor}` : ``">
<div class="date">{{change.date}}</div>
<div class="changes-title">{{change.title}}</div>
<div
v-for="change in changelog"
:key="change.title"
class="change"
>
<div
class="heading"
:style="change.headColor ? `background-color: ${change.headColor}` : ``"
>
<div class="date">
{{ change.date }}
</div>
<div class="changes-title">
{{ change.title }}
</div>
</div>
<div class="information">
<div v-if="change.new">
<strong>What's new?</strong>
<br>
<ul>
<li v-for="(wnew, index) in change.new" :key="index" v-html="wnew"></li>
<li
v-for="(wnew, index) in change.new"
:key="index"
v-html="wnew"
/>
</ul>
</div>
<div v-if="change.fix">
<strong>Issues fixed</strong>
<br>
<ul>
<li v-for="(wfix, index) in change.fix" :key="index" v-html="wfix"></li>
<li
v-for="(wfix, index) in change.fix"
:key="index"
v-html="wfix"
/>
</ul>
</div>
<div v-if="change.next">
<strong>Up next</strong>
<br>
<ul>
<li v-for="(wnext, index) in change.next" :key="index" v-html="wnext"></li>
<li
v-for="(wnext, index) in change.next"
:key="index"
v-html="wnext"
/>
</ul>
</div>
<div v-if="change.msg" v-html="change.msg"></div>
<div
v-if="change.msg"
v-html="change.msg"
/>
</div>
</div>
</div>

32
src/components/app/Tabs/Servers.vue
View file

@ -2,17 +2,17 @@
<div class="direct-message-tab">
<transition name="slide-left">
<server-list
class="left-panel"
v-click-outside="hideLeftPanel"
v-show="$mq === 'mobile' && showLeftPanel || ($mq !== 'mobile')"
v-click-outside="hideLeftPanel"
class="left-panel"
/>
</transition>
<message-panel/>
<message-panel />
<transition name="slide-right">
<members-list
class="members-panel"
v-click-outside="hideMembersPanel"
v-show="($mq === 'members_panel' || $mq === 'mobile') && showMembersPanel || ($mq === 'desktop')"
v-click-outside="hideMembersPanel"
class="members-panel"
/>
</transition>
</div>
@ -37,6 +37,17 @@ export default {
showMembersPanel: false
};
},
mounted() {
bus.$on("toggleLeftMenu", () => {
this.showLeftPanel = !this.showLeftPanel;
});
bus.$on("toggleMembersPanel", () => {
this.showMembersPanel = !this.showMembersPanel;
});
bus.$on("closeLeftMenu", () => {
this.showLeftPanel = false;
});
},
methods: {
hideLeftPanel(event) {
if (this.showLeftPanel) {
@ -52,17 +63,6 @@ export default {
}
}
}
},
mounted() {
bus.$on("toggleLeftMenu", () => {
this.showLeftPanel = !this.showLeftPanel;
});
bus.$on("toggleMembersPanel", () => {
this.showMembersPanel = !this.showMembersPanel;
});
bus.$on("closeLeftMenu", () => {
this.showLeftPanel = false;
});
}
};
</script>

36
src/components/app/TypingStatus.vue
View file

@ -1,8 +1,18 @@
<template>
<transition name="typing-animate">
<div class="typing-status" v-if="formatedRecipients">
<object class="animation" type="image/svg+xml" :data="animation"></object>
<div class="text" v-html="formatedRecipients"></div>
<div
v-if="formatedRecipients"
class="typing-status"
>
<object
class="animation"
type="image/svg+xml"
:data="animation"
/>
<div
class="text"
v-html="formatedRecipients"
/>
</div>
</transition>
</template>
@ -15,16 +25,6 @@ export default {
animation: require("@/assets/typing-indicator.svg")
};
},
methods: {
escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
}
},
computed: {
formatedRecipients() {
const arr = Object.values(this.recipients);
@ -55,6 +55,16 @@ export default {
}
return arr;
}
},
methods: {
escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
}
}
};
</script>

52
src/components/app/relationships/AddFriendPanel.vue
View file

@ -1,24 +1,52 @@
<template>
<div class="add-friend-panel">
<div class="panel-title" @click="expanded = !expanded">
<div
class="panel-title"
@click="expanded = !expanded"
>
<div>
<i class="material-icons" v-if="!expanded">
<i
v-if="!expanded"
class="material-icons"
>
person_add
</i>
<span>{{expanded ? "Hide" : "Add friend"}}</span>
<span>{{ expanded ? "Hide" : "Add friend" }}</span>
</div>
</div>
<transition name="slide" appear>
<div class="add-friend" v-if="expanded">
<div class="title">Add friend</div>
<div class="info">Type in your friends username and tag. eg: someone@jt4g</div>
<div class="infoC">Creators tag: Fishie@azK0</div>
<form action="#" @submit.prevent="addFriend">
<input type="text" placeholder="username@tag" v-model="input">
<loadingButton :loading="currentButtonMessage == 1" :message="buttonMessages[currentButtonMessage]" />
<transition
name="slide"
appear
>
<div
v-if="expanded"
class="add-friend"
>
<div class="title">
Add friend
</div>
<div class="info">
Type in your friends username and tag. eg: someone@jt4g
</div>
<div class="infoC">
Creators tag: Fishie@azK0
</div>
<form
action="#"
@submit.prevent="addFriend"
>
<input
v-model="input"
type="text"
placeholder="username@tag"
>
<loadingButton
:loading="currentButtonMessage == 1"
:message="buttonMessages[currentButtonMessage]"
/>
</form>
<div :class="{message: true, warning: errorMessage.isError}">
{{errorMessage.message}}
{{ errorMessage.message }}
</div>
</div>
</transition>

75
src/components/app/relationships/FriendsTemplate.vue
View file

@ -1,15 +1,36 @@
<template>
<div :class="{friend: true, notifyAnimation: (notifications && notifications > 0) }" :style="`background: ${status.bgColor};`" @click="openChat">
<div class="profile-picture" @click="openUserInformation" :style="`border-color: ${status.statusColor}; background-image: url(${userAvatar})`">
<div class="status" :style="`background-image: url(${status.statusURL})`" ></div>
<div
:class="{friend: true, notifyAnimation: (notifications && notifications > 0) }"
:style="`background: ${status.bgColor};`"
@click="openChat"
>
<div
class="profile-picture"
:style="`border-color: ${status.statusColor}; background-image: url(${userAvatar})`"
@click="openUserInformation"
>
<div
class="status"
:style="`background-image: url(${status.statusURL})`"
/>
</div>
<div class="information">
<div class="username">{{recipient.username}}</div>
<div class="status-name" :style="`color: ${status.statusColor}`">{{status.statusName}}</div>
<div class="username">
{{ recipient.username }}
</div>
<div
class="status-name"
:style="`color: ${status.statusColor}`"
>
{{ status.statusName }}
</div>
</div>
<div class="notification" v-if="notifications && notifications >0">
<div
v-if="notifications && notifications >0"
class="notification"
>
<div class="notification-inner">
{{notifications}}
{{ notifications }}
</div>
</div>
</div>
@ -24,26 +45,6 @@ import {bus} from '@/main'
export default {
props: ['username', 'tag', 'channelID', 'uniqueID', 'recipient'],
methods: {
async openChat(event) {
if (event.target.closest(".profile-picture")) return;
bus.$emit('closeLeftMenu');
// dismiss notification if exists
// TODO move this into openchat or something :/
if (this.notifications && this.notifications >= 1 && document.hasFocus()) {
this.$socket.emit('notification:dismiss', {channelID: this.channelID});
}
this.$store.dispatch('openChat', {
uniqueID: this.recipient.uniqueID,
channelID: this.channelID,
channelName: this.recipient.username
})
},
openUserInformation() {
this.$store.dispatch('setUserInformationPopout', this.recipient.uniqueID)
}
},
computed: {
notifications () {
const channelID = this.$props.channelID;
@ -72,6 +73,26 @@ export default {
bgColor: statuses[parseInt(status)].bgColor
}
}
},
methods: {
async openChat(event) {
if (event.target.closest(".profile-picture")) return;
bus.$emit('closeLeftMenu');
// dismiss notification if exists
// TODO move this into openchat or something :/
if (this.notifications && this.notifications >= 1 && document.hasFocus()) {
this.$socket.emit('notification:dismiss', {channelID: this.channelID});
}
this.$store.dispatch('openChat', {
uniqueID: this.recipient.uniqueID,
channelID: this.channelID,
channelName: this.recipient.username
})
},
openUserInformation() {
this.$store.dispatch('setUserInformationPopout', this.recipient.uniqueID)
}
}
}
</script>

24
src/components/app/relationships/OfflineFriends.vue
View file

@ -1,11 +1,25 @@
<template>
<div class="friends" >
<div class="tab" @click="expanded = !expanded">
<Tab :expanded="expanded" tabname="Offline" />
<div class="friends">
<div
class="tab"
@click="expanded = !expanded"
>
<Tab
:expanded="expanded"
tabname="Offline"
/>
</div>
<transition name="list">
<div class="list" v-if="expanded">
<FriendsTemplate v-for="(friend, key) of friends" :key="key" :channelID="friend.channelID" :recipient="friends[key].recipient" />
<div
v-if="expanded"
class="list"
>
<FriendsTemplate
v-for="(friend, key) of friends"
:key="key"
:channel-i-d="friend.channelID"
:recipient="friends[key].recipient"
/>
</div>
</transition>
</div>

30
src/components/app/relationships/OnlineFriends.vue
View file

@ -1,11 +1,25 @@
<template>
<div class="friends" >
<div class="tab" @click="expanded = !expanded">
<Tab :expanded="expanded" tabname="Online" />
<div class="friends">
<div
class="tab"
@click="expanded = !expanded"
>
<Tab
:expanded="expanded"
tabname="Online"
/>
</div>
<transition name="list">
<div class="list" v-if="expanded">
<FriendsTemplate v-for="(friend, key) of friends" :key="key" :channelID="friend.channelID" :recipient="friends[key].recipient"/>
<div
v-if="expanded"
class="list"
>
<FriendsTemplate
v-for="(friend, key) of friends"
:key="key"
:channel-i-d="friend.channelID"
:recipient="friends[key].recipient"
/>
</div>
</transition>
</div>
@ -23,9 +37,6 @@ export default {
return {
expanded: true
}
},
methods: {
},
computed: {
friends() {
@ -51,6 +62,9 @@ export default {
});
return result.filter(friend => friend.status == 2 && (presences[friend.uniqueID] && presences[friend.uniqueID] > 0 ));
}
},
methods: {
}
}
</script>

26
src/components/app/relationships/PendingFriends.vue
View file

@ -1,11 +1,27 @@
<template>
<div class="pending-friends" >
<div class="tab" @click="expanded = !expanded">
<Tab :expanded="expanded" tabname="Pending requests" />
<div class="pending-friends">
<div
class="tab"
@click="expanded = !expanded"
>
<Tab
:expanded="expanded"
tabname="Pending requests"
/>
</div>
<transition name="list">
<div class="list" v-if="expanded">
<PendingTemplate v-for="(friend, key) of friends" :key="key" :uniqueID="friend.recipient.uniqueID" :status="friend.status" :username="friend.recipient.username" :tag="friend.recipient.tag"/>
<div
v-if="expanded"
class="list"
>
<PendingTemplate
v-for="(friend, key) of friends"
:key="key"
:unique-i-d="friend.recipient.uniqueID"
:status="friend.status"
:username="friend.recipient.username"
:tag="friend.recipient.tag"
/>
</div>
</transition>
</div>

40
src/components/app/relationships/PendingTemplate.vue
View file

@ -1,17 +1,31 @@
<template>
<div class="pending-friend">
<div class="profile-picture" @click="openUserInformation" :style="`background-image: url(${userAvatar})`"></div>
<div
class="profile-picture"
:style="`background-image: url(${userAvatar})`"
@click="openUserInformation"
/>
<div class="information">
<div class="username">{{$props.username}}</div>
<div class="tag">@{{$props.tag}}</div>
<div class="username">
{{ $props.username }}
</div>
<div class="tag">
@{{ $props.tag }}
</div>
</div>
<div class="buttons">
<div :class="{button: true, accept: true, hide: $props.status == 0}" @click="accept" >
<div
:class="{button: true, accept: true, hide: $props.status == 0}"
@click="accept"
>
<i class="material-icons">
check
</i>
</div>
<div class="button decline" @click="deny">
<div
class="button decline"
@click="deny"
>
<i class="material-icons">
not_interested
</i>
@ -26,6 +40,14 @@ import config from '@/config.js'
export default {
props: ['username', 'tag', 'status', 'uniqueID'],
computed: {
user() {
return this.$store.getters.user.friends[this.$props.uniqueID].recipient;
},
userAvatar() {
return config.domain + "/avatars/" + this.user.avatar
},
},
methods: {
deny() {
RelationshipService.delete(this.$props.uniqueID)
@ -36,14 +58,6 @@ export default {
openUserInformation() {
this.$store.dispatch('setUserInformationPopout', this.uniqueID)
}
},
computed: {
user() {
return this.$store.getters.user.friends[this.$props.uniqueID].recipient;
},
userAvatar() {
return config.domain + "/avatars/" + this.user.avatar
},
}
}
</script>

7
src/components/app/relationships/RecentFriends.vue
View file

@ -2,7 +2,12 @@
<div class="recents">
<transition name="list">
<div class="list">
<FriendsTemplate v-for="(channel, key) of channels" :key="key" :channelID="channel.channelID" :recipient="channel.recipients[0]"/>
<FriendsTemplate
v-for="(channel, key) of channels"
:key="key"
:channel-i-d="channel.channelID"
:recipient="channel.recipients[0]"
/>
</div>
</transition>
</div>

2
src/components/app/relationships/Tab.vue
View file

@ -4,7 +4,7 @@
expand_more
</i>
<div class="tab-name">
{{$props.tabname}}
{{ $props.tabname }}
</div>
</div>
</template>

54
src/components/app/statusList.vue
View file

@ -1,13 +1,51 @@
<template>
<div class="status-popout">
<div class="status-list" @click="changeStatus(1)"><span class="status-icon"><img class="icon" :src="getStatusLogo(1)" /></span><span class="text">Online</span></div>
<div class="status-list" @click="changeStatus(2)"><span class="status-icon"><img class="icon" :src="getStatusLogo(2)" /></span><span class="text">Away</span></div>
<div class="status-list" @click="changeStatus(3)"><span class="status-icon"><img class="icon" :src="getStatusLogo(3)" /></span><span class="text">Busy</span></div>
<div class="status-list" @click="changeStatus(4)"><span class="status-icon"><img class="icon" :src="getStatusLogo(4)" /></span><span class="text">Looking to play</span></div>
<div class="status-list" @click="changeStatus(0)"><span class="status-icon"><img class="icon" :src="getStatusLogo(0)" /></span><span class="text">Offline</span></div>
<div class="status-popout">
<div
class="status-list"
@click="changeStatus(1)"
>
<span class="status-icon"><img
class="icon"
:src="getStatusLogo(1)"
></span><span class="text">Online</span>
</div>
<div
class="status-list"
@click="changeStatus(2)"
>
<span class="status-icon"><img
class="icon"
:src="getStatusLogo(2)"
></span><span class="text">Away</span>
</div>
<div
class="status-list"
@click="changeStatus(3)"
>
<span class="status-icon"><img
class="icon"
:src="getStatusLogo(3)"
></span><span class="text">Busy</span>
</div>
<div
class="status-list"
@click="changeStatus(4)"
>
<span class="status-icon"><img
class="icon"
:src="getStatusLogo(4)"
></span><span class="text">Looking to play</span>
</div>
<div
class="status-list"
@click="changeStatus(0)"
>
<span class="status-icon"><img
class="icon"
:src="getStatusLogo(0)"
></span><span class="text">Offline</span>
</div>
</div>
</template>
<script>

23
src/components/app/uploadsQueue.vue
View file

@ -1,17 +1,30 @@
<template>
<div class="uploads-queue">
<div class="upload" v-for="(upload, index) in $props.queue" :key="index">
<div
v-for="(upload, index) in $props.queue"
:key="index"
class="upload"
>
<div class="icon">
<i class="material-icons">insert_drive_file</i>
</div>
<div class="information">
<div class="info">{{upload.name}}</div>
<div class="info size">{{upload.size}}</div>
<div class="info">
{{ upload.name }}
</div>
<div class="info size">
{{ upload.size }}
</div>
<div class="progress">
<div class="progress-bar">
<div class="progress-bar-inner" :style="{width: `${upload.percent}%`}"></div>
<div
class="progress-bar-inner"
:style="{width: `${upload.percent}%`}"
/>
</div>
<div class="percent">
{{ upload.percent }}%
</div>
<div class="percent">{{upload.percent}}%</div>
</div>
</div>
</div>

31
src/components/homePage/Popout.vue
View file

@ -1,17 +1,34 @@
<template>
<div class="profile-popout">
<div class="triangle"></div>
<div class="triangle" />
<div class="inner">
<profile-picture v-if="user" class="avatar" :url="avatarDomain + user.avatar" :admin="user.admin" size="40px" emoteSize="17px" />
<profile-picture
v-if="user"
class="avatar"
:url="avatarDomain + user.avatar"
:admin="user.admin"
size="40px"
emote-size="17px"
/>
<div class="information">
<div
class="username"
>{{user.username}}</div>
<div class="tag">@{{user.tag}}</div>
>
{{ user.username }}
</div>
<div class="tag">
@{{ user.tag }}
</div>
</div>
<div class="buttons">
<i class="material-icons warn" @click="logOut">exit_to_app</i>
<i class="material-icons" @click="openApp">message</i>
<i
class="material-icons warn"
@click="logOut"
>exit_to_app</i>
<i
class="material-icons"
@click="openApp"
>message</i>
</div>
</div>
</div>
@ -22,8 +39,8 @@ import ProfilePicture from "@/components/ProfilePictureTemplate.vue";
import config from "@/config.js";
export default {
props: ["user"],
components: { ProfilePicture },
props: ["user"],
data() {
return {
avatarDomain: config.domain + "/avatars/"

3
src/router.js
View file

@ -4,7 +4,7 @@ Vue.use(VueRouter);
import { store } from "./store/index";
import VueSocketio from "vue-socket.io-extended";
import io from "socket.io-client";
import config from "./config";
import config from "./config.js";
import VueMq from "vue-mq";
// import MainApp from '../src/views/App.vue'
@ -58,6 +58,7 @@ export const router = new VueRouter({
if (!localStorage.getItem("hauthid")) {
return router.push({ path: "/login" });
}
Vue.use(
VueSocketio,
io(config.socketIP, {

6
src/views/GDriveCallback.vue
View file

@ -1,7 +1,7 @@
<template>
<div>
Redirecting...
</div>
<div>
Redirecting...
</div>
</template>
<script>

95
src/views/HomePage - Legacy.vue
View file

@ -1,46 +1,77 @@
<template>
<div id="app">
<vue-headful title="Nertivia" description="Nertivia Chat Client"/>
<div class="background-image"></div>
<div class="layout">
<div class="small-view-nav-bar">
<div class="small-logo"></div>
<div class="small-title">Nertivia</div>
<div class="show-menu-button" @click="showMobileMenu = !showMobileMenu">
<div id="app">
<vue-headful
title="Nertivia"
description="Nertivia Chat Client"
/>
<div class="background-image" />
<div class="layout">
<div class="small-view-nav-bar">
<div class="small-logo" />
<div class="small-title">
Nertivia
</div>
<div
class="show-menu-button"
@click="showMobileMenu = !showMobileMenu"
>
<i class="material-icons">
menu
menu
</i>
</div>
</div>
</div>
<div class="panels">
<div class="panels">
<div class="left-panel">
<div class="title">The best chat client that wont restrict you from important and fun features.</div>
<img src="../assets/graphics/HomeGraphics.png" class="graphic-app" />
<div class="change-log-mini" @click="showChangeLog = true">
<div class="change-title">Change log <span style="font-size: 15px; color: rgba(211, 211, 211, 0.774);">Click for details</span></div>
<div class="title">
The best chat client that wont restrict you from important and fun features.
</div>
<img
src="../assets/graphics/HomeGraphics.png"
class="graphic-app"
>
<div
class="change-log-mini"
@click="showChangeLog = true"
>
<div class="change-title">
Change log <span style="font-size: 15px; color: rgba(211, 211, 211, 0.774);">Click for details</span>
</div>
<div class="change-list">
<div class="change" v-for="change in changelogFiltered" :key="change.title">
<div class="notable-changes">{{change.shortTitle}}</div>
<div class="change-date">{{change.date}}</div>
<div
v-for="change in changelogFiltered"
:key="change.title"
class="change"
>
<div class="notable-changes">
{{ change.shortTitle }}
</div>
<div class="change-date">
{{ change.date }}
</div>
</div>
</div>
</div>
<div class="twitter-outer">
<twitter class="twitter">
<div slot="loading">loading .....</div>
<a class="twitter-timeline" data-height="500" data-theme="dark" href="https://twitter.com/NertiviaApp?ref_src=twsrc%5Etfw">Tweets by NertiviaApp</a>
<div slot="loading">
loading .....
</div>
<a
class="twitter-timeline"
data-height="500"
data-theme="dark"
href="https://twitter.com/NertiviaApp?ref_src=twsrc%5Etfw"
>Tweets by NertiviaApp</a>
</twitter>
</div>
</div>
<RightPanel :class="{'show-menu-content': showMobileMenu }" />
<RightPanel :class="{'show-menu-content': showMobileMenu }" />
</div>
</div>
<transition name="fade">
<ChangeLog v-if="showChangeLog" />
</transition>
</div>
<transition name="fade">
<ChangeLog v-if="showChangeLog"/>
</transition>
</div>
</template>
<script>
@ -63,15 +94,15 @@ export default {
changelog
}
},
mounted() {
bus.$on('closeChangeLog', () => {
this.showChangeLog = false;
})
},
computed: {
changelogFiltered() {
return this.changelog.slice(0, 3)
}
},
mounted() {
bus.$on('closeChangeLog', () => {
this.showChangeLog = false;
})
}
}

115
src/views/HomePage.vue
View file

@ -1,48 +1,113 @@
<template>
<div id="app">
<vue-headful title="Nertivia" description="Nertivia Chat Client"/>
<div class="background-image" ref="backgroundImage"></div>
<spinner v-if="!showPage"/>
<div class="content" v-if="showPage">
<transition name="fall-down" appear>
<vue-headful
title="Nertivia"
description="Nertivia Chat Client"
/>
<div
ref="backgroundImage"
class="background-image"
/>
<spinner v-if="!showPage" />
<div
v-if="showPage"
class="content"
>
<transition
name="fall-down"
appear
>
<div class="header">
<div class="logo"></div>
<div class="name">Nertivia</div>
<div class="logo" />
<div class="name">
Nertivia
</div>
<div class="links">
<div class="link" @click="signupPage" v-if="!loggedIn">Sign up</div>
<div class="link" @click="loginPage" v-if="!loggedIn">Login</div>
<spinner class="spinner-profile" :size="50" v-if="loggedIn && !user" />
<profile-picture class="avatar" v-if="loggedIn && user" @click.native="showPopout = !showPopout" :hover='true' :url="avatarDomain + user.avatar" :admin="user.admin" size="40px" emoteSize="17px"/>
<div
v-if="!loggedIn"
class="link"
@click="signupPage"
>
Sign up
</div>
<div
v-if="!loggedIn"
class="link"
@click="loginPage"
>
Login
</div>
<spinner
v-if="loggedIn && !user"
class="spinner-profile"
:size="50"
/>
<profile-picture
v-if="loggedIn && user"
class="avatar"
:hover="true"
:url="avatarDomain + user.avatar"
:admin="user.admin"
size="40px"
emote-size="17px"
@click.native="showPopout = !showPopout"
/>
<transition name="fall-down-fast">
<Popout v-if="user && loggedIn && showPopout" @logout="logOut" :user="user" v-click-outside="closePopout"/>
<Popout
v-if="user && loggedIn && showPopout"
v-click-outside="closePopout"
:user="user"
@logout="logOut"
/>
</transition>
</div>
</div>
</transition>
<transition name="side-in" appear>
<transition
name="side-in"
appear
>
<div class="inner-content">
<div
class="title"
>The best chat client that won't restrict you from important and fun features.</div>
<img class="graphic" src="@/assets/graphics/HomeGraphics2.png">
>
The best chat client that won't restrict you from important and fun features.
</div>
<img
class="graphic"
src="@/assets/graphics/HomeGraphics2.png"
>
<div class="buttons">
<div class="button" @click="openApp">Open In Browser</div>
<div
class="button"
@click="openApp"
>
Open In Browser
</div>
<!-- <div class="button" >Download App</div> -->
</div>
<div class="features-list">
<div class="title">Things you can do in Nertivia</div>
<div class="title">
Things you can do in Nertivia
</div>
<div class="list">
<div class="feature">
<i class="material-icons">insert_drive_file</i>
<div class="description">1GB per file limit, upload huge files!</div>
<div class="description">
1GB per file limit, upload huge files!
</div>
</div>
<div class="feature">
<i class="material-icons">face</i>
<div class="description">Free custom gif emojis and profile picture.</div>
<div class="description">
Free custom gif emojis and profile picture.
</div>
</div>
<div class="feature">
<i class="material-icons">storage</i>
<div class="description">Make your own servers with channels.</div>
<div class="description">
Make your own servers with channels.
</div>
</div>
</div>
</div>
@ -70,6 +135,11 @@ export default {
avatarDomain: config.domain + '/avatars/'
};
},
async mounted() {
if (this.loggedIn) this.getUser();
this.preloadImages();
},
methods: {
closePopout(event) {
if (!event.target.closest('.avatar'))
@ -135,11 +205,6 @@ export default {
this.user = result.data.user;
}
}
},
async mounted() {
if (this.loggedIn) this.getUser();
this.preloadImages();
}
};
</script>

78
src/views/Invites.vue
View file

@ -1,20 +1,46 @@
<template>
<div id="app">
<div class="app-content">
<header-login v-on:isDay="isDayEvent"/>
<header-login @isDay="isDayEvent" />
<div class="content">
<transition appear name="fade-up">
<div :class="{box: true, red: server === undefined}" >
<spinner v-if="server === null"/>
<transition
appear
name="fade-up"
>
<div :class="{box: true, red: server === undefined}">
<spinner v-if="server === null" />
<div v-if="server === undefined">
<div class="invalid">{{errorMsg}}</div>
<div class="invalid">
{{ errorMsg }}
</div>
</div>
<div class="server" v-if="server">
<profile-picture class="avatar" size="100px" :url="tempImage"/>
<div class="server-name">{{server.name}}</div>
<div
v-if="server"
class="server"
>
<profile-picture
class="avatar"
size="100px"
:url="tempImage"
/>
<div class="server-name">
{{ server.name }}
</div>
<div class="buttons">
<div class="button join-button" @click="joinServerButton" v-if="loggedIn">Join {{server.name}}</div>
<div class="button join-button" v-else @click="loginButton">Login to join</div>
<div
v-if="loggedIn"
class="button join-button"
@click="joinServerButton"
>
Join {{ server.name }}
</div>
<div
v-else
class="button join-button"
@click="loginButton"
>
Login to join
</div>
</div>
</div>
</div>
@ -23,9 +49,9 @@
</div>
<div class="background">
<div :class="{background: true, 'night-background': true, chosen: !isDay}">
<particlesJS class="particles"/>
<particlesJS class="particles" />
</div>
<div class="background day-background"></div>
<div class="background day-background" />
</div>
</div>
</template>
@ -48,6 +74,20 @@ export default {
errorMsg: ""
};
},
async mounted() {
const inviteID = this.$route.params.invite_id;
const { ok, error, result } = await ServerService.getInviteDetail(inviteID);
if (ok) {
this.server = result.data;
} else {
if (error.response === undefined) {
this.errorMsg = "Cannot connect to server. Try again later.";
} else {
this.errorMsg = "The invite code is either invalid, expired or blocked.";
}
this.server = undefined;
}
},
methods: {
isDayEvent(data) {
this.isDay = data;
@ -84,20 +124,6 @@ export default {
const inviteID = this.$route.params.invite_id;
this.$router.push(`/login?to=invites&id=${inviteID}`);
}
},
async mounted() {
const inviteID = this.$route.params.invite_id;
const { ok, error, result } = await ServerService.getInviteDetail(inviteID);
if (ok) {
this.server = result.data;
} else {
if (error.response === undefined) {
this.errorMsg = "Cannot connect to server. Try again later.";
} else {
this.errorMsg = "The invite code is either invalid, expired or blocked.";
}
this.server = undefined;
}
}
};
</script>

81
src/views/LoginPage.vue
View file

@ -1,50 +1,95 @@
<template>
<div id="app">
<div class="app-content">
<header-login v-on:isDay="isDayEvent"/>
<header-login @isDay="isDayEvent" />
<div class="content">
<transition appear name="fade-up">
<div class="box" v-if="visible">
<transition
appear
name="fade-up"
>
<div
v-if="visible"
class="box"
>
<div class="title">
<i class="material-icons">account_circle</i>
Login
</div>
<div class="info">Login to access Nertivia</div>
<form action="#" @submit.prevent="submitForm" v-if="!showCaptcha">
<div class="info">
Login to access Nertivia
</div>
<form
v-if="!showCaptcha"
action="#"
@submit.prevent="submitForm"
>
<div class="input">
<div class="input-text">
Email
<span class="error" v-if="email.alert">- {{email.alert}}</span>
<span
v-if="email.alert"
class="error"
>- {{ email.alert }}</span>
</div>
<input type="email" v-model="email.value" placeholder="Email">
<input
v-model="email.value"
type="email"
placeholder="Email"
>
</div>
<div class="input">
<div class="input-text">
Password
<span class="error" v-if="password.alert">- {{password.alert}}</span>
<span
v-if="password.alert"
class="error"
>- {{ password.alert }}</span>
</div>
<input
type="password"
v-model="password.value"
type="password"
autocomplete="password"
placeholder="Password"
>
</div>
<span class="error" style="text-align: center;" v-if="otherError">{{otherError}}</span>
<span
v-if="otherError"
class="error"
style="text-align: center;"
>{{ otherError }}</span>
<div class="buttons">
<button type="submit" :class="{button: true, deactive: deactive}">Login</button>
<button class="button register-button" @click.prevent="registerButton">I'm new!</button>
<button
type="submit"
:class="{button: true, deactive: deactive}"
>
Login
</button>
<button
class="button register-button"
@click.prevent="registerButton"
>
I'm new!
</button>
</div>
</form>
<div class="captcha-box" v-if="showCaptcha">
<div
v-if="showCaptcha"
class="captcha-box"
>
<div class="input captcha-input">
<div class="input-text">
Beep Boop
<span class="error" v-if="reCaptcha.alert">- {{reCaptcha.alert}}</span>
<span
v-if="reCaptcha.alert"
class="error"
>- {{ reCaptcha.alert }}</span>
</div>
<div class="captcha">
<Recaptcha ref="recaptcha" @verify="captchaSubmit"/>
<Recaptcha
ref="recaptcha"
@verify="captchaSubmit"
/>
</div>
</div>
</div>
@ -53,8 +98,10 @@
</div>
</div>
<div class="background">
<div :class="{background: true, 'night-background': true, chosen: !isDay}"><particlesJS class="particles"/></div>
<div class="background day-background"></div>
<div :class="{background: true, 'night-background': true, chosen: !isDay}">
<particlesJS class="particles" />
</div>
<div class="background day-background" />
</div>
</div>
</template>

85
src/views/RegisterPage.vue
View file

@ -1,32 +1,55 @@
<template>
<div id="app">
<div class="app-content">
<header-login v-on:isDay="isDayEvent"/>
<header-login @isDay="isDayEvent" />
<div class="content">
<transition appear name="fade-up">
<div class="box" v-if="visible">
<transition
appear
name="fade-up"
>
<div
v-if="visible"
class="box"
>
<div class="title">
<i class="material-icons">account_circle</i>
Register
</div>
<div class="info">Welcome, new user! Hope you enjoy Nertivia!</div>
<form action="#" @submit.prevent="formSubmit" v-if="!showCaptcha">
<div class="info">
Welcome, new user! Hope you enjoy Nertivia!
</div>
<form
v-if="!showCaptcha"
action="#"
@submit.prevent="formSubmit"
>
<div class="input">
<div class="input-text">
Email
<span class="error" v-if="email.alert">- {{email.alert}}</span>
<span
v-if="email.alert"
class="error"
>- {{ email.alert }}</span>
</div>
<input type="email" v-model="email.value" placeholder="Email" autocomplete="off">
<input
v-model="email.value"
type="email"
placeholder="Email"
autocomplete="off"
>
</div>
<div class="input">
<div class="input-text">
Username
<span class="error" v-if="username.alert">- {{username.alert}}</span>
<span
v-if="username.alert"
class="error"
>- {{ username.alert }}</span>
</div>
<input
type="text"
v-model="username.value"
type="text"
placeholder="Username"
autocomplete="off"
>
@ -35,29 +58,51 @@
<div class="input">
<div class="input-text">
Password
<span class="error" v-if="password.alert">- {{password.alert}}</span>
<span
v-if="password.alert"
class="error"
>- {{ password.alert }}</span>
</div>
<input
type="password"
v-model="password.value"
type="password"
autocomplete="off"
placeholder="Password"
>
</div>
<span class="error" style="text-align: center;" v-if="otherError">{{otherError}}</span>
<span
v-if="otherError"
class="error"
style="text-align: center;"
>{{ otherError }}</span>
<div class="buttons">
<button type="submit" :class="{button: true, deactive: deactive}">Register</button>
<button
type="submit"
:class="{button: true, deactive: deactive}"
>
Register
</button>
<button
class="button register-button"
@click.prevent="loginButton"
>I'm already a user!</button>
>
I'm already a user!
</button>
</div>
</form>
<div class="captcha-box" v-if="showCaptcha">
<div
v-if="showCaptcha"
class="captcha-box"
>
<div class="input captcha-input">
<div class="input-text">Beep Boop</div>
<div class="input-text">
Beep Boop
</div>
<div class="captcha">
<Recaptcha ref="recaptcha" @verify="captchaSubmit"/>
<Recaptcha
ref="recaptcha"
@verify="captchaSubmit"
/>
</div>
</div>
</div>
@ -66,8 +111,10 @@
</div>
</div>
<div class="background">
<div :class="{background: true, 'night-background': true, chosen: !isDay}"><particlesJS class="particles"/></div>
<div class="background day-background"></div>
<div :class="{background: true, 'night-background': true, chosen: !isDay}">
<particlesJS class="particles" />
</div>
<div class="background day-background" />
</div>
</div>
</template>

280
yarn.lock
View file

@ -29,6 +29,26 @@
semver "^5.4.1"
source-map "^0.5.0"
"@babel/core@^7.5.0":
version "7.5.0"
resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.5.0.tgz#6ed6a2881ad48a732c5433096d96d1b0ee5eb734"
integrity sha512-6Isr4X98pwXqHvtigw71CKgmhL1etZjPs5A67jL/w0TkLM9eqmFR40YrnJvEc1WnMZFsskjsmid8bHZyxKEAnw==
dependencies:
"@babel/code-frame" "^7.0.0"
"@babel/generator" "^7.5.0"
"@babel/helpers" "^7.5.0"
"@babel/parser" "^7.5.0"
"@babel/template" "^7.4.4"
"@babel/traverse" "^7.5.0"
"@babel/types" "^7.5.0"
convert-source-map "^1.1.0"
debug "^4.1.0"
json5 "^2.1.0"
lodash "^4.17.11"
resolve "^1.3.2"
semver "^5.4.1"
source-map "^0.5.0"
"@babel/generator@^7.4.4":
version "7.4.4"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.4.4.tgz#174a215eb843fc392c7edcaabeaa873de6e8f041"
@ -40,6 +60,17 @@
source-map "^0.5.0"
trim-right "^1.0.1"
"@babel/generator@^7.5.0":
version "7.5.0"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.5.0.tgz#f20e4b7a91750ee8b63656073d843d2a736dca4a"
integrity sha512-1TTVrt7J9rcG5PMjvO7VEG3FrEoEJNHxumRq66GemPmzboLWtIjjcJgk8rokuAS7IiRSpgVSu5Vb9lc99iJkOA==
dependencies:
"@babel/types" "^7.5.0"
jsesc "^2.5.1"
lodash "^4.17.11"
source-map "^0.5.0"
trim-right "^1.0.1"
"@babel/helper-annotate-as-pure@^7.0.0":
version "7.0.0"
resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.0.0.tgz#323d39dd0b50e10c7c06ca7d7638e6864d8c5c32"
@ -216,6 +247,15 @@
"@babel/traverse" "^7.4.4"
"@babel/types" "^7.4.4"
"@babel/helpers@^7.5.0":
version "7.5.2"
resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.5.2.tgz#97424dc82fc0041f4c751119b4d2b1ec68cdb5ba"
integrity sha512-NDkkTqDvgFUeo8djXBOiwO/mFjownznOWvmP9hvNdfiFUmx0nwNOqxuaTTbxjH744eQsD9M5ubC7gdANBvIWPw==
dependencies:
"@babel/template" "^7.4.4"
"@babel/traverse" "^7.5.0"
"@babel/types" "^7.5.0"
"@babel/highlight@^7.0.0":
version "7.0.0"
resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.0.0.tgz#f710c38c8d458e6dd9a201afb637fcb781ce99e4"
@ -230,6 +270,11 @@
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.4.5.tgz#04af8d5d5a2b044a2a1bffacc1e5e6673544e872"
integrity sha512-9mUqkL1FF5T7f0WDFfAoDdiMVPWsdD1gZYzSnaXsxUCUqzuch/8of9G3VUSNiZmMBoRxT3neyVsqeiL/ZPcjew==
"@babel/parser@^7.5.0":
version "7.5.0"
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.5.0.tgz#3e0713dff89ad6ae37faec3b29dcfc5c979770b7"
integrity sha512-I5nW8AhGpOXGCCNYGc+p7ExQIBxRFnS2fd/d862bNOKvmoEPjYPcfIjsfdy0ujagYOIYPczKgD9l3FsgTkAzKA==
"@babel/plugin-proposal-async-generator-functions@^7.2.0":
version "7.2.0"
resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.2.0.tgz#b289b306669dce4ad20b0252889a15768c9d417e"
@ -658,6 +703,21 @@
globals "^11.1.0"
lodash "^4.17.11"
"@babel/traverse@^7.5.0":
version "7.5.0"
resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.5.0.tgz#4216d6586854ef5c3c4592dab56ec7eb78485485"
integrity sha512-SnA9aLbyOCcnnbQEGwdfBggnc142h/rbqqsXcaATj2hZcegCl903pUD/lfpsNBlBSuWow/YDfRyJuWi2EPR5cg==
dependencies:
"@babel/code-frame" "^7.0.0"
"@babel/generator" "^7.5.0"
"@babel/helper-function-name" "^7.1.0"
"@babel/helper-split-export-declaration" "^7.4.4"
"@babel/parser" "^7.5.0"
"@babel/types" "^7.5.0"
debug "^4.1.0"
globals "^11.1.0"
lodash "^4.17.11"
"@babel/types@^7.0.0", "@babel/types@^7.2.0", "@babel/types@^7.4.4":
version "7.4.4"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.4.4.tgz#8db9e9a629bb7c29370009b4b779ed93fe57d5f0"
@ -667,6 +727,15 @@
lodash "^4.17.11"
to-fast-properties "^2.0.0"
"@babel/types@^7.5.0":
version "7.5.0"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.5.0.tgz#e47d43840c2e7f9105bc4d3a2c371b4d0c7832ab"
integrity sha512-UFpDVqRABKsW01bvw7/wSUe56uy6RXM5+VJibVVAybDGxEW25jdwiFJEf7ASvSaC7sN7rbE/l3cLp2izav+CtQ==
dependencies:
esutils "^2.0.2"
lodash "^4.17.11"
to-fast-properties "^2.0.0"
"@hapi/address@2.x.x":
version "2.0.0"
resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.0.0.tgz#9f05469c88cb2fd3dcd624776b54ee95c312126a"
@ -1229,7 +1298,7 @@ ajv@^5.2.3, ajv@^5.3.0:
fast-json-stable-stringify "^2.0.0"
json-schema-traverse "^0.3.0"
ajv@^6.1.0, ajv@^6.5.5, ajv@^6.9.1:
ajv@^6.1.0, ajv@^6.5.5:
version "6.10.0"
resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.10.0.tgz#90d0d54439da587cd7e843bfb7045f50bd22bdf1"
integrity sha512-nffhOpkymDECQyR0mnsUtoCE8RlX38G0rYP+wgLWFyZuUyuuojSSvi/+euOiQBIn63whYwYVIIH1TvE3tu4OEg==
@ -1249,7 +1318,7 @@ ansi-colors@^3.0.0:
resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-3.2.4.tgz#e3a3da4bfbae6c86a9c285625de124a234026fbf"
integrity sha512-hHUXGagefjN2iRrID63xckIvotOXOojhQKWIPUZ4mNUZ9nLZW+7FMNoE1lOkEhNWYsx/7ysGIuJYCiMAA9FnrA==
ansi-escapes@^3.0.0, ansi-escapes@^3.2.0:
ansi-escapes@^3.0.0:
version "3.2.0"
resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.2.0.tgz#8780b98ff9dbf5638152d1f1fe5c1d7b4442976b"
integrity sha512-cBhpre4ma+U0T1oM5fXg7Dy1Jw7zzwv7lt/GoCpr+hDQJoYnKVPLL4dCvSEFMmQurOQvSrwT7SL/DAlhBI97RQ==
@ -1420,11 +1489,6 @@ assign-symbols@^1.0.0:
resolved "https://registry.yarnpkg.com/assign-symbols/-/assign-symbols-1.0.0.tgz#59667f41fadd4f20ccbc2bb96b8d4f7f78ec0367"
integrity sha1-WWZ/QfrdTyDMvCu5a41Pf3jsA2c=
astral-regex@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9"
integrity sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg==
async-each@^1.0.1:
version "1.0.3"
resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.3.tgz#b727dbf87d7651602f06f4d4ac387f47d91b0cbf"
@ -1490,7 +1554,7 @@ babel-code-frame@^6.22.0, babel-code-frame@^6.26.0:
esutils "^2.0.2"
js-tokens "^3.0.2"
babel-eslint@^10.0.1:
babel-eslint@^10.0.1, babel-eslint@^10.0.2:
version "10.0.2"
resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.0.2.tgz#182d5ac204579ff0881684b040560fdcc1558456"
integrity sha512-UdsurWPtgiPgpJ06ryUnuaSXC2s0WoSZnQmEpbAH65XZSdwowgN5MvyP7e88nW07FYXv72erVtpBkxyDVKhH1Q==
@ -1902,11 +1966,6 @@ callsites@^2.0.0:
resolved "https://registry.yarnpkg.com/callsites/-/callsites-2.0.0.tgz#06eb84f00eea413da86affefacbffb36093b3c50"
integrity sha1-BuuE8A7qQT2oav/vrL/7Ngk7PFA=
callsites@^3.0.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/callsites/-/callsites-3.1.0.tgz#b3630abd8943432f54b3f0519238e33cd7df2f73"
integrity sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==
camel-case@3.0.x:
version "3.0.0"
resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-3.0.0.tgz#ca3c3688a4e9cf3a4cda777dc4dcbc713249cf73"
@ -1975,11 +2034,6 @@ chardet@^0.4.0:
resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2"
integrity sha1-tUc7M9yXxCTl2Y3IfVXU2KKci/I=
chardet@^0.7.0:
version "0.7.0"
resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
integrity sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==
check-types@^7.3.0:
version "7.4.0"
resolved "https://registry.yarnpkg.com/check-types/-/check-types-7.4.0.tgz#0378ec1b9616ec71f774931a3c6516fad8c152f4"
@ -2406,7 +2460,7 @@ cross-spawn@^5.0.1, cross-spawn@^5.1.0:
shebang-command "^1.2.0"
which "^1.2.9"
cross-spawn@^6.0.0, cross-spawn@^6.0.5:
cross-spawn@^6.0.0:
version "6.0.5"
resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
integrity sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==
@ -2663,7 +2717,7 @@ debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
dependencies:
ms "^2.1.1"
debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@~4.1.0:
debug@^4.1.0, debug@^4.1.1, debug@~4.1.0:
version "4.1.1"
resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
@ -2851,13 +2905,6 @@ doctrine@^2.1.0:
dependencies:
esutils "^2.0.2"
doctrine@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
integrity sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==
dependencies:
esutils "^2.0.2"
dom-converter@^0.2:
version "0.2.0"
resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@ -3148,7 +3195,7 @@ eslint-scope@^3.7.1:
esrecurse "^4.1.0"
estraverse "^4.1.1"
eslint-scope@^4.0.0, eslint-scope@^4.0.3:
eslint-scope@^4.0.0:
version "4.0.3"
resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-4.0.3.tgz#ca03833310f6889a3264781aa82e63eb9cfe7848"
integrity sha512-p7VutNr1O/QrxysMo3E45FjYDTeXBy0iTltPFNSqKAIfjDSXC+4dj+qfyuD8bfAXrW/y6lW3O76VaYNPKfpKrg==
@ -3156,11 +3203,6 @@ eslint-scope@^4.0.0, eslint-scope@^4.0.3:
esrecurse "^4.1.0"
estraverse "^4.1.1"
eslint-utils@^1.3.1:
version "1.3.1"
resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-1.3.1.tgz#9a851ba89ee7c460346f97cf8939c7298827e512"
integrity sha512-Z7YjnIldX+2XMcjr7ZkgEsOj/bREONV60qYeB/bjMAqqqZ4zxKyWX+BOUkdmRmA9riiIPVvo5x86m5elviOk0Q==
eslint-visitor-keys@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#3f3180fb2e291017716acb4c9d6d5b5c34a6a81d"
@ -3210,48 +3252,6 @@ eslint@^4.19.1:
table "4.0.2"
text-table "~0.2.0"
eslint@^5.8.0:
version "5.16.0"
resolved "https://registry.yarnpkg.com/eslint/-/eslint-5.16.0.tgz#a1e3ac1aae4a3fbd8296fcf8f7ab7314cbb6abea"
integrity sha512-S3Rz11i7c8AA5JPv7xAH+dOyq/Cu/VXHiHXBPOU1k/JAM5dXqQPt3qcrhpHSorXmrpu2g0gkIBVXAqCpzfoZIg==
dependencies:
"@babel/code-frame" "^7.0.0"
ajv "^6.9.1"
chalk "^2.1.0"
cross-spawn "^6.0.5"
debug "^4.0.1"
doctrine "^3.0.0"
eslint-scope "^4.0.3"
eslint-utils "^1.3.1"
eslint-visitor-keys "^1.0.0"
espree "^5.0.1"
esquery "^1.0.1"
esutils "^2.0.2"
file-entry-cache "^5.0.1"
functional-red-black-tree "^1.0.1"
glob "^7.1.2"
globals "^11.7.0"
ignore "^4.0.6"
import-fresh "^3.0.0"
imurmurhash "^0.1.4"
inquirer "^6.2.2"
js-yaml "^3.13.0"
json-stable-stringify-without-jsonify "^1.0.1"
levn "^0.3.0"
lodash "^4.17.11"
minimatch "^3.0.4"
mkdirp "^0.5.1"
natural-compare "^1.4.0"
optionator "^0.8.2"
path-is-inside "^1.0.2"
progress "^2.0.0"
regexpp "^2.0.1"
semver "^5.5.1"
strip-ansi "^4.0.0"
strip-json-comments "^2.0.1"
table "^5.2.3"
text-table "^0.2.0"
espree@^3.5.2, espree@^3.5.4:
version "3.5.4"
resolved "https://registry.yarnpkg.com/espree/-/espree-3.5.4.tgz#b0f447187c8a8bed944b815a660bddf5deb5d1a7"
@ -3269,15 +3269,6 @@ espree@^4.1.0:
acorn-jsx "^5.0.0"
eslint-visitor-keys "^1.0.0"
espree@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/espree/-/espree-5.0.1.tgz#5d6526fa4fc7f0788a5cf75b15f30323e2f81f7a"
integrity sha512-qWAZcWh4XE/RwzLJejfcofscgMc9CamR6Tn1+XRXNzrvUSSbiAjGOI/fggztjIi7y9VLPqnICMIPiGyr8JaZ0A==
dependencies:
acorn "^6.0.7"
acorn-jsx "^5.0.0"
eslint-visitor-keys "^1.0.0"
esprima@^4.0.0:
version "4.0.1"
resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
@ -3446,15 +3437,6 @@ external-editor@^2.0.4:
iconv-lite "^0.4.17"
tmp "^0.0.33"
external-editor@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/external-editor/-/external-editor-3.0.3.tgz#5866db29a97826dbe4bf3afd24070ead9ea43a27"
integrity sha512-bn71H9+qWoOQKyZDo25mOMVpSmXROAsTJVVVYzrrtol3d4y+AsKjf4Iwl2Q+IuT0kFSQ1qo166UuIwqYq7mGnA==
dependencies:
chardet "^0.7.0"
iconv-lite "^0.4.24"
tmp "^0.0.33"
extglob@^2.0.4:
version "2.0.4"
resolved "https://registry.yarnpkg.com/extglob/-/extglob-2.0.4.tgz#ad00fe4dc612a9232e8718711dc5cb5ab0285543"
@ -3550,13 +3532,6 @@ file-entry-cache@^2.0.0:
flat-cache "^1.2.1"
object-assign "^4.0.1"
file-entry-cache@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-5.0.1.tgz#ca0f6efa6dd3d561333fb14515065c2fafdf439c"
integrity sha512-bCg29ictuBaKUwwArK4ouCaqDgLZcysCFLmM/Yn/FDoqndh/9vNuQfXRDvTuXKLxfD/JtZQGKFT8MGcJBK644g==
dependencies:
flat-cache "^2.0.1"
file-loader@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-3.0.1.tgz#f8e0ba0b599918b51adfe45d66d1e771ad560faa"
@ -3665,20 +3640,6 @@ flat-cache@^1.2.1:
rimraf "~2.6.2"
write "^0.2.1"
flat-cache@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-2.0.1.tgz#5d296d6f04bda44a4630a301413bdbc2ec085ec0"
integrity sha512-LoQe6yDuUMDzQAEH8sgmh4Md6oZnc/7PjtwjNFSzveXqSHt6ka9fPBuso7IGf9Rz4uqnSnWiFH2B/zj24a5ReA==
dependencies:
flatted "^2.0.0"
rimraf "2.6.3"
write "1.0.3"
flatted@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/flatted/-/flatted-2.0.0.tgz#55122b6536ea496b4b44893ee2608141d10d9916"
integrity sha512-R+H8IZclI8AAkSBRQJLVOsxwAoHd6WC40b4QTNWIjzAa6BXOBfQcM587MXDTVPeYaopFNWHUFLx7eNmHDSxMWg==
flush-write-stream@^1.0.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/flush-write-stream/-/flush-write-stream-1.1.1.tgz#8dd7d873a1babc207d94ead0c2e0e44276ebf2e8"
@ -3872,7 +3833,7 @@ glob@^7.0.3, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4:
once "^1.3.0"
path-is-absolute "^1.0.0"
globals@^11.0.1, globals@^11.1.0, globals@^11.7.0:
globals@^11.0.1, globals@^11.1.0:
version "11.12.0"
resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==
@ -4214,7 +4175,7 @@ https-browserify@^1.0.0:
resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
integrity sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=
iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.24, iconv-lite@^0.4.4:
iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.4:
version "0.4.24"
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
@ -4255,7 +4216,7 @@ ignore@^3.3.3, ignore@^3.3.5:
resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.10.tgz#0a97fb876986e8081c631160f8f9f389157f0043"
integrity sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==
ignore@^4.0.3, ignore@^4.0.6:
ignore@^4.0.3:
version "4.0.6"
resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
@ -4275,14 +4236,6 @@ import-fresh@^2.0.0:
caller-path "^2.0.0"
resolve-from "^3.0.0"
import-fresh@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.0.0.tgz#a3d897f420cab0e671236897f75bc14b4885c390"
integrity sha512-pOnA9tfM3Uwics+SaBLCNyZZZbK+4PTu0OPZtLlMIrv17EdBoC15S9Kn8ckJ9TZTyKb3ywNE5y1yeDxxGA7nTQ==
dependencies:
parent-module "^1.0.0"
resolve-from "^4.0.0"
import-from@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/import-from/-/import-from-2.1.0.tgz#335db7f2a7affd53aaa471d4b8021dee36b7f3b1"
@ -4361,25 +4314,6 @@ inquirer@^3.0.6:
strip-ansi "^4.0.0"
through "^2.3.6"
inquirer@^6.2.2:
version "6.4.1"
resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-6.4.1.tgz#7bd9e5ab0567cd23b41b0180b68e0cfa82fc3c0b"
integrity sha512-/Jw+qPZx4EDYsaT6uz7F4GJRNFMRdKNeUZw3ZnKV8lyuUgz/YWRCSUAJMZSVhSq4Ec0R2oYnyi6b3d4JXcL5Nw==
dependencies:
ansi-escapes "^3.2.0"
chalk "^2.4.2"
cli-cursor "^2.1.0"
cli-width "^2.0.0"
external-editor "^3.0.3"
figures "^2.0.0"
lodash "^4.17.11"
mute-stream "0.0.7"
run-async "^2.2.0"
rxjs "^6.4.0"
string-width "^2.1.0"
strip-ansi "^5.1.0"
through "^2.3.6"
internal-ip@^4.3.0:
version "4.3.0"
resolved "https://registry.yarnpkg.com/internal-ip/-/internal-ip-4.3.0.tgz#845452baad9d2ca3b69c635a137acb9a0dad0907"
@ -4733,7 +4667,7 @@ js-tokens@^3.0.2:
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
integrity sha1-mGbfOVECEw449/mWvOtlRDIJwls=
js-yaml@^3.13.0, js-yaml@^3.13.1, js-yaml@^3.9.1:
js-yaml@^3.13.1, js-yaml@^3.9.1:
version "3.13.1"
resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847"
integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==
@ -5831,13 +5765,6 @@ param-case@2.1.x:
dependencies:
no-case "^2.2.0"
parent-module@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/parent-module/-/parent-module-1.0.1.tgz#691d2709e78c79fae3a156622452d00762caaaa2"
integrity sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==
dependencies:
callsites "^3.0.0"
parse-asn1@^5.0.0:
version "5.1.4"
resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.4.tgz#37f6628f823fbdeb2273b4d540434a22f3ef1fcc"
@ -6659,11 +6586,6 @@ regexpp@^1.0.1:
resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-1.1.0.tgz#0e3516dd0b7904f413d2d4193dce4618c3a689ab"
integrity sha512-LOPw8FpgdQF9etWMaAfG/WRthIdXJGYp4mJ2Jgn/2lpkbod9jPn0t9UqN7AxBOKNfzRbYyVfgc7Vk4t/MpnXgw==
regexpp@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-2.0.1.tgz#8d19d31cf632482b589049f8281f93dbcba4d07f"
integrity sha512-lv0M6+TkDVniA3aD1Eg0DVpfU/booSu7Eev3TDO/mZKHBfVjgCGTV4t4buppESEYDtkArYFOxTJWv6S5C+iaNw==
regexpu-core@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-1.0.0.tgz#86a763f58ee4d7c2f6b102e4764050de7ed90c6b"
@ -6832,11 +6754,6 @@ resolve-from@^3.0.0:
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-3.0.0.tgz#b22c7af7d9d6881bc8b6e653335eebcb0a188748"
integrity sha1-six699nWiBvItuZTM17rywoYh0g=
resolve-from@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
integrity sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==
resolve-url@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
@ -6877,7 +6794,7 @@ rgba-regex@^1.0.0:
resolved "https://registry.yarnpkg.com/rgba-regex/-/rgba-regex-1.0.0.tgz#43374e2e2ca0968b0ef1523460b7d730ff22eeb3"
integrity sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=
rimraf@2.6.3, rimraf@^2.5.4, rimraf@^2.6.1, rimraf@^2.6.2, rimraf@^2.6.3, rimraf@~2.6.2:
rimraf@^2.5.4, rimraf@^2.6.1, rimraf@^2.6.2, rimraf@^2.6.3, rimraf@~2.6.2:
version "2.6.3"
resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.3.tgz#b2d104fe0d8fb27cf9e0a1cda8262dd3833c6cab"
integrity sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==
@ -6918,13 +6835,6 @@ rx-lite@*, rx-lite@^4.0.8:
resolved "https://registry.yarnpkg.com/rx-lite/-/rx-lite-4.0.8.tgz#0b1e11af8bc44836f04a6407e92da42467b79444"
integrity sha1-Cx4Rr4vESDbwSmQH6S2kJGe3lEQ=
rxjs@^6.4.0:
version "6.5.2"
resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-6.5.2.tgz#2e35ce815cd46d84d02a209fb4e5921e051dbec7"
integrity sha512-HUb7j3kvb7p7eCUHE3FqjoDsC1xfZQ4AHFWfTKSpZ+sAhhz5X1WX0ZuUqWbzB2QhSLp3DoLUG+hMdEDKqWo2Zg==
dependencies:
tslib "^1.9.0"
safe-buffer@5.1.2, safe-buffer@>=5.1.0, safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@^5.1.1, safe-buffer@^5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
version "5.1.2"
resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
@ -7132,15 +7042,6 @@ slice-ansi@1.0.0:
dependencies:
is-fullwidth-code-point "^2.0.0"
slice-ansi@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-2.1.0.tgz#cacd7693461a637a5788d92a7dd4fba068e81636"
integrity sha512-Qu+VC3EwYLldKa1fCxuuvULvSJOKEgk9pi8dZeCVK7TqBfUNTH4sFkk4joj8afVSfAYgJoSOetjx9QWOJ5mYoQ==
dependencies:
ansi-styles "^3.2.0"
astral-regex "^1.0.0"
is-fullwidth-code-point "^2.0.0"
snapdragon-node@^2.0.1:
version "2.1.1"
resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
@ -7532,7 +7433,7 @@ strip-indent@^2.0.0:
resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-2.0.0.tgz#5ef8db295d01e6ed6cbf7aab96998d7822527b68"
integrity sha1-XvjbKV0B5u1sv3qrlpmNeCJSe2g=
strip-json-comments@^2.0.1, strip-json-comments@~2.0.1:
strip-json-comments@~2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
integrity sha1-PFMZQukIwml8DsNEhYwobHygpgo=
@ -7602,16 +7503,6 @@ table@4.0.2:
slice-ansi "1.0.0"
string-width "^2.1.1"
table@^5.2.3:
version "5.4.1"
resolved "https://registry.yarnpkg.com/table/-/table-5.4.1.tgz#0691ae2ebe8259858efb63e550b6d5f9300171e8"
integrity sha512-E6CK1/pZe2N75rGZQotFOdmzWQ1AILtgYbMAbAjvms0S1l5IDB47zG3nCnFGB/w+7nB3vKofbLXCH7HPBo864w==
dependencies:
ajv "^6.9.1"
lodash "^4.17.11"
slice-ansi "^2.1.0"
string-width "^3.0.0"
tapable@^1.0.0, tapable@^1.1.0:
version "1.1.3"
resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.1.3.tgz#a1fccc06b58db61fd7a45da2da44f5f3a3e67ba2"
@ -7655,7 +7546,7 @@ terser@^4.0.0:
source-map "~0.6.1"
source-map-support "~0.5.10"
text-table@^0.2.0, text-table@~0.2.0:
text-table@~0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=
@ -8411,13 +8302,6 @@ wrappy@1:
resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
write@1.0.3:
version "1.0.3"
resolved "https://registry.yarnpkg.com/write/-/write-1.0.3.tgz#0800e14523b923a387e415123c865616aae0f5c3"
integrity sha512-/lg70HAjtkUgWPVZhZcm+T4hkL8Zbtp1nFNOn3lRrxnlv50SRBv7cR7RqR+GMsd3hUXy9hWBo4CHTbFTcOYwig==
dependencies:
mkdirp "^0.5.1"
write@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/write/-/write-0.2.1.tgz#5fc03828e264cea3fe91455476f7a3c566cb0757"