Skip to content

C
cribjs-editor
Commit 710afd9b authored by Cédric Le Ninivin's avatar Cédric Le Ninivin
Browse files
Options

Export/Import: Improve and fix 

* Fix import Torrent to get a readable blob
* Add meaningful placeholders
* Add meaningful labels
* Add In-page notification
* Fix Import Path processing
parent 3acafb15
Hide whitespace changes
Inline Side-by-side
Showing with 130 additions and 52 deletions
gadget/gadget_cribjs_page_save_load.html
View file @ 710afd9b
......@@ -19,12 +19,15 @@
</head>
<body>
<div class="nav_content save_load container">
<h3>Storage</h3>
<form class="crib-save-to-zip form-inline">
<h3>Export to Zip</h3>
<h3>Download Zip</h3>
<div class="info crib-save-to-zip-status" style="display:none; background-color: #dff0d8;"></div>
<div class="form-group">
<label>Export to zip:
<input class="save-zip-path form-control" name="save-zip-path" type="text" size="30" value=""></label>
<label>Path to Export:
<input class="save-zip-path form-control"
name="save-zip-path"
type="text" size="30" value=""
placeholder="Leave Empty to Export everything"></label>
</div>
<div class="form-group">
<label> to:
......@@ -32,24 +35,33 @@
</div>
<button name="save-zip-contents" type="submit" class="btn btn-default">Export to Zip</button>
</form>
<div><span class="info crib-save-to-zip-status"></span></div>
<form class="crib-load-from-zip form-inline">
<h3>Import from zip</h3>
<h3>Import from Zip</h3>
<div class="info crib-load-from-zip-status" style="display:none; background-color: #dff0d8;"></div>
<div class="form-group">
<label>Import from zip:
<label>Zip File:
<input name="load-zip-file" class="load-zip-file form-control" type="file" size="30"></label>
</div>
<div class="form-group">
<label> to path:
<input name="load-zip-path" class="load-zip-path form-control" type="text" size="30" value="cribeditor/v1.1">
<label> Path to import to:
<input name="load-zip-path"
class="load-zip-path form-control"
type="text" size="30"
placeholder="Leave Empty to Replace Existing Content">
</label>
</div>
<button name="load-zip-contents" class="load-zip-contents btn btn-default" type="submit">Import from zip</button>
</form>
<div><span class="crib-load-from-zip-status"></span></div>
<h3>Share as Torrent</h3>
<h3>Share as Torrent</h3>
<div class="crib-export-to-zip-torrent-status"
style="display:none; background-color: #dff0d8;"></div>
<form class="crib-export-torrent form-inline">
<div class="form-group">
<label>Path to Export:
<input class="torrent-save-zip-path form-control"
name="torrent-save-zip-path"
type="text" size="30" value=""
placeholder="Leave Empty to Export everything"></label>
<button name="submit-crib-export-torrent" class="export-torrent btn btn-default" type="submit">Export Torrent</button>
</div>
</form>
......@@ -60,12 +72,20 @@
<textarea name="load-zip-path" class="magnet-link form-control" readonly value="cribeditor/v1.1">Data</textarea>
</div>
<form class="crib-import-torrent form-inline">
<h3>Import from zip Torrent</h3>
<div class="log" style="display:none;">
</div>
<h3>Import from Torrent</h3>
<div class="crib-load-from-zip-torrent-status"
style="display:none; background-color: #dff0d8;"></div>
<div class="form-group">
<label>Magnet:
<input name="zip-magnet" class="zip-magnet form-control" type="text" size="40"></label>
<input name="zip-magnet" class="zip-magnet form-control" type="text" size="50"></label>
</div>
<div class="form-group">
<label> Path to import to:
<input name="torrent-load-zip-path"
class="torrent-load-zip-path form-control"
type="text" size="30"
placeholder="Leave Empty to Replace Existing Content">
</label>
</div>
<button name="load-zip-magnet" class="load-zip-magnet btn btn-default" type="submit">Import from Torrent</button>
</form>
......
gadget/gadget_cribjs_page_save_load.js
View file @ 710afd9b
......@@ -12,10 +12,10 @@
return "." + extension;
}
function log(gadget, str) {
function log(gadget, str, klass) {
var p = document.createElement('p'),
old_p_element = gadget.props.element.querySelector('.log p'),
log_element = gadget.props.element.querySelector('.log');
old_p_element = gadget.props.element.querySelector(klass + ' p'),
log_element = gadget.props.element.querySelector(klass);
if (old_p_element) {
old_p_element.remove();
}
......@@ -24,26 +24,48 @@
log_element.appendChild(p);
}
function logExportZipFile(gadget, str) {
return log(gadget, str, ".crib-save-to-zip-status");
}
function logImportZipFile(gadget, str) {
return log(gadget, str, ".crib-load-from-zip-status");
}
function logExportZipTorrent(gadget, str) {
return log(gadget, str, ".crib-export-to-zip-torrent-status");
}
function logImportZipTorrent(gadget, str) {
return log(gadget, str, ".crib-load-from-zip-torrent-status");
}
function downloadTorrent(gadget, torrentId) {
logImportZipTorrent(gadget, "Preparing");
return RSVP.Promise(function (resolve, reject) {
var client = new WebTorrent();
client.on('error', function (err) {
reject(err.message);
});
client.add(torrentId, function (torrent) {
log(gadget, 'Got torrent metadata!');
log(gadget,
logImportZipTorrent(gadget, 'Got torrent metadata!');
logImportZipTorrent(gadget,
'Torrent info hash: ' + torrent.infoHash + ' ' +
'<a href="' + torrent.magnetURI + '" target="_blank">[Magnet URI]</a> ' +
'<a href="' + torrent.torrentFileBlobURL + '" target="_blank" download="' + torrent.name + '.torrent">[Download .torrent]</a>'
);
// Torrents can contain many files. Here we suppose there is only one zip
var interval = setInterval(function () {
log(gadget, 'Progress: ' + (torrent.progress * 100).toFixed(1) + '%');
logImportZipTorrent(gadget, 'Progress: ' + (torrent.progress * 100).toFixed(1) + '%');
}, 5000);
torrent.files[0].getBlob(function (error, result) {
if (error) {
reject(error);
}
resolve(result);
});
torrent.on('done', function () {
log(gadget, "Done");
resolve(torrent.files);
logImportZipTorrent(gadget, "100%");
clearInterval(interval);
});
......@@ -53,8 +75,8 @@
}
// Zip Methods
function prepareZip(gadget, event, options) {
var path_to_save, path_to_save_length, crib_sw_gadget,
function prepareZip(gadget, event, options, path_to_save, logFunction) {
var path_to_save_length, crib_sw_gadget,
jio_gadget, url_list = [], final_url_list = [], saved_number = 0, zip;
if (options === undefined) {
options = {};
......@@ -62,8 +84,8 @@
if (options.type === undefined) {
options.type = "blob";
}
path_to_save = gadget.props.element.querySelector('form.crib-save-to-zip .save-zip-path').value;
path_to_save_length = path_to_save.length;
logFunction(gadget, "Preparing");
return new RSVP.Queue()
.push(function () {
return RSVP.all([
......@@ -95,6 +117,7 @@
final_url_list.push(url);
}
}
logFunction(gadget, "Retrieving " + saved_number + " Files");
return RSVP.all(promise_list);
})
.push(function (response_list) {
......@@ -118,27 +141,47 @@
}
zip.file(url, response);
}
logFunction(gadget, "Preparing Zip");
return zip.generateAsync({type: options.type});
});
}
function formatSizeUnits(bytes) {
if (bytes >= 1073741824) { bytes = (bytes / 1073741824).toFixed(2) + " GB"; }
else if (bytes >= 1048576) { bytes = (bytes / 1048576).toFixed(2) + " MB"; }
else if (bytes >= 1024) { bytes = (bytes / 1024).toFixed(2) + " KB"; }
else if (bytes > 1) { bytes = bytes + " bytes"; }
else if (bytes == 1) { bytes = bytes + " byte"; }
else { bytes = "0 bytes"; }
return bytes;
}
function saveContentToZIP(gadget, event) {
return prepareZip(gadget, event)
var path_to_save = gadget.props.element
.querySelector('form.crib-save-to-zip .save-zip-path').value;
return prepareZip(gadget, event, {}, path_to_save, logExportZipFile)
.push(function (content) {
var application_id = gadget.props.element
.querySelector('form.crib-save-to-zip .save-zip-id').value;
logExportZipFile(
gadget,
"Saved a " + formatSizeUnits(content.size) + " zip file at " + Date()
);
return saveAs(content, application_id);
})
.push(function () {
gadget.props.element.querySelector(".crib-save-to-zip-status")
.textContent = "Saved " + "X" + " files at " + Date();
})
.push(console.log, console.log);
}
function seedZip(gadget, event) {
return prepareZip(gadget, event)
var path_to_save = gadget.props.element
.querySelector('form.crib-export-torrent .torrent-save-zip-path')
.value;
return prepareZip(gadget, event, {}, path_to_save, logExportZipTorrent)
.push(function (result) {
logExportZipTorrent(
gadget,
"Sharing a " + formatSizeUnits(result.size) + " zip file at " + Date()
);
gadget.client = new WebTorrent();
gadget.client.seed(new File([result], "data.zip"), function (torrent) {
gadget.props.element.querySelector("div.magnet-link").style.display = "";
......@@ -146,41 +189,51 @@
.querySelector("textarea.magnet-link").textContent = torrent.magnetURI;
console.log('Client is seeding ' + torrent.magnetURI);
});
})
.push(console.log, console.log);
});
}
function loadContentFromZIPFile(gadget, event) {
var file_list, file;
var file_list, file, path_to_load;
file_list = gadget.props.element.querySelector('form.crib-load-from-zip .load-zip-file').files;
path_to_load = gadget.props.element
.querySelector('form.crib-load-from-zip .load-zip-path').value;
if (file_list.length === 0) {
gadget.props.element.querySelector(".crib-load-from-zip-status")
.textContent = "Please put a Zip at " + Date();
logImportZipFile(gadget, "Please put a Zip at " + Date());
return;
}
file = file_list[0];
return loadContentFromZIP(gadget, event, file);
return loadContentFromZIP(
gadget, event, file, path_to_load, logImportZipFile
);
}
function loadContentFromZIPMagnet(gadget, event) {
var magnet;
var magnet, path_to_load;
magnet = gadget.props.element.querySelector('form.crib-import-torrent .zip-magnet').value;
path_to_load = gadget.props.element
.querySelector('form.crib-import-torrent .torrent-load-zip-path').value;
return RSVP.Queue()
.push(function () {
return downloadTorrent(gadget, magnet);
})
.push(function (files) {
return loadContentFromZIP(gadget, event, files[0]);
});
.push(function (result) {
return loadContentFromZIP(
gadget, event, result, path_to_load, logImportZipTorrent
);
})
.push(console.log, console.log);
}
function loadContentFromZIP(gadget, event, zip_data) {
var path_to_load, path_to_load_length, file_list, crib_sw_gadget,
function loadContentFromZIP(gadget, event, zip_data,
path_to_load, logFunction) {
var path_to_load_length, file_list, crib_sw_gadget,
jio_gadget, url_list = [], file, url_number = 0;
path_to_load = gadget.props.element.querySelector('form.crib-load-from-zip .load-zip-path').value;
path_to_load_length = path_to_load.length;
return new RSVP.Queue()
.push(function () {
return logFunction(gadget, "Loading Zip");
})
.push(function () {
return JSZip.loadAsync(zip_data);
})
......@@ -188,17 +241,19 @@
var promise_list = [];
zip.forEach(function (relativePath, zipEntry) {
var end_url;
url_number += 1;
if (zipEntry.dir) {
return;
}
if (!relativePath.startsWith("/") && !path_to_load.endsWith("/")) {
if (path_to_load && !relativePath.startsWith("/") &&
!path_to_load.endsWith("/")) {
end_url = path_to_load + "/" + relativePath;
} else if (relativePath.startsWith("/") && path_to_load.endsWith("/")) {
} else if (relativePath.startsWith("/") &&
(path_to_load.endsWith("/") || path_to_load === "")) {
end_url = path_to_load + relativePath.substring(1);
} else {
end_url = path_to_load + relativePath;
}
url_number += 1;
promise_list.push(
new RSVP.Queue()
.push(function () {
......@@ -219,14 +274,17 @@
})
);
});
logFunction(
gadget,
"Pushing " + url_number + " files in Crib at " + Date()
);
return RSVP.all(promise_list);
})
.push(function () {
gadget.props.element.querySelector(".crib-load-from-zip-status")
.textContent = "Loaded " + url_number + " files at " + Date();
})
.push(console.log, console.log);
logFunction(gadget, "Loaded " + url_number + " files at " + Date());
});
}
rJS(window)
.ready(function (g) {
g.props = {};
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7