Restructure the theme code to be more like WordPress / Habari. Now,

the controller initiates a request to a top level page (eg:
album.html.php) which is then free to include whatever other page
chunks it wants with calls like <?= $theme->display('header.html') ?>

Variables like $item and $children are in the global space for all
views.

theme.php helper is now Theme.php library which lets us store the name
of the theme inside the variable itself.  This means that the theme
does not have to know its own name because you can use $theme->url()
for all urls to stuff inside the theme itself, which makes it possible
to cline a theme without changing a single line.

Still using the mock album UI.

1 files changed, 70 insertions, 58 deletions

diff --git a/themes/default/views/album.html.php b/themes/default/views/album.html.php
index 10930daa..2abb810f 100644
--- a/themes/default/views/album.html.php
+++ b/themes/default/views/album.html.php
@@ -1,72 +1,84 @@
 <? defined("SYSPATH") or die("No direct script access."); ?>
-<script type="text/javascript">
-  myTooltip = new YAHOO.widget.Tooltip("myTooltip", {
-  context:"photo-id-1",
-  text:"<strong>Photo title</strong><br />taken December 24, 2007<br />Viewed 27 times<br /><br/>Tags: christmas, familiy, home, xmas",
-  showDelay:500 } );
-</script>
+<?= $theme->display('header.html') ?>
 
-<div id="gAlbumGrid">
-  <div id="gAlbumGridHeader">
-    <h1>Christmas 2007</h1>
-    <span class="understate">(interesting information about the Album)</span>
-    <a href="#" id="gSlideshowLink" class="buttonlink">Slideshow</a>
-  </div>
+<div id="bd">
+  <div id="yui-main">
+    <div id="gContent" class="yui-b">
+      <script type="text/javascript">
+	myTooltip = new YAHOO.widget.Tooltip("myTooltip", {
+	context:"photo-id-1",
+	text:"<strong>Photo title</strong><br />taken December 24, 2007<br />Viewed 27 times<br /><br/>Tags: christmas, familiy, home, xmas",
+	showDelay:500 } );
+      </script>
 
-  <div class="gAlbumContainer first gAlbum">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Album title</h2>
-    <ul class="gMetadata">
-      <li>Views: 321</li>
-      <li>By: <a href="#">username</a></li>
-    </ul>
-  </div>
+      <div id="gAlbumGrid">
+	<div id="gAlbumGridHeader">
+	  <h1><?= $item->title ?></h1>
+	  <span class="understate"><?= $item->description ?></span>
+	  <a href="#" id="gSlideshowLink" class="buttonlink">Slideshow</a>
+	</div>
 
-  <div class="gItemContainer">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gAlbumContainer first gAlbum">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Album title</h2>
+	  <ul class="gMetadata">
+	    <li>Views: 321</li>
+	    <li>By: <a href="#">username</a></li>
+	  </ul>
+	</div>
 
-  <div class="gItemContainer">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div class="gItemContainer first">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div class="gItemContainer">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer first">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div class="gItemContainer">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div class="gItemContainer first">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div class="gItemContainer">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer first">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div class="gItemContainer">
-    <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= theme::url("images/thumbnail.jpg") ?>" /></a>
-    <h2>Photo title</h2>
-  </div>
+	<div class="gItemContainer">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
 
-  <div id="gPagination">
-    Items 1-10 of 34
-    <span class="first_inactive">first</span>
-    <span class="previous_inactive">previous</span>
-    <a href="#" class="next">next</a>
-    <a href="#" class="last">last</a>
+	<div class="gItemContainer">
+	  <a href="photo.html"><img id="photo-id-1" class="photo" alt="photo" src="<?= $theme->url("images/thumbnail.jpg") ?>" /></a>
+	  <h2>Photo title</h2>
+	</div>
+
+	<div id="gPagination">
+	  Items 1-10 of 34
+	  <span class="first_inactive">first</span>
+	  <span class="previous_inactive">previous</span>
+	  <a href="#" class="next">next</a>
+	  <a href="#" class="last">last</a>
+	</div>
+      </div>
+
+    </div>
   </div>
+  <?= $theme->display('sidebar.html') ?>
 </div>
+
+<?= $theme->display('footer.html') ?>