[Scummvm-git-logs] scummvm-web master -> e45259fe38181167e164aaf842878b0fc2ca6493

Mataniko mataniko at gmail.com
Wed Aug 8 01:04:10 CEST 2018


This automated email contains information about 2 new commits which have been
pushed to the 'scummvm-web' repo located at https://github.com/scummvm/scummvm-web .

Summary:
b91570b1fa DATA: Add anchors to the credits data
e45259fe38 TEMPLATES: Extracted the boxes into components and updated existing templates to use them


Commit: b91570b1fa6a979bf952474bb92f5f21c3ddb617
    https://github.com/scummvm/scummvm-web/commit/b91570b1fa6a979bf952474bb92f5f21c3ddb617
Author: Matan Bareket (mataniko at gmail.com)
Date: 2018-08-07T18:38:59-04:00

Commit Message:
DATA: Add anchors to the credits data

Changed paths:
    data/credits.xml
    include/Objects/CSection.php


diff --git a/data/credits.xml b/data/credits.xml
index 61a5993..0031cec 100644
--- a/data/credits.xml
+++ b/data/credits.xml
@@ -3,8 +3,10 @@
 <credits>
 	<section>
 		<title>ScummVM Team</title>
+    <anchor>scummvm_team</anchor>
 		<subsection>
 			<title>Project Leader</title>
+      <anchor>project_leader</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -16,6 +18,7 @@
 		</subsection>
 		<subsection>
 			<title>PR Office</title>
+      <anchor>pr</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -32,6 +35,7 @@
 		</subsection>
 		<subsection>
 			<title>Retired Project Leaders</title>
+      <anchor>retired_leaders</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -58,6 +62,7 @@
 		</subsection>
 		<subsection>
 			<title>Engine Teams</title>
+      <anchor>engine_teams</anchor>
 			<group>
 				<name>SCUMM</name>
 				<person>
@@ -1081,6 +1086,7 @@
 		</subsection>
 		<subsection>
 			<title>Backend Teams</title>
+      <anchor>backend_teams</anchor>
 			<group>
 				<name>Android</name>
 				<person>
@@ -1317,6 +1323,7 @@
 		</subsection>
 		<subsection>
 			<title>Other subsystems</title>
+      <anchor>other_subsystems</anchor>
 			<group>
 				<name>Infrastructure</name>
 				<person>
@@ -1394,6 +1401,7 @@
 		</subsection>
 		<subsection>
 			<title>Website (code)</title>
+      <anchor>web_code</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -1405,6 +1413,7 @@
 		</subsection>
 		<subsection>
 			<title>Website (maintenance)</title>
+      <anchor>web_maint</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -1446,10 +1455,12 @@
 		</subsection>
 		<subsection>
 			<title>Website (content)</title>
+      <anchor>web_content</anchor>
 		<paragraph>All active team members</paragraph>
 		</subsection>
 		<subsection>
 			<title>Documentation</title>
+      <anchor>docs</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -1471,6 +1482,7 @@
 		</subsection>
 		<subsection>
 			<title>Retired Team Members</title>
+      <anchor>retired_members</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -1523,8 +1535,10 @@
 	</section>
 	<section>
 		<title>Other contributions</title>
+    <anchor>other_contrib</anchor>
 		<subsection>
 			<title>Packages</title>
+      <anchor>packages</anchor>
 			<group>
 				<name>AmigaOS 4</name>
 				<person>
@@ -1696,6 +1710,7 @@
 		</subsection>
 		<subsection>
 			<title>GUI Translations</title>
+      <anchor>gui_translations</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -1882,6 +1897,7 @@
 		</subsection>
 		<subsection>
 			<title>Game Translations</title>
+      <anchor>game_translations</anchor>
 			<group>
 				<name>CGE</name>
 				<person>
@@ -1947,6 +1963,7 @@
 		</subsection>
 		<subsection>
 			<title>Websites (design)</title>
+      <anchor>web_design</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -1983,6 +2000,7 @@
 		</subsection>
 		<subsection>
 			<title>Code contributions</title>
+      <anchor>code_contrib</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -2119,6 +2137,7 @@
 		</subsection>
 		<subsection>
 			<title>FreeSCI Contributors</title>
+      <anchor>freesci_contrib</anchor>
 			<group>
 				<name></name>
 				<person>
@@ -2309,6 +2328,7 @@
 	</section>
 	<section>
 		<title>Special thanks to</title>
+    <anchor>special_thanks</anchor>
 			<group>
 				<name></name>
 				<person>
