DARLING in the FRANXXHEADmaster

3 files changed, 902 insertions, 0 deletions

diff --git a/public/js/auth.js b/public/js/auth.js
new file mode 100644
index 0000000..1ae9e4d
--- /dev/null
+++ b/public/js/auth.js
@@ -0,0 +1,56 @@
+var page = {};
+
+page.do = function(dest){
+
+	var user = document.getElementById('user').value;
+	var pass = document.getElementById('pass').value;
+
+	if(user === undefined || user === null || user === '')
+		return swal('Error', 'You need to specify a username', 'error');
+	if(pass === undefined || pass === null || pass === '')
+		return swal('Error', 'You need to specify a username', 'error');
+
+	axios.post('/api/' + dest, {
+		username: user,
+		password: pass
+	})
+	.then(function (response) {
+
+		if(response.data.success === false)
+			return swal('Error', response.data.description, 'error');
+		
+		localStorage.token = response.data.token;
+		window.location = '/dashboard';
+
+	})
+	.catch(function (error) {
+		return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error');
+		console.log(error);
+	});
+};
+
+page.verify = function(){
+	page.token = localStorage.token;
+	if(page.token === undefined) return;
+
+	axios.post('/api/tokens/verify', {
+		token: page.token
+	})
+	.then(function (response) {
+
+		if(response.data.success === false)
+			return swal('Error', response.data.description, 'error');
+		
+		window.location = '/dashboard';
+
+	})
+	.catch(function (error) {
+		return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error');
+		console.log(error);
+	});
+
+};
+
+window.onload = function () {
+	page.verify();
+};
\ No newline at end of file
diff --git a/public/js/dashboard.js b/public/js/dashboard.js
new file mode 100644
index 0000000..b080402
--- /dev/null
+++ b/public/js/dashboard.js
@@ -0,0 +1,620 @@
+let panel = {};
+
+panel.page;
+panel.username;
+panel.token = localStorage.token;
+panel.filesView = localStorage.filesView;
+
+panel.preparePage = function(){
+	if(!panel.token) return window.location = '/auth';
+	panel.verifyToken(panel.token, true);
+};
+
+panel.verifyToken = function(token, reloadOnError){
+	if(reloadOnError === undefined)
+		reloadOnError = false;
+
+	axios.post('/api/tokens/verify', {
+		token: token
+	})
+	.then(function (response) {
+
+		if(response.data.success === false){
+			swal({
+				title: "An error ocurred", 
+				text: response.data.description, 
+				type: "error"
+			}, function(){
+				if(reloadOnError){
+					localStorage.removeItem("token");
+					location.location = '/auth';
+				}
+			});
+			return;
+		}
+
+		axios.defaults.headers.common['token'] = token;
+		localStorage.token = token;
+		panel.token = token;
+		panel.username = response.data.username;
+		return panel.prepareDashboard();
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.prepareDashboard = function(){
+	panel.page = document.getElementById('page');
+	document.getElementById('auth').style.display = 'none';
+	document.getElementById('dashboard').style.display = 'block';
+
+	document.getElementById('itemUploads').addEventListener('click', function(){
+		panel.setActiveMenu(this);
+	});
+
+	document.getElementById('itemManageGallery').addEventListener('click', function(){
+		panel.setActiveMenu(this);
+	});
+
+	document.getElementById('itemTokens').addEventListener('click', function(){
+		panel.setActiveMenu(this);
+	});
+
+	document.getElementById('itemPassword').addEventListener('click', function(){
+		panel.setActiveMenu(this);
+	});
+
+	document.getElementById('itemLogout').innerHTML = `Logout ( ${panel.username} )`;
+
+	panel.getAlbumsSidebar();
+};
+
+panel.logout = function(){
+	localStorage.removeItem("token");
+	location.reload('/');
+};
+
+panel.getUploads = function(album = undefined, page = undefined){
+
+	if(page === undefined) page = 0;
+
+	let url = '/api/uploads/' + page;
+	if(album !== undefined)
+		url = '/api/album/' + album + '/' + page;
+
+	axios.get(url).then(function (response) {
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+		
+		var prevPage = 0;
+		var nextPage = page + 1;
+
+		if(response.data.files.length < 25)
+			nextPage = page;
+		
+		if(page > 0) prevPage = page - 1;
+
+		panel.page.innerHTML = '';
+		var container = document.createElement('div');
+		var pagination = `<nav class="pagination is-centered">
+					  		<a class="pagination-previous" onclick="panel.getUploads(${album}, ${prevPage} )">Previous</a>
+					  		<a class="pagination-next" onclick="panel.getUploads(${album}, ${nextPage} )">Next page</a>
+						</nav>`;
+		var listType = `
+		<div class="columns">
+			<div class="column">
+				<a class="button is-small is-outlined is-danger" title="List view" onclick="panel.setFilesView('list', ${album}, ${page})">
+					<span class="icon is-small">
+						<i class="fa fa-list-ul"></i>
+					</span>
+				</a>
+				<a class="button is-small is-outlined is-danger" title="List view" onclick="panel.setFilesView('thumbs', ${album}, ${page})">
+					<span class="icon is-small">
+						<i class="fa fa-th-large"></i>
+					</span>
+				</a>
+			</div>
+		</div>`;
+
+		if(panel.filesView === 'thumbs'){
+
+			container.innerHTML = `
+				${pagination}
+				<hr>
+				${listType}
+				<div class="columns is-multiline is-mobile" id="table">
+
+				</div>
+				${pagination}
+			`;
+
+			panel.page.appendChild(container);
+			var table = document.getElementById('table');
+
+			for(var item of response.data.files){
+
+				var div = document.createElement('div');
+				div.className = "column is-2";
+				if(item.thumb !== undefined)
+					div.innerHTML = `<a href="${item.file}" target="_blank"><img src="${item.thumb}"/></a><a class="button is-small is-danger is-outlined" title="Delete file" onclick="panel.deleteFile(${item.id})"><span class="icon is-small"><i class="fa fa-trash-o"></i></span></a>`;
+				else
+					div.innerHTML = `<a href="${item.file}" target="_blank"><h1 class="title">.${item.file.split('.').pop()}</h1></a><a class="button is-small is-danger is-outlined" title="Delete file" onclick="panel.deleteFile(${item.id})"><span class="icon is-small"><i class="fa fa-trash-o"></i></span></a>`;
+				table.appendChild(div);
+
+			}
+
+		}else{
+
+			var albumOrUser = 'Album';
+			if(panel.username === 'root')
+				albumOrUser = 'User';
+
+			container.innerHTML = `
+				${pagination}
+				<hr>
+				${listType}
+				<table class="table is-striped is-narrow is-left">
+					<thead>
+						<tr>
+							  <th>File</th>
+							  <th>${albumOrUser}</th>
+							  <th>Date</th>
+							  <th></th>
+						</tr>
+					</thead>
+					<tbody id="table">
+					</tbody>
+				</table>
+				<hr>
+				${pagination}
+			`;
+
+			panel.page.appendChild(container);
+			var table = document.getElementById('table');
+
+			for(var item of response.data.files){
+
+				var tr = document.createElement('tr');
+
+				var displayAlbumOrUser = item.album;
+				if(panel.username === 'root'){
+					displayAlbumOrUser = '';
+					if(item.username !== undefined)
+						displayAlbumOrUser = item.username;
+				}
+					
+				tr.innerHTML = `
+					<tr>
+						<th><a href="${item.file}" target="_blank">${item.file}</a></th>
+						<th>${displayAlbumOrUser}</th>
+						<td>${item.date}</td>
+						<td>
+							<a class="button is-small is-danger is-outlined" title="Delete album" onclick="panel.deleteFile(${item.id})">
+								<span class="icon is-small">
+									<i class="fa fa-trash-o"></i>
+								</span>
+							</a>
+						</td>
+					</tr>
+					`;
+
+				table.appendChild(tr);
+			}
+		}
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.setFilesView = function(view, album, page){
+	localStorage.filesView = view;
+	panel.filesView = view;
+	panel.getUploads(album, page);
+};
+
+panel.deleteFile = function(id){
+	swal({
+		title: "Are you sure?",
+		text: "You wont be able to recover the file!",
+		type: "warning",
+		showCancelButton: true,
+		confirmButtonColor: "#ff3860",
+		confirmButtonText: "Yes, delete it!",
+		closeOnConfirm: false
+	},
+		function(){
+
+			axios.post('/api/upload/delete', {
+				id: id
+			})
+			.then(function (response) {
+
+				if(response.data.success === false){
+					if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+					else return swal("An error ocurred", response.data.description, "error");		
+				}
+
+				swal("Deleted!", "The file has been deleted.", "success");
+				panel.getUploads();
+
+			})
+			.catch(function (error) {
+				return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+				console.log(error);
+			});
+
+		}
+	);
+};
+
+panel.getAlbums = function(){
+
+	axios.get('/api/albums').then(function (response) {
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+
+		panel.page.innerHTML = '';
+		var container = document.createElement('div');
+		container.className = "container";
+		container.innerHTML = `
+			<h2 class="subtitle">Create new album</h2>
+
+			<p class="control has-addons has-addons-centered">
+				<input id="albumName" class="input" type="text" placeholder="Name">
+				<a id="submitAlbum" class="button is-primary">Submit</a>
+			</p>
+
+			<h2 class="subtitle">List of albums</h2>
+
+			<table class="table is-striped is-narrow">
+				<thead>
+					<tr>
+						  <th>Name</th>
+						  <th>Files</th>
+						  <th>Created At</th>
+						  <th>Public link</th>
+						  <th></th>
+					</tr>
+				</thead>
+				<tbody id="table">
+				</tbody>
+			</table>`;
+
+		panel.page.appendChild(container);
+		var table = document.getElementById('table');
+
+		for(var item of response.data.albums){
+
+			var tr = document.createElement('tr');
+			tr.innerHTML = `
+				<tr>
+					<th>${item.name}</th>
+					<th>${item.files}</th>
+					<td>${item.date}</td>
+					<td><a href="${item.identifier}" target="_blank">Album link</a></td>
+					<td>
+						<a class="button is-small is-primary is-outlined" title="Edit name" onclick="panel.renameAlbum(${item.id})">
+							<span class="icon is-small">
+								<i class="fa fa-pencil"></i>
+							</span>
+						</a>
+						<a class="button is-small is-danger is-outlined" title="Delete album" onclick="panel.deleteAlbum(${item.id})">
+							<span class="icon is-small">
+								<i class="fa fa-trash-o"></i>
+							</span>
+						</a>
+					</td>
+				</tr>
+				`;
+
+			table.appendChild(tr);
+		}
+
+		document.getElementById('submitAlbum').addEventListener('click', function(){
+			panel.submitAlbum();
+		});
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.renameAlbum = function(id){
+	
+	swal({
+		title: "Rename album",
+		text: "New name you want to give the album:",
+		type: "input",
+		showCancelButton: true,
+		closeOnConfirm: false,
+		animation: "slide-from-top",
+		inputPlaceholder: "My super album"
+	},function(inputValue){
+		if (inputValue === false) return false;
+		if (inputValue === "") {
+			swal.showInputError("You need to write something!");
+			return false;
+		}
+		
+		axios.post('/api/albums/rename', {
+			id: id,
+			name: inputValue
+		})
+		.then(function (response) {
+
+			if(response.data.success === false){
+				if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+				else if(response.data.description === 'Name already in use') swal.showInputError("That name is already in use!");
+				else swal("An error ocurred", response.data.description, "error");
+				return;
+			}
+
+			swal("Success!", "Your album was renamed to: " + inputValue, "success");
+			panel.getAlbumsSidebar();
+			panel.getAlbums();
+
+		})
+		.catch(function (error) {
+			return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+			console.log(error);
+		});
+		
+	});
+
+};
+
+panel.deleteAlbum = function(id){
+	swal({
+		title: "Are you sure?",
+		text: "This won't delete your files, only the album!",
+		type: "warning",
+		showCancelButton: true,
+		confirmButtonColor: "#ff3860",
+		confirmButtonText: "Yes, delete it!",
+		closeOnConfirm: false
+	},
+		function(){
+
+			axios.post('/api/albums/delete', {
+				id: id
+			})
+			.then(function (response) {
+
+				if(response.data.success === false){
+					if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+					else return swal("An error ocurred", response.data.description, "error");		
+				}
+
+				swal("Deleted!", "Your album has been deleted.", "success");
+				panel.getAlbumsSidebar();
+				panel.getAlbums();
+
+			})
+			.catch(function (error) {
+				return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+				console.log(error);
+			});
+
+		}
+	);
+
+};
+
+panel.submitAlbum = function(){
+	
+	axios.post('/api/albums', {
+		name: document.getElementById('albumName').value
+	})
+	.then(function (response) {
+
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+
+		swal("Woohoo!", "Album was added successfully", "success");
+		panel.getAlbumsSidebar();
+		panel.getAlbums();
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.getAlbumsSidebar = function(){
+
+	axios.get('/api/albums/sidebar')
+	.then(function (response) {
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+
+		var albumsContainer = document.getElementById('albumsContainer');
+		albumsContainer.innerHTML = '';
+
+		if(response.data.albums === undefined) return;
+
+		for(var album of response.data.albums){
+
+			li = document.createElement('li');
+			a = document.createElement('a');
+			a.id = album.id;
+			a.innerHTML = album.name;
+
+			a.addEventListener('click', function(){
+				panel.getAlbum(this);
+			});
+
+			li.appendChild(a);
+			albumsContainer.appendChild(li);
+		}
+
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.getAlbum = function(item){
+	panel.setActiveMenu(item);
+	panel.getUploads(item.id);
+};
+
+panel.changeToken = function(){
+
+	axios.get('/api/tokens')
+	.then(function (response) {
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+
+		panel.page.innerHTML = '';
+		var container = document.createElement('div');
+		container.className = "container";
+		container.innerHTML = `
+			<h2 class="subtitle">Manage your token</h2>
+
+			<label class="label">Your current token:</label>
+			<p class="control has-addons">
+				<input id="token" readonly class="input is-expanded" type="text" placeholder="Your token" value="${response.data.token}">
+				<a id="getNewToken" class="button is-primary">Request new token</a>
+			</p>
+		`;
+
+		panel.page.appendChild(container);
+
+		document.getElementById('getNewToken').addEventListener('click', function(){
+			panel.getNewToken();
+		});
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.getNewToken = function(){
+
+	axios.post('/api/tokens/change')
+	.then(function (response) {
+
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+
+		swal({
+			title: "Woohoo!", 
+			text: 'Your token was changed successfully.', 
+			type: "success"
+		}, function(){
+			localStorage.token = response.data.token;
+			location.reload();
+		});
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.changePassword = function(){
+
+	panel.page.innerHTML = '';
+	var container = document.createElement('div');
+	container.className = "container";
+	container.innerHTML = `
+		<h2 class="subtitle">Change your password</h2>
+
+		<label class="label">New password:</label>
+		<p class="control has-addons">
+			<input id="password" class="input is-expanded" type="password" placeholder="Your new password">
+		</p>
+		<label class="label">Confirm password:</label>
+		<p class="control has-addons">
+			<input id="passwordConfirm" class="input is-expanded" type="password" placeholder="Verify your new password">
+			<a id="sendChangePassword" class="button is-primary">Set new password</a>
+		</p>
+	`;
+
+	panel.page.appendChild(container);
+
+	document.getElementById('sendChangePassword').addEventListener('click', function(){
+		if (document.getElementById('password').value === document.getElementById('passwordConfirm').value) {
+			panel.sendNewPassword(document.getElementById('password').value);
+		} else {
+			swal({
+				title: "Password mismatch!", 
+				text: 'Your passwords do not match, please try again.', 
+				type: "error"
+			}, function() {
+				panel.changePassword();
+			});
+		}
+	});
+};
+
+panel.sendNewPassword = function(pass){
+
+	axios.post('/api/password/change', {password: pass})
+	.then(function (response) {
+
+		if(response.data.success === false){
+			if(response.data.description === 'No token provided') return panel.verifyToken(panel.token);
+			else return swal("An error ocurred", response.data.description, "error");		
+		}
+
+		swal({
+			title: "Woohoo!", 
+			text: 'Your password was changed successfully.', 
+			type: "success"
+		}, function(){
+			location.reload();
+		});
+
+	})
+	.catch(function (error) {
+		return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		console.log(error);
+	});
+
+};
+
+panel.setActiveMenu = function(item){
+	var menu = document.getElementById('menu');
+	var items = menu.getElementsByTagName('a');
+	for(var i = 0; i < items.length; i++)
+		items[i].className = "";
+
+	item.className = 'is-active';
+};
+
+window.onload = function () {
+	panel.preparePage();
+};
diff --git a/public/js/home.js b/public/js/home.js
new file mode 100644
index 0000000..0f5b1ee
--- /dev/null
+++ b/public/js/home.js
@@ -0,0 +1,226 @@
+var upload = {};
+
+upload.isPrivate = true;
+upload.token = localStorage.token;
+upload.maxFileSize;
+// add the album var to the upload so we can store the album id in there
+upload.album;
+upload.myDropzone;
+
+upload.checkIfPublic = function(){
+	axios.get('/api/check')
+	.then(function (response) {
+		upload.isPrivate= response.data.private;
+		upload.maxFileSize = response.data.maxFileSize;
+		upload.preparePage();
+	})
+	.catch(function (error) {
+		swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		return console.log(error);
+	});
+}
+
+upload.preparePage = function(){
+	if(!upload.isPrivate) return upload.prepareUpload();
+	if(!upload.token) return document.getElementById('loginToUpload').style.display = 'inline-flex';
+	upload.verifyToken(upload.token, true);
+};
+
+upload.verifyToken = function(token, reloadOnError){
+	if(reloadOnError === undefined)
+		reloadOnError = false;
+	
+	axios.post('/api/tokens/verify', {
+		token: token
+	})
+	.then(function (response) {
+
+		if(response.data.success === false){
+			swal({
+				title: "An error ocurred", 
+				text: response.data.description, 
+				type: "error"
+			}, function(){
+				if(reloadOnError){
+					localStorage.removeItem("token");
+					location.reload();
+				}
+			});
+			return;
+		}
+
+		localStorage.token = token;
+		upload.token = token;
+		return upload.prepareUpload();
+
+	})
+	.catch(function (error) {
+		swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+		return console.log(error);
+	});
+
+};
+
+upload.prepareUpload = function(){
+	// I think this fits best here because we need to check for a valid token before we can get the albums
+	if (upload.token) {
+		var select = document.getElementById('albumSelect');
+		
+		select.addEventListener('change', function() {
+			upload.album = select.value;
+		});
+
+		axios.get('/api/albums', { headers: { token: upload.token }})
+		.then(function(res) {
+			var albums = res.data.albums;
+			
+			// if the user doesn't have any albums we don't really need to display
+			// an album selection
+			if (albums.length === 0) return;
+			
+			// loop through the albums and create an option for each album 
+			for (var i = 0; i < albums.length; i++) {
+				var opt = document.createElement('option');
+				opt.value = albums[i].id;
+				opt.innerHTML = albums[i].name;
+				select.appendChild(opt);
+			}
+			// display the album selection
+			document.getElementById('albumDiv').style.display = 'block';
+		})
+		.catch(function(e) {
+			swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
+			return console.log(e);
+		});
+	}
+
+	div = document.createElement('div');
+	div.id = 'dropzone';
+	div.innerHTML = 'Click here or drag and drop files';
+	div.style.display = 'flex';
+
+	$.getJSON("../json/quotes.json", (data) => {
+		var items = [];
+		let quoteNum = Math.floor(Math.random() * data.length);
+		document.getElementById('quotes').innerHTML = data[quoteNum];
+	});
+
+	document.getElementById('maxFileSize').innerHTML = 'Maximum upload size per file is 1024TB' /*+ upload.maxFileSize*/;
+	document.getElementById('loginToUpload').style.display = 'none';
+	
+	if(upload.token === undefined) 
+		document.getElementById('loginLinkText').innerHTML = 'Create an account and keep track of your uploads';
+
+	document.getElementById('uploadContainer').appendChild(div);
+	
+	upload.prepareDropzone();
+
+};
+
+upload.prepareDropzone = function(){
+	var previewNode = document.querySelector('#template');
+	previewNode.id = '';
+	var previewTemplate = previewNode.parentNode.innerHTML;
+	previewNode.parentNode.removeChild(previewNode);
+
+	var dropzone = new Dropzone('div#dropzone', { 
+		url: '/api/upload',
+		paramName: 'files[]',
+		maxFilesize: upload.maxFileSize.slice(0, -2),
+		parallelUploads: 2,
+		uploadMultiple: false,
+		previewsContainer: 'div#uploads',
+		previewTemplate: previewTemplate,
+		createImageThumbnails: false,
+		maxFiles: 1000,
+		autoProcessQueue: true,
+		headers: {
+			'token': upload.token
+		},
+		init: function() {
+			upload.myDropzone = this;
+			this.on('addedfile', function(file) { 
+				document.getElementById('uploads').style.display = 'block';
+			});
+			// add the selected albumid, if an album is selected, as a header 
+			this.on('sending', function(file, xhr) {
+				if (upload.album) {
+					xhr.setRequestHeader('albumid', upload.album);
+				}
+			});
+		}
+	});
+
+	// Update the total progress bar
+	dropzone.on('uploadprogress', function(file, progress) {
+		file.previewElement.querySelector('.progress').setAttribute('value', progress);
+		file.previewElement.querySelector('.progress').innerHTML = progress + '%';
+	});
+
+	dropzone.on('success', function(file, response) {
+
+		// Handle the responseText here. For example, add the text to the preview element:
+
+		if (response.success === false) {
+			var p = document.createElement('p');
+			p.innerHTML = response.description;
+			file.previewTemplate.querySelector('.link').appendChild(p);
+		}
+
+		if (response.files[0].url) {
+			a = document.createElement('a');
+			a.href = response.files[0].url;
+			a.target = '_blank';
+			a.innerHTML = response.files[0].url;
+			file.previewTemplate.querySelector('.link').appendChild(a);
+
+			file.previewTemplate.querySelector('.progress').style.display = 'none';
+		}
+		
+	});
+
+	upload.prepareShareX();
+};
+
+upload.prepareShareX = function(){
+	if (upload.token) {
+		var sharex_element = document.getElementById("ShareX");
+		var sharex_file = "{\r\n\
+  \"Name\": \"" + location.hostname + "\",\r\n\
+  \"DestinationType\": \"ImageUploader, FileUploader\",\r\n\
+  \"RequestType\": \"POST\",\r\n\
+  \"RequestURL\": \"" + location.origin + "/api/upload\",\r\n\
+  \"FileFormName\": \"files[]\",\r\n\
+  \"Headers\": {\r\n\
+    \"token\": \"" + upload.token + "\"\r\n\
+  },\r\n\
+  \"ResponseType\": \"Text\",\r\n\
+  \"URL\": \"$json:files[0].url$\",\r\n\
+  \"ThumbnailURL\": \"$json:files[0].url$\"\r\n\
+}";
+		var sharex_blob = new Blob([sharex_file], {type: "application/octet-binary"});
+		sharex_element.setAttribute("href", URL.createObjectURL(sharex_blob));
+		sharex_element.setAttribute("download", location.hostname + ".sxcu");
+	}
+};
+
+//Handle image paste event
+window.addEventListener('paste', function(event) {
+	var items = (event.clipboardData || event.originalEvent.clipboardData).items;
+	for (index in items) {
+		var item = items[index];
+		if (item.kind === 'file') {
+			var blob = item.getAsFile();
+			console.log(blob.type);
+			var file = new File([blob], "pasted-image."+blob.type.match(/(?:[^\/]*\/)([^;]*)/)[1]);
+			file.type = blob.type;
+			console.log(file);
+			upload.myDropzone.addFile(file);
+		}
+	}
+});
+
+window.onload = function () {
+	upload.checkIfPublic();
+};
+