mirror of
https://github.com/gabehf/massflip.git
synced 2026-03-07 21:48:16 -08:00
bug fixes, ws rate limit, new graph
This commit is contained in:
parent
a3e56fa753
commit
5387401156
5 changed files with 91 additions and 51 deletions
|
|
@ -8,6 +8,7 @@ import (
|
|||
"time"
|
||||
|
||||
"github.com/gorilla/websocket"
|
||||
"golang.org/x/time/rate"
|
||||
)
|
||||
|
||||
// code adapted from the gorilla websocket chat demo code
|
||||
|
|
@ -49,6 +50,8 @@ type Client struct {
|
|||
username string
|
||||
|
||||
auth bool
|
||||
|
||||
limiter rate.Limiter
|
||||
}
|
||||
|
||||
type Auth struct {
|
||||
|
|
@ -70,6 +73,7 @@ func (c *Client) readPump() {
|
|||
c.conn.SetReadLimit(maxMessageSize)
|
||||
c.conn.SetReadDeadline(time.Now().Add(pongWait))
|
||||
c.conn.SetPongHandler(func(string) error { c.conn.SetReadDeadline(time.Now().Add(pongWait)); return nil })
|
||||
c.limiter = *rate.NewLimiter(1, 5)
|
||||
for {
|
||||
_, message, err := c.conn.ReadMessage()
|
||||
if err != nil {
|
||||
|
|
@ -78,6 +82,10 @@ func (c *Client) readPump() {
|
|||
}
|
||||
break
|
||||
}
|
||||
if !c.limiter.Allow() {
|
||||
c.send <- []byte("{\"type\":\"chaterror\",\"error\":\"You are sending messages too quickly\"}")
|
||||
continue
|
||||
}
|
||||
var v Auth
|
||||
err = json.Unmarshal(message, &v)
|
||||
if err == nil {
|
||||
|
|
|
|||
|
|
@ -5,13 +5,15 @@
|
|||
<div id="until">{{ until }}</div>
|
||||
</div>
|
||||
<div id="BetGraph">
|
||||
<div class="pie animate pie-base" :style="tailsStyle"></div>
|
||||
<div class="pie animate start-no-round pie-overlap" :style="headsStyle"></div>
|
||||
<div class="spin">
|
||||
<div class="tails-pie pie animate pie-base" :style="tailsStyle"></div>
|
||||
<div class="heads-pie pie animate pie-overlap" :style="headsStyle"></div>
|
||||
</div>
|
||||
<div class="data-overlap" id="data">
|
||||
<div id="headsInfo" class="percent heads">{{ headsPercent }}%</div>
|
||||
<div id="headsPool" class="pool heads"> {{ headsPool }}gp</div>
|
||||
<div id="tailsInfo" class="percent tails">{{ tailsPercent }}%</div>
|
||||
<div id="tailsPool" class="pool tails">{{ tailsPool }}gp</div>
|
||||
<div id="headsInfo" class="percent heads" :class="{ unfocused: User.bet == 'tails' }">{{ headsPercent }}%</div>
|
||||
<div id="headsPool" class="pool heads" :class="{ unfocused: User.bet == 'tails' }"> {{ headsPool }}gp</div>
|
||||
<div id="tailsInfo" class="percent tails" :class="{ unfocused: User.bet == 'heads' }">{{ tailsPercent }}%</div>
|
||||
<div id="tailsPool" class="pool tails" :class="{ unfocused: User.bet == 'heads' }">{{ tailsPool }}gp</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="lower" v-show="userStore().username != ''">
|
||||
|
|
@ -168,35 +170,23 @@ onMounted(() => {
|
|||
position:absolute;
|
||||
border-radius:50%;
|
||||
}
|
||||
.pie:before {
|
||||
.heads-pie:before {
|
||||
inset:0;
|
||||
background:
|
||||
radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat,
|
||||
conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
|
||||
-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
|
||||
mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
|
||||
}
|
||||
.pie:after {
|
||||
inset:calc(50% - var(--b)/2);
|
||||
background:var(--c);
|
||||
transform:rotate(calc(var(--p)*3.6deg - 90deg)) translate(calc(var(--w)/2 - 50%));
|
||||
.tails-pie:before {
|
||||
inset:0;
|
||||
background:
|
||||
conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
|
||||
-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
|
||||
mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
|
||||
}
|
||||
.animate {
|
||||
animation:p 1s .5s both;
|
||||
}
|
||||
.start-no-round:before {
|
||||
inset:0;
|
||||
background:
|
||||
radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat,
|
||||
conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
|
||||
-webkit-mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
|
||||
mask:radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
|
||||
}
|
||||
.start-no-round:after {
|
||||
inset:calc(50% - var(--b)/2);
|
||||
background:var(--c);
|
||||
transform:rotate(calc(var(--p)*3.6deg - 90deg)) translate(calc(var(--w)/2 - 50%));
|
||||
}
|
||||
@-moz-keyframes p{
|
||||
from{--p:0}
|
||||
}
|
||||
|
|
@ -211,7 +201,7 @@ onMounted(() => {
|
|||
}
|
||||
.data-overlap {
|
||||
position:relative;
|
||||
bottom:305px;
|
||||
bottom:304px;
|
||||
left: 50px;
|
||||
background-color: #001d3d;
|
||||
width: 250px;
|
||||
|
|
@ -238,6 +228,12 @@ onMounted(() => {
|
|||
.tails {
|
||||
color:#dc2f91;
|
||||
}
|
||||
.heads.unfocused {
|
||||
color:#7a661b;
|
||||
}
|
||||
.tails.unfocused {
|
||||
color:#6b214b;
|
||||
}
|
||||
.pool.heads {
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
|
|
@ -264,4 +260,15 @@ onMounted(() => {
|
|||
background-clip: text;
|
||||
color: transparent;
|
||||
}
|
||||
.spin {
|
||||
animation: rotation 20s infinite linear;
|
||||
}
|
||||
@keyframes rotation {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -40,15 +40,45 @@ const ChatColors = {
|
|||
|
||||
const _CHAT_MAX_HISTORY = 75;
|
||||
|
||||
onMounted(() => {
|
||||
let log = document.getElementById("ChatWindow")
|
||||
function appendLog(item) {
|
||||
var doScroll = log.scrollTop > log.scrollHeight - log.clientHeight - 1;
|
||||
log.appendChild(item);
|
||||
if (doScroll) {
|
||||
log.scrollTop = log.scrollHeight - log.clientHeight;
|
||||
}
|
||||
|
||||
function appendLog(item) {
|
||||
var log = document.getElementById("ChatWindow")
|
||||
var doScroll = log.scrollTop > log.scrollHeight - log.clientHeight - 1;
|
||||
log.appendChild(item);
|
||||
if (doScroll) {
|
||||
log.scrollTop = log.scrollHeight - log.clientHeight;
|
||||
}
|
||||
}
|
||||
|
||||
function updateChat() {
|
||||
var log = document.getElementById("ChatWindow")
|
||||
log.innerHTML = ""
|
||||
for (let message of Object.values(chatQueue.elements)) {
|
||||
var item = document.createElement("div")
|
||||
let fromUser = document.createElement("span")
|
||||
fromUser.style = `color: ${message.color};`
|
||||
fromUser.innerText = message.username
|
||||
item.appendChild(fromUser)
|
||||
if ('points' in message) {
|
||||
let chatScore = document.createElement("span")
|
||||
chatScore.innerText = `(${message.points})`
|
||||
chatScore.style = `color: ${message.color};font-family: 'Helvetica';font-size: 12px;`
|
||||
item.appendChild(chatScore)
|
||||
}
|
||||
let chatMsg
|
||||
if (!('msgcolor' in message)) {
|
||||
//message['msgcolor'] = '#f3f9f8'
|
||||
}
|
||||
chatMsg = document.createElement("span")
|
||||
chatMsg.style = `color: ${message.msgcolor};`
|
||||
chatMsg.innerText = `: ${message.message}`
|
||||
item.appendChild(chatMsg)
|
||||
appendLog(item)
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
WS.addEventListener("message", function (evt) {
|
||||
let MSGs = evt.data.split('\n')
|
||||
MSGs.forEach((i) => {
|
||||
|
|
@ -58,27 +88,22 @@ onMounted(() => {
|
|||
if (chatQueue.length >= _CHAT_MAX_HISTORY) {
|
||||
chatQueue.dequeue()
|
||||
}
|
||||
log.innerHTML = ""
|
||||
for (let message of Object.values(chatQueue.elements)) {
|
||||
var item = document.createElement("div")
|
||||
let fromUser = document.createElement("span")
|
||||
fromUser.style = `color: ${message.color};`
|
||||
fromUser.innerText = message.username
|
||||
item.appendChild(fromUser)
|
||||
let chatScore = document.createElement("span")
|
||||
chatScore.innerText = `(${message.points})`
|
||||
chatScore.style = `color: ${message.color};font-family: 'Helvetica';font-size: 12px;`
|
||||
item.appendChild(chatScore)
|
||||
let chatMsg = document.createTextNode(`: ${message.message}`)
|
||||
item.appendChild(chatMsg)
|
||||
appendLog(item)
|
||||
}
|
||||
updateChat()
|
||||
} else if (wsMsg.type == 'chaterror') {
|
||||
chatQueue.enqueue({
|
||||
username: 'Not Sent',
|
||||
color: '#555',
|
||||
message: wsMsg.error,
|
||||
msgcolor: '#555'
|
||||
})
|
||||
updateChat()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
function sendChat() {
|
||||
if (chat.value == '') { return }
|
||||
if (chat.value.startsWith("/color")) {
|
||||
let newColor = chat.value.split(" ")[1]
|
||||
if (newColor in ChatColors) {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ module.exports = defineConfig({
|
|||
module.exports = {
|
||||
devServer: {
|
||||
host: "localhost",
|
||||
port: 8000,
|
||||
port: 8080,
|
||||
proxy: {
|
||||
"/": {
|
||||
target: "http://localhost:8000",
|
||||
|
|
|
|||
2
main.go
2
main.go
|
|
@ -12,7 +12,7 @@ import (
|
|||
|
||||
/*
|
||||
0.0.4
|
||||
- added rate limiting
|
||||
- added rate limiting for http and ws
|
||||
- added captcha for account creation
|
||||
- added WebSocket authentication
|
||||
- fixed BetInput bugs (NaN, decimals)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue