X-Git-Url: https://git.nubati.net/cgi-bin/gitweb.cgi?p=photo-tags.git;a=blobdiff_plain;f=js%2Fphoto-tags.js;h=238575d12cf17611c3919afbbead29dc414789e0;hp=71dadd41c8150fdf4ca97f316651aebbac16180d;hb=68246bb37ea3eaba59e3fb6af80d541bfd345f38;hpb=801ba916b5b5680e10c3b63978034058f7fed840 diff --git a/js/photo-tags.js b/js/photo-tags.js index 71dadd4..238575d 100644 --- a/js/photo-tags.js +++ b/js/photo-tags.js @@ -15,22 +15,32 @@ function init() d3.select('form').attr("action",webbase+"/tag/"+document.getElementById('MyTagsInput').value.replace(" ","+")); }); + d3.select("#currenttags").select("a").remove(); if (T!="") { var mycurrenttags = T.split(","); - d3.select("#currenttags").select("button").remove(); - d3.select("#currenttags").selectAll("button") + d3.select("#currenttags").selectAll("a") .data(mycurrenttags).enter() - .append("button").attr("type","button").text( function(d) {return d;} ); - } - else - { - d3.select("#currenttags").select("button").remove(); - d3.select("#currenttags").append("span").text( ' none'); + .append("a").attr("class","btn btn-small").text( function(d) {return d;} ) + .on("mouseover", function(d){ d3.select(this).classed("btn-danger",true)}) + .on("mouseout", function(d){ d3.select(this).classed("btn-danger",false)}) + .attr("href", function(d) { return removeTag(T.split(","),d) }); }; } +function removeTag(alltags,removetag) +{ + /* return a link to a page with 'removetag' removed from the array of tags*/ + var index = alltags.indexOf(removetag); + alltags.splice(index, 1); + if (alltags.length) + return webbase+'/tag/'+alltags.join(","); + else + return webbase; +} + + function load_content() { // d3.select(".debug").text("T,P,N = *"+T+"* *"+page+"* *"+N+"*"); @@ -50,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("div").attr("class","left").append("img").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("div").attr("class","right").append("img").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-success",true)}) + .on("mouseout", function(d){ d3.select(this).classed("btn-success",false)}) + .on("click", function(d) { document.location.href=webbase+'/tag/'+d.name}); + }); + + update_thumbnails(); } else { @@ -110,16 +143,9 @@ function next_page() { update_page_index(); } -function prev_pic() { -} - -function next_pic() { -} - function load_pic(myid) { ID=myid; update_page_index(); - update_thumbnails(); load_content(); } @@ -135,11 +161,11 @@ function tagcloud() { /* update pics */ d3.json(url, function(json) { svgelement.selectAll("text").data(json).enter().append("text") - .style("font-size", function(d){return (Math.log(d.count+1)/2.0)+"em"}) + .style("font-size", function(d){return (Math.log(d.count+1)/3.0+0.5)+"em"}) .text(function(d) { return d.name+" "; }) - .on("mouseover", function(d){ d3.select(this).style("color","red")} ) - .on("mouseout", function(d){ d3.select(this).style("color","white")} ) - .on("click", function(d) { document.location.href=webbase+'/tag/'+d.name }) + .on("mouseover", function(d){ d3.select(this).style("color","red") }) + .on("mouseout", function(d){ d3.select(this).style("color","black")}) + .on("click", function(d) { document.location.href=webbase+'/tag/'+d.name}); }); } @@ -166,6 +192,8 @@ function update_thumbnails(){ var thumbs= d3.select(".nextprev").select("ul").selectAll("li").data(json2, function(d) {return d.id;}); + thumbs.exit().select("img").transition().duration(1000).style("height","0px").transition().duration(1050).remove(); + thumbs.exit().transition().duration(1050).remove(); thumbs.enter().append("li") .append("a") .on("click", function(d) { @@ -177,26 +205,29 @@ function update_thumbnails(){ s = s.replace('file:\/\/'+dbprefix,webbase+'/Photos-tiny/'); return s; }) - .style("height","0") - .transition().duration(1000) + .style("height","0px") + .transition().duration(500) .style("height","100px"); - thumbs.exit().select("img").transition().duration(1000).style("height","0"); - thumbs.exit().transition().duration(1050).remove(); - /* resort elements */ d3.select(".nextprev").select("ul").selectAll("li").sort(function(a,b){return a.id-b.id;}); - d3.select(".nextprev").select("ul").selectAll("li").select("a").select("img").classed("current",false); - d3.select(".nextprev").select("ul").selectAll("li").select("a").select("img").classed("current",function(d){return (d.id==IDcurr);}); + d3.select(".nextprev").select("ul").selectAll("li").select("a").select("img") + .classed("current",function(d){return (d.id==IDcurr);}); /* add links for left/right arrows */ if (IDprev != -1 ) - d3.select(".left").on("click", function() { load_pic(IDprev); }); + d3.select(".left" ).on("click", function() { load_pic(IDprev); }); if (IDnext != -1 ) - d3.select(".right").on("click", function() { load_pic(IDnext); }); - - }); + d3.select(".right").on("click", function() { load_pic(IDnext); }); + + /* keyboard shortcuts */ + $(document) + .keydown( function (e) { + if(e.which == 37 && IDprev != -1) { $(document).unbind('keydown'); load_pic(IDprev); } + if(e.which == 39 && IDnext != -1) { $(document).unbind('keydown'); load_pic(IDnext); } + }); + }); } function checkbutton() @@ -259,7 +290,13 @@ function update_page_index() mydata.push('{ page:'+(n+1)+', name:"'+(n+1)+'"}'); mydata.push('{ page:'+(n+2.1)+', name:"Next"}'); - }; + } + else + { + mydata.push('{ page:0.1, name:"Prev"}'); + mydata.push('{ page:1.1, name:"Next"}'); + } + mydata = "["+mydata.join(",")+"]"; mydata = eval('(' + mydata + ')');