Browse Source

Modified UI and dropzone to be more custom and per file.

Modified how encoding worked (still not working)
tags/2.0.3
Teknikode 4 years ago
parent
commit
cb6aaee0dc

+ 37
- 7
Teknik/Areas/Upload/Scripts/EncryptionWorker.js View File

@@ -4,18 +4,48 @@

switch (data.cmd) {
case 'encrypt':
var wordArray = CryptoJS.lib.WordArray.create(new Uint8Array(data.file))
//var startByte = 0;
//var endByte = 0;
//var prog = [];

//var dataStr = ab2str(data.file);
//var bytes = new Uint8Array(data.file);

// encrypt the passed in file data
var encrypted = CryptoJS.AES.encrypt(wordArray, data.key, { iv: data.iv });
var encByteArray = wordToByteArray(encrypted);
//// Create aes encryptor object
//var aesEncryptor = CryptoJS.algo.AES.createEncryptor(data.key, { iv: data.iv });

//while (startByte <= (bytes.length - 1)) {
// // Set the end byte
// endByte = startByte + data.chunkSize;
// if (endByte > bytes.length - 1)
// {
// endByte = bytes.length - 1;
// }

// // Grab current set of bytes
// var curBytes = bytes.subarray(startByte, endByte);
// var wordArray = CryptoJS.lib.WordArray.create(curBytes)

// // encrypt the passed in file data and add it to bits[]
// prog.push(aesEncryptor.process(wordArray));

// // Set the next start as the current end
// startByte = endByte + 1;
//}//then finalize
//prog.push(aesEncryptor.finalize());

//throw JSON.stringify({ data: prog, start: startByte, end: endByte, len: bytes.length })
var wordArray = CryptoJS.lib.WordArray.create(new Uint8Array(data.file));

var encWords = CryptoJS.AES.encrypt(wordArray, data.key, { iv: data.iv, mode: CryptoJS.mode.CBC });

//throw JSON.stringify({ data: wordArray });

var dcBase64String = encWords.toString(); // to Base64-String
//var encByteArray = wordToByteArray(encWords.words);
// patch it all back together for the trip home
var objData =
{
encrypted: encByteArray.buffer
encrypted: str2ab(dcBase64String)
};

self.postMessage(objData, [objData.encrypted]);
@@ -58,7 +88,7 @@ function ab2str(buf) {

function str2ab(str) {
var buf = new ArrayBuffer(str.length); // 2 bytes for each char
var bufView = new Uint8Array(buf);
var bufView = new Uint16Array(buf);
for (var i = 0, strLen = str.length; i < strLen; i++) {
bufView[i] = str.charCodeAt(i);
}

+ 90
- 88
Teknik/Areas/Upload/Scripts/Upload.js View File

@@ -34,29 +34,30 @@ Dropzone.options.TeknikUpload = {
addRemoveLinks: true,
autoProcessQueue: false,
clickable: true,
init: function() {
this.on("addedfile", function (file, responseText) {
// Create the UI element for the new item
var short_name = file.name.split(".")[0].hashCode();
$("#upload-links").css('display', 'inline', 'important');
$("#upload-links").prepend(' \
<div class="row link_'+short_name+'"> \
previewTemplate: function () { },
addedfile: function (file) {
// Create the UI element for the new item
var short_name = file.name.hashCode();
$("#upload-links").css('display', 'inline', 'important');
$("#upload-links").prepend(' \
<div class="row link-' + short_name + '" id="link-' + short_name + '"> \
<div class="col-sm-12 text-center"> \
'+file.name+' \
'+ file.name + ' \
</div> \
<div class="progress col-sm-12"> \
<div class="progress-' + short_name + '"> \
<div class="progress-bar progress-bar-success" id="progressBar-' + short_name + '" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 0%">0%</div> \
</div> \
</div> \
');

// Encrypt the file
encryptFile(file, uploadFile);
$("#upload_message").css('display', 'none', 'important');
});
// Encrypt the file
encryptFile(file, uploadFile);
$("#upload_message").css('display', 'none', 'important');
},
init: function() {
this.on("removedfile", function(file) {
var name = file.name.split(".")[0].hashCode();
$('.link_'+name).remove();
var name = file.name.hashCode();
$('.link-'+name).remove();
});
this.on("reset", function(file, responseText) {
$("#upload_message").css('display', 'inline', 'important');
@@ -78,72 +79,11 @@ Dropzone.options.TeknikUpload = {
}
};

function uploadFile(data, key, iv, filetype, filename)
{
$("#key").val(key);
$("#iv").val(iv);
var blob = new Blob([data]);
// Now we need to upload the file
var fd = new FormData();
fd.append('fileType', filetype);
fd.append('iv', iv);
fd.append('data', blob);
fd.append('__RequestVerificationToken', $('#__AjaxAntiForgeryForm input[name=__RequestVerificationToken]').val());

var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", uploadProgress, false);
xhr.addEventListener("load", uploadComplete.bind(null, filename), false);
xhr.addEventListener("error", uploadFailed, false);
xhr.addEventListener("abort", uploadCanceled, false);
xhr.open("POST", uploadFileURL);
xhr.send(fd);
}

function uploadProgress(evt) {
if (evt.lengthComputable) {
var percentComplete = Math.round(evt.loaded * 100 / evt.total);
$(".progress").children('.progress-bar').css('width', (percentComplete * (3 / 5)) + 40 + '%');
$(".progress").children('.progress-bar').html(percentComplete + '% Uploaded');
}
else {
document.getElementById('progressNumber').innerHTML = 'unable to compute';
}
}

function uploadComplete(filename, evt) {
obj = JSON.parse(evt.target.responseText);
var name = obj.result.name;
var fullName = obj.result.url;
var short_name = filename.split(".")[0].hashCode();
$("#upload-links").css('display', 'inline', 'important');
$("#upload-links").prepend(' \
<div class="row link_'+ short_name + '"> \
<div class="col-sm-6"> \
' + filename + ' \
</div> \
<div class="col-sm-3"> \
<a href="' + fullName + '" target="_blank" class="alert-link">' + fullName + '</a> \
</div> \
<div class="col-sm-3"> \
<button type="button" class="btn btn-default btn-xs generate-delete-link-' + name + '" id="' + name + '">Generate Deletion URL</button> \
</div> \
</div> \
');
linkUploadDelete('.generate-delete-link-' + name + '');
}

function uploadFailed(evt) {
alert("There was an error attempting to upload the file.");
}

function uploadCanceled(evt) {
alert("The upload has been canceled by the user or the browser dropped the connection.");
}

// Function to encrypt a file, overide the file's data attribute with the encrypted value, and then call a callback function if supplied
function encryptFile(file, callback) {
var filetype = file.type;
var filename = file.name;
var shortName = file.name.hashCode();

// Start the file reader
var reader = new FileReader();
@@ -158,8 +98,8 @@ function encryptFile(file, callback) {
var iv = CryptoJS.enc.Utf8.parse(ivStr);

// Display encryption message
$(".progress").children('.progress-bar').css('width', '20%');
$(".progress").children('.progress-bar').html('Encrypting...');
$(".progress-" + shortName).children('.progress-bar').css('width', '20%');
$(".progress-" + shortName).children('.progress-bar').html('Encrypting...');

var worker = new Worker(encScriptSrc);

@@ -170,6 +110,14 @@ function encryptFile(file, callback) {
}
});

worker.onerror = function (err) {
alert(err);

// An error occured
$(".progress-" + shortName).children('.progress-bar').css('width', '100%');
$(".progress-" + shortName).children('.progress-bar').html('Error Occured');
}

// Execute worker with data
var objData =
{
@@ -177,22 +125,76 @@ function encryptFile(file, callback) {
script: aesScriptSrc,
key: key,
iv: iv,
chunkSize: 1024,
file: e.target.result
};
worker.postMessage(objData, [objData.file]);
};
})(callback);

// While reading, display the current progress
reader.onprogress = function (data) {
if (data.lengthComputable) {
var progress = parseInt(((data.loaded / data.total) * 100), 10);
$(".progress").children('.progress-bar').css('width', (progress.toFixed(2) / 5) + '%');
$(".progress").children('.progress-bar').html(progress.toFixed(2) + '% Loaded');
}
}

// Start async read
var blob = file.slice(0, file.size);
reader.readAsArrayBuffer(blob);
}

function uploadFile(data, key, iv, filetype, filename)
{
$("#key").val(key);
$("#iv").val(iv);
var blob = new Blob([data]);
// Now we need to upload the file
var fd = new FormData();
fd.append('fileType', filetype);
fd.append('iv', iv);
fd.append('data', blob);
fd.append('__RequestVerificationToken', $('#__AjaxAntiForgeryForm input[name=__RequestVerificationToken]').val());

var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", uploadProgress.bind(null, filename), false);
xhr.addEventListener("load", uploadComplete.bind(null, filename), false);
xhr.addEventListener("error", uploadFailed, false);
xhr.addEventListener("abort", uploadCanceled, false);
xhr.open("POST", uploadFileURL);
xhr.send(fd);
}

function uploadProgress(filename, evt) {
var shortName = filename.hashCode();
if (evt.lengthComputable) {
var percentComplete = Math.round(evt.loaded * 100 / evt.total);
$(".progress-" + shortName).children('.progress-bar').css('width', (percentComplete * (3 / 5)) + 40 + '%');
$(".progress-" + shortName).children('.progress-bar').html(percentComplete + '% Uploaded');
}
else {
document.getElementById('progressNumber').innerHTML = 'unable to compute';
}
}

function uploadComplete(filename, evt) {
obj = JSON.parse(evt.target.responseText);
var name = obj.result.name;
var fullName = obj.result.url;
var shortName = filename.hashCode();
$('.progress-' + shortName).children('.progress-bar').css('width', '100%');
$('.progress-' + shortName).children('.progress-bar').html('Complete');
$('.links-' + shortName).append(' \
<div class="col-sm-6"> \
' + filename + ' \
</div> \
<div class="col-sm-3"> \
<a href="' + fullName + '" target="_blank" class="alert-link">' + fullName + '</a> \
</div> \
<div class="col-sm-3"> \
<button type="button" class="btn btn-default btn-xs generate-delete-link-' + name + '" id="' + name + '">Generate Deletion URL</button> \
</div> \
');
linkUploadDelete('.generate-delete-link-' + name + '');
}

function uploadFailed(evt) {
alert("There was an error attempting to upload the file.");
}

function uploadCanceled(evt) {
alert("The upload has been canceled by the user or the browser dropped the connection.");
}

+ 0
- 3
Teknik/Areas/Upload/Views/Upload/Index.cshtml View File

@@ -44,9 +44,6 @@
</form>
</div>
<br />
<div class="progress">
<div class="progress-bar progress-bar-success" id="progressBar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 0%">0%</div>
</div>
<div class="container" id="upload-links">
</div>
<br />

+ 6
- 1
Teknik/Web.config View File

@@ -20,7 +20,7 @@
<customErrors mode="Off" />
<authentication mode="Forms" />
<compilation debug="true" targetFramework="4.5.2" />
<httpRuntime targetFramework="4.5.2" />
<httpRuntime targetFramework="4.5.2" maxRequestLength="1048576" />
<pages buffer="true" enableViewState="false" />
</system.web>
<system.webServer>
@@ -35,6 +35,11 @@
<clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="365.00:00:00" cacheControlCustom="public" />
</staticContent>
<urlCompression doDynamicCompression="true" doStaticCompression="true" dynamicCompressionBeforeCache="true" />
<security>
<requestFiltering>
<requestLimits maxAllowedContentLength="1073741824" />
</requestFiltering>
</security>
</system.webServer>
<runtime>
<assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">

Loading…
Cancel
Save