diff --git a/css/main.css b/css/main.css
index da739f8..2808bab 100644
--- a/css/main.css
+++ b/css/main.css
@@ -767,18 +767,36 @@ select option:disabled {
transition: all 0.2s;
}
+.save-button {
+ display:inline-block;
+ padding-left: 10px;
+ color:#FFFFFF;
+}
+
+.save-button a {
+ color: inherit;
+}
+
+.save-button:hover {
+ color: blue;
+}
+
.packet-button:hover{
color:lightblue;
border-color:blue;
}
-.sk-cube-grid {
- width: 60px;
- height: 60px;
+.progress-block {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
+ font-size: smaller;
+}
+
+.sk-cube-grid {
+ width: 60px;
+ height: 60px;
}
.sk-cube-grid .sk-cube {
diff --git a/index.html b/index.html
index 301b7bc..9c2fde4 100644
--- a/index.html
+++ b/index.html
@@ -101,6 +101,9 @@
+
diff --git a/js/helpers.js b/js/helpers.js
index f443b52..6def092 100644
--- a/js/helpers.js
+++ b/js/helpers.js
@@ -3,7 +3,9 @@
* @param {array} array
*/
export function shuffleArray(array) {
- var currentIndex = array.length, temporaryValue, randomIndex;
+ var currentIndex = array.length,
+ temporaryValue,
+ randomIndex;
// While there remain elements to shuffle...
while (0 !== currentIndex) {
// Pick a remaining element...
@@ -26,3 +28,15 @@ export function urltoFile(url, filename, mimeType) {
return new File([buf], filename, { type: mimeType });
});
}
+
+export function formatBytes(bytes, decimals = 2) {
+ if (bytes === 0) return "0 Bytes";
+
+ const k = 1024;
+ const dm = decimals < 0 ? 0 : decimals;
+ const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+
+ const i = Math.floor(Math.log(bytes) / Math.log(k));
+
+ return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+}
diff --git a/js/main.js b/js/main.js
index 191bee0..3fba18a 100644
--- a/js/main.js
+++ b/js/main.js
@@ -55,9 +55,19 @@ function loadPacketList(data) {
window.packet_list = data.packets;
window.packet_list.forEach(function (packet) {
$("#packet-list").append(
- $("" + packet + "
").click(function () {
- loadPacketFromAjax("packets/" + packet);
- })
+ $("")
+ .text(packet)
+ .click(function () {
+ loadPacketFromAjax("packets/" + packet);
+ })
+ .append(
+ $(
+ ``
+ ).click(function () {
+ console.log("packets/" + packet);
+ event.stopPropagation();
+ })
+ )
);
});
$("#options-panel").show();
@@ -69,11 +79,28 @@ function loadPacketList(data) {
*/
function loadPacketFromAjax(path) {
console.log("loading packet from " + path);
- $.getJSON(path, function (data) {
- setUpPacket(data);
- $("#options-panel").hide();
+ // $.getJSON(path, function (data) {
+ // setUpPacket(data);
+ // $("#options-panel").hide();
+ // })
+ $.ajax({
+ dataType: "json",
+ url: path,
+ progress: function (e) {
+ if (e.lengthComputable) {
+ var completedPercentage = Math.round((e.loaded * 100) / e.total);
+ console.log(completedPercentage);
+
+ $("#progress").html(
+ `${completedPercentage}%
${helper.formatBytes(e.total)}`
+ );
+ }
+ },
})
- .done(function () {})
+ .done(function (data) {
+ setUpPacket(data);
+ $("#options-panel").hide();
+ })
.fail(function () {
console.log("Unable to load packet at: " + path);
});
@@ -1643,7 +1670,9 @@ $("#btn-delete-databases").click(function (evt) {
.then(() => {
$.notify("Database successfully deleted", "success");
$.notify("The page will now reload", "warn");
- setTimeout(() => {location.reload();}, 2000);
+ setTimeout(() => {
+ location.reload();
+ }, 2000);
console.log("Database successfully deleted");
})
.catch((err) => {
@@ -1658,19 +1687,23 @@ $("#btn-delete-databases").click(function (evt) {
});
$("#btn-delete-current").click(function (evt) {
-db.answers
- .where("qid").anyOf(window.question_order)
+ db.answers
+ .where("qid")
+ .anyOf(window.question_order)
.delete()
.then(function (deleteCount) {
- $.notify("Packet successfully reset", "success");
- $.notify("The page will now reload", "warn");
- setTimeout(() => {location.reload();}, 2000);
- console.log( "Deleted " + deleteCount + " objects");
- }).catch((err) => {
- $.notify("Error reseting packet", "error");
- console.error("Could not answers");
- });
-
+ $.notify("Packet successfully reset", "success");
+ $.notify("The page will now reload", "warn");
+ setTimeout(() => {
+ location.reload();
+ }, 2000);
+ console.log("Deleted " + deleteCount + " objects");
+ })
+ .catch((err) => {
+ $.notify("Error reseting packet", "error");
+ $.notify("You may have to delete all answers this time", "info");
+ console.error("Could not answers");
+ });
});
$(document).ajaxStart(function () {
diff --git a/lib/jq-ajax-progress.min.js b/lib/jq-ajax-progress.min.js
new file mode 100644
index 0000000..af77526
--- /dev/null
+++ b/lib/jq-ajax-progress.min.js
@@ -0,0 +1 @@
+!function(e){"function"==typeof define&&define.amd?define(["jquery"],e):"object"==typeof exports?module.exports=e(require("jquery")):e(jQuery)}(function(e){var t=e.ajax.bind(e);e.ajax=function(n,r){"object"==typeof n&&(r=n,n=void 0);var o=(r=r||{chunking:!1}).xhr?r.xhr():e.ajaxSettings.xhr(),s=r.chunking||e.ajaxSettings.chunking;return r.xhr=function(){if("function"==typeof r.uploadProgress){if(!o.upload)return;o.upload.onprogress=null,o.upload.addEventListener("progress",function(e){r.uploadProgress.call(this,e)},!1)}if("function"==typeof r.progress){var e=0;o.addEventListener("progress",function(t){var n=[t],o="";this.readyState===XMLHttpRequest.LOADING&&s&&(o=this.responseText.substr(e),e=this.responseText.length,n.push(o)),r.progress.apply(this,n)},!1)}return o},t(n,r)}});
\ No newline at end of file