gregor/gtransfer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Gregor Lohaus
2026-02-25 12:30:27 +01:00
parent df3adf0e3c
commit bd72a98e64
51 changed files with 2103 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
Backend/src/main/resources/META-INF/spring.factories Normal file
View File

@@ -0,0 +1 @@
org.springframework.boot.EnvironmentPostProcessor=com.gregor_lohaus.gtransfer.config.ConfigEnvironmentPostProcessor

1
Backend/src/main/resources/application.properties Normal file
View File

@@ -0,0 +1 @@
spring.application.name=gtransfer

67
Backend/src/main/resources/static/style.css Normal file
View File

@@ -0,0 +1,67 @@
body {
background-color: #0d1117;
color: #e6edf3;
}
.brand {
letter-spacing: -0.5px;
color: #e6edf3;
}
.brand span {
color: #3fb950;
}
.hero-title {
font-size: 3rem;
font-weight: 800;
letter-spacing: -1px;
line-height: 1.1;
}
.hero-title span {
color: #3fb950;
}
.hero-subtitle {
color: #8b949e;
max-width: 480px;
}
.drop-zone {
border: 2px dashed #30363d;
border-radius: 16px;
background-color: #161b22;
cursor: pointer;
transition: border-color 0.2s, background-color 0.2s;
max-width: 520px;
}
.drop-zone:hover,
.drop-zone.dragover {
border-color: #3fb950;
background-color: #0d1117;
}
.drop-zone-icon {
font-size: 2.5rem;
opacity: 0.6;
}
.drop-zone-text {
color: #8b949e;
}
.drop-zone-text strong {
color: #3fb950;
}
.badge-e2e {
background-color: #1a2f1e;
color: #3fb950;
border: 1px solid #2ea043;
font-size: 0.78rem;
}
footer, footer a {
color: #484f58;
}
footer a:hover {
color: #8b949e;
}

135
Backend/src/main/resources/static/upload.js Normal file
View File

@@ -0,0 +1,135 @@
const dropZone = document.getElementById('drop-zone');
const fileInput = document.getElementById('file-input');
const views = {
prompt: document.getElementById('view-prompt'),
selected: document.getElementById('view-selected'),
uploading: document.getElementById('view-uploading'),
result: document.getElementById('view-result'),
};
let selectedFile = null;
function showView(name) {
Object.entries(views).forEach(([key, el]) => el.classList.toggle('d-none', key !== name));
}
// ── File selection ────────────────────────────────────────────────────────────
dropZone.addEventListener('click', () => {
if (views.prompt.classList.contains('d-none')) return;
fileInput.click();
});
fileInput.addEventListener('change', e => {
if (e.target.files[0]) selectFile(e.target.files[0]);
});
dropZone.addEventListener('dragover', e => {
e.preventDefault();
dropZone.classList.add('dragover');
});
dropZone.addEventListener('dragleave', () => dropZone.classList.remove('dragover'));
dropZone.addEventListener('drop', e => {
e.preventDefault();
dropZone.classList.remove('dragover');
if (e.dataTransfer.files[0]) selectFile(e.dataTransfer.files[0]);
});
function selectFile(file) {
selectedFile = file;
document.getElementById('selected-name').textContent = file.name;
showView('selected');
}
document.getElementById('reset-btn').addEventListener('click', e => {
e.stopPropagation();
selectedFile = null;
fileInput.value = '';
showView('prompt');
});
document.getElementById('new-upload-btn').addEventListener('click', e => {
e.stopPropagation();
selectedFile = null;
fileInput.value = '';
showView('prompt');
});
// ── Upload ────────────────────────────────────────────────────────────────────
document.getElementById('upload-btn').addEventListener('click', async e => {
e.stopPropagation();
await upload();
});
function setStatus(msg) {
document.getElementById('upload-status').textContent = msg;
}
async function upload() {
const file = selectedFile;
showView('uploading');
try {
setStatus('Generating encryption key\u2026');
const key = await crypto.subtle.generateKey(
{ name: 'AES-GCM', length: 256 },
true,
['encrypt', 'decrypt']
);
const iv = crypto.getRandomValues(new Uint8Array(12));
setStatus('Encrypting\u2026');
const ciphertext = await crypto.subtle.encrypt(
{ name: 'AES-GCM', iv },
key,
await file.arrayBuffer()
);
// Payload: 12-byte IV prepended to ciphertext
const payload = new Uint8Array(12 + ciphertext.byteLength);
payload.set(iv, 0);
payload.set(new Uint8Array(ciphertext), 12);
// SHA-256(rawKey) → file identifier sent to server (server never sees the key)
const rawKey = await crypto.subtle.exportKey('raw', key);
const hash = Array.from(new Uint8Array(await crypto.subtle.digest('SHA-256', rawKey)))
.map(b => b.toString(16).padStart(2, '0'))
.join('');
// Base64url-encode key for URL fragment
const base64urlKey = btoa(String.fromCharCode(...new Uint8Array(rawKey)))
.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
setStatus('Uploading\u2026');
const formData = new FormData();
formData.append('file', new Blob([payload]), file.name);
formData.append('hash', hash);
formData.append('name', file.name);
const response = await fetch('/upload', { method: 'POST', body: formData });
if (!response.ok) throw new Error(`Server responded with ${response.status}`);
const { id } = await response.json();
document.getElementById('share-link').value =
`${window.location.origin}/download/${id}#${base64urlKey}`;
showView('result');
} catch (err) {
setStatus(`Error: ${err.message}`);
}
}
// ── Copy link ─────────────────────────────────────────────────────────────────
document.getElementById('copy-btn').addEventListener('click', async e => {
e.stopPropagation();
await navigator.clipboard.writeText(document.getElementById('share-link').value);
const btn = document.getElementById('copy-btn');
btn.textContent = 'Copied!';
setTimeout(() => { btn.textContent = 'Copy'; }, 2000);
});

