Help with Spry Detail Regions, XML Data Sets, for IMG gallery

Question

Hello,
I'm working on a site for a friend of mine, a photo gallery. You can see the gallery here, it's a temporary one I'm working on
http://www.emiliajozefa.com/a_index.html
Here are some important parts of my code:
//initially load these data sets. the function will be called by the links to update components later<script type="text/javascript">
     var intNumPhoto = 0;
     dsGallery = new Spry.Data.XMLDataSet("photofile.xml", "galleries/ride/photo");
     dsNav = new Spry.Data.XMLDataSet("photofile.xml", "galleries/ride");
     function updateSpryComponents(galleryDir){
          alert("updating spry components for " + galleryDir);
          intNumPhoto = 0;
          dsGallery = Spry.Data.XMLDataSet("photofile.xml", "galleries/" + galleryDir + "/photo");
          dsNav = Spry.Data.XMLDataSet("photofile.xml", "galleries/" + galleryDir);
          dsGallery.setCurrentRow(intNumPhoto);
          //document.getElementById('nav').innerHTML='<H1>'+enlarge.inp.value+'</H1>';
          document.getElementById('nav').innerHTML=
          "<span spry:detailregion = 'dsGallery'>
         <a href = 'javascript:' onclick = 'if(intNumPhoto > 0){intNumPhoto -= 1}; dsGallery.setCurrentRow(intNumPhoto);'>&lt;</a> {@id} / </span>
         <span spry:detailregion = 'dsNav'>{@numPhotos}
         <a href = 'javascript:' onclick = 'if(intNumPhoto < ({@numPhotos} - 1)){intNumPhoto += 1; }; dsGallery.setCurrentRow(intNumPhoto);'>&gt;</a>
         </span>";
</script> <--- later ----><!-- SIDEBAR NAV. When link i clicked, set DataSet to the location of the new gallery -->
     <div id = "sideBarNav">
         <a href = "javascript:" onclick ='updateSpryComponents('ride');">Tannersville</a>
            <br />
          <a href = "javascript:" onclick = "updateSpryComponents('dive');">Dive</a>
        <br />
          <a href = "javascript:" onclick = "updateSpryComponents('poland');">Poland</a>
        <br />
          <a href = "javascript:" onclick = "updateSpryComponents('alaska');">Alaska</a>
    </div>
</div>
<div id = "content2">
     <!-- PHOTO CONTAINER I think I somehow need to refresh this section of the code to reload new data-->
     <div id = "fotoContainer" spry:detailregion="dsGallery"><img src = "photos/{@path}" width = "{@width}" height = "{@height}"/></div>
     <!-- IMAGE NAVIGATION -->
     <div id = "nav">       
         <span spry:detailregion = "dsGallery" id = "galSpan">
         <a href = "javascript:" onclick = "if(intNumPhoto > 0){intNumPhoto -= 1}; dsGallery.setCurrentRow(intNumPhoto);">&lt;</a> {@id} / </span>
         <span spry:detailregion = "dsNav" id = "navSpan">{@numPhotos}
         <a href = "javascript:" onclick = "if(intNumPhoto < ({@numPhotos} - 1)){intNumPhoto += 1; }; dsGallery.setCurrentRow(intNumPhoto);">&gt;</a>
         </span>
     </div>
You could view source there to get the code. Here is what I believe is my problem
I'm trying to automate the site so that when you click on one of the links on the left, without refreshing the page, the paths to the galleries xml file changes, and the spry Detail Regions (1 for the images, 1 for the navigation - left and right arrows). I think the problem is that once the link changes the set and calls my updateSpryComponenets() function, the detail regions need to be refreshed. I'm currently trying to solve this by dynamically rewriting the HTML thru .innterHTML, everytime I call updateSpryComponents().There may also be a problem in the Javascript function updateSpryControllers because if I put the alert after the spry calls, I never get the alert
Thanks in advance for any help!

Answer 1

Update:
Ok, the first query on the Recent tab doesnt work for me because it wont show unless its already voted, and since these are supposed to be new blurts, that kind of breaks the whole site:
"SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC";
So I replaced it with what I originally had.
"SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt ORDER BY Blurt.`Date` DESC";
But this doesn't provide me with the initial average rating:(