gideonstar/imgpaste
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 2 Wiki Activity

Compare commits

base: gideonstar:v0.1
Branches Tags
gideonstar:master
gideonstar:imgpaste-0.2
gideonstar:imgpaste-0.1
gideonstar:v0.1
...
compare: gideonstar:master
Branches Tags
gideonstar:master
gideonstar:imgpaste-0.2
gideonstar:imgpaste-0.1
gideonstar:v0.1

15 Commits
v0.1 ... master

Author SHA1 Message Date
Stefan Ritter
f78c404ae2 Doch kein Screenshot :D 2024-08-13 22:29:17 +02:00
Stefan Ritter
3f8b51c78a Screenshot hinzugefügt 2024-08-13 22:27:14 +02:00
root
2fdf5e9275 Theme gideonstar: Fade-Effekt hinzugefügt 2023-03-25 17:07:13 +01:00
root
fbc85cf13c Theme redesign 2023-03-25 13:09:39 +01:00
root
56bde40f69 Footer hinzugefügt 2023-03-25 12:15:07 +01:00
root
37efdc7c81 Funktion dropzone_toggle() 2023-03-24 15:47:56 +01:00
root
394a770a26 Erlaubte Dateitypen in ein Array gepackt 2023-03-24 15:41:49 +01:00
root
bf1182be54 GIF auch für Klick hinzugefügt 2023-03-24 14:59:15 +01:00
Stefan Ritter
152772e3ad GIF hinzugefügt, muss getestet werden 2023-03-24 14:52:26 +01:00
root
24c9f12695 * CSS Klassen umbenannt 
* Debug Code entfernt
 2023-03-24 08:34:29 +01:00
root
e7fb076f12 Vor dem Upload werden alle File Extensions zu lowercase gemacht 2023-03-23 20:03:42 +01:00
root
dc768566fc TODO entfernt, ist jetzt im Wiki 2023-03-23 18:08:45 +01:00
root
14b9ca6686 * Bugfix: ein preventDefault() zuviel entfernt 
* Theme Funktionalität hinzugefügt
* style.css und sora.ttf in eigenes Theme verschoben
 2023-03-23 18:05:57 +01:00
root
891565f76c * unnötige preventDefault() entfernt 
* optisches Klick-Feedback hinzugefügt
 2023-03-23 16:47:00 +00:00
root
125ee53fe2 WTFPL als Lizenz hinzugefügt 2023-03-23 13:08:28 +00:00
8 changed files with 78 additions and 33 deletions
Show Stats Expand all files Collapse all files

13
LICENSE Normal file
View File

@ -0,0 +1,13 @@
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
Version 2, December 2004
Copyright (C) 2004 Sam Hocevar <sam@hocevar.net>
Everyone is permitted to copy and distribute verbatim or modified
copies of this license document, and changing it is allowed as long
as the name is changed.
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
0. You just DO WHAT THE FUCK YOU WANT TO.

3
TODO.md
View File

@ -1,3 +0,0 @@
# TODO
- create a check for max file size

8
config.dist.php
View File

@ -3,9 +3,15 @@
// Title // Title
$title = "imgpaste by gideonstar"; $title = "imgpaste by gideonstar";
// Displayed text // Dropzone text
$text = "Click or drop image here..."; $text = "Click or drop image here...";
// Footer text
$footer = '<a href="https://git.stefanritter.de/gideonstar/imgpaste.git">imgpaste</a> by gideonstar';
// Themes can be found in the themes directory
$theme = "gideonstar";
// Writeable directory for images. Will be created if it does not exist. // Writeable directory for images. Will be created if it does not exist.
$datadir = "i"; $datadir = "i";

5
index.php
View File

@ -13,13 +13,14 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title><?php echo $title; ?></title> <title><?php echo $title; ?></title>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="themes/<?php echo $theme; ?>/style.css">
</head> </head>
<body> <body>
<div id="wrapper"> <div id="wrapper">
<div id="dropzone" class="nodrop"> <div id="dropzone" class="inactive">
<p><?php echo $text; ?></p> <p><?php echo $text; ?></p>
</div> </div>
<div id="footer"><?php echo $footer; ?></div>
</div> </div>
<script src="script.js"></script> <script src="script.js"></script>
</body> </body>

37
script.js
View File

