GRMrGecko
/
ImageDatabase
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Changed the way you can change the title of the image database form "Image Database" to anything else. Changed the way tags are handled in editing mode. Added delete button to Tagless Images mode. Added support for browser state which makes it easy to share the state you are in with others by copying the current URL shown in the browser.

master
GRMrGecko 11 years ago
parent
a3be9ae994
commit
fc7c34eb4c
5 changed files with 159 additions and 17 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 27
      code/hash.php
  2. 88
      code/index.php
  3. 58
      code/tagless.php
  4. 2
      header.php
  5. 1
      index.php

27
code/hash.php
View File

@ -151,14 +151,16 @@ function loadImage(image) {
$("#imageViewer_sidebar .basic_info").append("File Size: "+bytesToSize(image.attr("file_size"))+"<br />");
$("#imageViewer_sidebar .tags").html("");
<?if (isset($_MGM['user'])) {?>
$("#imageViewer_sidebar .tags_edit").val(image.attr("tags"));
<?}?>
var tagsEdit = "";
var tags = image.attr("tags").split(" ");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/_/g, " ");
$("#imageViewer_sidebar .tags").append(tag+"<br />");
tagsEdit += tag+"\n";
}
<?if (isset($_MGM['user'])) {?>
$("#imageViewer_sidebar .tags_edit").val(tagsEdit);
<?}?>
<?if (isset($_MGM['user']) && $_MGM['user']['level']>=4) {?>
if (image.attr("user")=="<?=$_MGM['user']['docid']?>") {
@ -189,14 +191,27 @@ $(document).ready(function() {
$("#imageViewer_sidebar .tags").removeClass("hide");
$("#imageViewer_sidebar .tags_edit").addClass("hide");
var tagsToSave = "";
var tags = $("#imageViewer_sidebar .tags_edit").val().split("\n");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/\s/g, "_");
if (tag=="") {
continue;
}
if (tagsToSave!="") {
tagsToSave += " ";
}
tagsToSave += tag;
}
$("#imageViewer_sidebar .tags").html("");
var tags = $("#imageViewer_sidebar .tags_edit").val().split(" ");
var tags = tagsToSave.split(" ");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/_/g, " ");
$("#imageViewer_sidebar .tags").append(tag+"<br />");
}
$("#imageViewer_apiloader").load("<?=generateURL("api/save_tags")?>/", {hash: imageViewing, tags: $("#imageViewer_sidebar .tags_edit").val()});
$("#imageViewer_apiloader").load("<?=generateURL("api/save_tags")?>/", {hash: imageViewing, tags: tagsToSave});
}
});
<?}?>

88
code/index.php
View File

