A Simple XML-Based Searchable Database (part 2): URLs and Frame numbers
By Joachim Schnier
Introduction
This tutorial is about adding URLs to buttons or frame numbers to ´gotoAndPlay´ or other actions using xml. The tutorial is a continuation of the previously published tutorial ´A Simple XML-Based Searchable Database´. The previous tutorial was about creating a database using XML. I will also discuss some parts of the script again and this time in more detail. In particular I want to point to one mistake in the previous tutorial. This tutorial requires FlashMX.
Often you need to add links to a database and that was not covered in the previous tutorial. There are some possibilities. You could for example add external links in the swf, which is shown at the same time with the database text. This may be a good idea when you have several links. Or you may want the user to go to a different frame, which you can also do dynamically using XML and is shown in one of the swfs. The simplest solution if you have one URL is shown in two of the fla files.
Type flash5 or flashmx or tutorials in the input field and submit or type nothing or something different. I will explain one of the files in more detail in this tutorial. Once you understand, the others will also be easy to understand by looking at the code.
The XML file
One of the xml files of this tutorial is shown here. The urls are present in the ´myUrl´ attributes. I have selected this example because these are urls, which contain also characters such as ´?´ and ´=´ and can normally not be executed in dynamic textfields with HTML capabilities.
<?xml version="1.0"?>
<flashkit>
<flashmx name="flashmx" myUrl="http://flashkit.com/board/forumdisplay.php?forumid=61" action="Press to go to the Flash MX forum.">
</flashmx>
<flash5 name="flash5" myUrl="http://board.flashkit.com/board/forumdisplay.php?forumid=26" action="Press to go to the Flash 5 forum.">
</flash5>
<tutorials name="tutorials" myUrl="http://flashkit.com/tutorials/" action="Press to go to the Tutorials section.">
</tutorials>
</flashkit>
The Actionscript
The way we achieve to assign a URL to a certain text is to create a dynamic button. The button is dynamic in that sense that it can be en- or disabled, its visiblility be changed and of course most important its URL can be changed. But let´s now have a look at the script, which we go through stepwise. We first create the search function as shown in the previous tutorial.
//we have to disable the button for the moment until we activate it
_root.nameBut.enabled = false;
//this is the function for the search engine
function searchSite() {
flashSite = new XML();//here we create an instance name flashSite, which will hold the XML file.
flashSite.load("url_flashkit.xml");//loading the Instance with content
flashSite.onLoad = findSite;//once loaded the function findSite will execute//we check if the file is loaded
if (this.loaded) {
headline = "Text loaded."
}else{
headline = "Text not yet loaded."
}
//with this function we will get access to the xml tree
function findSite() {
//"flashSite" contains the xml file
for (var count01=0; count01 <= flashSite.childNodes.length; count01++) {
Here I would like to point out a typo mistake in the previous tutorial. The instance name there was ´model´, however the instance name in the loop was by mistake ´models´, which is undefined. Nevertheless the script was executed. I still do not know the exact reason, why it could be executed but I know that it was possible because we had
model.ignoreWhite = true;
and if we leave that out the script would not have been executed. Actually we did not need the ignoreWhite statement. So after this event I also belong to those who recommend to try to execute the script leaving out the ignoreWhite statement. This statement is, however, useful to detect the white space using trace for example and adjust the script if necessary.
The Actionscript: continuation...
After looping through the XML tree we look for the root node, which is flashkit and then we assign the XML file content to the variable flashkitContent.
if (this.childNodes[count01].nodeName.toLowerCase() == "flashkit") {
flashkitContent = this.childNodes[count01];
}
}
//here the XML file content is carried over to the next function
findUrl(flashkitContent);
}
The Actionscript: findUrl function
As in the previous example we now have to get the individual contents of the xml file using a function with a new argument thisUrl.
function findUrl(thisUrl) {
We loop through the XML content to find all the childnodes and create the variable urlName, which holds the nodenames. We always set the contents to lower case, since by this way the search becomes case insensitive.
for (var count02=0; count02<=thisUrl.childNodes.length; count02++) {
//we are defining the var modelName here
urlName = thisUrl.childNodes[count02].nodeName.toLowerCase();
We now compare the input from the input textfield with urlName and at the same time exclude undefined childnodes. This is important if the user clicks on the submit button and there is no text in the input field.
//the string from the input textfield is compared//with the name of the childnodes//we exclude undefined childnodes from the search
if (searchWindow.toLowerCase() == urlName && urlName != undefined) {
The Actionscript: findUrl function
Next we fill the textfield ´headline´ with the corresponding content and address the attributes myUrl containing the url and the attribute name having the same content as the corresponding childnodes. This is very important for the search capability. When the if statement here is positive the search string will be assigned to thisName and will hold only the search string. We can now use thisName in the next else if statement. We cannot use urlName, because this variable holds more than one name (all childnode names). Even one of the names matches the others won't and the else if statement will always be executed as well. So to have the search engine work the childnode names have to fit to an attribute with the same string.
Note: Contents of attributes should never be interrupted by carriage return. It won't be recognized any more. Contents of child nodes is fine.
//if there is a match we do all this, we define the all the variables//for the else if statement
thisName = thisUrl.childNodes[count02].attributes.name;
//for the textfield
headline = thisUrl.childNodes[count02].attributes.action;
//and for the URL.
urlText = thisUrl.childNodes[count02].attributes.myUrl;
//the button will be enabled
_root.nameBut.enabled = true;
//the button will appear, we the alpha value to 50 to see the textfield underneath,//it can also stay 0
_root.nameBut._alpha = 50;
//if there is no match...//we cannot use urlName here because this still holds more child node names//and this statement will always be executed, so we use thisName.//urlText is undefined: if the user presses the submit button w/o adding text//this will be executed if urlText is undefined.
}else if (searchWindow.toLowerCase() != thisName.toLowerCase() || urlName == undefined){
//the button is disabled
_root.nameBut.enabled = false;
//the button will not appear
_root.nameBut._alpha = 0;
headline = "Sorry, no match.";
}
}
}
}
function myURL, searchSite, urlbutton and submit button
Next we define the button function for opening the URL. Within the function myURL() we place the getURL action with the arguments urlText, which holds our URL, and the target window (in this case blank). It is important to place the target window in quotations ("_blank").
//We define the function for the button containing the url and the browser target window
function myUrl(){
getURL(urlText,"_blank");
}
Now we place the function in the action window for the urlbutton...
on (release) {
myUrl();
}
...and then we place the search function into the action window for the submit button:
on (release) {
searchSite();
}
Conclusion
The other two versions show other ways to call a URL and in one version we first go to a different frame. You can change all parameters in the xml file w/o touching the swf. I hope I could clarify some points and correct some things which were not clear recently. Again if you have suggestions or find mistakes e-mail me. Thanks you for your attention.