slight tweaks

This commit is contained in:
Craig 2020-01-23 16:54:32 +00:00
parent 157ee2e1fb
commit 064253eae3
12 changed files with 94 additions and 57 deletions

View File

@ -1 +1 @@
VUE_APP_SERVER=localhost:3000 VUE_APP_SERVER_PORT=3000

View File

@ -0,0 +1,12 @@
<div align="center">
<a href="https://github.com/nurdism/neko"><img src="https://github.com/nurdism/neko/raw/master/.github/logo.png" width="650" height="auto"/></a>
</div>
# **n**.eko
This is a proof of concept project I threw together over the last few days, it's not perfect, but it looks nice. This uses web rtc to stream a desktop inside of a docker container, I made this because [rabb.it](https://en.wikipedia.org/wiki/Rabb.it) went under and my internet can't handle streaming and discord keeps crashing. I just want to watch anime with my friends ლ(ಠ益ಠლ) so I started digging throughout the net and found a few *kinda* clones, but non of them had the virtual browser, then I found [Turtus](https://github.com/Khauri/Turtus) and I was able to figure out the rest.
This is by no means a fully featured clone of rabbit. The client has no concept of other peers. It has bugs, but for the most part it works. I'm not sure what the future holds for this. If I continue to use it and like it, I'll probably keep pushing updates to it. I'd be happy to accept PRs for any improvements.
### Why n.eko?
I like cats (Neko is the Japanese word for cat), I'm a weeb/nerd, I own the domain [n.eko.moe](https://n.eko.moe/) and I love the logo /shrug

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
client/src/assets/clap.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
client/src/assets/heart.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
client/src/assets/sleep.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

View File

@ -325,7 +325,7 @@
@Ref('history') readonly _history!: HTMLElement @Ref('history') readonly _history!: HTMLElement
@Ref('context') readonly _context!: any @Ref('context') readonly _context!: any
_content = '' content = ''
get id() { get id() {
return this.$accessor.user.id return this.$accessor.user.id
@ -339,18 +339,6 @@
return this.$accessor.chat.history return this.$accessor.chat.history
} }
get content() {
return this._content
}
set content(text: string) {
if (text.length > length) {
this._content = text.substring(0, length)
return
}
this._content = text
}
@Watch('history') @Watch('history')
onHistroyChange() { onHistroyChange() {
this.$nextTick(() => { this.$nextTick(() => {
@ -361,7 +349,7 @@
@Watch('muted') @Watch('muted')
onMutedChange(muted: boolean) { onMutedChange(muted: boolean) {
if (muted) { if (muted) {
this._content = '' this.content = ''
} }
} }
@ -405,11 +393,15 @@
} }
onKeyDown(event: KeyboardEvent) { onKeyDown(event: KeyboardEvent) {
if (typeof this._content === 'undefined' || this.muted) { if (this.muted) {
return return
} }
if (this._content.length == length) { if (this.content.length > length) {
this.content = this.content.substring(0, length)
}
if (this.content.length == length) {
if ( if (
[8, 16, 17, 18, 20, 33, 34, 35, 36, 37, 38, 39, 40, 45, 46, 91, 93, 144].includes(event.keyCode) || [8, 16, 17, 18, 20, 33, 34, 35, 36, 37, 38, 39, 40, 45, 46, 91, 93, 144].includes(event.keyCode) ||
(event.ctrlKey && [67, 65, 88].includes(event.keyCode)) (event.ctrlKey && [67, 65, 88].includes(event.keyCode))
@ -425,14 +417,14 @@
return return
} }
if (this._content === '') { if (this.content === '') {
event.preventDefault() event.preventDefault()
return return
} }
this.$accessor.chat.sendMessage(this._content) this.$accessor.chat.sendMessage(this.content)
this._content = '' this.content = ''
event.preventDefault() event.preventDefault()
} }
} }

View File

@ -1,12 +1,12 @@
<template> <template>
<div ref="emote" @click.stop.prevent="run" class="emote"> <div ref="emote" @click.stop.prevent="run" class="emote">
<i :class="classes"></i> <div :class="classes" />
<i :class="classes"></i> <div :class="classes" />
<i :class="classes"></i> <div :class="classes" />
<i :class="classes"></i> <div :class="classes" />
<i :class="classes"></i> <div :class="classes" />
<i :class="classes"></i> <div :class="classes" />
<i :class="classes"></i> <div :class="classes" />
</div> </div>
</template> </template>
@ -18,7 +18,7 @@
bottom: 0; bottom: 0;
right: 0; right: 0;
i { div {
position: absolute; position: absolute;
width: 30px; width: 30px;
height: 30px; height: 30px;
@ -26,18 +26,30 @@
font-size: 30px; font-size: 30px;
line-height: 30px; line-height: 30px;
text-align: center; text-align: center;
background-size: contain;
&.celebrate {
background-image: url('../assets/celebrate.png');
}
&.clap {
background-image: url('../assets/clap.png');
}
&.exclam {
background-image: url('../assets/exclam.png');
}
&.heart { &.heart {
color: rgb(204, 72, 72); background-image: url('../assets/heart.png');
} }
&.poo {
color: rgb(112, 89, 58); &.laughing {
background-image: url('../assets/laughing.png');
} }
&.grin {
color: rgb(228, 194, 84); &.sleep {
} background-image: url('../assets/sleep.png');
&.dizzy {
color: rgb(199, 199, 199);
} }
} }
} }
@ -66,14 +78,7 @@
let count = 0 let count = 0
let finish: Array<Promise<any>> = [] let finish: Array<Promise<any>> = []
const emotes: any = { this.classes = [this.emote.type]
heart: 'fa-heart',
poo: 'fa-poo',
grin: 'fa-grin-tears',
ghost: 'fa-ghost',
}
this.classes = ['fas', emotes[this.emote.type] || 'fa-heart', this.emote.type]
for (let child of this.container.children) { for (let child of this.container.children) {
const ele = child as HTMLElement const ele = child as HTMLElement

View File

@ -1,10 +1,12 @@
<template> <template>
<div class="emotes"> <div class="emotes">
<ul v-if="!muted"> <ul v-if="!muted">
<li><i @click.stop.prevent="click('heart')" class="fas fa-heart"></i></li> <li><div @click.stop.prevent="click('heart')" class="heart" /></li>
<li><i @click.stop.prevent="click('poo')" class="fas fa-poo"></i></li> <li><div @click.stop.prevent="click('sleep')" class="sleep" /></li>
<li><i @click.stop.prevent="click('grin')" class="fas fa-grin-tears"></i></li> <li><div @click.stop.prevent="click('laughing')" class="laughing" /></li>
<li><i @click.stop.prevent="click('ghost')" class="fas fa-ghost"></i></li> <li><div @click.stop.prevent="click('celebrate')" class="celebrate" /></li>
<li><div @click.stop.prevent="click('exclam')" class="exclam" /></li>
<li><div @click.stop.prevent="click('clap')" class="clap" /></li>
</ul> </ul>
</div> </div>
</template> </template>
@ -21,8 +23,35 @@
font-size: 24px; font-size: 24px;
margin: 0 5px; margin: 0 5px;
i { div {
width: 24px;
height: 24px;
cursor: pointer; cursor: pointer;
background-size: contain;
&.celebrate {
background-image: url('../assets/celebrate.png');
}
&.clap {
background-image: url('../assets/clap.png');
}
&.exclam {
background-image: url('../assets/exclam.png');
}
&.heart {
background-image: url('../assets/heart.png');
}
&.laughing {
background-image: url('../assets/laughing.png');
}
&.sleep {
background-image: url('../assets/sleep.png');
}
} }
} }
} }

View File

@ -33,7 +33,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
connect(password: string, username: string) { connect(password: string, username: string) {
const url = const url =
process.env.NODE_ENV === 'development' process.env.NODE_ENV === 'development'
? `ws://${process.env.VUE_APP_SERVER}/` ? `ws://${location.host.split(':')[0]}:${process.env.VUE_APP_SERVER_PORT}/`
: `${/https/gi.test(location.protocol) ? 'wss' : 'ws'}://${location.host}/` : `${/https/gi.test(location.protocol) ? 'wss' : 'ws'}://${location.host}/`
super.connect(url, password, username) super.connect(url, password, username)
@ -61,13 +61,6 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
duration: 5000, duration: 5000,
speed: 1000, speed: 1000,
}) })
this.$accessor.chat.newMessage({
id: this.id,
content: 'connected',
type: 'event',
created: new Date(),
})
} }
protected [EVENT.DISCONNECTED](reason?: Error) { protected [EVENT.DISCONNECTED](reason?: Error) {
@ -125,6 +118,12 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
///////////////////////////// /////////////////////////////
protected [EVENT.MEMBER.LIST]({ members }: MemberListPayload) { protected [EVENT.MEMBER.LIST]({ members }: MemberListPayload) {
this.$accessor.user.setMembers(members) this.$accessor.user.setMembers(members)
this.$accessor.chat.newMessage({
id: this.id,
content: 'connected',
type: 'event',
created: new Date(),
})
} }
protected [EVENT.MEMBER.CONNECTED](member: MemberPayload) { protected [EVENT.MEMBER.CONNECTED](member: MemberPayload) {