@ -136,6 +136,7 @@ var filter = "";
var readyToLoad = false;
var loadingPage = false;
var currentPage = 0;
var currentState = 0;
function loadPage(page) {
if (loadingPage) {
@ -224,7 +225,7 @@ function bytesToSize(bytes) {
return (Math.round(size*100)/100)+" "+type;
}
function loadImage(image, animate) {
function loadImage(image, animate, urlHistory) {
if (animate==0) {
$("#backdrop").css("opacity", 0);
$("#backdrop").removeClass("hide");
@ -247,14 +248,16 @@ function loadImage(image, animate) {
$("#imageViewer_sidebar .basic_info").append("File Size: "+bytesToSize(image.attr("file_size"))+"<br />");
$("#imageViewer_sidebar .tags").html("");
<?if (isset($_MGM['user'])) {?>
$("#imageViewer_sidebar .tags_edit").val(image.attr("tags"));
<?}?>
var tagsEdit = "";
var tags = image.attr("tags").split(" ");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/_/g, " ");
$("#imageViewer_sidebar .tags").append(tag+"<br />");
tagsEdit += tag+"\n";
}
<?if (isset($_MGM['user'])) {?>
$("#imageViewer_sidebar .tags_edit").val(tagsEdit);
<?}?>
<?if (isset($_MGM['user']) && $_MGM['user']['level']>=4) {?>
if (image.attr("user")=="<?=$_MGM['user']['docid']?>") {
@ -274,6 +277,10 @@ function loadImage(image, animate) {
} else {
$("#imageViewer_nextButton").attr("disabled","disabled");
}
if (urlHistory==undefined) {
window.history.pushState({image: imageViewing, state: currentState}, "<?=$_MGM['title']?>", "<?=$_MGM['installPath']?>hash/"+image.attr("hash")+"/");
}
currentState = 2;
}
$(document).ready(function() {
@ -286,7 +293,7 @@ $(document).ready(function() {
$("#imageViewer_nextButton").click(function() {
repositionImage(3);
});
function closeImageViewer() {
function closeImageViewer(urlHistory) {
$("#backdrop").animate({opacity: 0}, {duration: 400, complete: function() {
$("#backdrop").addClass("hide");
}});
@ -302,6 +309,15 @@ $(document).ready(function() {
<?}?>
repositionImage(2);
if (urlHistory==undefined) {
if (filter!="") {
window.history.pushState({state: currentState}, "<?=$_MGM['title']?>", "<?=$_MGM['installPath']?>?filter="+encodeURIComponent(filter));
} else {
window.history.pushState({state: currentState}, "<?=$_MGM['title']?>", "<?=$_MGM['installPath']?>");
}
}
currentState = 2;
}
$("#backdrop, #imageViewer_close").click(closeImageViewer);
$(window).resize(function() {
@ -320,15 +336,28 @@ $(document).ready(function() {
$(this).text("Edit Tags");
$("#imageViewer_sidebar .tags").removeClass("hide");
$("#imageViewer_sidebar .tags_edit").addClass("hide");
var tagsToSave = "";
var tags = $("#imageViewer_sidebar .tags_edit").val().split("\n");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/\s/g, "_");
if (tag=="") {
continue;
}
if (tagsToSave!="") {
tagsToSave += " ";
}
tagsToSave += tag;
}
$("#imageViewer_sidebar .tags").html("");
var tags = $("#imageViewer_sidebar .tags_edit").val().split(" ");
var tags = tagsToSave.split(" ");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/_/g, " ");
$("#imageViewer_sidebar .tags").append(tag+"<br />");
}
$("#imageViewer_apiloader").load("<?=generateURL("api/save_tags")?>/", {hash: imageViewing, tags: $("#imageViewer_sidebar .tags_edit").val()});
$("#imageViewer_apiloader").load("<?=generateURL("api/save_tags")?>/", {hash: imageViewing, tags: tagsToSave});
}
});
<?if ($_MGM['user']['level']<=2) {?>
@ -356,9 +385,52 @@ $(document).ready(function() {
}
});
window.onpopstate = function(event) {
if (event.state!=undefined) {
if (event.state.filter!=undefined) {
if (currentState!=2) {
filter = event.state.filter;
$("#filter_field").val(filter);
$("#images_main").html("");
loadPage(0);
} else {
closeImageViewer(true);
}
currentState = event.state.state;
} else if (event.state.image!=undefined) {
var image = $("#images_main .image[hash='"+event.state.image+"']");
if (image.length>0) {
if ($("#backdrop").hasClass("hide")) {
loadImage(image, 0, true);
} else {
loadImage(image, 1, true);
}
} else {
closeImageViewer(true);
}
}
} else {
if (currentState==2) {
closeImageViewer(true);
} else {
filter = "";
$("#filter_field").val(filter);
$("#images_main").html("");
loadPage(0);
}
currentState = 0;
}
};
$("#filter_form").submit(function() {
filter = $("#filter_field").val();
$("#images_main").html("");
if (filter=="") {
window.history.pushState({filter: filter, state: currentState}, "<?=$_MGM['title']?>", "<?=$_MGM['installPath']?>");
} else {
window.history.pushState({filter: filter, state: currentState}, "<?=$_MGM['title']?>", "<?=$_MGM['installPath']?>?filter="+encodeURIComponent(filter));
}
currentState = 1;
loadPage(0);
return false;
});

58
code/tagless.php
View File

@ -60,10 +60,29 @@ require_once("header.php");
</style>
<div id="image_loader" style="display: none;"></div>
<?if (isset($_MGM['user']) && $_MGM['user']['level']<=2) {?>
<div id="imageViewer_confirmDelete" class="modal hide fade" tabindex="-1" role="dialog">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h3>Delete Image</h3>
</div>
<div class="modal-body">
<p>You are about to delete an image from the database.</p>
<p>Are you sure you wish to do this?</p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">No</button>
<button class="btn btn-danger" data-dismiss="modal" id="imageViewer_confirmDelete_yes">Yes</button>
</div>
</div>
<?}?>
<div id="imageViewer_sidebar">
<?if (isset($_MGM['user'])) {?>
<textarea class="tags_edit"></textarea>
<button type="button" class="btn" id="imageViewer_save">Save/Next</button>
<?if ($_MGM['user']['level']<=2) {?>
<br /><br /><button type="button" class="btn btn-danger" id="imageViewer_delete">Delete/Next</button>
<?}?>
<div id="imageViewer_apiloader" style="display: none;"></div>
<?}?>
</div>
@ -113,8 +132,17 @@ function loadImage(image) {
$("#imageViewer_main").html("<a href=\""+image.attr("original")+"\" target=\"blank\"><img src=\""+image.attr("original")+"\" /></a>");
repositionImage();
var tagsEdit = "";
var tags = image.attr("tags").split(" ");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/_/g, " ");
tagsEdit += tag+"\n";
}
<?if (isset($_MGM['user'])) {?>
$("#imageViewer_sidebar .tags_edit").val(tagsEdit);
<?}?>
<?if (isset($_MGM['user'])) {?>
$("#imageViewer_sidebar .tags_edit").val(image.attr("tags"));
$("#imageViewer_sidebar .tags_edit").focus();
<?}?>
}
@ -130,10 +158,36 @@ $(document).ready(function() {
if (imageViewing=="") {
return;
}
$("#imageViewer_apiloader").load("<?=generateURL("api/save_tags")?>/", {hash: imageViewing, tags: $("#imageViewer_sidebar .tags_edit").val()}, function() {
var tagsToSave = "";
var tags = $("#imageViewer_sidebar .tags_edit").val().split("\n");
for (var i=0; i<tags.length; i++) {
var tag = tags[i].replace(/\s/g, "_");
if (tag=="") {
continue;
}
if (tagsToSave!="") {
tagsToSave += " ";
}
tagsToSave += tag;
}
$("#imageViewer_apiloader").load("<?=generateURL("api/save_tags")?>/", {hash: imageViewing, tags: tagsToSave}, function() {
loadNext();
});
});
<?if ($_MGM['user']['level']<=2) {?>
$("#imageViewer_delete").click(function() {
if (imageViewing=="") {
return;
}
$("#imageViewer_confirmDelete").modal();
});
$("#imageViewer_confirmDelete_yes").click(function() {
$("#imageViewer_apiloader").load("<?=generateURL("api/delete")?>/", {hash: imageViewing}, function() {
loadNext();
});
});
<?}?>
<?}?>
loadNext();
});

2
header.php
View File

@ -18,7 +18,7 @@
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Image Database</title>
<title><?=$_MGM['title']?></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

1
index.php
View File

@ -18,6 +18,7 @@ error_reporting(E_ALL & ~E_NOTICE & ~E_WARNING & ~E_STRICT);
$_MGM = array();
$_MGM['version'] = "2";
$_MGM['title'] = "Image Database";
$_MGM['DBType'] = "SQLITE"; // MYSQL, POSTGRESQL, SQLITE.
$_MGM['DBPersistent'] = NO;
$_MGM['DBHost'] = "localhost";

Write Preview
Loading…
Cancel
Save