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 { .jspaint-dialogue-window .jspaint-window-content > form > .jspaint-button-group {
flex-flow: row; flex-flow: row;
justify-content: flex-end;
} }
.jspaint-dialogue-window .jspaint-window-content > form > div:first-child { .jspaint-dialogue-window .jspaint-window-content > form > div:first-child {
padding: 5px; padding: 5px;
@ -291,9 +292,16 @@ html, body, .jspaint {
overflow: auto; overflow: auto;
display: block; display: block;
} }
.storage-manager img { .storage-manager a > img {
max-width: 60px; max-width: 100px;
max-height: 60px; max-height: 100px;
vertical-align: middle;
margin: 5px;
}
.storage-manager a > span,
.storage-manager a > img,
.storage-manager p {
margin: 5px;
} }
::before, ::after { ::before, ::after {

30
src/manage-storage.js
View File

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