reta final, so falta a parte do obs studio agora
This commit is contained in:
@@ -98,6 +98,8 @@ func main() {
|
||||
e.POST("login", login, timeoutMiddleware, rateLimit)
|
||||
e.GET("login", badreq)
|
||||
e.GET("player", player_data)
|
||||
e.GET("player/info/:id", player_info)
|
||||
e.GET("player/info*", player_info)
|
||||
e.GET("player/inv", inv_get)
|
||||
e.POST("player/inv", inv_add)
|
||||
e.GET("player/inv/del/:id", inv_del)
|
||||
|
||||
@@ -190,6 +190,50 @@ func roll_get(c echo.Context) error {
|
||||
})
|
||||
}
|
||||
|
||||
func player_info(c echo.Context) error {
|
||||
id := c.Param("id")
|
||||
|
||||
if anyEmpty(id) {
|
||||
return jsonError(c, http.StatusBadRequest, "você precisa passar a id do usuario.")
|
||||
}
|
||||
|
||||
var foto, nome, vida, descricao string
|
||||
var conhecimento, level, idade, vd, vdm, destreza, inteligencia, forca, constituicao, carisma, inventario int64
|
||||
var altura float64
|
||||
|
||||
err := db.QueryRow(`SELECT foto, nome, conhecimento, level, idade, altura, vida, vida_maxima,
|
||||
destresa, inteligencia, força, constituição, cárisma, inventario, descrição
|
||||
FROM players WHERE id=? LIMIT 1;`, id).
|
||||
Scan(&foto, &nome, &conhecimento, &level, &idade, &altura, &vd, &vdm,
|
||||
&destreza, &inteligencia, &forca, &constituicao, &carisma, &inventario, &descricao)
|
||||
|
||||
if err != nil {
|
||||
return jsonError(c, http.StatusBadRequest, "Algo deu errado ao carregar informações do player")
|
||||
}
|
||||
|
||||
vida = fmt.Sprintf("%v/%v", vd, vdm)
|
||||
porcentagem := (float64(vd) / float64(vdm)) * 100
|
||||
|
||||
return c.JSON(http.StatusOK, resp_json{
|
||||
Status: "Success",
|
||||
Foto: foto,
|
||||
PlayerName: nome,
|
||||
Conhecimento: &conhecimento,
|
||||
Level: &level,
|
||||
Idade: &idade,
|
||||
Altura: &altura,
|
||||
Vida: vida,
|
||||
VidaPorcentagem: &porcentagem,
|
||||
Destresa: &destreza,
|
||||
Inteligencia: &inteligencia,
|
||||
Força: &forca,
|
||||
Constituição: &constituicao,
|
||||
Cárisma: &carisma,
|
||||
Inventario: &inventario,
|
||||
Descrição: descricao,
|
||||
})
|
||||
}
|
||||
|
||||
func player_data(c echo.Context) error {
|
||||
session, err := requireSession(c)
|
||||
if err != nil {
|
||||
|
||||
168
rpg/css/styleProfile.css
Normal file
168
rpg/css/styleProfile.css
Normal file
@@ -0,0 +1,168 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#playerDATA {
|
||||
background-color: var(--subbgcolor);
|
||||
padding: 1dvw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 1vw;
|
||||
|
||||
#hero {
|
||||
width: 25dvh;
|
||||
height: 25dvh;
|
||||
border: solid 3px var(--backredcolor);
|
||||
border-radius: 100dvh;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 1vw;
|
||||
width: 80%;
|
||||
|
||||
li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 1dvh;
|
||||
font-size: 1.5em;
|
||||
border-bottom: dotted 2px var(--lines);
|
||||
flex-wrap: wrap;
|
||||
|
||||
p {
|
||||
margin-left: 1dvh;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#box_1 {
|
||||
display: flex;
|
||||
h1 {
|
||||
min-height: 4dvh;
|
||||
width: 100%;
|
||||
background: var(--btncolor);
|
||||
font-family: "Share Tech Mono", monospace;
|
||||
padding-left: 1dvh;
|
||||
}
|
||||
#status {
|
||||
width: 50%;
|
||||
border-right: solid 1px var(--lines);
|
||||
|
||||
overflow: hidden;
|
||||
ul {
|
||||
height: 90%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
li {
|
||||
margin: 2dvh;
|
||||
background-color: var(--bgcolor);
|
||||
border-radius: 1dvw;
|
||||
|
||||
label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 1vw 0 1vw 1vw;
|
||||
p {
|
||||
padding: 0 1vw 0 0.5vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
background-color: var(--subbgcolor);
|
||||
}
|
||||
|
||||
#text_lore {
|
||||
width: 50%;
|
||||
ul {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
p {
|
||||
font-family: arial;
|
||||
font-size: 1.5em;
|
||||
padding: 1vw;
|
||||
white-space: pre-wrap;
|
||||
width: 100%;
|
||||
min-height: 45dvw;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#statusPlayer {
|
||||
text-align: center;
|
||||
width: 10%;
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
top: 3dvh;
|
||||
right: 3dvh;
|
||||
padding: 0.5dvw;
|
||||
border-radius: 10vw;
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1080px) {
|
||||
#playerDATA {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
#hero {
|
||||
width: 40vw;
|
||||
height: auto;
|
||||
aspect-ratio: 1 / 1;
|
||||
}
|
||||
|
||||
ul li {
|
||||
font-size: clamp(1em, 2vw, 1.2em);
|
||||
}
|
||||
}
|
||||
|
||||
#box_1 {
|
||||
flex-direction: column;
|
||||
|
||||
#status {
|
||||
width: 100%;
|
||||
min-height: 60vh;
|
||||
ul {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
#text_lore {
|
||||
width: 100%;
|
||||
min-height: 60vh;
|
||||
}
|
||||
}
|
||||
#statusPlayer {
|
||||
width: 35%;
|
||||
padding: 2dvw;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1080px) and (orientation: landscape) {
|
||||
#box_1 {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
#status {
|
||||
width: 48%;
|
||||
min-height: 50vh;
|
||||
max-height: none;
|
||||
}
|
||||
|
||||
#playerDATA #hero {
|
||||
width: 40vh;
|
||||
height: 40vh;
|
||||
}
|
||||
|
||||
#statusPlayer {
|
||||
width: 25%;
|
||||
padding: 1dvw;
|
||||
}
|
||||
}
|
||||
@@ -237,6 +237,25 @@ function roll(dado) {
|
||||
});
|
||||
}
|
||||
|
||||
function share(textToCopy) {
|
||||
if (navigator.clipboard) {
|
||||
return navigator.clipboard
|
||||
.writeText(textToCopy)
|
||||
.then(() => msg("success", "Link copiado com sucesso!"))
|
||||
.catch(() => msg("error", "Erro ao copiar link"));
|
||||
}
|
||||
const $tempInput = $("<input>");
|
||||
$("body").append($tempInput);
|
||||
$tempInput.val(textToCopy).select();
|
||||
try {
|
||||
document.execCommand("copy");
|
||||
msg("success", "Link copiado com sucesso!");
|
||||
} catch (err) {
|
||||
msg("error", "Erro ao copiar link");
|
||||
}
|
||||
$tempInput.remove();
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
$(".updown").click(function () {
|
||||
const atb = $(this).data("atb");
|
||||
@@ -263,6 +282,11 @@ $(document).ready(function () {
|
||||
invPowerAdd();
|
||||
});
|
||||
|
||||
$(".share").on("click", function () {
|
||||
const textToCopy = `${window.location.origin}/profile.html?id=${playerID}`;
|
||||
share(textToCopy);
|
||||
});
|
||||
|
||||
setInterval(() => {
|
||||
loadFicha();
|
||||
rollLoad();
|
||||
|
||||
67
rpg/javascript/profile.js
Normal file
67
rpg/javascript/profile.js
Normal file
@@ -0,0 +1,67 @@
|
||||
let img;
|
||||
let playerID;
|
||||
|
||||
function loadFicha(id) {
|
||||
$.ajax({
|
||||
url: `${window.api}player/info/${id}`,
|
||||
type: "GET",
|
||||
xhrFields: { withCredentials: true },
|
||||
success(resp) {
|
||||
if (!img) {
|
||||
img = resp.Foto;
|
||||
$("#hero").attr("src", `data:image/*;base64,${resp.Foto}`);
|
||||
}
|
||||
|
||||
if (!playerID) playerID = resp.PlayerID;
|
||||
$("#vdp").text(resp.Vida);
|
||||
$("#nmp").text(resp.PlayerName);
|
||||
$("#lvp").text(resp.Level);
|
||||
$("#idp").text(resp.Idade);
|
||||
$("#alp").text(resp.Altura);
|
||||
$("#conhecimento").text(resp.Conhecimento);
|
||||
$("#força").text(resp.Força);
|
||||
$("#destresa").text(resp.Destresa);
|
||||
$("#constitution").text(resp.Constituição);
|
||||
$("#inteligencia").text(resp.Inteligencia);
|
||||
$("#cárisma").text(resp.Cárisma);
|
||||
$("#mip").text(resp.Inventario);
|
||||
$("#lore").text(resp.Descrição);
|
||||
|
||||
const statusMap = [
|
||||
{ limit: 0, text: "Status: morto(a)" },
|
||||
{ limit: 5, text: "Status: morrendo" },
|
||||
{ limit: 50, text: "Status: muito ferido(a)" },
|
||||
{ limit: 70, text: "Status: ferido(a)" },
|
||||
{ limit: 100, text: "Status: normal" },
|
||||
];
|
||||
|
||||
const status = statusMap.find((s) => resp.VidaPorcentagem <= s.limit);
|
||||
$("#statusPlayer").text(status?.text || "Status: desconhecido");
|
||||
},
|
||||
error() {
|
||||
return $("body").html(
|
||||
'<div class="erro">a url esta incorreta ou usuario não existe</div>',
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
function getParam(param) {
|
||||
let urlParams = new URLSearchParams(window.location.search);
|
||||
return urlParams.get(param);
|
||||
}
|
||||
|
||||
let id = getParam("id");
|
||||
|
||||
if (!id) {
|
||||
return $("body").html(
|
||||
'<div class="erro">Você precisa passar uma ID na url</div>',
|
||||
);
|
||||
}
|
||||
setInterval(() => {
|
||||
loadFicha(id);
|
||||
}, 1000);
|
||||
|
||||
loadFicha(id);
|
||||
});
|
||||
96
rpg/profile.html
Normal file
96
rpg/profile.html
Normal file
@@ -0,0 +1,96 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
|
||||
/>
|
||||
<title>ficha</title>
|
||||
<link rel="stylesheet" href="css/base.css" />
|
||||
<link rel="stylesheet" href="css/styleProfile.css" />
|
||||
<script type="text/javascript" src="javascript/libs/jquery.js"></script>
|
||||
<script type="text/javascript" src="javascript/libs/tata.js"></script>
|
||||
<script type="text/javascript" src="javascript/globais.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="playerDATA">
|
||||
<img id="hero" src="images/none.png" />
|
||||
<ul>
|
||||
<li>
|
||||
<label>vida:</label>
|
||||
<p id="vdp">0/0</p>
|
||||
</li>
|
||||
<li>
|
||||
<label>nome:</label>
|
||||
<p id="nmp">you user name</p>
|
||||
</li>
|
||||
<li>
|
||||
<label>level:</label>
|
||||
<p id="lvp">0</p>
|
||||
</li>
|
||||
<li>
|
||||
<label>idade:</label>
|
||||
<p id="idp">0</p>
|
||||
</li>
|
||||
<li>
|
||||
<label>altura:</label>
|
||||
<p id="alp">0,0</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="box_1">
|
||||
<div id="status">
|
||||
<h1>Player Status</h1>
|
||||
<ul>
|
||||
<li>
|
||||
<label>
|
||||
conh:
|
||||
<p id="conhecimento" class="status_player">0</p>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label>
|
||||
for:
|
||||
<p id="força" class="status_player">0</p>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label>
|
||||
des:
|
||||
<p id="destresa" class="status_player">0</p>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label>
|
||||
const:
|
||||
<p id="constitution" class="status_player">0</p>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label>
|
||||
int:
|
||||
<p id="inteligencia" class="status_player">0</p>
|
||||
</label>
|
||||
</li>
|
||||
<li>
|
||||
<label>
|
||||
car:
|
||||
<p id="cárisma" class="status_player">0</p>
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="text_lore">
|
||||
<h1>Texto do Player</h1>
|
||||
<ul>
|
||||
<p id="lore"></p>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<label id="statusPlayer"></label>
|
||||
|
||||
<!-- scripts -->
|
||||
<script type="text/javascript" src="javascript/profile.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user