@ -1,29 +1,32 @@
dropzone = document.getElementById('dropzone'); dropzone = document.getElementById('dropzone');
filetypes = ['image/png', 'image/jpeg', 'image/gif'];
dropzone.addEventListener('dragover', function(e) { dropzone.addEventListener('dragover', function(e) {
e.preventDefault(); e.preventDefault();
dropzone_toggle("on");
this.classList.remove('nodrop');
this.classList.add('drop');
}); });
dropzone.addEventListener('dragleave', function(e) { dropzone.addEventListener('dragleave', function(e) {
e.preventDefault(); dropzone_toggle("off");
});
this.classList.remove('drop'); dropzone.addEventListener('mousedown', function(e) {
this.classList.add('nodrop'); dropzone_toggle("on");
});
dropzone.addEventListener('mouseup', function(e) {
dropzone_toggle("off");
}); });
dropzone.addEventListener('click', function(e) { dropzone.addEventListener('click', function(e) {
e.preventDefault();
input = document.createElement('input'); input = document.createElement('input');
input.type = 'file'; input.type = 'file';
input.click(); input.click();
input.onchange = function(e) { input.onchange = function(e) {
file = e.target.files[0]; file = e.target.files[0];
if( file.type == 'image/png' || file.type == 'image/jpeg' ) { if(filetypes.includes(file.type)) {
upload(e.target.files[0]); upload(e.target.files[0]);
} }
} }
@ -31,16 +34,24 @@ dropzone.addEventListener('click', function(e) {
dropzone.addEventListener('drop', function(e) { dropzone.addEventListener('drop', function(e) {
e.preventDefault(); e.preventDefault();
dropzone_toggle("off");
this.classList.remove('drop');
this.classList.add('nodrop');
file = e.dataTransfer.files[0]; file = e.dataTransfer.files[0];
if( file.type == 'image/png' || file.type == 'image/jpeg' ) { if(filetypes.includes(file.type)) {
upload(e.dataTransfer.files[0]); upload(e.dataTransfer.files[0]);
} }
}); });
function dropzone_toggle(state) {
if(state == "on") {
dropzone.classList.remove('inactive');
dropzone.classList.add('active');
} else if(state == "off") {
dropzone.classList.remove('active');
dropzone.classList.add('inactive');
}
}
function upload(file) { function upload(file) {
const data = new FormData(); const data = new FormData();
data.append('upload', file) data.append('upload', file)

0
sora.ttf → themes/gideonstar/sora.ttf
View File

40
style.css → themes/gideonstar/style.css
View File

@ -1,6 +1,5 @@
:root { :root {
--round: 20px; --round: 20px;
--border: 100px;
} }
@font-face { @font-face {
@ -20,28 +19,43 @@ body {
} }
#wrapper { #wrapper {
display: flex;
flex-direction: column;
align-items: center;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
display: flex;
align-items: center;
justify-content: center;
} }
#dropzone { #dropzone {
width: calc(100vw - var(--border));
height: calc(100vh - var(--border));
border-radius: var(--round);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 90vw;
height: 200px;
max-width: 500px;
margin-top: 50px;
border-radius: var(--round);
} }
.nodrop { .active {
background-color: #f5f5f5;
outline: 2px dashed #d5d5d5;
}
.drop {
background-color: #ffb703; background-color: #ffb703;
outline: 2px dashed #fb8500; outline: 2px dashed #fb8500;
transition: .3s ease;
}
.inactive {
background-color: #f5f5f5;
outline: 2px dashed #d5d5d5;
transition: .3s ease;
}
#footer {
margin-top: 10px;
color: white;
font-size: .8em;
}
a {
color: #ffb703;
text-decoration: none;
} }

5
upload.php
View File

@ -10,10 +10,13 @@ if(!is_dir($datadir)) {
mkdir($datadir); mkdir($datadir);
} }
$extensions = ['jpg', 'jpeg', 'png', 'gif'];
if(isset($_FILES['upload'])) { if(isset($_FILES['upload'])) {
$extension = pathinfo($_FILES['upload']['name'], PATHINFO_EXTENSION); $extension = pathinfo($_FILES['upload']['name'], PATHINFO_EXTENSION);
$extension = strtolower($extension);
if($extension == 'jpg' || $extension == 'jpeg' || $extension == 'png') { if(in_array($extension, $extensions)) {
$filename = generate_filename($length) . '.' . $extension; $filename = generate_filename($length) . '.' . $extension;
move_uploaded_file($_FILES['upload']['tmp_name'], $datadir . '/' . $filename); move_uploaded_file($_FILES['upload']['tmp_name'], $datadir . '/' . $filename);
echo json_encode(['datadir' => $datadir, 'filename' => $filename]); echo json_encode(['datadir' => $datadir, 'filename' => $filename]);