radex
/
jspaint
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve storage manager

main
Isaiah Odhner 2016-11-03 02:02:05 +00:00
parent d17481f211
commit 92a719e984
2 changed files with 29 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
layout.css
View File

@ -251,6 +251,7 @@ html, body, .jspaint {
}
.jspaint-dialogue-window .jspaint-window-content > form > .jspaint-button-group {
flex-flow: row;
justify-content: flex-end;
}
.jspaint-dialogue-window .jspaint-window-content > form > div:first-child {
padding: 5px;
@ -291,10 +292,17 @@ html, body, .jspaint {
overflow: auto;
display: block;
}
.storage-manager img {
max-width: 60px;
max-height: 60px;
.storage-manager a > img {
max-width: 100px;
max-height: 100px;
vertical-align: middle;
margin: 5px;
}
.storage-manager a > span,
.storage-manager a > img,
.storage-manager p {
margin: 5px;
}
::before, ::after {
pointer-events: none;

30
src/manage-storage.js
View File

@ -38,37 +38,43 @@ function manage_storage(){
if($storage_manager){
$storage_manager.close();
}
$storage_manager = $Window().title("Manage Storage").addClass("storage-manager");
$storage_manager = $FormWindow().title("Manage Storage").addClass("storage-manager jspaint-dialogue-window");
// @TODO: remove all button (with confirmation)
// @TODO: move this text to the bottom?
$storage_manager.$content.html(
"<p>Any images you've saved to your computer with <b>File > Save</b> will not be affected.</p>"
var $table = $(E("table")).appendTo($storage_manager.$main);
var $message = $(E("p")).appendTo($storage_manager.$main).html(
"Any images you've saved to your computer with <b>File > Save</b> will not be affected."
);
var $table = $(E("table")).appendTo($storage_manager.$content);
$storage_manager.$Button("Close", function(){
$storage_manager.close();
});
var addRowFor = function(k, imgSrc){
var addRow = function(k, imgSrc){
var $tr = $(E("tr")).appendTo($table);
var $img = $(E("img")).attr({src: imgSrc});
var $remove = $(E("button")).addClass("jspaint-button jspaint-dialogue-button").text("Remove");
var $a = $(E("a")).attr({href: "#" + k.replace("image#", "local:"), target: "__blank"}).text(k.replace("image#", "local:"));
$(E("td")).append($a).appendTo($tr);
$(E("td")).append($img).appendTo($tr);
var href = "#" + k.replace("image#", "local:");
var $link = $(E("a")).attr({href: href, target: "__blank"});
$link.append($img);
$link.append($(E("span")).text("View"));
$(E("td")).append($link).appendTo($tr);
$(E("td")).append($remove).appendTo($tr);
$remove.click(function(){
localStorage.removeItem(k);
$tr.remove();
if($table.find("tr").length == 0){
$message.html("<p>All cleaned up!</p>");
}
});
};
for(var k in localStorage){
if(k.match(/^image#/)){
var v = localStorage[k];
addRowFor(k, v[0] === '"' ? JSON.parse(v) : v);
addRow(k, v[0] === '"' ? JSON.parse(v) : v);
}
}
$storage_manager.width(500);
$storage_manager.width(450);
$storage_manager.center();
}