update crow version, add colors to UI
This commit is contained in:
ngn
parent
d2d712df83
commit
3514128871
10 changed files with 151 additions and 70 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
|
@ -1,2 +1,3 @@
|
|||
src/crow_all.h
|
||||
kisalt
|
||||
data/
|
||||
|
|
|
|||
17
Dockerfile
17
Dockerfile
|
|
@ -1,29 +1,18 @@
|
|||
FROM alpine as build
|
||||
|
||||
RUN apk update && apk upgrade
|
||||
RUN apk add --no-cache build-base wget boost-dev openssl-dev jsoncpp-dev
|
||||
RUN apk add --no-cache build-base wget asio asio-dev openssl-dev jsoncpp-dev
|
||||
|
||||
WORKDIR /app
|
||||
COPY src ./src
|
||||
COPY static ./static
|
||||
COPY Makefile ./
|
||||
|
||||
# https://aur.archlinux.org/cgit/aur.git/tree/PKGBUILD?h=crow
|
||||
RUN wget https://github.com/CrowCpp/crow/releases/download/v1.0+5/crow-v1.0+5.tar.gz
|
||||
RUN mkdir crow
|
||||
RUN mkdir -p /usr/local/include
|
||||
RUN mkdir -p /usr/local/lib
|
||||
RUN tar xf crow-v1.0+5.tar.gz -C crow
|
||||
|
||||
WORKDIR /app/crow
|
||||
RUN cp -r include /usr/local
|
||||
RUN cp -r lib /usr/local
|
||||
|
||||
WORKDIR /app
|
||||
RUN make && rm -r crow
|
||||
RUN make && rm -r src
|
||||
|
||||
FROM alpine as main
|
||||
COPY --from=build /app /
|
||||
EXPOSE 8080
|
||||
RUN apk add --no-cache libstdc++ libgcc libcrypto3 jsoncpp
|
||||
RUN apk add --no-cache libstdc++ libgcc libcrypto3 jsoncpp asio
|
||||
ENTRYPOINT ["/kisalt"]
|
||||
|
|
|
|||
14
Makefile
14
Makefile
|
|
@ -1,5 +1,15 @@
|
|||
SRCS:=$(wildcard src/*.cpp)
|
||||
CC=g++
|
||||
CROW_URL = https://github.com/CrowCpp/Crow/releases/download/v1.1.0/crow_all.h
|
||||
CROW_HASH = 9e710a3fa5170b736c500ad283d8ed5d178ee88cd530224efd02a348dd655ffb
|
||||
|
||||
SRCS = $(wildcard src/*.cpp) $(wildcard src/*.h)
|
||||
CC = g++
|
||||
|
||||
all: src/crow_all.h kisalt
|
||||
|
||||
kisalt: $(SRCS)
|
||||
$(CC) -o $@ $^ -lcrypto -ljsoncpp
|
||||
|
||||
src/crow_all.h:
|
||||
wget -q --show-progress $(CROW_URL) -O src/crow_all.h
|
||||
echo "$(CROW_HASH) $@" | sha256sum -c
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
|
||||
|
||||
kisalt is a simple link shortener written with [Crow](https://github.com/CrowCpp/Crow)
|
||||
kisalt is a dead simple link shortener written with in C++ using the [Crow](https://github.com/CrowCpp/Crow) web framework.
|
||||
|
||||
### Deploy
|
||||
You can easily deploy the app with docker and place it behind a proxy:
|
||||
|
|
@ -31,7 +31,3 @@ You can use the web interface to shorten links, or you can directly use the API:
|
|||
```bash
|
||||
curl https://k.example.com/add\?url=<url>
|
||||
```
|
||||
|
||||
### Todo
|
||||
- ~~Save links to a database~~
|
||||
- Better web UI
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@ std::string add_url(std::string org) {
|
|||
memcpy(orgurl, org.c_str(), org.length());
|
||||
SHA1(orgurl, sizeof(orgurl)-1, hash);
|
||||
|
||||
char hashhex[SHA_DIGEST_LENGTH+SHA224_DIGEST_LENGTH];
|
||||
char hashhex[SHA_DIGEST_LENGTH+SHA_DIGEST_LENGTH+1];
|
||||
char current[3];
|
||||
|
||||
for(int i = 0; i < SHA_DIGEST_LENGTH; i++){
|
||||
|
|
|
|||
|
|
@ -1,9 +1,7 @@
|
|||
#include <crow/settings.h>
|
||||
#include <crow/app.h>
|
||||
#include "crow_all.h"
|
||||
#include "config.hpp"
|
||||
#include "link.hpp"
|
||||
#include "log.hpp"
|
||||
#include <crow.h>
|
||||
#include <random>
|
||||
|
||||
std::string join_url(std::string url) {
|
||||
|
|
@ -76,5 +74,6 @@ SKIP_LOAD:
|
|||
return res.end();
|
||||
});
|
||||
|
||||
info("Running on port 8080");
|
||||
app.port(8080).run();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<h1>oops!</h1>
|
||||
<h1>not found :(</h1>
|
||||
<p>
|
||||
you just visited a shortened</br>URL but it seems to be invalid
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -3,11 +3,90 @@
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
@keyframes colorAnimation {
|
||||
100%,
|
||||
0% {
|
||||
color: rgb(255, 0, 0);
|
||||
}
|
||||
8% {
|
||||
color: rgb(255, 127, 0);
|
||||
}
|
||||
16% {
|
||||
color: rgb(255, 255, 0);
|
||||
}
|
||||
25% {
|
||||
color: rgb(127, 255, 0);
|
||||
}
|
||||
33% {
|
||||
color: rgb(0, 255, 0);
|
||||
}
|
||||
41% {
|
||||
color: rgb(0, 255, 127);
|
||||
}
|
||||
50% {
|
||||
color: rgb(0, 255, 255);
|
||||
}
|
||||
58% {
|
||||
color: rgb(0, 127, 255);
|
||||
}
|
||||
66% {
|
||||
color: rgb(0, 0, 255);
|
||||
}
|
||||
75% {
|
||||
color: rgb(127, 0, 255);
|
||||
}
|
||||
83% {
|
||||
color: rgb(255, 0, 255);
|
||||
}
|
||||
91% {
|
||||
color: rgb(255, 0, 127);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fullBorderAnimation {
|
||||
100%,
|
||||
0% {
|
||||
border-color: rgb(255, 0, 0);
|
||||
}
|
||||
8% {
|
||||
border-color: rgb(255, 127, 0);
|
||||
}
|
||||
16% {
|
||||
border-color: rgb(255, 255, 0);
|
||||
}
|
||||
25% {
|
||||
border-color: rgb(127, 255, 0);
|
||||
}
|
||||
33% {
|
||||
border-color: rgb(0, 255, 0);
|
||||
}
|
||||
41% {
|
||||
border-color: rgb(0, 255, 127);
|
||||
}
|
||||
50% {
|
||||
border-color: rgb(0, 255, 255);
|
||||
}
|
||||
58% {
|
||||
border-color: rgb(0, 127, 255);
|
||||
}
|
||||
66% {
|
||||
border-color: rgb(0, 0, 255);
|
||||
}
|
||||
75% {
|
||||
border-color: rgb(127, 0, 255);
|
||||
}
|
||||
83% {
|
||||
border-color: rgb(255, 0, 255);
|
||||
}
|
||||
91% {
|
||||
border-color: rgb(255, 0, 127);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: monospace;
|
||||
padding: 10%;
|
||||
background: black;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
main {
|
||||
|
|
@ -15,52 +94,43 @@ main {
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1, a {
|
||||
main h1, a {
|
||||
animation-name: colorAnimation;
|
||||
animation-iteration-count: infinite;
|
||||
animation-duration: 10s;
|
||||
|
||||
font-size: 40px;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
p {
|
||||
main p {
|
||||
font-size: 20px;
|
||||
color: #DFDFDF;
|
||||
}
|
||||
|
||||
.badges {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
form {
|
||||
gap: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 20px;
|
||||
width: 400px;
|
||||
text-shadow: 0px 10px 20px rgba(90, 90, 90, 0.8);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
form input {
|
||||
background: none;
|
||||
width: 400px;
|
||||
background: black;
|
||||
font-size: 20px;
|
||||
outline: none;
|
||||
border: solid 1px #DFDFDF;
|
||||
border: solid 1.5px #505050;
|
||||
border-radius: 5px;
|
||||
color: white;
|
||||
color: #DFDFDF;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
form button {
|
||||
border-radius: 5px;
|
||||
border: none;
|
||||
background: none;
|
||||
padding: 10px;
|
||||
font-size: 20px;
|
||||
outline: none;
|
||||
border: solid 1px #DFDFDF;
|
||||
cursor: pointer;
|
||||
form input::placeholder {
|
||||
color: white;
|
||||
}
|
||||
|
||||
form input:not(:placeholder-shown){
|
||||
transition: .4s;
|
||||
box-shadow: rgba(20, 20, 20, 0.19) 0px 10px 20px, rgba(30, 30, 30, 0.23) 0px 6px 6px;;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,24 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title></title>
|
||||
<title>kisalt</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=1200, initial-scale=1">
|
||||
<link href="/static/global.css" rel="stylesheet">
|
||||
<noscript>
|
||||
this website uses simple fetch requests to interact with the API,
|
||||
enable JavaScript or send your requests directly to /add?url=[url]
|
||||
</noscript>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<a href="https://github.com/ngn13/kisalt"><h1>kisalt</h1></a>
|
||||
<p>a simple link shortener</p>
|
||||
</br>
|
||||
<div class="badges">
|
||||
<img alt="GitHub License" src="https://img.shields.io/github/license/ngn13/kisalt">
|
||||
<img alt="GitHub repo size" src="https://img.shields.io/github/repo-size/ngn13/kisalt">
|
||||
<img alt="GitHub Actions Workflow Status" src="https://img.shields.io/github/actions/workflow/status/ngn13/kisalt/publish.yml">
|
||||
</div>
|
||||
<p id="msg">a simple link shortener</p>
|
||||
<form id="form">
|
||||
<input id="url" placeholder="enter a URL" type="text" required>
|
||||
<button id="btn" type="submit">submit</button>
|
||||
<input id="url" placeholder="enter a link" type="text" required>
|
||||
</form>
|
||||
</main>
|
||||
<script src="/static/index.js"></script>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,20 @@
|
|||
const inp = document.getElementById("url")
|
||||
const btn = document.getElementById("btn")
|
||||
const form = document.getElementById("form")
|
||||
const msg = document.getElementById("msg")
|
||||
const inp = document.getElementById("url")
|
||||
|
||||
const messages = {
|
||||
"copied": "copied to clipboard",
|
||||
"submit": "hit enter to submit",
|
||||
"desc": "a simple link shortener",
|
||||
}
|
||||
|
||||
inp.addEventListener("focusin", ()=>{
|
||||
msg.innerText = messages["submit"]
|
||||
})
|
||||
|
||||
inp.addEventListener("focusout", ()=>{
|
||||
msg.innerText = messages["desc"]
|
||||
})
|
||||
|
||||
form.addEventListener("submit", async(e)=>{
|
||||
e.preventDefault()
|
||||
|
|
@ -16,8 +30,13 @@ form.addEventListener("submit", async(e)=>{
|
|||
return alert(txt)
|
||||
}
|
||||
|
||||
btn.innerText = "copied to clipboard"
|
||||
msg.innerText = messages["copied"]
|
||||
inp.value = ""
|
||||
|
||||
setTimeout(()=>{
|
||||
btn.innerText = "submit"
|
||||
if(document.activeElement == inp)
|
||||
msg.innerText = messages["submit"]
|
||||
else
|
||||
msg.innerText = messages["desc"]
|
||||
}, 1500)
|
||||
})
|
||||
|
|
|
|||
Reference in a new issue