Select specific tag add-on to JaS
A friend of mine using JaS said that he sometimes had the scenario that he wanted to load all the images but then preload a certain tag, hence initially hiding all the pictures that doesn’t match that criteria. I though it was a simple task so I created an add-on script for those interested.
Since I want to keep the core functionality of JaS as small and lightweight as possible, I wanted to introduce the concept of add-ons to JaS. Basically, you create an external JavaScript file and put your add-on methods in it. To use the add-on I’ve created for JaS, do the following:
Download the JaSSelectCertainTag JavaScript file.
Include it in your web page:
<script type="text/javascript" src="js/JaSSelectCertainTag.js"></script>
Then you just call it like this, with a string parameter for the value you want the tag to have:
JaS.selectCertainTag("Texas Capitol");
If you automatically want to call this when the page has loaded, you just need to add this line to your code:
addEvent(window, "load", function(){JaS.selectCertainTag("Texas Capitol");}, false);
addEvent(window, "load", selectCertainTagWithJaS, false);
var oJaSTimer;
function selectCertainTagWithJaS(){
if(JaS.thumbnailContainer){
clearTimeout(oJaSTimer);
JaS.selectCertainTag("Texas Capitol");
}
else{
oJaSTimer = setTimeout("selectCertainTagWithJaS()", 100);
}
}
The code
If you’re interested in the code or how it should look when you want to create your own add-on, here goes:
JaS.selectCertainTag = function (strValue){
var oCheckBox;
var bNotAllSelected = false;
for(var i=0; i<this.tagsCheckboxes.length; i++){
oCheckBox = this.tagsCheckboxes[i];
oCheckBox.checked = (oCheckBox.value.search(strValue) != -1)? true : false;
if(!bNotAllSelected && !oCheckBox.checked){
bNotAllSelected = true;
this.tagsSelectAll.checked = false;
}
}
this.applyTagFilter();
};
[…] n Wednesday, April 12th, 2006 Lightbox feature added September 15th 2006. Select specific tag add-on added September 21th 2006. Pretty much ever […]
Please forgive me for being a total idiot, but I'm still unclear on what this add-on does. Is this a means of specifying a particular image when the page loads (not necessarily image #1)? Because that's exactly what my page needs.
I've created a mini biographical gallery; each image is a different person. From a separate page, I want to link to this gallery using the names of the people. For example, you'd click on "Abe Lincoln", and the gallery would come up with Abe Lincoln displayed.
I realize that this would probably require some kind of php parameter, right? Like I'd have to call up the url http://mydomain.com/jas.php?person=AbeLincoln
Or something like that. Anyway, any help/clarification you could give me would be much appreciated. I don't know much about scripting, but if you tell me it's possible without too much difficulty, then I can figure it out.
Thanks
Scooby,
The idea with this add-on is just to display images having a particular tag predefined (e.g. “flower”).
And yes, sending it in like a parameter and then just calling the method is one way of approaching it. Include the code above, and then do it like this:
addEvent(window, "load", function(){selectCertainTagWithJaS("<?php $_REQUEST["tag"] ?>")}, false);Thanks for your help, Robert! This has been a stumbling block for me; until now I've been using a large, bloated php gallery script. I'm so happy that I can now accomplish the same thing with your streamlined (and much better, imo) javascript. I'll get to work on it right now. Cheers