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

Compare commits

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

No commits in common. "master" and "imgpaste-0.1" have entirely different histories.
master ... imgpaste-0

8 changed files with 33 additions and 78 deletions
Show Stats Expand all files Collapse all files

13
LICENSE
View File

@ -1,13 +0,0 @@
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 Normal file
View File

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

8
config.dist.php
View File

@ -3,15 +3,9 @@
// Title // Title
$title = "imgpaste by gideonstar"; $title = "imgpaste by gideonstar";
// Dropzone text // Displayed 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,14 +13,13 @@
<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="themes/<?php echo $theme; ?>/style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
<body> <body>
<div id="wrapper"> <div id="wrapper">
<div id="dropzone" class="inactive"> <div id="dropzone" class="nodrop">
<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,32 +1,29 @@
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) {
dropzone_toggle("off"); e.preventDefault();
});
dropzone.addEventListener('mousedown', function(e) { this.classList.remove('drop');
dropzone_toggle("on"); this.classList.add('nodrop');
});
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(filetypes.includes(file.type)) { if( file.type == 'image/png' || file.type == 'image/jpeg' ) {
upload(e.target.files[0]); upload(e.target.files[0]);
} }
} }
@ -34,24 +31,16 @@ 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(filetypes.includes(file.type)) { if( file.type == 'image/png' || file.type == 'image/jpeg' ) {
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
themes/gideonstar/sora.ttf → sora.ttf
View File

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

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

5
upload.php
View File

@ -10,13 +10,10 @@ 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(in_array($extension, $extensions)) { if($extension == 'jpg' || $extension == 'jpeg' || $extension == 'png') {
$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]);