PWI Demo 5, Override the onclickAlbumThumb, show dual-screen: albums and selected album

Select popup-viewer:

Albums:

Content:
Click here to view the code for this example. 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>PWI Demo 5 - Picassa Webalbum Integrator (PWI)</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery//jquery.min.js"></script>

    <!-- These files are needed for  -->
    <link   href="" rel="stylesheet" type="text/css"/>
    <script src="" type="text/javascript"></script>
    
    <!-- These files are the PWI files -->
    <link   href="css/pwi.css" rel="stylesheet" type="text/css"/>
    <script src="js/jquery.pwi-min.js" type="text/javascript"></script>

    <!-- Needed for the Google Maps overview map -->
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>

    <script type="text/javascript">

      $(document).ready(function () {
        var settings = {
          username: '<<USERNAME>>',
          albumsPerPage: 4,
          onclickAlbumThumb: function (e) {
            $("#container2").html("");
            $("#container2").pwi({
              username: '<<USERNAME>>',
              maxResults: 25,
              showAlbumDescription: false,
              mode: 'album',
              showSlideshow: false,
              album: e.data.gphoto$name.$t  // The ident of the selected album
            });
          }
        };
        $("#container1").pwi(settings);
      });

    </script>
  </head>
  <body>
    <div id="container"> </div>

    <table align="center" cellspacing=5" width="90%" >
      <tr>
        <td align="center" valign="top" width="50%" style="border-style: double; border-width: 3" bordercolor="#663300">
          <h2><center>Albums:</center></h2>
          <div id="container1"> </div>
        </td>
        <td width="10">
        </td>
        <td align="center" valign="top" width="50%" style="border-style: double; border-width: 3" bordercolor="#663300">
          <h2><center>Content:</center></h2>
          <div id="container2"> </div>
        </td>
      </tr>
    </table>

  </body>
</html>