I just applied the latest thing I’ve been working on for urPics, which adds on to the feature I worked on last night. Last night I added a list of owners to the bottom of the page, but it was a static and boring list. Now, when you click an owners name, their photos become highlighted so you can see who owns which photos. This is but another step forward towards my final goal of much, much more customization over what photos to download. I must add that right now clicking on names DOES NOT change what photos are downloaded. I have some ideas as to how I’m going to implement customizing this, I just need to think them through and figure out what would be the best way to do so first.
If you were wondering how I was able to do this, heres a quick run through (note: this requires scriptaculous):
The PHP
$owners = getOwnerList();
if(is_array($owners))
{
echo "<p>";
for($i=0; $i<count($owners); $i++)
{
if(!$i==0){ echo ", "; }
echo "<a href="javascript:highlightUserPics('".$owners[$i]['uid']."')">";
echo $owners[$i]['name'];
echo "</a>";
}
echo "</p>";
}
else
{
echo "<p>No Owners</p>";
}
The Javascript
function highlightUserPics(owner)
{
if(lastOwner!=null)
{
var lastOwner_classes = document.getElementsByClassName(lastOwner);
for(n=0;n<lastOwner_classes.length;n++)
{
lastOwner_classes[n].style.border = 'none';
}
}
var owner_classes = document.getElementsByClassName(owner);
for(i=0;i<owner_classes.length;i++)
{
if(lastOwner == owner)
{
owner_classes[i].style.border = 'none';
}
else
{
owner_classes[i].style.border = '4px #516fa6 solid';
}
}
if(lastOwner==owner){lastOwner=0;}
else{lastOwner = owner;}
}
Leave a Reply