87
Backend/src/main/resources/templates/index.html Normal file
View File

@@ -0,0 +1,87 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" data-bs-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GTransfer</title>
<link rel="stylesheet" th:href="@{/webjars/bootstrap/dist/css/bootstrap.min.css}">
<link rel="stylesheet" th:href="@{/style.css}">
<script th:src="@{/webjars/bootstrap/dist/js/bootstrap.bundle.min.js}" defer></script>
<script th:src="@{/webjars/htmx.org/dist/htmx.min.js}" defer></script>
<script th:src="@{/upload.js}" defer></script>
</head>
<body class="d-flex flex-column min-vh-100">
<nav class="navbar px-4 pt-3">
<a class="brand fw-bold text-decoration-none fs-4" href="/">G<span>Transfer</span></a>
<span class="badge-e2e rounded-pill fw-medium px-3 py-1">&#x1F512; End-to-end encrypted</span>
</nav>
<main class="flex-grow-1 d-flex align-items-center justify-content-center py-5 px-3">
<div class="row align-items-center g-5" style="max-width: 960px; width: 100%;">
<div class="col-lg-5">
<h1 class="hero-title">Send files.<br><span>Privately.</span></h1>
<p class="hero-subtitle mt-3">
Share files of any size with end-to-end encryption.
No account needed. Files are encrypted before they leave your device.
</p>
</div>
<div class="col-lg-7 d-flex justify-content-center justify-content-lg-end">
<div id="drop-zone" class="drop-zone text-center py-5 px-4 w-100">
<!-- State: prompt (default) -->
<div id="view-prompt">
<div class="drop-zone-icon mb-3">&#x1F4C2;</div>
<div class="mb-2">
<strong>Choose a file</strong>
<span class="drop-zone-text"> or drag and drop here</span>
</div>
<div class="drop-zone-text small">Any file type &middot; Up to <span th:text="${maxFileSize}">10GB</span></div>
</div>
<!-- State: file selected -->
<div id="view-selected" class="d-none">
<div class="drop-zone-icon mb-3">&#x1F4C4;</div>
<div class="fw-medium mb-3" id="selected-name"></div>
<div class="d-flex gap-2 justify-content-center">
<button id="upload-btn" class="btn btn-success px-4">Send</button>
<button id="reset-btn" class="btn btn-link drop-zone-text text-decoration-none">Change file</button>
</div>
</div>
<!-- State: uploading -->
<div id="view-uploading" class="d-none">
<div class="mb-3">
<div class="spinner-border text-success" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div class="drop-zone-text" id="upload-status">Preparing&hellip;</div>
</div>
<!-- State: result -->
<div id="view-result" class="d-none">
<div class="drop-zone-icon mb-3">&#x2705;</div>
<div class="drop-zone-text mb-3">Your file is ready to share</div>
<div class="input-group mb-2">
<input type="text" id="share-link" class="form-control form-control-sm" readonly>
<button id="copy-btn" class="btn btn-outline-success btn-sm">Copy</button>
</div>
<button id="new-upload-btn" class="btn btn-link drop-zone-text text-decoration-none small">
Send another file
</button>
</div>
<input type="file" id="file-input" hidden>
</div>
</div>
</div>
</main>
<footer class="text-center p-4 small">
<a href="https://github.com/gregor-lohaus/gtransfer">Open source</a>
&middot; No tracking &middot; No ads
</footer>
</body>
</html>