From 580887dfba771bbfa99b7b8f13a8943c6dafc5a7 Mon Sep 17 00:00:00 2001 From: Arun Persaud Date: Sat, 17 Nov 2012 12:06:08 -0800 Subject: added information when displaying a single picture * description, if available * time * tags (clickable) --- getjson.php | 9 ++++++++- js/photo-tags.js | 47 +++++++++++++++++++++++++++++++++++------------ 2 files changed, 43 insertions(+), 13 deletions(-) diff --git a/getjson.php b/getjson.php index 432b324..63daf0b 100644 --- a/getjson.php +++ b/getjson.php @@ -67,9 +67,16 @@ if (isset($_REQUEST["S"])) else if (isset($_REQUEST["ID"]) && !isset($_REQUEST["C"])) { $id = intval($_REQUEST["ID"]); - $result = $DB->query("SELECT base_uri, filename, id FROM photos". + $result = $DB->query("SELECT base_uri, filename, id, description, time FROM photos". " WHERE id=$id"); } + else if (isset($_REQUEST["IDT"])) + { /* tags of a single image */ + $id = intval($_REQUEST["IDT"]); + $result = $DB->query("SELECT t.name as name FROM photo_tags pt ". + " LEFT JOIN tags t on t.id=pt.tag_id". + " WHERE pt.photo_id=$id"); + } else if (isset($_REQUEST["CLOUD"])) { $result = $DB->query("SELECT t.name as name, count(*) as count FROM photo_tags pt ". diff --git a/js/photo-tags.js b/js/photo-tags.js index 8db5df9..4b8d397 100644 --- a/js/photo-tags.js +++ b/js/photo-tags.js @@ -60,18 +60,41 @@ function load_content() { /* if ID is set, just show one pictures, else create an array of pictures */ if (ID>=0) { - var singlepicspace=pics.selectAll("li").data(picdata, function(d){return ID;}).enter().append("li").append("div").attr("class","singlepic"); - singlepicspace.append("img").attr("class","left").attr("src",webbase+"/icons/left.png"); - singlepicspace.append("img") - .attr("class","large") - .attr("src",function(d) { - s = d.base_uri+'/'+d.filename; - s = s.replace('file:\/\/'+dbprefix,webbase+'/Photos-small/'); - return s; - }); - singlepicspace.append("img").attr("class","right").attr("src",webbase+"/icons/right.png"); - - update_thumbnails(); + var singlepicspace=pics.selectAll("li").data(picdata, function(d){return ID;}). + enter().append("li").append("div").attr("class","singlepic"); + singlepicspace.append("img").attr("class","left").attr("src",webbase+"/icons/left.png"); + singlepicspace.append("img") + .attr("class","large") + .attr("src",function(d) { + s = d.base_uri+'/'+d.filename; + s = s.replace('file:\/\/'+dbprefix,webbase+'/Photos-small/'); + return s; + }); + singlepicspace.append("img").attr("class","right").attr("src",webbase+"/icons/right.png"); + /* show description and time of photo */ + singlepicspace.append("p") + .text(function(d) { + var date = new Date(d.time*1000); + if (d.description=="") + return "Time: "+date.toUTCString(); + else + return "Description: "+d.description + "Time: "+date.toUTCString(); + }); + /* show tags */ + tags=""; + d3.json(webbase+"/getjson.php?IDT="+ID, function(jsontag) { + singlepicspace.append("p").selectAll("span").data(jsontag) + .enter().append("span") + .attr("class","btn btn-small") + .text( function(t) { + return t.name; + }) + .on("mouseover", function(d){ d3.select(this).classed("btn-danger",true)}) + .on("mouseout", function(d){ d3.select(this).classed("btn-danger",false)}) + .on("click", function(d) { document.location.href=webbase+'/tag/'+d.name}); + }); + + update_thumbnails(); } else { -- cgit v1.2.3-18-g5258