diff --git a/include/Objects/CSection.php b/include/Objects/CSection.php
index 1236f8f..c847152 100644
--- a/include/Objects/CSection.php
+++ b/include/Objects/CSection.php
@@ -9,11 +9,13 @@ class CSection extends BasicObject {
 	private $_title;
 	private $_groups;
 	private $_subsections;
-	private $_paragraphs;
+  private $_paragraphs;
+  private $_anchor;
 
 	/* CSection object constructor. */
 	public function __construct($data) {
-		$this->_title = $data['title'];
+    $this->_title = $data['title'];
+    $this->_anchor = $data['anchor'];
 		$this->_groups = array();
 		$this->_subsections = array();
 		$this->_paragraphs = array();
@@ -52,6 +54,11 @@ if (is_string($value['person'])) {
 	/* Get the title. */
 	public function getTitle() {
 		return $this->_title;
+  }
+  
+  /* Get the anchor. */
+	public function getAnchor() {
+		return $this->_anchor;
 	}
 
 	/* Get the optional list of groups. */


Commit: e45259fe38181167e164aaf842878b0fc2ca6493
    https://github.com/scummvm/scummvm-web/commit/e45259fe38181167e164aaf842878b0fc2ca6493
Author: Matan Bareket (mataniko at gmail.com)
Date: 2018-08-07T18:42:58-04:00

Commit Message:
TEMPLATES: Extracted the boxes into components and updated existing templates to use them

Also updated the templates to have a more consistent look across pages

Where possible templates have been simplified, most notable in the
downloads and games templates

Changed paths:
  A templates/components/random_screenshot.tpl
  A templates/components/roundbox.tpl
    templates/components/box.tpl
    templates/components/compatibility_details.tpl
    templates/components/exception.tpl
    templates/components/intro_header.tpl
    templates/pages/compatibility.tpl
    templates/pages/contact.tpl
    templates/pages/credits.tpl
    templates/pages/documentation.tpl
    templates/pages/downloads.tpl
    templates/pages/faq.tpl
    templates/pages/game_demos.tpl
    templates/pages/games.tpl
    templates/pages/index.tpl
    templates/pages/links.tpl
    templates/pages/news.tpl
    templates/pages/press.tpl
    templates/pages/screenshots.tpl
    templates/pages/screenshots_category.tpl
    templates/pages/subprojects.tpl


diff --git a/templates/components/box.tpl b/templates/components/box.tpl
index 003c7f0..f628aae 100644
--- a/templates/components/box.tpl
+++ b/templates/components/box.tpl
@@ -1,7 +1,14 @@
-<div class="box">
-	<div class="head" id="{$id}">
-    {$head}
+<div class="box" {if $id}id="{$id}"{/if}>
+	{if $head}
+	<div class="head">
+		{$head}
 	</div>
+	{/if}
+	{if $intro}
+	<div class="intro">		
+		{$intro}
+	</div>
+	{/if}
 	<div class="content">
 		{$content}
 	</div>
diff --git a/templates/components/compatibility_details.tpl b/templates/components/compatibility_details.tpl
index 7e3afb8..d102f6b 100644
--- a/templates/components/compatibility_details.tpl
+++ b/templates/components/compatibility_details.tpl
@@ -8,41 +8,36 @@
 	{assign var="support_level" value=$game->getSupportLevel()|cat:"%"}
 {/if}
 
-<div class="box">
-	<div class="intro">
-		<p>
-			{#compatibilityDetailsInto#}
-		</p>
-	</div>
-	<div class="content">
-		<table class="chart color4">
-			<caption>{#compatibilityDetailsChartTitle#}</caption>
-			<thead>
-				<tr class="color4">
-					<th>{#compatibilityDetailsChartCol1#}</th>
-					<th>{#compatibilityDetailsChartCol2#}</th>
-					{if $old_layout == 'no'}
-						<th>{#compatibilityDetailsChartCol3a#}</th>
-					{else}
-						<th>{#compatibilityDetailsChartCol3b#}</th>
-					{/if}
-				</tr>
-			</thead>
-			<tbody>
-				<tr class="color0">
-					<td>{$game->getName()}</td>
-					<td>{$game->getTarget()}</td>
-					<td align="center" class="{$pct_class}">{$support_level}</td>
-				</tr>
-				<tr class="color2">
-					<td colspan="3" class="details">
-						{$game->getNotes()}
-					</td>
-				</tr>
-			</tbody>
-		</table>
-		<p class="bottom-link">
-			<a href="/compatibility/{$version}/">{#compatibilityDetailsBack#}</a>
-		</p>
-	</div>
-</div>
+{capture "content"}
+	<table class="chart color4">
+		<caption>{#compatibilityDetailsChartTitle#}</caption>
+		<thead>
+			<tr class="color4">
+				<th>{#compatibilityDetailsChartCol1#}</th>
+				<th>{#compatibilityDetailsChartCol2#}</th>
+				{if $old_layout == 'no'}
+					<th>{#compatibilityDetailsChartCol3a#}</th>
+				{else}
+					<th>{#compatibilityDetailsChartCol3b#}</th>
+				{/if}
+			</tr>
+		</thead>
+		<tbody>
+			<tr class="color0">
+				<td>{$game->getName()}</td>
+				<td>{$game->getTarget()}</td>
+				<td align="center" class="{$pct_class}">{$support_level}</td>
+			</tr>
+			<tr class="color2">
+				<td colspan="3" class="details">
+					{$game->getNotes()}
+				</td>
+			</tr>
+		</tbody>
+	</table>
+	<p class="bottom-link">
+		<a href="/compatibility/{$version}/">{#compatibilityDetailsBack#}</a>
+	</p>	
+{/capture}
+
+{include "components/box.tpl" intro={#compatibilityDetailsInto#} content=$smarty.capture.content} 
diff --git a/templates/components/exception.tpl b/templates/components/exception.tpl
index 7b70815..ef2aac2 100644
--- a/templates/components/exception.tpl
+++ b/templates/components/exception.tpl
@@ -1,12 +1,6 @@
-<div class="box">
-	<div class="head">{#exceptionHeading#}</div>
-	<div class="intro">
-		<h2>{#exceptionIntro#}</h2>
-	</div>
-	<div class="content">
-		<img src="/images/three-headed-monkey.png" alt="{#exceptionAlt#}" class="float_right" style="margin-bottom: 5px;">
-		<h3>{#exceptionContent#}</h3>
-		<p>{$exception->getMessage()|nl2br:false}</p>
-	</div>
-	<div class="spacing"> </div>
-</div>
+{capture "content"}
+	<img src="/images/three-headed-monkey.png" alt="{#exceptionAlt#}" class="float_right" style="margin-bottom: 5px;">
+	<h3>{#exceptionContent#}</h3>
+	<p>{$exception->getMessage()|nl2br:false}</p>
+{/capture}
+{include "components/box.tpl" head=#exceptionHeading# intro="<h2>{#exceptionIntro#}</h2>" content=$smarty.capture.content}
diff --git a/templates/components/intro_header.tpl b/templates/components/intro_header.tpl
index 0c32188..cf625a8 100644
--- a/templates/components/intro_header.tpl
+++ b/templates/components/intro_header.tpl
@@ -1,63 +1,23 @@
-{* Random screenshot. *}
-{assign var='rand_files' value=$random_shot.screenshot->getFiles()}
-{assign var='rand_max' value=$rand_files|@count}
-{assign var='rand_pos' value=0|rand:($rand_max-1)}
-{assign var='rand_file' value=$rand_files[$rand_pos]}
-
 {* Introduction header, included from index.tpl *}
-<div id="intro_header">
-	{* Introduction text. *}
-	<div class="round-box">
-		<div class="header">
-			{#introHeaderWhatIs#}
-		</div>
-		<div class="content text row">
-			<div class="col-2-3 col-md-1">
-				<p>{#introHeaderContentP1#}</p>
-				<p>{#introHeaderContentP2#}</p>
-				<p>{#introHeaderContentP3#}</p>
-				<p>{#introHeaderContentP4#}</p>
-				<form class="float_right" id="donate-header" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
-					<input type="hidden" name="cmd" value="_s-xclick">
-					<input type="hidden" name="hosted_button_id" value="U6E6SLL7E8MAS">
-					<input type="image" src="/images/ppdonate.png" style="width: 63px; height: 25px; border: 0 none;" align="right" name="submit" alt="{#indexSupport#}">
-					<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
-				</form>
-				<p>{#introHeaderContentP5#}</p>
-			</div>
-			<div class="col-1-3 col-md-1">
-			<div class="round-box">
-				<div class="content gallery">
-					<a href="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}-full.png" title="{$rand_file.caption}">
-						<img class="random-screenshot" src="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}-full.png" alt="{$rand_file.caption}">
-					</a>
-				</div>
-			</div>
-			</div>
-
-		</div>
-	</div>
-
-	{* Screenshots.
-	<div class="sshots">
-		<div class="round-box">
-			<div class="header">
-				{#introHeaderScreenshots#}
-			</div>
-			<div class="content">
-				<a href="/screenshots/{$random_shot.category}/{$random_shot.screenshot->getCategory()}/{$rand_pos+1}" id="screenshots_random">
-					<img src="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}.jpg" width="128" height="96" title="{#introHeaderFullsize#}" alt="{#introHeaderRandom#}">
-				</a>
-			</div>
-		</div>
-	</div>
-	 *}
+{capture "content"}
+<div class="col-2-3 col-md-1">
+  <p>{#introHeaderContentP1#}</p>
+  <p>{#introHeaderContentP2#}</p>
+  <p>{#introHeaderContentP3#}</p>
+  <p>{#introHeaderContentP4#}</p>
+  <form class="float_right" id="donate-header" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
+    <input type="hidden" name="cmd" value="_s-xclick">
+    <input type="hidden" name="hosted_button_id" value="U6E6SLL7E8MAS">
+    <input type="image" src="/images/ppdonate.png" style="width: 63px; height: 25px; border: 0 none;" align="right" name="submit" alt="{#indexSupport#}">
+    <img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
+  </form>
+  <p>{#introHeaderContentP5#}</p>
 </div>
+<div class="col-1-3 col-md-1">
+  {include file='components/random_screenshot.tpl'}    
+</div>
+{/capture}
 
-{literal}
-<script>
-	window.addEventListener('DOMContentLoaded', function() {
-		baguetteBox.run('.gallery');
-	});
-</script>
-{/literal}
+<div id="intro_header">	
+  {include file='components/roundbox.tpl' header=#introHeaderWhatIs# class="text row" content=$smarty.capture.content}	
+</div>
diff --git a/templates/components/random_screenshot.tpl b/templates/components/random_screenshot.tpl
new file mode 100644
index 0000000..601a073
--- /dev/null
+++ b/templates/components/random_screenshot.tpl
@@ -0,0 +1,17 @@
+{assign var='rand_files' value=$random_shot.screenshot->getFiles()}
+{assign var='rand_max' value=$rand_files|@count}
+{assign var='rand_pos' value=0|rand:($rand_max-1)}
+{assign var='rand_file' value=$rand_files[$rand_pos]}
+
+{capture "content"}
+<a href="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}-full.png" title="{$rand_file.caption}">
+  <img class="random-screenshot" src="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}-full.png" alt="{$rand_file.caption}">
+</a>
+{/capture}
+{include file='components/roundbox.tpl' class="gallery" content=$smarty.capture.content}
+
+<script>
+	window.addEventListener('DOMContentLoaded', function() {
+		baguetteBox.run('.gallery');
+	});
+</script>
diff --git a/templates/components/roundbox.tpl b/templates/components/roundbox.tpl
new file mode 100644
index 0000000..68122a8
--- /dev/null
+++ b/templates/components/roundbox.tpl
@@ -0,0 +1,10 @@
+<div class="round-box">
+  {if $header}
+  <div class="header">
+    {$header}
+  </div>
+  {/if}
+  <div class="content{if $class} {$class}{/if}">
+    {$content}
+  </div>  
+</div>
diff --git a/templates/pages/compatibility.tpl b/templates/pages/compatibility.tpl
index 963ba09..565a386 100644
--- a/templates/pages/compatibility.tpl
+++ b/templates/pages/compatibility.tpl
@@ -1,108 +1,109 @@
-<div class="box">
-	<div class="intro">
-		<p>
-			{#compatibilityIntro#}
-		</p>
-		<p>
-			{#compatibilityIntroExplanation#}
-		</p>
-		{if $version == 'DEV'}
-			<p>
-				{#compatibilityDevContent#}
-				{foreach from=$versions item=ver name=versions_loop}
-					{if $smarty.foreach.versions_loop.last}
-						{assign var='last' value=')'}
-					{/if}
-					<a href="/compatibility/{$ver}/">{$ver}</a>{$last}
-				{/foreach}
-			</p>
-			<p>
-				{#compatibilityDevDisclaimer#}
-			</p>
-		{else}
-			<p>
-				{'/\x7bversion\x7d/'|preg_replace:$version:#compatibilityStableContent#}
-			</p>
-			<p>
-				{#compatibilityStableReleases#}
-			{foreach from=$versions item=ver}
-				<a href="/compatibility/{$ver}/">{$ver}</a>
-			{/foreach}
-			</p>
-		{/if}
-		<p>
-			<small>{#compatiblityLastUpdated#} {$last_updated}</small>
-		</p>
-	</div>
-	<div class="content">
-		<table class="chart color4 colorKeyTable">
-			<caption>{#compatibilityLegendTitle#}</caption>
-			<tbody>
-				<tr class="color2">
-					{if $old_layout == 'no'}
-						{foreach from=$support_level_desc key=level item=desc}
-							<td class={$support_level_class.$level} align='center'>{$desc}</td>
-						{/foreach}
-					{else}
-						<td class="pct0"> 0</td>
-						<td class="pct5"> 5</td>
-						<td class="pct10">10</td>
-						<td class="pct15">15</td>
-						<td class="pct20">20</td>
-						<td class="pct25">25</td>
-						<td class="pct30">30</td>
-						<td class="pct35">35</td>
-						<td class="pct40">40</td>
-						<td class="pct45">45</td>
-						<td class="pct50">50</td>
-						<td class="pct55">55</td>
-						<td class="pct60">60</td>
-						<td class="pct65">65</td>
-						<td class="pct70">70</td>
-						<td class="pct75">75</td>
-						<td class="pct80">80</td>
-						<td class="pct85">85</td>
-						<td class="pct90">90</td>
-						<td class="pct95">95</td>
-						<td class="pct100">100</td>
-					{/if}
-				</tr>
-			</tbody>
-		</table>
+{capture "intro"}
+  <p>
+    {#compatibilityIntro#}
+  </p>
+  <p>
+    {#compatibilityIntroExplanation#}
+  </p>
+  {if $version == 'DEV'}
+    <p>
+      {#compatibilityDevContent#}
+      {foreach from=$versions item=ver name=versions_loop}
+        {if $smarty.foreach.versions_loop.last}
+          {assign var='last' value=')'}
+        {/if}
+        <a href="/compatibility/{$ver}/">{$ver}</a>{$last}
+      {/foreach}
+    </p>
+    <p>
+      {#compatibilityDevDisclaimer#}
+    </p>
+  {else}
+    <p>
+      {'/\x7bversion\x7d/'|preg_replace:$version:#compatibilityStableContent#}
+    </p>
+    <p>
+      {#compatibilityStableReleases#}
+    {foreach from=$versions item=ver}
+      <a href="/compatibility/{$ver}/">{$ver}</a>
+    {/foreach}
+    </p>
+  {/if}
+  <p>
+    <small>{#compatiblityLastUpdated#} {$last_updated}</small>
+  </p>
+{/capture}
 
-		{foreach from=$compat_data key=company item=games name=compat_loop}
-			<table class="chart color4">
-				<caption>{'/\x7bcompany\x7d/'|preg_replace:$company:#compatibilitySectionTitle#}</caption>
-				<thead>
-					<tr class="color4">
-						<th class="gameFullName">{#compatibilityDetailsChartCol1#}</th>
-						<th class="gameShortName">{#compatibilityDetailsChartCol2#}</th>
-						{if $old_layout == 'no'}
-							<th class="gameSupportLevel">{#compatibilityDetailsChartCol3a#}</th>
-						{else}
-							<th class="gameSupportLevel">{#compatibilityDetailsChartCol3b#}</th>
-						{/if}
-					</tr>
-				</thead>
-				<tbody>
-				{foreach from=$games item=game}
-					{if $old_layout == 'no'}
-						{assign var="x" value=$game->getSupportLevel()}
-						{assign var="pct_class" value=$support_level_class.$x}
-						{assign var="support_level" value=$support_level_desc.$x}
-					{else}
-						{math equation="x - (x % 5)" x=$game->getSupportLevel() assign='pct_class'}
-						{assign var="pct_class" value="pct"|cat:$pct_class}
-						{assign var="support_level" value=$game->getSupportLevel()|cat:"%"}
-					{/if}
-					<tr class="color{cycle values='2,0'}">
-						<td class="gameFullName"><a href="/compatibility/{$version}/{$game->getTarget()}/">{$game->getName()}</a></td>
-						<td class="gameShortName">{$game->getTarget()}</td>
-						<td class="gameSupportLevel {$pct_class}">{$support_level}</td>
-					</tr>
-				{/foreach}
-				</tbody>
-			</table>
-		{/foreach}
-	</div>
-</div>
+{capture "content"}
+  <table class="chart color4 colorKeyTable">
+    <caption>{#compatibilityLegendTitle#}</caption>
+    <tbody>
+      <tr class="color2">
+        {if $old_layout == 'no'}
+          {foreach from=$support_level_desc key=level item=desc}
+            <td class={$support_level_class.$level} align='center'>{$desc}</td>
+          {/foreach}
+        {else}
+          <td class="pct0"> 0</td>
+          <td class="pct5"> 5</td>
+          <td class="pct10">10</td>
+          <td class="pct15">15</td>
+          <td class="pct20">20</td>
+          <td class="pct25">25</td>
+          <td class="pct30">30</td>
+          <td class="pct35">35</td>
+          <td class="pct40">40</td>
+          <td class="pct45">45</td>
+          <td class="pct50">50</td>
+          <td class="pct55">55</td>
+          <td class="pct60">60</td>
+          <td class="pct65">65</td>
+          <td class="pct70">70</td>
+          <td class="pct75">75</td>
+          <td class="pct80">80</td>
+          <td class="pct85">85</td>
+          <td class="pct90">90</td>
+          <td class="pct95">95</td>
+          <td class="pct100">100</td>
+        {/if}
+      </tr>
+    </tbody>
+  </table>
+
+  {foreach from=$compat_data key=company item=games name=compat_loop}
+    <table class="chart color4">
+      <caption>{'/\x7bcompany\x7d/'|preg_replace:$company:#compatibilitySectionTitle#}</caption>
+      <thead>
+        <tr class="color4">
+          <th class="gameFullName">{#compatibilityDetailsChartCol1#}</th>
+          <th class="gameShortName">{#compatibilityDetailsChartCol2#}</th>
+          {if $old_layout == 'no'}
+            <th class="gameSupportLevel">{#compatibilityDetailsChartCol3a#}</th>
+          {else}
+            <th class="gameSupportLevel">{#compatibilityDetailsChartCol3b#}</th>
+          {/if}
+        </tr>
+      </thead>
+      <tbody>
+      {foreach from=$games item=game}
+        {if $old_layout == 'no'}
+          {assign var="x" value=$game->getSupportLevel()}
+          {assign var="pct_class" value=$support_level_class.$x}
+          {assign var="support_level" value=$support_level_desc.$x}
+        {else}
+          {math equation="x - (x % 5)" x=$game->getSupportLevel() assign='pct_class'}
+          {assign var="pct_class" value="pct"|cat:$pct_class}
+          {assign var="support_level" value=$game->getSupportLevel()|cat:"%"}
+        {/if}
+        <tr class="color{cycle values='2,0'}">
+          <td class="gameFullName"><a href="/compatibility/{$version}/{$game->getTarget()}/">{$game->getName()}</a></td>
+          <td class="gameShortName">{$game->getTarget()}</td>
+          <td class="gameSupportLevel {$pct_class}">{$support_level}</td>
+        </tr>
+      {/foreach}
+      </tbody>
+    </table>
+  {/foreach}
+{/capture}
+
+{include file="components/box.tpl" head=$content_title intro=$smarty.capture.intro content=$smarty.capture.content}
diff --git a/templates/pages/contact.tpl b/templates/pages/contact.tpl
index 82d7a25..d888888 100644
--- a/templates/pages/contact.tpl
+++ b/templates/pages/contact.tpl
@@ -1,27 +1,22 @@
-<div class="box">
-	<div class="intro">
-		{#contactIntro#}
-	</div>
+{capture "content"}
+  <div class="subhead">{#contactIRCHeader#}</div>
+  <div class="subhead-content">
+    {#contactIRC#}
+  </div>
 
-	<div class="content">
-		<div class="subhead">{#contactIRCHeader#}</div>
-		<div class="subhead-content">
-			{#contactIRC#}
-		</div>
+  <div class="subhead">{#contactForumsHeader#}</div>
+  <div class="subhead-content">
+    {#contactForums#}
+  </div>
 
-		<div class="subhead">{#contactForumsHeader#}</div>
-		<div class="subhead-content">
-			{#contactForums#}
-		</div>
+  <div class="subhead">{#contactTrackersHeader#}</div>
+  <div class="subhead-content">
+    {#contactTrackers#}
+  </div>
 
-		<div class="subhead">{#contactTrackersHeader#}</div>
-		<div class="subhead-content">
-			{#contactTrackers#}
-		</div>
-
-		<div class="subhead">{#contactListsHeader#}</div>
-		<div class="subhead-content">
-			{#contactLists#}
-		</div>
-	</div>
-</div>
+  <div class="subhead">{#contactListsHeader#}</div>
+  <div class="subhead-content">
+    {#contactLists#}
+  </div>
+{/capture}
+{include file="components/box.tpl" head=$content_title intro=#contactIntro# content=$smarty.capture.content}
diff --git a/templates/pages/credits.tpl b/templates/pages/credits.tpl
index 08708c1..ef19a3c 100644
--- a/templates/pages/credits.tpl
+++ b/templates/pages/credits.tpl
@@ -1,30 +1,53 @@
-{foreach from=$credits item=csection}
-<div class="box">
-	<div class="head">{$csection->getTitle()}</div>
-	<div class="content">
-		{if $csection->getSubsections()|@count > 0}
-			{foreach from=$csection->getSubsections() item=subcsection}
-				<div class="subhead">{$subcsection->getTitle()}</div>
-				<div class="subhead-content">
-					{include
-						file='components/credits_entry.tpl'
-						groups=$subcsection->getGroups()
-						paragraphs=$subcsection->getParagraphs()
-					}
-				</div>
-			{/foreach}
-			{* If the section itself has paragraphs, we must process them here. *}
-			{include
-				file='components/credits_entry.tpl'
-				paragraphs=$csection->getParagraphs()
-			}
-		{else}
-			{include
-				file='components/credits_entry.tpl'
-				groups=$csection->getGroups()
-				paragraphs=$csection->getParagraphs()
-			}
-		{/if}
-	</div>
-</div>
+{capture "intro"}
+<div class="row">
+  <div class="navigation col-1-1">
+    <h4 class="subhead">{#screenshotsNavigation#}</h4>
+    <ul>
+      {foreach from=$credits item=csection}      
+        {if $csection->getSubsections()|@count > 0}
+          {foreach from=$csection->getSubsections() item=subcsection}
+          <li><a href="/credits/#{$subcsection->getAnchor()}">{$subcsection->getTitle()}</a></li>
+          {/foreach}   
+        {else}
+          <li><a href="/credits/#{$csection->getAnchor()}">{$csection->getTitle()}</a></li>
+        {/if}   
+      {/foreach}    
+    </ul>
+  </div>  
+</div>  
+{/capture}
+
+{foreach from=$credits item=csection name=credits}
+  {capture "content"}
+    {if $csection->getSubsections()|@count > 0}
+      {foreach from=$csection->getSubsections() item=subcsection}
+        <div class="subhead" id="{$subcsection->getAnchor()}">{$subcsection->getTitle()}</div>
+        <div class="subhead-content">
+          {include
+            file='components/credits_entry.tpl'
+            groups=$subcsection->getGroups()
+            paragraphs=$subcsection->getParagraphs()
+          }
+        </div>
+      {/foreach}
+      {* If the section itself has paragraphs, we must process them here. *}
+      {include
+        file='components/credits_entry.tpl'
+        paragraphs=$csection->getParagraphs()
+      }
+    {else}
+      {include
+        file='components/credits_entry.tpl'
+        groups=$csection->getGroups()
+        paragraphs=$csection->getParagraphs()
+      }
+    {/if}
+  {/capture}
+
+  {if $smarty.foreach.credits.first}
+    {include file="components/box.tpl" head=$csection->getTitle() id=$csection->getAnchor() intro=$smarty.capture.intro content=$smarty.capture.content}
+  {else}
+    {include file="components/box.tpl" head=$csection->getTitle() id=$csection->getAnchor() content=$smarty.capture.content}
+  {/if}
+  
 {/foreach}
diff --git a/templates/pages/documentation.tpl b/templates/pages/documentation.tpl
index b98969e..66778fe 100644
--- a/templates/pages/documentation.tpl
+++ b/templates/pages/documentation.tpl
@@ -1,13 +1,10 @@
-<div class="box">
-	<div class="intro">
-		<p>{#documentationIntro#}</p>
-	</div>
-	<div class="content">
-		{foreach from=$documents item=document}
-		<p>
-			<a href="{eval var=$document->getURL()}">{eval var=$document->getName()}</a><br>
-			{eval var=$document->getDescription()}
-		</p>
-		{/foreach}
-	</div>
-</div>
+{capture "content"}
+{foreach from=$documents item=document}
+<p>
+  <a href="{eval var=$document->getURL()}">{eval var=$document->getName()}</a><br>
+  {eval var=$document->getDescription()}
+</p>
+{/foreach}
+{/capture}
+
+{include file="components/box.tpl" head=$content_title intro=#documentationIntro# content=$smarty.capture.content}
diff --git a/templates/pages/downloads.tpl b/templates/pages/downloads.tpl
index 7d4c541..3be46ae 100644
--- a/templates/pages/downloads.tpl
+++ b/templates/pages/downloads.tpl
@@ -1,10 +1,7 @@
-{foreach from=$downloads item=dsection name=downloads_loop}
-<div class="box" id="{if $dsection->getAnchor() != 'a'}{$dsection->getAnchor()}{/if}">
-	<div class="head">{eval var=$dsection->getTitle()}</div>
-	{if $smarty.foreach.downloads_loop.first}
-	<div class="intro row">
+{capture "intro"}
+<div class="row">
 		<div class="navigation col-1-2">
-			<h4 class="subhead">{#downloadsHeader#}</h4>
+    <h4 class="subhead">Navigation</h4>
 			<ul>
 				{foreach from=$sections item=arr}
 				<li>
@@ -22,13 +19,12 @@
 			</ul>
 		</div>
 	</div>
+{/capture}
 
-	<div class="content">
-		<!-- Recommended download - start -->
+{capture "recommendedDownload"}
 		<div id="recommended-download" class="hidden">
 			<div class="subhead">{#downloadsBadge#}</div>
 			<div class="subhead-content">
-
 				<div id="downloadContainer">
 					<a id="downloadButton">
 						<img src="images/scummvm.png" alt="Download ScummVM icon">
@@ -39,26 +35,45 @@
 			</div>
 		</div>
 		<br>
-
 		<script>{$recommendedDownloadsJS}</script>
 		<script src="/javascripts/recommended_dl.js"></script>
-		<!-- Recommended download - end -->
-	{else}
-	<div class="content">
-	{/if}
+{/capture}
 
-	{foreach from=$dsection->getSubSections() item=dsubsection}
-	{if $dsubsection->getTitle() != ''}
-		<div class="subhead" id="{if $dsubsection->getAnchor() != ''}{$dsubsection->getAnchor()}{/if}">{eval var=$dsubsection->getTitle()}</div>
-	{/if}
+{foreach from=$downloads item=dsection name=downloads_loop}
 
-		<div class="subhead-content">
-			{if $dsubsection->getNotes() != ''} {eval var=$dsubsection->getNotes()} {/if} {include file='components/list_items.tpl' list=$dsubsection->getItems() type='platforms'}
-			{if !is_null($dsubsection->getFooter())}
-			<p>{$dsubsection->getFooter()}</p>
-			{/if}
-		</div>
-	{/foreach}
-	</div>
-</div>
+  {capture "content"}
+    {if $smarty.foreach.downloads_loop.first}
+      {$smarty.capture.recommendedDownload}
+    {/if}
+
+    {foreach from=$dsection->getSubSections() item=dsubsection}
+    {if $dsubsection->getTitle() != ''}
+      <div class="subhead" id="{if $dsubsection->getAnchor() != ''}{$dsubsection->getAnchor()}{/if}">{eval var=$dsubsection->getTitle()}</div>
+    {/if}
+
+      <div class="subhead-content">
+        {if $dsubsection->getNotes() != ''} {eval var=$dsubsection->getNotes()} {/if} {include file='components/list_items.tpl' list=$dsubsection->getItems() type='platforms'}
+        {if !is_null($dsubsection->getFooter())}
+        <p>{$dsubsection->getFooter()}</p>
+        {/if}
+      </div>
+    {/foreach}
+  {/capture}
+
+  {if $smarty.foreach.downloads_loop.first}
+    {include 
+      file="components/box.tpl" 
+      head={eval var=$dsection->getTitle()} 
+      intro=$smarty.capture.intro 
+      id=$dsection->getAnchor()
+      content=$smarty.capture.content
+    }  
+  {else}
+    {include 
+      file="components/box.tpl" 
+      head={eval var=$dsection->getTitle()}       
+      content=$smarty.capture.content
+      id=$dsection->getAnchor()
+    }  
+  {/if}
 {/foreach}
diff --git a/templates/pages/faq.tpl b/templates/pages/faq.tpl
index f020255..8e6daaf 100644
--- a/templates/pages/faq.tpl
+++ b/templates/pages/faq.tpl
@@ -1,25 +1,23 @@
-<div class="box">
-	<div class="head">
-		{#faqHeading#}
-	</div>
-	<div class="content">
-	<div class="news-author">{#faqLastUpdated#} {$modified}</div>
-		<dl>
-			{foreach from=$contents item=section name='toc_loop'}
-				{assign var='toc_num' value=$smarty.foreach.toc_loop.iteration}
-				<dt>{$toc_num}. <a href="/faq/#{$toc_num}">{$section->getTitle()}</a></dt>
-				<dd>
-					<dl>
-					{foreach from=$section->getTOC() key=href item=name name='toc_section_loop'}
-						{assign var='toc_section_num' value=$smarty.foreach.toc_section_loop.iteration}
-						<dt>{$toc_num}.{$toc_section_num}. <a href="/faq/#{$toc_num}_{$toc_section_num}">{$name}</a></dt>
-					{/foreach}
-					</dl>
-				</dd>
-			{/foreach}
-		</dl>
+{capture "intro"}
+<div>{#faqLastUpdated#} {$modified}</div>
+<dl>
+  {foreach from=$contents item=section name='toc_loop'}
+    {assign var='toc_num' value=$smarty.foreach.toc_loop.iteration}
+    <dt>{$toc_num}. <a href="/faq/#{$toc_num}">{$section->getTitle()}</a></dt>
+    <dd>
+      <dl>
+      {foreach from=$section->getTOC() key=href item=name name='toc_section_loop'}
+        {assign var='toc_section_num' value=$smarty.foreach.toc_section_loop.iteration}
+        <dt>{$toc_num}.{$toc_section_num}. <a href="/faq/#{$toc_num}_{$toc_section_num}">{$name}</a></dt>
+      {/foreach}
+      </dl>
+    </dd>
+  {/foreach}
+</dl>
+{/capture}
 
-		{foreach from=$contents item=section name='section_loop'}
+{capture "content"}
+{foreach from=$contents item=section name='section_loop'}
 			{assign var='section_num' value=$smarty.foreach.section_loop.iteration}
 			<div class="section">
 				<h3 class="title" id="{$section_num}">{$section_num}. {$section->getTitle()}</h3>
@@ -37,5 +35,5 @@
 				{/foreach}
 			</div>
 		{/foreach}
-	</div>
-</div>
+{/capture}
+{include file="components/box.tpl" head=#faqHeading# intro=$smarty.capture.intro content=$smarty.capture.content}
diff --git a/templates/pages/game_demos.tpl b/templates/pages/game_demos.tpl
index f404375..3b1a2d6 100644
--- a/templates/pages/game_demos.tpl
+++ b/templates/pages/game_demos.tpl
@@ -1,8 +1,8 @@
 <script type="text/javascript" src="/javascripts/jquery-1.3.2.min.js"></script>
 <script type="text/javascript" src="/javascripts/game_demos.js"></script>
 
-<div class="box">
-	<div class="intro row">
+{capture "intro"}
+  <div class="row">
 		<div class="navigation col-1-2">
 			<h4 class="subhead">{#gamesDemosHeading#}</h4>
 			<ul>
@@ -20,27 +20,30 @@
 			</p>
 		</div>
 	</div>
-	<div class="content">
-		{foreach from=$demos item=group}
-		<table class="chart color4 gameDemos" id="{$group.href}">
-			<caption>{$group.name}</caption>
-			<thead>
-				<tr class="color4">
-					<th>{#gamesDemosH1#}</th>
-					<th class="gameTarget">{#gamesDemosH2#}</th>
-				</tr>
-			</thead>
-			<tbody>
-			{foreach from=$group.demos item=demo}
-				<tr class="{cycle values="color2, color0"}">
-					<td>						
-						<a href="{$demo->getURL()}">{$demo->getName()}</a>
-					</td>
-					<td class="gameTarget">{$demo->getTarget()}</td>
-				</tr>
-			{/foreach}
-			</tbody>
-		</table>
-		{/foreach}
-	</div>
-</div>
+{/capture}
+
+{capture "content"}
+  {foreach from=$demos item=group}
+  <table class="chart color4 gameDemos" id="{$group.href}">
+    <caption>{$group.name}</caption>
+    <thead>
+      <tr class="color4">
+        <th>{#gamesDemosH1#}</th>
+        <th class="gameTarget">{#gamesDemosH2#}</th>
+      </tr>
+    </thead>
+    <tbody>
+    {foreach from=$group.demos item=demo}
+      <tr class="{cycle values="color2, color0"}">
+        <td>						
+          <a href="{$demo->getURL()}">{$demo->getName()}</a>
+        </td>
+        <td class="gameTarget">{$demo->getTarget()}</td>
+      </tr>
+    {/foreach}
+    </tbody>
+  </table>
+  {/foreach}
+{/capture}
+
+{include file="components/box.tpl" head=$content_title intro=$smarty.capture.intro content=$smarty.capture.content}
diff --git a/templates/pages/games.tpl b/templates/pages/games.tpl
index bb9ae25..1f9bf7b 100644
--- a/templates/pages/games.tpl
+++ b/templates/pages/games.tpl
@@ -1,30 +1,26 @@
-{foreach from=$downloads item=dsection name=downloads_loop}
-	<div class="box" id="{if $dsection->getAnchor() != ''}{$dsection->getAnchor()}{/if}">
-		<div class="head">{eval var=$dsection->getTitle()}</div>
+{capture "intro"}
+  <div class="row">
+    <div class="navigation col-1-2">
+      <h4 class="subhead">{#gamesHeader#}</h4>
+      <ul>
+      {foreach from=$sections item=arr}
+        <li><a href="/games/#{$arr.anchor}">{eval var=$arr.title}</a></li>
+      {/foreach}
+      </ul>
+    </div>
+    <div class="text col-1-2">
+      <ul>
+        <li>{#gamesContentP1#}</li>
+        <li>{#gamesContentP2#}</li>
+      </ul>
+    </div>
+  </div>
+{/capture}
 
-		{if $smarty.foreach.downloads_loop.first}
-		<div class="intro row">
-			<div class="navigation col-1-2">
-				<h4 class="subhead">{#gamesHeader#}</h4>
-				<ul>
-				{foreach from=$sections item=arr}
-					<li><a href="/games/#{$arr.anchor}">{eval var=$arr.title}</a></li>
-				{/foreach}
-				</ul>
-			</div>
-			<div class="text col-1-2">
-				<ul>
-					<li>{#gamesContentP1#}</li>
-					<li>{#gamesContentP2#}</li>
-				</ul>
-			</div>
-		</div>
-		<div class="content">
-		{else}
-		<div class="content">
-		{/if}
+{foreach from=$downloads item=dsection name=downloads_loop}
 
-		{foreach from=$dsection->getSubSections() item=dsubsection}
+  {capture "content"}
+   {foreach from=$dsection->getSubSections() item=dsubsection}
 			{if $dsubsection->getTitle() != ''}
 				<div class="subhead" id="{if $dsubsection->getAnchor() != ''}{$dsubsection->getAnchor()}{/if}">{eval var=$dsubsection->getTitle()}</div>
 			{/if}
@@ -40,6 +36,23 @@
 				{/if}
 			</div>
 		{/foreach}
-		</div>
-	</div>
+  {/capture}
+	
+  {if $smarty.foreach.downloads_loop.first}			
+    {include 
+      file="components/box.tpl" 
+      head={eval var=$dsection->getTitle()} 
+      intro=$smarty.capture.intro 
+      id=$dsection->getAnchor()
+      content=$smarty.capture.content
+    }
+  {else}
+    {include 
+      file="components/box.tpl" 
+      head={eval var=$dsection->getTitle()}      
+      id=$dsection->getAnchor()
+      content=$smarty.capture.content
+    }
+  {/if}
+
 {/foreach}
diff --git a/templates/pages/index.tpl b/templates/pages/index.tpl
index 74fd7ba..7e6ebeb 100644
--- a/templates/pages/index.tpl
+++ b/templates/pages/index.tpl
@@ -47,16 +47,7 @@
 					{/if}
 
 					{* The actual content. *}
-					<div class="round-box">
-						<div class="header">
-							{$content_title}
-						</div>
-						<div class="content">
-							{$content}
-						</div>
-
-						{include file='components/banners.tpl'}
-					</div>
+					{include file='components/roundbox.tpl' header=$content_title content=$content}
 				</div>
 			</div>
 
@@ -99,7 +90,6 @@
 		urchinTracker();
 	</script>
 {* End Google analytics javascript. *}
-{literal}
 	<script>
 		document.querySelector('.nav-trigger').addEventListener('change', function() {
 			if (this.checked)
@@ -108,6 +98,5 @@
 				document.body.classList.remove('no-scroll');
 		});
 	</script>
-{/literal}
 </body>
 </html>
diff --git a/templates/pages/links.tpl b/templates/pages/links.tpl
index 2c245fc..343065d 100644
--- a/templates/pages/links.tpl
+++ b/templates/pages/links.tpl
@@ -1,29 +1,25 @@
-<div class="box">
-	<div class="head">
-		{#linksHeading#}
-	</div>
-	<div class="intro">
-		<img src="/images/scummvm-link.png" width="88" height="31" alt="ScummVM">
-		{#linksIntro#}
-	</div>
-	<div class="content">
-		{foreach from=$links item=group}
-		<div class="subhead">{$group.name}</div>
-		<div class="subhead-content">
-			<p>{$group.description}</p>
-			<div class="linklist">
-				{foreach from=$group.links item=link}
-				<div class="linkentry">
-					<div class="linkhead">
-						<a href="{$link->getURL()}">{$link->getName()}</a>
-					</div>
-					<div class="linkbody">
-						{$link->getDescription()}
-					</div>
-				</div>
-				{/foreach}
-			</div>
-		</div>
-    	{/foreach}
-	</div>
-</div>
+{capture "intro"}
+  <img src="/images/scummvm-link.png" width="88" height="31" alt="ScummVM">
+  {#linksIntro#}
+{/capture}
+
+{capture "content"}
+  {foreach from=$links item=group}
+    <div class="subhead">{$group.name}</div>
+    <div class="subhead-content">
+      <p>{$group.description}</p>
+      <div class="linklist">
+        {foreach from=$group.links item=link}
+          <div class="linkentry">
+            <div class="linkhead">
+              <a href="{$link->getURL()}">{$link->getName()}</a>
+            </div>
+            <div class="linkbody">{$link->getDescription()}</div>
+          </div>
+        {/foreach}
+      </div>
+    </div>
+  {/foreach}
+{/capture}
+
+{include file="components/box.tpl" head=#linksHeading# intro=$smarty.capture.intro content=$smarty.capture.content}
diff --git a/templates/pages/news.tpl b/templates/pages/news.tpl
index b4b3a18..db9b4b2 100644
--- a/templates/pages/news.tpl
+++ b/templates/pages/news.tpl
@@ -1,20 +1,19 @@
 {foreach from=$news_items item=news}
-  {$news_filename=$news->getFilename()|substr:'0':'-4'}
-  <div class="box">
-    <div class="head" id="{$news->getDate()|date_format:"%Y-%m-%d"}{if $news_filename|strlen == 9}{$news_filename|substr:'-1'}{/if}">
-      <a href="{$news->getLink()}/">
-        <span class="news-date">{$news->getDate()|date_localized:#dateformat#}</span>:
-        {$news->getTitle()}
-      </a>
-    </div>
-    <div class="news content">
-      <div class="news-author">
+	{$news_filename = $news->getFilename()|substr:'0':'-4'}
+	{$id = "{$news->getDate()|date_format:"%Y-%m-%d"}{if $news_filename|strlen == 9}{$news_filename|substr:'-1'}{/if}"}	
+	{capture "head"}
+		<a href="{$news->getLink()}/">
+			<span class="news-date">{$news->getDate()|date_localized:#dateformat#}</span>:
+			{$news->getTitle()}
+		</a>
+	{/capture}
+	{capture "content"}
+		<div class="news-author">
         {#newsPostedBy#} {$news->getAuthor()}
-      </div>
-      {$news->getContent()}
-      <div class="spacing"></div>
     </div>
-  </div>
+    {$news->getContent()}
+	{/capture}
+	{include "components/box.tpl" id=$id head=$smarty.capture.head content=$smarty.capture.content} 
 {/foreach}
 
 {* Only show the 'more news' link if we're on the main page *}
diff --git a/templates/pages/press.tpl b/templates/pages/press.tpl
index 5194b72..828f4be 100644
--- a/templates/pages/press.tpl
+++ b/templates/pages/press.tpl
@@ -1,15 +1,17 @@
-<div class="box">
-	<div class="head">{#pressHeading#}</div>
-	<div class="content">
-		<small>{#pressIntro#}</small>
-		{foreach from=$articles item=article}
-		<p>
-			{if $article->getLanguage() != null}
-				<a href="{$article->getURL()}"><b>{$article->getName()}</b></a> ({$article->getLanguage()}), {$article->getPosted()}
-			{else}
-				<a href="{$article->getURL()}"><b>{$article->getName()}</b></a>, {$article->getPosted()}
-			{/if}
-		</p>
-		{/foreach}
-	</div>
-</div>
+{capture "intro"}
+  <p>{#pressIntro#}</p>
+{/capture}
+
+{capture "content"}  
+  {foreach from=$articles item=article}
+  <p>
+    {if $article->getLanguage() != null}
+      <a href="{$article->getURL()}"><b>{$article->getName()}</b></a> ({$article->getLanguage()}), {$article->getPosted()}
+    {else}
+      <a href="{$article->getURL()}"><b>{$article->getName()}</b></a>, {$article->getPosted()}
+    {/if}
+  </p>
+  {/foreach}
+{/capture}
+
+{include file="components/box.tpl" head=#pressHeading# intro=$smarty.capture.intro content=$smarty.capture.content}
diff --git a/templates/pages/screenshots.tpl b/templates/pages/screenshots.tpl
index 7277e26..1ae093f 100644
--- a/templates/pages/screenshots.tpl
+++ b/templates/pages/screenshots.tpl
@@ -1,48 +1,28 @@
-{* Random screenshot. *}
-{assign var='rand_files' value=$random_shot.screenshot->getFiles()}
-{assign var='rand_max' value=$rand_files|@count}
-{assign var='rand_pos' value=0|rand:($rand_max-1)}
-{assign var='rand_file' value=$rand_files[$rand_pos]}
+{capture "intro"}
+  <div class="row">
+    <div class="navigation col-1-2">
+      <h4 class="subhead">{#screenshotsNavigation#}</h4>
+      <ul>
+      {foreach from=$screenshots item=arr}
+        <li><a href="/screenshots/#{$arr.category}">{eval var=$arr.title}</a></li>
+      {/foreach}
+      </ul>
+    </div>
+    <div class="text col-1-2">
+      {include file='components/random_screenshot.tpl'}
+    </div>
+  </div>
+{/capture}
 
-{* List the available categories. *}
-<div class="box">
-	<div class="head">{#screenshotsHeading#}</div>
-	<div class="intro row">
-		<div class="navigation col-1-2">
-			<h4 class="subhead">{#screenshotsNavigation#}</h4>
-			<ul>
-			{foreach from=$screenshots item=arr}
-				<li><a href="/screenshots/#{$arr.category}">{eval var=$arr.title}</a></li>
-			{/foreach}
-			</ul>
-		</div>
-		<div class="text col-1-2">
-			<div class="round-box">
-				<div class="content gallery">
-					<a href="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}-full.png" title="{$rand_file.caption}">
-						<img class="random-screenshot" src="{$smarty.const.DIR_SCREENSHOTS}/{$rand_file.filename}-full.png" alt="{$rand_file.caption}">
-					</a>
-				</div>
-			</div>
-		</div>
-	</div>
-
-	<div class="content">
-		{foreach from=$screenshots item=arr}
-		<div class="subhead" id="{$arr.category}">
-			<a href="/screenshots/{$arr.category}/">{$arr.title}</a>
-		</div>
-		<div class="scr-content scr-content-{$arr.category}">
+{capture "content"}  
+  {foreach from=$screenshots item=arr}
+    <div class="subhead" id="{$arr.category}">
+      <a href="/screenshots/{$arr.category}/">{$arr.title}</a>
+    </div>
+    <div class="scr-content scr-content-{$arr.category}">
       {include file='components/list_items.tpl' list=$arr.games type='games'}
-		</div>
-		{/foreach}
-	</div>
-</div>
+    </div>
+  {/foreach}
+{/capture}
 
-{literal}
-<script>
-	window.addEventListener('DOMContentLoaded', function() {
-		baguetteBox.run('.gallery');
-	});
-</script>
-{/literal}
+{include file="components/box.tpl" head=#screenshotsHeading# intro=$smarty.capture.intro content=$smarty.capture.content}
diff --git a/templates/pages/screenshots_category.tpl b/templates/pages/screenshots_category.tpl
index 1539c0c..977e101 100644
--- a/templates/pages/screenshots_category.tpl
+++ b/templates/pages/screenshots_category.tpl
@@ -1,55 +1,34 @@
-{* List all screenshots for an entry. *}
+{* List all screenshots for an entry or category. *}
+{capture "content"}  
+  {foreach from=$screenshots.games item=g name=cat_loop}
+    {if $game and $game != $g->getCategory()}
+      {continue}
+    {/if}
+    <div class="gallery">
+      <h3 class="subhead"><a href="/screenshots/{$category}/{$g->getCategory()}/">{$g->getName()}</a></h3>
+      {foreach from=$g->getFiles() item=fdata name=game_loop}
+        <div class="screenshot">
+          <a href="{$smarty.const.DIR_SCREENSHOTS}/{$fdata.filename}-full.png" title="{$fdata.caption}">
+            <img src="{$smarty.const.DIR_SCREENSHOTS}/{$fdata.filename}.jpg" alt="{$g->getName()} screenshot #{$smarty.foreach.cat_loop.iteration}">
+          </a>
+          <div class="caption">{$fdata.caption}</div>
+        </div>
+      {/foreach}
+    </div>
+    {if $game and $game == $g->getCategory()}      
+      {break}
+    {/if}
+  {/foreach}
+{/capture}
 
-{* A single game (target) was selected. *}
-{if !empty($game)}
-	<div class="box">
-		<div class="head">{#screenshotsCategoryHeading#}</div>
-		<div class="content gallery">
-			{foreach from=$screenshots.games item=g name=cat_loop}
-				{if $game == $g->getCategory()}
-					<h3 class="subhead">{$g->getName()}</h3>
-					{foreach from=$g->getFiles() item=fdata name=game_loop}
-						<div class="screenshot">
-							<a href="{$smarty.const.DIR_SCREENSHOTS}/{$fdata.filename}-full.png" title="{$fdata.caption}">
-								<img src="{$smarty.const.DIR_SCREENSHOTS}/{$fdata.filename}.jpg" alt="{$g->getName()} screenshot #{$smarty.foreach.cat_loop.iteration}">
-							</a>
-							<div class="caption">{$fdata.caption}</div>
-						</div>
-					{/foreach}
-				{/if}
-			{/foreach}
-		</div>
-	</div>
-	<a href="/screenshots/{$category}/">{#screenshotsCategoryBack#}</a>
+{include file="components/box.tpl" head=#screenshotsCategoryHeading# content=$smarty.capture.content}
 
+{if $game}
+  <a href="/screenshots/{$category}/">{#screenshotsCategoryBack#}</a>
 {else}
-
-	{* No game selected, but the complete category. *}
-	<div class="box">
-		<div class="head">{#screenshotsCategoryHeading#}</div>
-		<div class="content">
-		{foreach from=$screenshots.games item=g name=cat_loop}
-			<div class="gallery">
-				<h3 class="subhead"><a href="/screenshots/{$category}/{$g->getCategory()}/">{$g->getName()}</a></h3>
-				{foreach from=$g->getFiles() item=fdata name=game_loop}
-					<div class="screenshot">
-						<a href="{$smarty.const.DIR_SCREENSHOTS}/{$fdata.filename}-full.png" title="{$fdata.caption}">
-							<img src="{$smarty.const.DIR_SCREENSHOTS}/{$fdata.filename}.jpg" alt="{$g->getName()} screenshot #{$smarty.foreach.cat_loop.iteration}">
-						</a>
-						<div class="caption">{$fdata.caption}</div>
-					</div>
-				{/foreach}
-			</div>
-		{/foreach}
-		</div>
-	</div>
-	<a href="/screenshots/">{#screenshotsCategoryBack#}</a>
+  <a href="/screenshots/">{#screenshotsCategoryBack#}</a>
 {/if}
 
-{literal}
-<script>
-	document.addEventListener('DOMContentLoaded', function() {
-		baguetteBox.run('.gallery');
-	});
-</script>
-{/literal}
+
+
+
diff --git a/templates/pages/subprojects.tpl b/templates/pages/subprojects.tpl
index b6b647b..260b700 100644
--- a/templates/pages/subprojects.tpl
+++ b/templates/pages/subprojects.tpl
@@ -1,20 +1,20 @@
-<div class="box">
-	<div class="intro">
-		<p>
-			{#subprojectsIntroP1#}
-		</p>
-		<p>
-			{#subprojectsIntroP2#}
-		</p>
-	</div>
+{capture "intro"}
+  <p>
+    {#subprojectsIntroP1#}
+  </p>
+  <p>
+    {#subprojectsIntroP2#}
+  </p>
+{/capture}
 
-	<div class="content">
-		{foreach from=$subprojects item=project}
-		<div class="subhead">{$project->getName()}</div>
-		<div class="subhead-content">
-			{$project->getInfo()}
-			{include file='components/list_items.tpl' list=$project->getDownloads() type='platforms'}
-		</div>
-		{/foreach}
-	</div>
-</div>
+{capture "content"}
+  {foreach from=$subprojects item=project}
+  <div class="subhead">{$project->getName()}</div>
+  <div class="subhead-content">
+    {$project->getInfo()}
+    {include file='components/list_items.tpl' list=$project->getDownloads() type='platforms'}
+  </div>
+  {/foreach}
+{/capture}
+
+{include file="components/box.tpl" head=$content_title intro=$smarty.capture.intro content=$smarty.capture.content}





More information about the Scummvm-git-logs mailing list