Start of typescript migration
This commit is contained in:
@@ -1,95 +0,0 @@
|
||||
/* Beforehand i'd like to tell you to not forget to add a width and height attribute to the canvas element, this can be styled with css for the prettyness, but to keep the responsiveness a width of 800 is nice with a height of 640 (if you want it to be a landscape styled right now, in any case a rectangle (not a squire) should be have 1 of the 2 attributes 4/5 like 80/100 or 640/800*/
|
||||
|
||||
/* Global variables */
|
||||
var lastUpdate = Date.now();
|
||||
var myInterval = setInterval(tick, 16.333333333);
|
||||
var config = {
|
||||
images: {
|
||||
width: 40, /* The size the image will be scaled to, dont see this as a must, but as a nicer way because you can remove this if you also remove the 2 parameters from the render function */
|
||||
height: 60,
|
||||
},
|
||||
speed: {
|
||||
x: 5.6, /* A lil tricky because here we define the speed it travels with, but this can be either negative or postive value, so we determine possibility that on the image creation, by adding a * -1 or * 1 ;3 */
|
||||
y: 7 /* Just the speed it travels with vertically, not as tricky as the "x" value */
|
||||
}
|
||||
};
|
||||
|
||||
/* Load in items trough ajax call (in case you keep em in a database, if not you can use it like this as well */
|
||||
|
||||
var img_format = '.png'; /* Use the format you desire */
|
||||
var items = {
|
||||
add: function (img_source) {
|
||||
var img = new Image();
|
||||
img.src = 'img_' + this.length + img_format;
|
||||
|
||||
e.direction = Math.random() < 0.5 ? 1 : -1; /* This is used to know if it's going left or right */
|
||||
e.curX = Math.random() * canvas.width();
|
||||
e.curY = canvas.height();
|
||||
this.push(img);
|
||||
}
|
||||
}
|
||||
|
||||
items.add('your_image_path_plus_name');
|
||||
/*_________*/
|
||||
|
||||
/* The preffered way */
|
||||
var items = {};
|
||||
$.ajax({
|
||||
url: 'your_api_call',
|
||||
success: function (response) {
|
||||
if (typeof {response: 1}) {
|
||||
response.forEach(function (element, index, array) {
|
||||
items.push(element);
|
||||
});
|
||||
|
||||
items.forEach(function (e, i, a) {
|
||||
e.direction = Math.random() < 0.5 ? 1 : -1; /* This is used to know if it's going left or right */
|
||||
e.curX = Math.random() * canvas.width();
|
||||
e.curY = canvas.height();
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (items.length === 0) {
|
||||
console.log(items); /* In possible debug scenario that something went wrong with the add function */
|
||||
console.log('Perhaps you did something wrong with the add functionality therefor no items are being found');
|
||||
}
|
||||
|
||||
/* Lets get the loop going */
|
||||
items.forEach(function (e, i, a) { /* You should know by now that e == element, i == index, a == array
|
||||
e.start_location = Math.random() * canvas.width(); /* This will add its starter location, this could also be defined in either the image loop or the ajax call, but im lazy and i will not write this shit twice */
|
||||
});
|
||||
|
||||
/* The simplest of simple looping skills */
|
||||
function tick() {
|
||||
var now = Date.now();
|
||||
var dt = now - lastUpdate;
|
||||
lastUpdate = now;
|
||||
|
||||
update(dt);
|
||||
render();
|
||||
}
|
||||
|
||||
function update(dt) {
|
||||
/* If game loop does not work, which i guess, take a look at "http://goo.gl/f8sQRD" */
|
||||
items.forEach(function (e, i, a) {
|
||||
e.curX += config.speed.x;
|
||||
e.curY += config.speed.y;
|
||||
|
||||
/* Simple reset the shitty image */
|
||||
if ((e.curX > canvas.width()) || (e.curX + config.images.width < 0)) {
|
||||
e.curX = Math.random() * canvas.width();
|
||||
e.curY = canvas.height();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function render() {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
/* Render the images based on the updated data in the function "update()" */
|
||||
items.forEach(function (e, i, a) {
|
||||
ctx.drawImage(e, e.curX + config.speed.x * e.direction, e.curY - config.speed.y, config.image.width, config.images.height); /* this can be either said in update() or in render(), i prefer render, because i allways want to do the moving after the update, which verifies the speed and such please use "http://goo.gl/2HQbFy" for more information*/
|
||||
});
|
||||
/* get fucked nooblord, just go on with yer life why are you even looking at this if you're not the dev */
|
||||
}
|
||||
@@ -1,73 +0,0 @@
|
||||
/*\
|
||||
|*|
|
||||
|*| :: cookies.js ::
|
||||
|*|
|
||||
|*| A complete cookies reader/writer framework with full unicode support.
|
||||
|*|
|
||||
|*| Revision #3 - July 13th, 2017
|
||||
|*|
|
||||
|*| https://developer.mozilla.org/en-US/docs/Web/API/document.cookie
|
||||
|*| https://developer.mozilla.org/User:fusionchess
|
||||
|*| https://github.com/madmurphy/cookies.js
|
||||
|*|
|
||||
|*| This framework is released under the GNU Public License, version 3 or later.
|
||||
|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html
|
||||
|*|
|
||||
|*| Syntaxes:
|
||||
|*|
|
||||
|*| * docCookies.setItem(name, value[, end[, path[, domain[, secure]]]])
|
||||
|*| * docCookies.getItem(name)
|
||||
|*| * docCookies.removeItem(name[, path[, domain]])
|
||||
|*| * docCookies.hasItem(name)
|
||||
|*| * docCookies.keys()
|
||||
|*|
|
||||
\*/
|
||||
|
||||
var Cookie = {
|
||||
get: function (sKey) {
|
||||
if (!sKey) { return null; }
|
||||
return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
|
||||
},
|
||||
set: function (sKey, sValue, vEnd, sPath, sDomain, bSecure) {
|
||||
if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false; }
|
||||
var sExpires = "";
|
||||
if (vEnd) {
|
||||
switch (vEnd.constructor) {
|
||||
case Number:
|
||||
sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd;
|
||||
/*
|
||||
Note: Despite officially defined in RFC 6265, the use of `max-age` is not compatible with any
|
||||
version of Internet Explorer, Edge and some mobile browsers. Therefore passing a number to
|
||||
the end parameter might not work as expected. A possible solution might be to convert the the
|
||||
relative time to an absolute time. For instance, replacing the previous line with:
|
||||
*/
|
||||
/*
|
||||
sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; expires=" + (new Date(vEnd * 1e3 + Date.now())).toUTCString();
|
||||
*/
|
||||
break;
|
||||
case String:
|
||||
sExpires = "; expires=" + vEnd;
|
||||
break;
|
||||
case Date:
|
||||
sExpires = "; expires=" + vEnd.toUTCString();
|
||||
break;
|
||||
}
|
||||
}
|
||||
document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : "");
|
||||
return true;
|
||||
},
|
||||
remove: function (sKey, sPath, sDomain) {
|
||||
if (!this.hasItem(sKey)) { return false; }
|
||||
document.cookie = encodeURIComponent(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "");
|
||||
return true;
|
||||
},
|
||||
has: function (sKey) {
|
||||
if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false; }
|
||||
return (new RegExp("(?:^|;\\s*)" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=")).test(document.cookie);
|
||||
},
|
||||
keys: function () {
|
||||
var aKeys = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/);
|
||||
for (var nLen = aKeys.length, nIdx = 0; nIdx < nLen; nIdx++) { aKeys[nIdx] = decodeURIComponent(aKeys[nIdx]); }
|
||||
return aKeys;
|
||||
}
|
||||
};
|
||||
@@ -1,194 +1,140 @@
|
||||
/*
|
||||
* Made by Fornax for PixelDrain
|
||||
* Use if you want
|
||||
*
|
||||
* I'll clean up this baby some time in the future too
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
/*
|
||||
* Form upload handlers
|
||||
*/
|
||||
|
||||
|
||||
/* global API_URL */
|
||||
|
||||
$("#selectFileButton").click(function(event){
|
||||
$("#fileInputField").click();
|
||||
$("#selectFileButton").click(function (event) {
|
||||
$("#fileInputField").click();
|
||||
});
|
||||
|
||||
$("#fileInputField").change(function(){
|
||||
pushUploads($("#fileInputField")[0].files);
|
||||
|
||||
// This resets the file input field
|
||||
// http://stackoverflow.com/questions/1043957/clearing-input-type-file-using-jquery
|
||||
$('#fileName').html("");
|
||||
$("#fileUploadButton").css("visibility", "hidden");
|
||||
$("#fileInputField").wrap("<form>").closest("form").get(0).reset();
|
||||
$("#fileInputField").unwrap();
|
||||
$("#fileInputField").change(function () {
|
||||
alert(typeof ($("#fileInputField")[0]));
|
||||
//pushUploads($("#fileInputField")[0].files);
|
||||
// This resets the file input field
|
||||
// http://stackoverflow.com/questions/1043957/clearing-input-type-file-using-jquery
|
||||
$('#fileName').html("");
|
||||
$("#fileUploadButton").css("visibility", "hidden");
|
||||
//$("#fileInputField").wrap("<form>").closest("form").get(0).reset();
|
||||
$("#fileInputField").unwrap();
|
||||
});
|
||||
|
||||
/*
|
||||
* Drag 'n Drop upload handlers
|
||||
*/
|
||||
$(document).on('dragover', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
});
|
||||
$(document).on('dragenter', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
});
|
||||
$(document).on('drop', function (e) {
|
||||
if (e.originalEvent.dataTransfer) {
|
||||
var len = e.originalEvent.dataTransfer.files.length;
|
||||
|
||||
if (len) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
pushUploads(e.originalEvent.dataTransfer.files);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// $(document).on('drop', function (e) {
|
||||
// if (e.originalEvent.dataTransfer) {
|
||||
// var len = e.originalEvent.dataTransfer.files.length;
|
||||
// if (len) {
|
||||
// e.preventDefault();
|
||||
// e.stopPropagation();
|
||||
// pushUploads(e.originalEvent.dataTransfer.files);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
/*
|
||||
* Upload functions
|
||||
*/
|
||||
function pushUploads(array){
|
||||
var len = array.length;
|
||||
|
||||
for(i = 0; i < len; i++){
|
||||
uploadQueue.push(array[i]);
|
||||
}
|
||||
|
||||
startFileUpload();
|
||||
}
|
||||
|
||||
var isFirstUpload = true;
|
||||
var uploadQueue = new Array();
|
||||
var isUploading = false;
|
||||
|
||||
function startFileUpload() {
|
||||
if(isUploading){
|
||||
return;
|
||||
}
|
||||
var file = uploadQueue.shift();
|
||||
|
||||
if(file === null){
|
||||
return;
|
||||
}
|
||||
|
||||
if(isFirstUpload){
|
||||
isFirstUpload = false;
|
||||
$("#uploads-completed").animate(
|
||||
{"height": "340px"},
|
||||
{"duration": 2000, queue: false}
|
||||
);
|
||||
$("#progress-bar").animate(
|
||||
{"height": "20px"},
|
||||
{"duration": 1000, queue: false}
|
||||
);
|
||||
}
|
||||
|
||||
isUploading = true;
|
||||
formData = new FormData();
|
||||
formData.append('file', file);
|
||||
formData.append("name", file.name);
|
||||
|
||||
jQuery.ajax({
|
||||
url: API_URL + "/file",
|
||||
data: formData,
|
||||
cache: false,
|
||||
crossDomain: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
type: 'POST',
|
||||
xhr: function () {
|
||||
var xhr = new window.XMLHttpRequest();
|
||||
xhr.upload.addEventListener("progress", function (evt) {
|
||||
if (evt.lengthComputable) {
|
||||
percentComplete = (evt.loaded / evt.total) * 100;
|
||||
|
||||
$("#upload-progress").animate(
|
||||
{"width": percentComplete + "%"},
|
||||
{"duration": 200, queue: false}
|
||||
);
|
||||
|
||||
$(".progress-text").html("Uploading... "
|
||||
+ evt.loaded + " / " + evt.total + " Bytes "
|
||||
+ "(" + uploadQueue.length + " files in queue)"
|
||||
);
|
||||
}
|
||||
}, false);
|
||||
|
||||
return xhr;
|
||||
},
|
||||
success: function (data) {
|
||||
isUploading = false;
|
||||
if(uploadQueue.length > 0){
|
||||
startFileUpload();
|
||||
}else{
|
||||
$(".progress-text").html("Done! File link is available below");
|
||||
}
|
||||
|
||||
fileUploadComplete(data);
|
||||
},
|
||||
error: function (xhr, status, error){
|
||||
console.log(status);
|
||||
console.log(error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function fileUploadComplete(json) {
|
||||
if (json.success) {
|
||||
setHistoryCookie(json.id)
|
||||
|
||||
resultString = "<div class=\"uploadItem\">Upload successful!<br/>"
|
||||
+ "Your file URL:<br/>"
|
||||
+ "<a href=\"/u/"+json.id+"\" target=\"_blank\">"+window.location.hostname+"/u/"+json.id+"</a>"
|
||||
+ "</div>";
|
||||
|
||||
$('#uploads-completed').prepend(
|
||||
$(resultString).hide().fadeIn('slow')
|
||||
);
|
||||
|
||||
addToList(json.id, "");
|
||||
} else {
|
||||
resultString = "<div class=\"uploadItem\">Something went wrong! "
|
||||
+ "The server responded with this:<br/>\"" + json.message
|
||||
+ "\"</div>";
|
||||
|
||||
$('#uploads-completed').prepend(
|
||||
$(resultString).hide().fadeIn('slow')
|
||||
);
|
||||
|
||||
$(".progressText").html(json.message);
|
||||
}
|
||||
}
|
||||
|
||||
function setHistoryCookie(id){
|
||||
uc = Cookie.get("pduploads");
|
||||
|
||||
// First upload in this browser
|
||||
if (uc === null) {
|
||||
Cookie.set("pduploads", id + ".");
|
||||
return;
|
||||
}
|
||||
|
||||
if (uc.length > 2000){
|
||||
// Cookie is becoming too long, drop the oldest two files
|
||||
uc = uc.substring(
|
||||
uc.indexOf(".") + 1
|
||||
).substring(
|
||||
uc.indexOf(".") + 1
|
||||
);
|
||||
}
|
||||
|
||||
Cookie.set("pduploads", uc + id + ".");
|
||||
}
|
||||
|
||||
$("#btnClearHistory").click(function(){
|
||||
$('#uploads-container').html("");
|
||||
listItems = new Array();
|
||||
});
|
||||
// function pushUploads(array){
|
||||
// var len = array.length;
|
||||
// for(i = 0; i < len; i++){
|
||||
// uploadQueue.push(array[i]);
|
||||
// }
|
||||
// startFileUpload();
|
||||
// }
|
||||
var Cookie;
|
||||
(function (Cookie) {
|
||||
function read(name) {
|
||||
var result = new RegExp('(?:^|; )' + encodeURIComponent(name) + '=([^;]*)').exec(document.cookie);
|
||||
return result ? result[1] : null;
|
||||
}
|
||||
Cookie.read = read;
|
||||
function write(name, value, days) {
|
||||
if (!days) {
|
||||
days = 365 * 20;
|
||||
}
|
||||
var date = new Date();
|
||||
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
||||
var expires = "; expires=" + date.toUTCString();
|
||||
document.cookie = name + "=" + value + expires + "; path=/";
|
||||
}
|
||||
Cookie.write = write;
|
||||
function remove(name) {
|
||||
write(name, "", -1);
|
||||
}
|
||||
Cookie.remove = remove;
|
||||
})(Cookie || (Cookie = {}));
|
||||
var UploadManager = /** @class */ (function () {
|
||||
function UploadManager() {
|
||||
}
|
||||
UploadManager.prototype.uploadFile = function (file) {
|
||||
this.uploadQueue.push(file);
|
||||
if (this.uploadThreads.length < 4) {
|
||||
setTimeout(new UploadWorker(this), 0); // Start a new upload thread
|
||||
}
|
||||
};
|
||||
UploadManager.prototype.grabFile = function () {
|
||||
return null;
|
||||
};
|
||||
return UploadManager;
|
||||
}());
|
||||
var UploadWorker = /** @class */ (function () {
|
||||
function UploadWorker(manager) {
|
||||
this.manager = manager;
|
||||
}
|
||||
UploadWorker.prototype.start = function () {
|
||||
var file = this.manager.grabFile();
|
||||
if (file === null) {
|
||||
return; // Stop the thread
|
||||
}
|
||||
this.tries = 0;
|
||||
this.upload(file);
|
||||
};
|
||||
UploadWorker.prototype.upload = function (file) {
|
||||
var formData = new FormData();
|
||||
formData.append('file', file);
|
||||
formData.append("name", file.name);
|
||||
$.ajax({
|
||||
url: "/api/file",
|
||||
data: formData,
|
||||
cache: false,
|
||||
crossDomain: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
type: 'POST',
|
||||
success: function (data) {
|
||||
console.log("Done: " + data.id);
|
||||
this.setHistoryCookie(data.id);
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
console.log(status);
|
||||
console.log(error);
|
||||
if (this.tries === 3) {
|
||||
alert("Upload failed: " + status);
|
||||
return; // Upload failed
|
||||
}
|
||||
// Try again
|
||||
this.tries++;
|
||||
this.upload(file);
|
||||
}
|
||||
});
|
||||
};
|
||||
UploadWorker.prototype.setHistoryCookie = function (id) {
|
||||
var uc = Cookie.read("pduploads");
|
||||
// First upload in this browser
|
||||
if (uc === null) {
|
||||
Cookie.write("pduploads", id + ".", undefined);
|
||||
return;
|
||||
}
|
||||
if (uc.length > 2000) {
|
||||
// Cookie is becoming too long, drop the oldest two files
|
||||
uc = uc.substring(uc.indexOf(".") + 1).substring(uc.indexOf(".") + 1);
|
||||
}
|
||||
Cookie.write("pduploads", uc + id + ".", undefined);
|
||||
};
|
||||
return UploadWorker;
|
||||
}());
|
||||
|
||||
194
res/static/res/script/home.js.old
Normal file
194
res/static/res/script/home.js.old
Normal file
@@ -0,0 +1,194 @@
|
||||
/*
|
||||
* Made by Fornax for PixelDrain
|
||||
* Use if you want
|
||||
*
|
||||
* I'll clean up this baby some time in the future too
|
||||
*/
|
||||
|
||||
/*
|
||||
* Form upload handlers
|
||||
*/
|
||||
|
||||
|
||||
/* global API_URL */
|
||||
|
||||
$("#selectFileButton").click(function(event){
|
||||
$("#fileInputField").click();
|
||||
});
|
||||
|
||||
$("#fileInputField").change(function(){
|
||||
pushUploads($("#fileInputField")[0].files);
|
||||
|
||||
// This resets the file input field
|
||||
// http://stackoverflow.com/questions/1043957/clearing-input-type-file-using-jquery
|
||||
$('#fileName').html("");
|
||||
$("#fileUploadButton").css("visibility", "hidden");
|
||||
$("#fileInputField").wrap("<form>").closest("form").get(0).reset();
|
||||
$("#fileInputField").unwrap();
|
||||
});
|
||||
|
||||
/*
|
||||
* Drag 'n Drop upload handlers
|
||||
*/
|
||||
$(document).on('dragover', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
});
|
||||
$(document).on('dragenter', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
});
|
||||
$(document).on('drop', function (e) {
|
||||
if (e.originalEvent.dataTransfer) {
|
||||
var len = e.originalEvent.dataTransfer.files.length;
|
||||
|
||||
if (len) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
|
||||
pushUploads(e.originalEvent.dataTransfer.files);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* Upload functions
|
||||
*/
|
||||
function pushUploads(array){
|
||||
var len = array.length;
|
||||
|
||||
for(i = 0; i < len; i++){
|
||||
uploadQueue.push(array[i]);
|
||||
}
|
||||
|
||||
startFileUpload();
|
||||
}
|
||||
|
||||
var isFirstUpload = true;
|
||||
var uploadQueue = new Array();
|
||||
var isUploading = false;
|
||||
|
||||
function startFileUpload() {
|
||||
if(isUploading){
|
||||
return;
|
||||
}
|
||||
var file = uploadQueue.shift();
|
||||
|
||||
if(file === null){
|
||||
return;
|
||||
}
|
||||
|
||||
if(isFirstUpload){
|
||||
isFirstUpload = false;
|
||||
$("#uploads-completed").animate(
|
||||
{"height": "340px"},
|
||||
{"duration": 2000, queue: false}
|
||||
);
|
||||
$("#progress-bar").animate(
|
||||
{"height": "20px"},
|
||||
{"duration": 1000, queue: false}
|
||||
);
|
||||
}
|
||||
|
||||
isUploading = true;
|
||||
formData = new FormData();
|
||||
formData.append('file', file);
|
||||
formData.append("name", file.name);
|
||||
|
||||
jQuery.ajax({
|
||||
url: API_URL + "/file",
|
||||
data: formData,
|
||||
cache: false,
|
||||
crossDomain: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
type: 'POST',
|
||||
xhr: function () {
|
||||
var xhr = new window.XMLHttpRequest();
|
||||
xhr.upload.addEventListener("progress", function (evt) {
|
||||
if (evt.lengthComputable) {
|
||||
percentComplete = (evt.loaded / evt.total) * 100;
|
||||
|
||||
$("#upload-progress").animate(
|
||||
{"width": percentComplete + "%"},
|
||||
{"duration": 200, queue: false}
|
||||
);
|
||||
|
||||
$(".progress-text").html("Uploading... "
|
||||
+ evt.loaded + " / " + evt.total + " Bytes "
|
||||
+ "(" + uploadQueue.length + " files in queue)"
|
||||
);
|
||||
}
|
||||
}, false);
|
||||
|
||||
return xhr;
|
||||
},
|
||||
success: function (data) {
|
||||
isUploading = false;
|
||||
if(uploadQueue.length > 0){
|
||||
startFileUpload();
|
||||
}else{
|
||||
$(".progress-text").html("Done! File link is available below");
|
||||
}
|
||||
|
||||
fileUploadComplete(data);
|
||||
},
|
||||
error: function (xhr, status, error){
|
||||
console.log(status);
|
||||
console.log(error);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function fileUploadComplete(json) {
|
||||
if (json.success) {
|
||||
setHistoryCookie(json.id)
|
||||
|
||||
resultString = "<div class=\"uploadItem\">Upload successful!<br/>"
|
||||
+ "Your file URL:<br/>"
|
||||
+ "<a href=\"/u/"+json.id+"\" target=\"_blank\">"+window.location.hostname+"/u/"+json.id+"</a>"
|
||||
+ "</div>";
|
||||
|
||||
$('#uploads-completed').prepend(
|
||||
$(resultString).hide().fadeIn('slow')
|
||||
);
|
||||
|
||||
addToList(json.id, "");
|
||||
} else {
|
||||
resultString = "<div class=\"uploadItem\">Something went wrong! "
|
||||
+ "The server responded with this:<br/>\"" + json.message
|
||||
+ "\"</div>";
|
||||
|
||||
$('#uploads-completed').prepend(
|
||||
$(resultString).hide().fadeIn('slow')
|
||||
);
|
||||
|
||||
$(".progressText").html(json.message);
|
||||
}
|
||||
}
|
||||
|
||||
function setHistoryCookie(id){
|
||||
uc = Cookie.get("pduploads");
|
||||
|
||||
// First upload in this browser
|
||||
if (uc === null) {
|
||||
Cookie.set("pduploads", id + ".");
|
||||
return;
|
||||
}
|
||||
|
||||
if (uc.length > 2000){
|
||||
// Cookie is becoming too long, drop the oldest two files
|
||||
uc = uc.substring(
|
||||
uc.indexOf(".") + 1
|
||||
).substring(
|
||||
uc.indexOf(".") + 1
|
||||
);
|
||||
}
|
||||
|
||||
Cookie.set("pduploads", uc + id + ".");
|
||||
}
|
||||
|
||||
$("#btnClearHistory").click(function(){
|
||||
$('#uploads-container').html("");
|
||||
listItems = new Array();
|
||||
});
|
||||
93
res/static/res/script/pixellib.js
Normal file
93
res/static/res/script/pixellib.js
Normal file
@@ -0,0 +1,93 @@
|
||||
"use strict";
|
||||
var Cookie;
|
||||
(function (Cookie) {
|
||||
function read(name) {
|
||||
var result = new RegExp('(?:^|; )' + encodeURIComponent(name) + '=([^;]*)').exec(document.cookie);
|
||||
return result ? result[1] : null;
|
||||
}
|
||||
Cookie.read = read;
|
||||
function write(name, value, days) {
|
||||
if (!days) {
|
||||
days = 365 * 20;
|
||||
}
|
||||
var date = new Date();
|
||||
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
||||
var expires = "; expires=" + date.toUTCString();
|
||||
document.cookie = name + "=" + value + expires + "; path=/";
|
||||
}
|
||||
Cookie.write = write;
|
||||
function remove(name) {
|
||||
write(name, "", -1);
|
||||
}
|
||||
Cookie.remove = remove;
|
||||
})(Cookie || (Cookie = {}));
|
||||
var UploadManager = /** @class */ (function () {
|
||||
function UploadManager() {
|
||||
}
|
||||
UploadManager.prototype.uploadFile = function (file) {
|
||||
this.uploadQueue.push(file);
|
||||
if (this.uploadThreads.length < 4) {
|
||||
setTimeout(new UploadWorker(this), 0); // Start a new upload thread
|
||||
}
|
||||
};
|
||||
UploadManager.prototype.grabFile = function () {
|
||||
return null;
|
||||
};
|
||||
return UploadManager;
|
||||
}());
|
||||
var UploadWorker = /** @class */ (function () {
|
||||
function UploadWorker(manager) {
|
||||
this.manager = manager;
|
||||
}
|
||||
UploadWorker.prototype.start = function () {
|
||||
var file = this.manager.grabFile();
|
||||
if (file === null) {
|
||||
return; // Stop the thread
|
||||
}
|
||||
this.tries = 0;
|
||||
this.upload(file);
|
||||
};
|
||||
UploadWorker.prototype.upload = function (file) {
|
||||
var formData = new FormData();
|
||||
formData.append('file', file);
|
||||
formData.append("name", file.name);
|
||||
$.ajax({
|
||||
url: "/api/file",
|
||||
data: formData,
|
||||
cache: false,
|
||||
crossDomain: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
type: 'POST',
|
||||
success: function (data) {
|
||||
console.log("Done: " + data.id);
|
||||
this.setHistoryCookie(data.id);
|
||||
},
|
||||
error: function (xhr, status, error) {
|
||||
console.log(status);
|
||||
console.log(error);
|
||||
if (this.tries === 3) {
|
||||
alert("Upload failed: " + status);
|
||||
return; // Upload failed
|
||||
}
|
||||
// Try again
|
||||
this.tries++;
|
||||
this.upload(file);
|
||||
}
|
||||
});
|
||||
};
|
||||
UploadWorker.prototype.setHistoryCookie = function (id) {
|
||||
var uc = Cookie.read("pduploads");
|
||||
// First upload in this browser
|
||||
if (uc === null) {
|
||||
Cookie.write("pduploads", id + ".", undefined);
|
||||
return;
|
||||
}
|
||||
if (uc.length > 2000) {
|
||||
// Cookie is becoming too long, drop the oldest two files
|
||||
uc = uc.substring(uc.indexOf(".") + 1).substring(uc.indexOf(".") + 1);
|
||||
}
|
||||
Cookie.write("pduploads", uc + id + ".", undefined);
|
||||
};
|
||||
return UploadWorker;
|
||||
}());
|
||||
59
res/static/res/typescript/home/home.ts
Normal file
59
res/static/res/typescript/home/home.ts
Normal file
@@ -0,0 +1,59 @@
|
||||
|
||||
|
||||
/*
|
||||
* Form upload handlers
|
||||
*/
|
||||
|
||||
$("#selectFileButton").click(function(event){
|
||||
$("#fileInputField").click();
|
||||
});
|
||||
|
||||
$("#fileInputField").on('change', null, (e) => {
|
||||
let field = <FileList> e.target
|
||||
|
||||
//pushUploads($("#fileInputField")[0].files);
|
||||
|
||||
// This resets the file input field
|
||||
// http://stackoverflow.com/questions/1043957/clearing-input-type-file-using-jquery
|
||||
$('#fileName').html("");
|
||||
$("#fileUploadButton").css("visibility", "hidden");
|
||||
$("#fileInputField").wrap("<form>").closest("form").get(0).reset();
|
||||
$("#fileInputField").unwrap();
|
||||
});
|
||||
|
||||
/*
|
||||
* Drag 'n Drop upload handlers
|
||||
*/
|
||||
$(document).on('dragover', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
});
|
||||
$(document).on('dragenter', function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
});
|
||||
// $(document).on('drop', function (e) {
|
||||
// if (e.originalEvent.dataTransfer) {
|
||||
// var len = e.originalEvent.dataTransfer.files.length;
|
||||
|
||||
// if (len) {
|
||||
// e.preventDefault();
|
||||
// e.stopPropagation();
|
||||
|
||||
// pushUploads(e.originalEvent.dataTransfer.files);
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
/*
|
||||
* Upload functions
|
||||
*/
|
||||
// function pushUploads(array){
|
||||
// var len = array.length;
|
||||
|
||||
// for(i = 0; i < len; i++){
|
||||
// uploadQueue.push(array[i]);
|
||||
// }
|
||||
|
||||
// startFileUpload();
|
||||
// }
|
||||
23
res/static/res/typescript/lib/cookie.ts
Normal file
23
res/static/res/typescript/lib/cookie.ts
Normal file
@@ -0,0 +1,23 @@
|
||||
module Cookie {
|
||||
export function read(name: string) {
|
||||
var result = new RegExp('(?:^|; )' + encodeURIComponent(name) + '=([^;]*)').exec(document.cookie);
|
||||
return result ? result[1] : null;
|
||||
}
|
||||
|
||||
export function write(name: string, value: string, days?: number) {
|
||||
if (!days) {
|
||||
days = 365 * 20;
|
||||
}
|
||||
|
||||
var date = new Date();
|
||||
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
||||
|
||||
var expires = "; expires=" + date.toUTCString();
|
||||
|
||||
document.cookie = name + "=" + value + expires + "; path=/";
|
||||
}
|
||||
|
||||
export function remove(name: string) {
|
||||
write(name, "", -1);
|
||||
}
|
||||
}
|
||||
8027
res/static/res/typescript/lib/jquery.d.ts
vendored
Normal file
8027
res/static/res/typescript/lib/jquery.d.ts
vendored
Normal file
File diff suppressed because it is too large
Load Diff
89
res/static/res/typescript/lib/uploader.ts
Normal file
89
res/static/res/typescript/lib/uploader.ts
Normal file
@@ -0,0 +1,89 @@
|
||||
class UploadManager {
|
||||
private uploadQueue: Array<File>;
|
||||
private uploadThreads: Array<UploadWorker>;
|
||||
private maxThreads: 4;
|
||||
|
||||
public uploadFile(file: File) {
|
||||
this.uploadQueue.push(file);
|
||||
|
||||
if (this.uploadThreads.length < 4) {
|
||||
setTimeout(new UploadWorker(this), 0) // Start a new upload thread
|
||||
}
|
||||
}
|
||||
public grabFile(): File | null {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
class UploadWorker {
|
||||
private manager: UploadManager
|
||||
private tries: number
|
||||
|
||||
constructor(manager: UploadManager) {
|
||||
this.manager = manager
|
||||
}
|
||||
|
||||
public start() {
|
||||
var file = this.manager.grabFile()
|
||||
if (file === null) {
|
||||
return // Stop the thread
|
||||
}
|
||||
|
||||
this.tries = 0
|
||||
this.upload(file)
|
||||
}
|
||||
|
||||
private upload(file: File){
|
||||
var formData = new FormData()
|
||||
formData.append('file', file)
|
||||
formData.append("name", file.name)
|
||||
|
||||
$.ajax({
|
||||
url: "/api/file",
|
||||
data: formData,
|
||||
cache: false,
|
||||
crossDomain: false,
|
||||
contentType: false,
|
||||
processData: false,
|
||||
type: 'POST',
|
||||
success: function (data) {
|
||||
console.log("Done: " + data.id)
|
||||
this.setHistoryCookie(data.id)
|
||||
},
|
||||
error: function (xhr, status, error){
|
||||
console.log(status)
|
||||
console.log(error)
|
||||
|
||||
if (this.tries === 3) {
|
||||
alert("Upload failed: " + status);
|
||||
return; // Upload failed
|
||||
}
|
||||
|
||||
// Try again
|
||||
this.tries++
|
||||
this.upload(file)
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private setHistoryCookie(id: string){
|
||||
var uc = Cookie.read("pduploads")
|
||||
|
||||
// First upload in this browser
|
||||
if (uc === null) {
|
||||
Cookie.write("pduploads", id + ".", undefined)
|
||||
return
|
||||
}
|
||||
|
||||
if (uc.length > 2000){
|
||||
// Cookie is becoming too long, drop the oldest two files
|
||||
uc = uc.substring(
|
||||
uc.indexOf(".") + 1
|
||||
).substring(
|
||||
uc.indexOf(".") + 1
|
||||
)
|
||||
}
|
||||
|
||||
Cookie.write("pduploads", uc + id + ".", undefined)
|
||||
}
|
||||
}
|
||||
@@ -143,9 +143,8 @@
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">var API_URL = "/api";</script>
|
||||
<script src="/res/script/Cookie.js"></script>
|
||||
<script src="/res/script/home.js"></script>
|
||||
<script src="/res/script/listmaker.js"></script>
|
||||
<script src="/res/script/home.js"></script>
|
||||
{{template "analytics"}}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user