mirror of
https://github.com/danbulant/Nertivia-Client
synced 2026-06-18 05:51:11 +00:00
minor changes and added electron frame buttons
This commit is contained in:
supertiger1234
parent
c412035733
commit
6a29642e56
20 changed files with 492 additions and 225 deletions
3
.babelrc
Normal file
3
.babelrc
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"plugins": ["@babel/plugin-syntax-dynamic-import"]
|
||||
}
|
||||
|
|
@ -7,7 +7,7 @@ module.exports = {
|
|||
},
|
||||
"extends": [
|
||||
"eslint:recommended",
|
||||
"plugin:vue/essential"
|
||||
"plugin:vue/essential",
|
||||
],
|
||||
"globals": {
|
||||
"Atomics": "readonly",
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
{
|
||||
"ExpandedNodes": [
|
||||
"",
|
||||
"\\src"
|
||||
],
|
||||
"SelectedNode": "\\src\\main.js",
|
||||
"PreviewInSolutionExplorer": false
|
||||
}
|
||||
BIN
.vs/slnx.sqlite
BIN
.vs/slnx.sqlite
Binary file not shown.
47
package-lock.json
generated
47
package-lock.json
generated
|
|
@ -4959,7 +4959,8 @@
|
|||
"ansi-regex": {
|
||||
"version": "2.1.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"aproba": {
|
||||
"version": "1.2.0",
|
||||
|
|
@ -4980,12 +4981,14 @@
|
|||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
|
|
@ -5000,17 +5003,20 @@
|
|||
"code-point-at": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"concat-map": {
|
||||
"version": "0.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"console-control-strings": {
|
||||
"version": "1.1.0",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"core-util-is": {
|
||||
"version": "1.0.2",
|
||||
|
|
@ -5127,7 +5133,8 @@
|
|||
"inherits": {
|
||||
"version": "2.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"ini": {
|
||||
"version": "1.3.5",
|
||||
|
|
@ -5139,6 +5146,7 @@
|
|||
"version": "1.0.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"number-is-nan": "^1.0.0"
|
||||
}
|
||||
|
|
@ -5153,6 +5161,7 @@
|
|||
"version": "3.0.4",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
|
|
@ -5160,12 +5169,14 @@
|
|||
"minimist": {
|
||||
"version": "0.0.8",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"minipass": {
|
||||
"version": "2.3.5",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"safe-buffer": "^5.1.2",
|
||||
"yallist": "^3.0.0"
|
||||
|
|
@ -5184,6 +5195,7 @@
|
|||
"version": "0.5.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"minimist": "0.0.8"
|
||||
}
|
||||
|
|
@ -5264,7 +5276,8 @@
|
|||
"number-is-nan": {
|
||||
"version": "1.0.1",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"object-assign": {
|
||||
"version": "4.1.1",
|
||||
|
|
@ -5276,6 +5289,7 @@
|
|||
"version": "1.4.0",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"wrappy": "1"
|
||||
}
|
||||
|
|
@ -5361,7 +5375,8 @@
|
|||
"safe-buffer": {
|
||||
"version": "5.1.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"safer-buffer": {
|
||||
"version": "2.1.2",
|
||||
|
|
@ -5397,6 +5412,7 @@
|
|||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"code-point-at": "^1.0.0",
|
||||
"is-fullwidth-code-point": "^1.0.0",
|
||||
|
|
@ -5416,6 +5432,7 @@
|
|||
"version": "3.0.1",
|
||||
"bundled": true,
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"requires": {
|
||||
"ansi-regex": "^2.0.0"
|
||||
}
|
||||
|
|
@ -5459,12 +5476,14 @@
|
|||
"wrappy": {
|
||||
"version": "1.0.2",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"yallist": {
|
||||
"version": "3.0.3",
|
||||
"bundled": true,
|
||||
"dev": true
|
||||
"dev": true,
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -6570,9 +6589,9 @@
|
|||
}
|
||||
},
|
||||
"jquery": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.3.1.tgz",
|
||||
"integrity": "sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg=="
|
||||
"version": "3.4.0",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.4.0.tgz",
|
||||
"integrity": "sha512-ggRCXln9zEqv6OqAGXFEcshF5dSBvCkzj6Gm2gzuR5fWawaX8t7cxKVkkygKODrDAzKdoYw3l/e3pm3vlT4IbQ=="
|
||||
},
|
||||
"js-levenshtein": {
|
||||
"version": "1.1.4",
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
"axios": "^0.18.0",
|
||||
"filesize": "^4.1.2",
|
||||
"futoji": "^0.5.0",
|
||||
"jquery": "^3.3.1",
|
||||
"jquery": "^3.4.0",
|
||||
"match-sorter": "^2.3.0",
|
||||
"socket.io": "^2.2.0",
|
||||
"socket.io-client": "^2.2.0",
|
||||
|
|
|
|||
74
src/components/ElectronJS/FrameButtons.vue
Normal file
74
src/components/ElectronJS/FrameButtons.vue
Normal file
|
|
@ -0,0 +1,74 @@
|
|||
<template>
|
||||
<div class="frame-buttons">
|
||||
<div class="minimize" @click="minimizeWindow()">
|
||||
<i class="material-icons">minimize</i>
|
||||
</div>
|
||||
<div class="res-max" @click="maximizeWindow()">
|
||||
<i class="material-icons">check_box_outline_blank</i>
|
||||
</div>
|
||||
<div class="close" @click="closeWindow()">
|
||||
<i class="material-icons">close</i>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const remote = window.require("electron").remote;
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
closeWindow() {
|
||||
var window = remote.getCurrentWindow();
|
||||
window.close();
|
||||
},
|
||||
|
||||
minimizeWindow() {
|
||||
var window = remote.getCurrentWindow();
|
||||
window.minimize();
|
||||
},
|
||||
|
||||
maximizeWindow() {
|
||||
var window = remote.getCurrentWindow();
|
||||
window.isMaximized() ? window.unmaximize() : window.maximize();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped>
|
||||
.frame-buttons {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
-webkit-app-region: drag;
|
||||
user-select: none;
|
||||
}
|
||||
.frame-buttons div {
|
||||
display: flex;
|
||||
padding: 5px;
|
||||
flex-shrink: 0;
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
border-radius: 5px;
|
||||
margin: 3px;
|
||||
color: white;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
-webkit-app-region: no-drag;
|
||||
transition: 0.3s;
|
||||
background: rgba(56, 56, 56, 0.247);
|
||||
}
|
||||
.frame-buttons .material-icons {
|
||||
display: block;
|
||||
font-size: 15px;
|
||||
}
|
||||
.frame-buttons .close:hover {
|
||||
background: rgba(255, 0, 0, 0.595);
|
||||
}
|
||||
.frame-buttons .minimize:hover {
|
||||
background: rgba(255, 81, 0, 0.595);
|
||||
}
|
||||
.frame-buttons .res-max:hover {
|
||||
background: rgba(0, 162, 255, 0.595);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -16,7 +16,7 @@ export default {
|
|||
|
||||
<style scoped>
|
||||
.loading-screen{
|
||||
margin: 50px;
|
||||
margin: auto;
|
||||
}
|
||||
.loading-animation{
|
||||
height: 100px;
|
||||
|
|
|
|||
|
|
@ -56,7 +56,9 @@ export default {
|
|||
z-index: 1;
|
||||
}
|
||||
.list{
|
||||
margin: 10px;
|
||||
margin: 2px;
|
||||
margin-left: 5px;
|
||||
margin-right: 5px;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -527,6 +527,7 @@ export default {
|
|||
.heading {
|
||||
border-bottom: solid 2px white;
|
||||
margin: 5px;
|
||||
margin-bottom: 0;
|
||||
height: 40px;
|
||||
padding-bottom: 2spx;
|
||||
display: flex;
|
||||
|
|
@ -578,6 +579,7 @@ export default {
|
|||
.message-logs,
|
||||
.message-logs .scroll {
|
||||
transform: scale(1, -1);
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.loading {
|
||||
|
|
@ -587,7 +589,7 @@ export default {
|
|||
.chat-input-area {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 10px;
|
||||
padding-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -596,7 +598,7 @@ export default {
|
|||
width: 50px;
|
||||
background: rgba(0, 0, 0, 0.219);
|
||||
margin-right: 2px;
|
||||
margin-left: 20px;
|
||||
margin-left: 10px;
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
cursor: default;
|
||||
|
|
@ -624,7 +626,7 @@ export default {
|
|||
}
|
||||
.message-count {
|
||||
float: right;
|
||||
margin-right: 30px;
|
||||
margin-right: 20px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
.message-area {
|
||||
|
|
@ -668,7 +670,7 @@ export default {
|
|||
border: none;
|
||||
outline: none;
|
||||
margin-left: 2px;
|
||||
margin-right: 20px;
|
||||
margin-right: 10px;
|
||||
min-height: 40px;
|
||||
width: 50px;
|
||||
transition: 0.3s;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div :class="{message: true, ownMessage: user.uniqueID === $props.uniqueID, ownMessageLeft: user.uniqueID === $props.uniqueID && (apperance && apperance.own_message_right === true)} ">
|
||||
<div class="outer-profile-picture">
|
||||
<profile-picture :hover="true" :admin="$props.admin" :url="userAvatar" size="50px" @click.native="openUserInformation"/>
|
||||
<profile-picture :admin="$props.admin" :url="userAvatar" size="50px" :hover="true" @click.native="openUserInformation"/>
|
||||
</div>
|
||||
<div class="triangle">
|
||||
<div class="triangle-inner"></div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
<template>
|
||||
<div class="my-mini-information">
|
||||
<profile-picture :url="avatar" :admin="user.admin" size="50px"/>
|
||||
<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"/>
|
||||
</div>
|
||||
<div class="information">
|
||||
<div class="name">{{user.username}}</div>
|
||||
<div class="tag">@{{user.tag}}</div>
|
||||
|
|
@ -34,6 +36,7 @@ import config from "@/config.js";
|
|||
import statusList from "../../components/app/statusList.vue";
|
||||
import settingsService from "@/services/settingsService";
|
||||
import ProfilePicture from "@/components/ProfilePictureTemplate.vue";
|
||||
import statuses from '@/utils/statuses';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
|
@ -48,6 +51,9 @@ export default {
|
|||
};
|
||||
},
|
||||
methods: {
|
||||
openUserInformation() {
|
||||
this.$store.dispatch('setUserInformationPopout', this.user.uniqueID)
|
||||
},
|
||||
closeMenus() {
|
||||
this.status.isPoppedOut = false;
|
||||
},
|
||||
|
|
@ -88,6 +94,10 @@ export default {
|
|||
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
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -96,6 +106,10 @@ export default {
|
|||
|
||||
|
||||
<style scoped>
|
||||
.profile-pic-outer{
|
||||
z-index:9999;
|
||||
display: flex;
|
||||
}
|
||||
.survay-button {
|
||||
padding: 10px;
|
||||
height: 24px;
|
||||
|
|
@ -135,11 +149,13 @@ export default {
|
|||
}
|
||||
|
||||
.my-mini-information {
|
||||
border-bottom: solid 1px rgb(218, 218, 218);
|
||||
width: 100%;
|
||||
border-radius: 10px;
|
||||
margin: 5px;
|
||||
height: 80px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.profile-picture {
|
||||
|
|
|
|||
|
|
@ -185,7 +185,6 @@ export default {
|
|||
margin-bottom: 50px;
|
||||
flex-direction: column;
|
||||
align-content: center;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -204,6 +204,9 @@ export default {
|
|||
align-items: initial !important;
|
||||
font-size: 15px;
|
||||
}
|
||||
.about_me .about-me-format {
|
||||
user-select: text;
|
||||
}
|
||||
.about-me-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -243,7 +246,6 @@ export default {
|
|||
font-size: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.drop-background {
|
||||
position: absolute;
|
||||
background: rgba(0, 0, 0, 0.521);
|
||||
|
|
@ -279,6 +281,7 @@ export default {
|
|||
background: rgba(22, 22, 22, 0.918);
|
||||
width: 100%;
|
||||
height: 170px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
|
|
@ -299,30 +302,28 @@ export default {
|
|||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
transition: 0.3s;
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
}
|
||||
.button .material-icons {
|
||||
margin-bottom: 10px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background: rgb(61, 61, 61);
|
||||
}
|
||||
|
||||
.button.valid {
|
||||
background: #09ff002d;
|
||||
}
|
||||
.button.valid:hover {
|
||||
background: #09ff00ab;
|
||||
}
|
||||
|
||||
.button.warn {
|
||||
background: #ff00002d;
|
||||
}
|
||||
.button.warn:hover {
|
||||
background: #ff0000ab;
|
||||
}
|
||||
|
||||
.profile-picture-outer {
|
||||
display: flex;
|
||||
z-index: 9999;
|
||||
|
|
|
|||
70
src/components/app/ServerList.vue
Normal file
70
src/components/app/ServerList.vue
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
<template>
|
||||
<div class="left-panel">
|
||||
<MyMiniInformation />
|
||||
|
||||
<div class="list">
|
||||
<online-friends />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import MyMiniInformation from '../../components/app/MyMiniInformation.vue'
|
||||
import OnlineFriends from './relationships/OnlineFriends.vue'
|
||||
|
||||
|
||||
export default {
|
||||
components: {
|
||||
MyMiniInformation,
|
||||
OnlineFriends,
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
.left-panel {
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.671);
|
||||
width: 300px;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
z-index: 1;
|
||||
}
|
||||
.list{
|
||||
margin: 10px;
|
||||
flex: 1;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* ------- SCROLL BAR -------*/
|
||||
/* width */
|
||||
.list::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
}
|
||||
|
||||
/* Track */
|
||||
.list::-webkit-scrollbar-track {
|
||||
background: #8080806b;
|
||||
}
|
||||
|
||||
/* Handle */
|
||||
.list::-webkit-scrollbar-thumb {
|
||||
background: #f5f5f559;
|
||||
}
|
||||
|
||||
/* Handle on hover */
|
||||
.list::-webkit-scrollbar-thumb:hover {
|
||||
background: #f5f5f59e;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -84,7 +84,7 @@ export default {
|
|||
padding: 10px;
|
||||
background: rgba(0, 0, 0, 0.555);
|
||||
margin-bottom: 10px;
|
||||
border-radius: 5px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.heading.latest {
|
||||
background: rgba(38, 139, 255, 0.87);
|
||||
|
|
@ -121,8 +121,5 @@ export default {
|
|||
.todo-list {
|
||||
margin-left: 0;
|
||||
}
|
||||
.change-log {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
66
src/components/app/Tabs/Servers.vue
Normal file
66
src/components/app/Tabs/Servers.vue
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
<template>
|
||||
<div class="direct-message-tab">
|
||||
<transition name="slidein">
|
||||
<server-list
|
||||
class="left-panel"
|
||||
v-click-outside="hideLeftPanel"
|
||||
v-show="$mq === 'mobile' && showLeftPanel || $mq === 'desktop'"
|
||||
/>
|
||||
</transition>
|
||||
<message-panel/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { bus } from "@/main";
|
||||
|
||||
import ServerList from "@/components/app/ServerList.vue";
|
||||
import MessagePanel from "@/components/app/MessagePanel.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ServerList,
|
||||
MessagePanel
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showLeftPanel: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
hideLeftPanel(event) {
|
||||
if (this.showLeftPanel) {
|
||||
if (event.target.closest(".show-menu-button") == null) {
|
||||
this.showLeftPanel = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
bus.$on("toggleLeftMenu", () => {
|
||||
this.showLeftPanel = !this.showLeftPanel;
|
||||
});
|
||||
bus.$on("closeLeftMenu", () => {
|
||||
this.showLeftPanel = false;
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.slidein-enter-active,
|
||||
.slidein-leave-active {
|
||||
transition: 0.5s;
|
||||
}
|
||||
.slidein-enter, .slidein-leave-to /* .fade-leave-active below version 2.1.8 */ {
|
||||
margin-left: -300px;
|
||||
}
|
||||
@media (max-width: 600px) {
|
||||
.left-panel {
|
||||
position: absolute;
|
||||
top: 47px;
|
||||
height: calc(100% - 47px);
|
||||
background-color: rgba(39, 39, 39, 0.97);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -86,7 +86,13 @@ export default {
|
|||
|
||||
.username {
|
||||
font-size: 20px;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
white-space: pre-wrap;
|
||||
overflow: hidden;
|
||||
user-select: all;
|
||||
max-width: 200px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.tag{
|
||||
|
|
@ -96,6 +102,7 @@ export default {
|
|||
|
||||
.buttons{
|
||||
display: flex;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.button {
|
||||
|
|
|
|||
|
|
@ -1,9 +1,20 @@
|
|||
const config = [
|
||||
{
|
||||
version: 2,
|
||||
title: "Make your own servers!",
|
||||
shortTitle: "Servers",
|
||||
date: "24/04/2019",
|
||||
headColor: "rgba(155, 244, 66, 0.77)",
|
||||
new: [
|
||||
"",
|
||||
],
|
||||
next: [""]
|
||||
},
|
||||
{
|
||||
version: 1.5,
|
||||
title: 'New Notification Sound',
|
||||
shortTitle: 'Notification Sound',
|
||||
date: '22/04/2019',
|
||||
title: "New Notification Sound",
|
||||
shortTitle: "Notification Sound",
|
||||
date: "22/04/2019",
|
||||
headColor: "rgba(16, 0, 154, 0.77)",
|
||||
new: [
|
||||
"Do not disturb should now mute notification sounds.",
|
||||
|
|
@ -16,9 +27,9 @@ const config = [
|
|||
},
|
||||
{
|
||||
version: 1,
|
||||
title: 'Profile Panel',
|
||||
shortTitle: 'Profile Panel',
|
||||
date: '21/04/2019',
|
||||
title: "Profile Panel",
|
||||
shortTitle: "Profile Panel",
|
||||
date: "21/04/2019",
|
||||
headColor: "rgba(39, 14, 204, 0.77)",
|
||||
new: [
|
||||
"Tabs have been added at the top of the screen.",
|
||||
|
|
@ -28,197 +39,170 @@ const config = [
|
|||
"Added a survey option to display your hobbies and age in your profile page."
|
||||
],
|
||||
fix: ["Some formatting issues with custom emojis have been fixed."],
|
||||
next: ['Make your own servers']
|
||||
next: ["Make your own servers"]
|
||||
},
|
||||
{
|
||||
title: 'Custom emojis!',
|
||||
shortTitle: 'Custom emojis!',
|
||||
date: '29/03/2019',
|
||||
title: "Custom emojis!",
|
||||
shortTitle: "Custom emojis!",
|
||||
date: "29/03/2019",
|
||||
headColor: "rgba(255, 48, 48, 0.77)",
|
||||
new: [
|
||||
'You can now add your own emojis for free.',
|
||||
"You can now add your own emojis for free.",
|
||||
"User status in the top bar to easily view if someone is still online or, if you're talking to a wall on the phone.",
|
||||
'Switching dms should be faster now.'
|
||||
"Switching dms should be faster now."
|
||||
],
|
||||
next: ['Servers', 'View an users information page']
|
||||
next: ["Servers", "View an users information page"]
|
||||
},
|
||||
{
|
||||
title: 'Emoji tabs and recent emojis',
|
||||
shortTitle: 'Emoji tabs and recent emojis',
|
||||
date: '22/03/2019',
|
||||
title: "Emoji tabs and recent emojis",
|
||||
shortTitle: "Emoji tabs and recent emojis",
|
||||
date: "22/03/2019",
|
||||
headColor: "rgba(244, 169, 65, 0.77)",
|
||||
new: [
|
||||
'Tabs in emoji panel',
|
||||
'Recent Emojis now show in the emoji panel'
|
||||
],
|
||||
fix: [
|
||||
'Emoji panel closes when clicking outside the panel.',
|
||||
],
|
||||
next: ['Custom emojis']
|
||||
new: ["Tabs in emoji panel", "Recent Emojis now show in the emoji panel"],
|
||||
fix: ["Emoji panel closes when clicking outside the panel."],
|
||||
next: ["Custom emojis"]
|
||||
},
|
||||
{
|
||||
title: 'Emojis :D',
|
||||
shortTitle: 'Emojis',
|
||||
date: '20/03/2019',
|
||||
title: "Emojis :D",
|
||||
shortTitle: "Emojis",
|
||||
date: "20/03/2019",
|
||||
headColor: "rgba(17, 153, 69, 0.77)",
|
||||
new: [
|
||||
'Emoji suggestions in chat when typing in any emoji :ok_hand:',
|
||||
'Emoji picker',
|
||||
'Removed planned features from changelog'
|
||||
"Emoji suggestions in chat when typing in any emoji :ok_hand:",
|
||||
"Emoji picker",
|
||||
"Removed planned features from changelog"
|
||||
],
|
||||
next: [
|
||||
'make tabs in emoji panel',
|
||||
'Make it so that emoji panel closes when clicking outside the panel.',
|
||||
'Custom emojis for freeeee!',
|
||||
"make tabs in emoji panel",
|
||||
"Make it so that emoji panel closes when clicking outside the panel.",
|
||||
"Custom emojis for freeeee!"
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Upload anything!',
|
||||
shortTitle: 'Upload anything!',
|
||||
date: '08/03/2019',
|
||||
title: "Upload anything!",
|
||||
shortTitle: "Upload anything!",
|
||||
date: "08/03/2019",
|
||||
headColor: "rgba(38, 139, 255, 0.77)",
|
||||
new: [
|
||||
'You can now upload any kind of files to friends. (Google drive required)',
|
||||
'Shift + enter should expand the text area.',
|
||||
'Made some design changes to the home page panel.'
|
||||
"You can now upload any kind of files to friends. (Google drive required)",
|
||||
"Shift + enter should expand the text area.",
|
||||
"Made some design changes to the home page panel."
|
||||
],
|
||||
fix: [
|
||||
'Improved performance by using Redis in more places.',
|
||||
'Small bugs fixed around some places.'
|
||||
"Improved performance by using Redis in more places.",
|
||||
"Small bugs fixed around some places."
|
||||
],
|
||||
next: [
|
||||
'Servers or emojis.',
|
||||
]
|
||||
next: ["Servers or emojis."]
|
||||
},
|
||||
{
|
||||
title: 'Notifications are finally here!',
|
||||
shortTitle: 'Notifications',
|
||||
date: '18/02/2019',
|
||||
title: "Notifications are finally here!",
|
||||
shortTitle: "Notifications",
|
||||
date: "18/02/2019",
|
||||
new: [
|
||||
'When you get a notification, you will now be notified by the red flashing Indicator.',
|
||||
'When you get a new friend request, you will notified by a sound.',
|
||||
'Added a new Recents tab to easily see who messaged you last.',
|
||||
'Adjusted the padding and size in some places such as the friends list.',
|
||||
'Messages can now be formated (e.g. **Hello**)'
|
||||
"When you get a notification, you will now be notified by the red flashing Indicator.",
|
||||
"When you get a new friend request, you will notified by a sound.",
|
||||
"Added a new Recents tab to easily see who messaged you last.",
|
||||
"Adjusted the padding and size in some places such as the friends list.",
|
||||
"Messages can now be formated (e.g. **Hello**)"
|
||||
],
|
||||
fix: [
|
||||
'Performance improvements were made in some places.',
|
||||
"Performance improvements were made in some places.",
|
||||
'Yesterday is now spelt with a capital "Y" in the timestamp.'
|
||||
],
|
||||
next: [
|
||||
'Uploading images or any files.',
|
||||
]
|
||||
next: ["Uploading images or any files."]
|
||||
},
|
||||
{
|
||||
title: 'Typing Indicator',
|
||||
shortTitle: 'Typing Indicator',
|
||||
date: '08/02/2019',
|
||||
title: "Typing Indicator",
|
||||
shortTitle: "Typing Indicator",
|
||||
date: "08/02/2019",
|
||||
new: [
|
||||
'See who\'s typing with the new typing indicator!',
|
||||
'Online and offline friends now have their own category.',
|
||||
'Timestamps for each message.'
|
||||
"See who's typing with the new typing indicator!",
|
||||
"Online and offline friends now have their own category.",
|
||||
"Timestamps for each message."
|
||||
],
|
||||
fix: [
|
||||
'Some bugs with the message list scrolling.',
|
||||
'Added some margin and padding to some places.'
|
||||
"Some bugs with the message list scrolling.",
|
||||
"Added some margin and padding to some places."
|
||||
],
|
||||
next: [
|
||||
'Message notifications.',
|
||||
]
|
||||
next: ["Message notifications."]
|
||||
},
|
||||
{
|
||||
title: 'Avatar',
|
||||
shortTitle: 'Avatar',
|
||||
date: '29/01/2019',
|
||||
title: "Avatar",
|
||||
shortTitle: "Avatar",
|
||||
date: "29/01/2019",
|
||||
new: [
|
||||
'Settings page has been added.',
|
||||
'You can now set your own profile picture from the settings page.',
|
||||
'You can now logout within the app.'
|
||||
"Settings page has been added.",
|
||||
"You can now set your own profile picture from the settings page.",
|
||||
"You can now logout within the app."
|
||||
],
|
||||
next: [
|
||||
'Typing status.',
|
||||
]
|
||||
next: ["Typing status."]
|
||||
},
|
||||
{
|
||||
title: 'Message limit, Chat message changes',
|
||||
shortTitle: 'Message limit',
|
||||
date: '25/01/2019',
|
||||
title: "Message limit, Chat message changes",
|
||||
shortTitle: "Message limit",
|
||||
date: "25/01/2019",
|
||||
new: ["Changed the design of messages slightly and changed the font size."],
|
||||
fix: ["Messages now have a limit of 5000 characters."],
|
||||
next: ["I have decided to add profile pictures in the next update."]
|
||||
},
|
||||
|
||||
{
|
||||
title: "ReeeeCaptcha :D",
|
||||
shortTitle: "ReCaptcha",
|
||||
date: "23/01/2019",
|
||||
new: [
|
||||
'Changed the design of messages slightly and changed the font size.'
|
||||
"Added reCaptcha to our login and register so our website is safe from any spam accounts that could be created by bots."
|
||||
],
|
||||
next: ["Typing status or maybe profile pictures (haven't decided yet)"]
|
||||
},
|
||||
{
|
||||
title: "Online status and fixes",
|
||||
shortTitle: "Online status and fixes",
|
||||
date: "22/01/2019",
|
||||
new: [
|
||||
"See if your friends are online, away, busy, looking to play or offline.",
|
||||
"Planned features and the latest change now shows in app."
|
||||
],
|
||||
fix: [
|
||||
'Messages now have a limit of 5000 characters.',
|
||||
],
|
||||
"Messages will no longer show twice when sending.",
|
||||
"Adjusted padding on some places.",
|
||||
"Message font is now much smaller."
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Send and receive messages (experimental)",
|
||||
shortTitle: "Send and receive messages",
|
||||
date: "14/01/2019",
|
||||
new: ["You can now send messages to your friends!"],
|
||||
next: [
|
||||
'I have decided to add profile pictures in the next update.',
|
||||
"improving the new messaging functionality and adding typing indicators, online statuses."
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
title: 'ReeeeCaptcha :D',
|
||||
shortTitle: 'ReCaptcha',
|
||||
date: '23/01/2019',
|
||||
title: "Public change log, Accept friends",
|
||||
shortTitle: "Public change log, Accept friends",
|
||||
date: "09/01/2019",
|
||||
new: [
|
||||
'Added reCaptcha to our login and register so our website is safe from any spam accounts that could be created by bots.',
|
||||
"Added a change log so you can see how much progress is being made to Nertivia.",
|
||||
"Adding friends, denying requests, accepting requests is now possible."
|
||||
],
|
||||
next: [
|
||||
'Typing status or maybe profile pictures (haven\'t decided yet)',
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
title: 'Online status and fixes',
|
||||
shortTitle: 'Online status and fixes',
|
||||
date: '22/01/2019',
|
||||
new: [
|
||||
'See if your friends are online, away, busy, looking to play or offline.',
|
||||
'Planned features and the latest change now shows in app.'
|
||||
],
|
||||
fix: [
|
||||
'Messages will no longer show twice when sending.',
|
||||
'Adjusted padding on some places.',
|
||||
'Message font is now much smaller.'
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
title: 'Send and receive messages (experimental)',
|
||||
shortTitle: 'Send and receive messages',
|
||||
date: '14/01/2019',
|
||||
new: [
|
||||
'You can now send messages to your friends!',
|
||||
],
|
||||
next: [
|
||||
'improving the new messaging functionality and adding typing indicators, online statuses.',
|
||||
]
|
||||
next: ["Ability to send messages."]
|
||||
},
|
||||
|
||||
{
|
||||
title: 'Public change log, Accept friends',
|
||||
shortTitle: 'Public change log, Accept friends',
|
||||
date: '09/01/2019',
|
||||
new: [
|
||||
'Added a change log so you can see how much progress is being made to Nertivia.',
|
||||
'Adding friends, denying requests, accepting requests is now possible.'
|
||||
],
|
||||
next: [
|
||||
'Ability to send messages.',
|
||||
]
|
||||
title: "Issues fixed",
|
||||
shortTitle: "Issues fixed",
|
||||
date: "04/01/2019",
|
||||
msg: "Tweaks have been made to the website here and there."
|
||||
},
|
||||
|
||||
{
|
||||
title: 'Issues fixed',
|
||||
shortTitle: 'Issues fixed',
|
||||
date: '04/01/2019',
|
||||
msg: 'Tweaks have been made to the website here and there.'
|
||||
},
|
||||
|
||||
{
|
||||
title: 'Compatibility',
|
||||
date: '31/12/2018',
|
||||
msg: 'Website is now compatible for viewing on mobile, tablet and desktop devices.'
|
||||
title: "Compatibility",
|
||||
date: "31/12/2018",
|
||||
msg:
|
||||
"Website is now compatible for viewing on mobile, tablet and desktop devices."
|
||||
}
|
||||
]
|
||||
];
|
||||
|
||||
|
||||
export default config;
|
||||
export default config;
|
||||
|
|
|
|||
|
|
@ -5,32 +5,38 @@
|
|||
<transition name="fade-between-two" appear>
|
||||
<ConnectingScreen v-if="!loggedIn"/>
|
||||
<div class="box" v-if="loggedIn">
|
||||
<div class="tabs">
|
||||
<div class="frame">
|
||||
<div class="tabs">
|
||||
<div :class="`tab ${currentTab === 0 ? 'selected' : ''}`" @click="switchTab(0)">
|
||||
<i class="material-icons">list_alt</i>
|
||||
Changelog
|
||||
</div>
|
||||
|
||||
<div :class="`tab ${currentTab === 0 ? 'selected' : ''}`" @click="switchTab(0)">
|
||||
<i class="material-icons">list_alt</i>
|
||||
Changelog
|
||||
</div>
|
||||
<div :class="`tab ${currentTab === 1 ? 'selected' : ''}`" @click="switchTab(1)">
|
||||
<i class="material-icons">chat</i>
|
||||
Direct Message
|
||||
</div>
|
||||
|
||||
<div :class="`tab ${currentTab === 1 ? 'selected' : ''}`" @click="switchTab(1)">
|
||||
<i class="material-icons">chat</i>
|
||||
Direct Message
|
||||
</div>
|
||||
|
||||
<div :class="`tab ${currentTab === 2 ? 'selected' : ''}`" @click="switchTab(2)">
|
||||
<i class="material-icons">forum</i>
|
||||
Servers
|
||||
</div>
|
||||
<div :class="`tab ${currentTab === 3 ? 'selected' : ''}`" @click="switchTab(3)">
|
||||
<i class="material-icons">rss_feed</i>
|
||||
Server Browser
|
||||
<div :class="`tab ${currentTab === 2 ? 'selected' : ''}`" @click="switchTab(2)">
|
||||
<i class="material-icons">forum</i>
|
||||
Servers
|
||||
</div>
|
||||
<div :class="`tab ${currentTab === 3 ? 'selected' : ''}`" @click="switchTab(3)">
|
||||
<i class="material-icons">rss_feed</i>
|
||||
Server Browser
|
||||
</div>
|
||||
</div>
|
||||
<div class="drag-area" v-if="isElectron"></div>
|
||||
<electron-frame-buttons v-if="isElectron"/>
|
||||
</div>
|
||||
<div class="panel-layout">
|
||||
<news v-if="currentTab == 0" />
|
||||
<direct-message v-if="currentTab == 1" />
|
||||
<div class="coming-soon" v-if="currentTab > 1">
|
||||
<div class="icon"><i class="material-icons">cached</i></div>
|
||||
<news v-if="currentTab == 0"/>
|
||||
<direct-message v-if="currentTab == 1"/>
|
||||
<servers v-if="currentTab == 2"/>
|
||||
<div class="coming-soon" v-if="currentTab > 2">
|
||||
<div class="icon">
|
||||
<i class="material-icons">cached</i>
|
||||
</div>
|
||||
<div class="text">Coming soon!</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -44,26 +50,41 @@
|
|||
import { bus } from "../main";
|
||||
import Popouts from "@/components/app/Popouts/Popouts.vue";
|
||||
|
||||
import changelog from '@/utils/changelog.js';
|
||||
import changelog from "@/utils/changelog.js";
|
||||
import ConnectingScreen from "./../components/app/ConnectingScreen.vue";
|
||||
import Spinner from "./../components/Spinner.vue";
|
||||
|
||||
const News = () => import('./../components/app/Tabs/News.vue');
|
||||
const DirectMessage = () => import('./../components/app/Tabs/DirectMessage.vue');
|
||||
|
||||
|
||||
const ElectronFrameButtons = () =>
|
||||
import("./../components/ElectronJS/FrameButtons.vue");
|
||||
|
||||
const News = () => import("./../components/app/Tabs/News.vue");
|
||||
//const DirectMessage = () => import('./../components/app/Tabs/DirectMessage.vue');
|
||||
const DirectMessage = () => ({
|
||||
component: import("./../components/app/Tabs/DirectMessage.vue"),
|
||||
loading: Spinner,
|
||||
delay: 0
|
||||
});
|
||||
const Servers = () => ({
|
||||
component: import("./../components/app/Tabs/Servers.vue"),
|
||||
loading: Spinner,
|
||||
delay: 0
|
||||
});
|
||||
|
||||
export default {
|
||||
name: "app",
|
||||
components: {
|
||||
ElectronFrameButtons,
|
||||
DirectMessage,
|
||||
Servers,
|
||||
ConnectingScreen,
|
||||
Popouts,
|
||||
News
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
currentTab: localStorage.getItem('currentTab') || 0,
|
||||
title: "Nertivia"
|
||||
currentTab: localStorage.getItem("currentTab") || 0,
|
||||
title: "Nertivia",
|
||||
isElectron: window && window.process && window.process.type
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -73,14 +94,13 @@ export default {
|
|||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
// check if changelog is updated
|
||||
const seenVersion = localStorage.getItem('changelog-version-seen');
|
||||
const seenVersion = localStorage.getItem("changelog-version-seen");
|
||||
if (!seenVersion || seenVersion < changelog[0].version) {
|
||||
this.currentTab = 0;
|
||||
localStorage.setItem('currentTab', 0)
|
||||
localStorage.setItem("currentTab", 0);
|
||||
}
|
||||
localStorage.setItem('changelog-version-seen', changelog[0].version)
|
||||
localStorage.setItem("changelog-version-seen", changelog[0].version);
|
||||
bus.$on("title:change", title => {
|
||||
this.title = title;
|
||||
});
|
||||
|
|
@ -95,8 +115,7 @@ export default {
|
|||
|
||||
|
||||
<style scoped>
|
||||
|
||||
.coming-soon{
|
||||
.coming-soon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
|
@ -106,27 +125,41 @@ export default {
|
|||
background: rgba(0, 0, 0, 0.39);
|
||||
color: white;
|
||||
}
|
||||
.coming-soon .icon{
|
||||
|
||||
}
|
||||
.coming-soon .material-icons {
|
||||
font-size: 100px;
|
||||
}
|
||||
|
||||
.direct-message-tab{
|
||||
.direct-message-tab {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.frame {
|
||||
display: flex;
|
||||
-webkit-app-region: drag;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.drag-area {
|
||||
display: flex;
|
||||
min-width: 20px;
|
||||
flex: 1;
|
||||
-webkit-app-region: drag;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
display: flex;
|
||||
overflow-y: hidden;
|
||||
overflow-x: auto;
|
||||
height: 35px;
|
||||
flex-shrink: 0;
|
||||
max-width: 473px;
|
||||
flex-basis: auto; /* default value */
|
||||
flex-grow: 1;
|
||||
-webkit-app-region: no-drag;
|
||||
}
|
||||
|
||||
.tabs::-webkit-scrollbar {
|
||||
height: 5px;
|
||||
}
|
||||
|
|
@ -145,12 +178,13 @@ export default {
|
|||
cursor: default;
|
||||
user-select: none;
|
||||
transition: 0.3s;
|
||||
-webkit-app-region: no-drag;
|
||||
}
|
||||
.tab.selected{
|
||||
.tab.selected {
|
||||
background: rgba(71, 71, 71, 0.637);
|
||||
}
|
||||
|
||||
.tab:hover{
|
||||
.tab:hover {
|
||||
background: rgba(71, 71, 71, 0.637);
|
||||
}
|
||||
|
||||
|
|
@ -234,6 +268,7 @@ textarea {
|
|||
|
||||
.panel-layout {
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in a new issue