From 126bb8cb6b93240bb4d3a2b816b74c286c3d422b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rg=20Frings-F=C3=BCrst?= <jff@merkur>
Date: Sun, 6 Jul 2014 15:20:38 +0200
Subject: Imported Upstream version 1.7.0

---
 share/gcstar/html_models/GCboardgames/piwi         | 275 +++++++++++++++++++
 share/gcstar/html_models/GCboardgames/piwi.png     | Bin 0 -> 50926 bytes
 share/gcstar/html_models/GCbooks/FloFred           |  73 +++++
 share/gcstar/html_models/GCbooks/FloFred.png       | Bin 0 -> 69747 bytes
 share/gcstar/html_models/GCbooks/NellistosDark     |  67 +++++
 share/gcstar/html_models/GCbooks/NellistosDark.png | Bin 0 -> 26138 bytes
 share/gcstar/html_models/GCbooks/NellistosLight    |  66 +++++
 .../gcstar/html_models/GCbooks/NellistosLight.png  | Bin 0 -> 30503 bytes
 share/gcstar/html_models/GCbooks/Shelf             |  12 +
 share/gcstar/html_models/GCbooks/Shelf.png         | Bin 0 -> 62375 bytes
 share/gcstar/html_models/GCbooks/Simple            |  10 +
 share/gcstar/html_models/GCbooks/Simple.png        | Bin 0 -> 29817 bytes
 share/gcstar/html_models/GCcoins/Simple            |  11 +
 share/gcstar/html_models/GCcoins/Simple.png        | Bin 0 -> 20252 bytes
 share/gcstar/html_models/GCfilms/Flat              | 109 ++++++++
 share/gcstar/html_models/GCfilms/Flat.png          | Bin 0 -> 77945 bytes
 share/gcstar/html_models/GCfilms/Shelf             | 284 ++++++++++++++++++++
 share/gcstar/html_models/GCfilms/Shelf.png         | Bin 0 -> 86073 bytes
 share/gcstar/html_models/GCfilms/Simple            | 100 +++++++
 share/gcstar/html_models/GCfilms/Simple.png        | Bin 0 -> 28419 bytes
 share/gcstar/html_models/GCfilms/Tabs              | 245 +++++++++++++++++
 share/gcstar/html_models/GCfilms/Tabs.png          | Bin 0 -> 51681 bytes
 share/gcstar/html_models/GCfilms/Tian              | 276 +++++++++++++++++++
 share/gcstar/html_models/GCfilms/Tian-Mario        | 276 +++++++++++++++++++
 share/gcstar/html_models/GCfilms/Tian-Mario-Kim    | 281 +++++++++++++++++++
 share/gcstar/html_models/GCfilms/Tian-Mario.png    | Bin 0 -> 30879 bytes
 share/gcstar/html_models/GCfilms/Tian.png          | Bin 0 -> 43774 bytes
 share/gcstar/html_models/GCfilms/float             | 120 +++++++++
 share/gcstar/html_models/GCfilms/float.png         | Bin 0 -> 67698 bytes
 share/gcstar/html_models/GCfilms/rootII_design     | 118 ++++++++
 share/gcstar/html_models/GCfilms/rootII_design.png | Bin 0 -> 49787 bytes
 share/gcstar/html_models/GCgames/Flat              | 111 ++++++++
 share/gcstar/html_models/GCgames/Flat.png          | Bin 0 -> 91347 bytes
 share/gcstar/html_models/GCgames/Simple            |  10 +
 share/gcstar/html_models/GCgames/Simple.png        | Bin 0 -> 28909 bytes
 share/gcstar/html_models/GCgames/Tabs              | 284 ++++++++++++++++++++
 share/gcstar/html_models/GCgames/Tabs.png          | Bin 0 -> 46938 bytes
 share/gcstar/html_models/GCminicars/Tian-Jim       | 279 +++++++++++++++++++
 share/gcstar/html_models/GCminicars/Tian-Jim.png   | Bin 0 -> 39085 bytes
 share/gcstar/html_models/GCmusics/Shelf            | 298 +++++++++++++++++++++
 share/gcstar/html_models/GCmusics/Shelf.png        | Bin 0 -> 62357 bytes
 share/gcstar/html_models/GCmusics/Simple           |  10 +
 share/gcstar/html_models/GCmusics/Simple.png       | Bin 0 -> 24463 bytes
 share/gcstar/html_models/GCstar/Shelf              | 282 +++++++++++++++++++
 share/gcstar/html_models/GCstar/Shelf.png          | Bin 0 -> 86073 bytes
 share/gcstar/html_models/GCstar/Simple             |  96 +++++++
 share/gcstar/html_models/GCstar/Simple.png         | Bin 0 -> 28419 bytes
 47 files changed, 3693 insertions(+)
 create mode 100644 share/gcstar/html_models/GCboardgames/piwi
 create mode 100644 share/gcstar/html_models/GCboardgames/piwi.png
 create mode 100644 share/gcstar/html_models/GCbooks/FloFred
 create mode 100644 share/gcstar/html_models/GCbooks/FloFred.png
 create mode 100644 share/gcstar/html_models/GCbooks/NellistosDark
 create mode 100644 share/gcstar/html_models/GCbooks/NellistosDark.png
 create mode 100644 share/gcstar/html_models/GCbooks/NellistosLight
 create mode 100644 share/gcstar/html_models/GCbooks/NellistosLight.png
 create mode 100644 share/gcstar/html_models/GCbooks/Shelf
 create mode 100644 share/gcstar/html_models/GCbooks/Shelf.png
 create mode 100644 share/gcstar/html_models/GCbooks/Simple
 create mode 100644 share/gcstar/html_models/GCbooks/Simple.png
 create mode 100644 share/gcstar/html_models/GCcoins/Simple
 create mode 100644 share/gcstar/html_models/GCcoins/Simple.png
 create mode 100644 share/gcstar/html_models/GCfilms/Flat
 create mode 100644 share/gcstar/html_models/GCfilms/Flat.png
 create mode 100644 share/gcstar/html_models/GCfilms/Shelf
 create mode 100644 share/gcstar/html_models/GCfilms/Shelf.png
 create mode 100644 share/gcstar/html_models/GCfilms/Simple
 create mode 100644 share/gcstar/html_models/GCfilms/Simple.png
 create mode 100644 share/gcstar/html_models/GCfilms/Tabs
 create mode 100644 share/gcstar/html_models/GCfilms/Tabs.png
 create mode 100644 share/gcstar/html_models/GCfilms/Tian
 create mode 100644 share/gcstar/html_models/GCfilms/Tian-Mario
 create mode 100644 share/gcstar/html_models/GCfilms/Tian-Mario-Kim
 create mode 100644 share/gcstar/html_models/GCfilms/Tian-Mario.png
 create mode 100644 share/gcstar/html_models/GCfilms/Tian.png
 create mode 100644 share/gcstar/html_models/GCfilms/float
 create mode 100644 share/gcstar/html_models/GCfilms/float.png
 create mode 100644 share/gcstar/html_models/GCfilms/rootII_design
 create mode 100644 share/gcstar/html_models/GCfilms/rootII_design.png
 create mode 100644 share/gcstar/html_models/GCgames/Flat
 create mode 100644 share/gcstar/html_models/GCgames/Flat.png
 create mode 100644 share/gcstar/html_models/GCgames/Simple
 create mode 100644 share/gcstar/html_models/GCgames/Simple.png
 create mode 100644 share/gcstar/html_models/GCgames/Tabs
 create mode 100644 share/gcstar/html_models/GCgames/Tabs.png
 create mode 100644 share/gcstar/html_models/GCminicars/Tian-Jim
 create mode 100644 share/gcstar/html_models/GCminicars/Tian-Jim.png
 create mode 100644 share/gcstar/html_models/GCmusics/Shelf
 create mode 100644 share/gcstar/html_models/GCmusics/Shelf.png
 create mode 100644 share/gcstar/html_models/GCmusics/Simple
 create mode 100644 share/gcstar/html_models/GCmusics/Simple.png
 create mode 100644 share/gcstar/html_models/GCstar/Shelf
 create mode 100644 share/gcstar/html_models/GCstar/Shelf.png
 create mode 100644 share/gcstar/html_models/GCstar/Simple
 create mode 100644 share/gcstar/html_models/GCstar/Simple.png

(limited to 'share/gcstar/html_models')

diff --git a/share/gcstar/html_models/GCboardgames/piwi b/share/gcstar/html_models/GCboardgames/piwi
new file mode 100644
index 0000000..9a32430
--- /dev/null
+++ b/share/gcstar/html_models/GCboardgames/piwi
@@ -0,0 +1,275 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<!--
+  Template made by Tian ( http://www.c-sait.net/ ) - Mods by Piwi -->
+<head>
+ <title>$$PAGETITLE$$</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+[JAVASCRIPT]
+ <script type="text/javascript">
+<!--
+expandTooltip="Afficher les informations du jeu";
+collapseTooltip="Masquer les informations du jeu";
+function prn(s)
+{
+ document.write(s)
+}
+function getE(id)
+{
+ return document.getElementById(id)
+}
+function expcolAll(dir,rowNum)
+{
+ for(x=0;x < rowNum;x++) {
+  try {
+   getE('movie'+x).style.display=dir
+   if(dir=="none") getE('switch'+x).innerHTML="+"
+   else getE('switch'+x).innerHTML="&ndash;"
+  }
+  catch(err) { }
+ }
+}
+function toggleDisplay(id,swt)
+{
+ if((getE(id).style.display=="")||(getE(id).style.display=="none")) {
+  getE(id).style.display="block"
+  getE(swt).innerHTML="&ndash;"
+  getE(swt).title=collapseTooltip
+ } else {
+  getE(id).style.display="none"
+  getE(swt).innerHTML="+"
+  getE(swt).title=expandTooltip
+ }
+ return false
+}
+function writeExpandControl(elementId,collapse)
+{
+ prn("<a href=\"#\" class=\"movie-expand\" id=\"switch"+elementId+"\" onclick=\"return toggleDisplay('movie"+elementId+"','switch"+elementId+"');\" title=\""+((collapse) ? expandTooltip : collapseTooltip)+"\">"+((collapse) ? "+" : "&ndash;")+"</a>")
+}
+function searchMovies(text)
+{
+ getE("collapseAll").click()
+ alldt=document.getElementsByTagName("dt")
+ alldd=document.getElementsByTagName("dd")
+ nb=alldt.length
+ re=new RegExp(text,"i")
+ for(i=0;i<nb;i++) {
+  s1=alldt[i].getElementsByTagName("a")[1].innerHTML
+  s2=alldd[i].innerHTML
+  res=0
+  if(getE("searchType").value=="all") res=(re.test(s1)||re.test(s2))
+  else res=re.test(s1)
+  if(res) st="block"
+  else st="none"
+  alldt[i].style.display=st
+  alldd[i].style.display=st
+ }
+}
+-->
+ </script>
+[/JAVASCRIPT]
+ <style type="text/css">
+   body {
+   background:#FEEFCF;
+  }
+  h1 {
+   font-weight:bold;
+   font-size:160%;
+   text-align:center;
+   margin-bottom:1em;
+  }
+  #top {
+   color:#FF912D ! important;
+   background:transparent ! important;
+  }
+  form {
+   text-align:center;
+   border:1px dashed #999999;
+   background:#FCCC67;
+   margin:0 3em;
+   padding:0.5em;
+  }
+  input, select {
+   border:1px solid #666666;
+   background: #FCCC67;
+   color: #993300;
+   margin:0 0.5em;
+  }
+  input:focus, input.submit:hover {
+   background:#FCCC67;
+   color: #993300;
+  }
+    }
+  input:hover, input.submit:hover {
+   background:#FCCC67;
+   color: #993300;
+  }
+  input.submit {
+   cursor:pointer;
+  }
+  #links {
+   margin-top:0.5em;
+   text-align:center;
+   font-size:120%;
+   color: #993300;
+  }
+  img {
+   float:left;
+   margin:0 1em 1em 1em;
+  }
+  dt {
+   color:#FF912D;
+   font-size:120%;
+   margin:0em 0.5em;
+   clear:both;
+  }
+  dd {
+   margin:0.5em 2em 1em;
+   border-left:1px dashed #FF912D;
+   border-bottom:1px dashed #FF912D;
+  }
+  table {
+   font-size:90%;
+   margin:0 1em;
+   border:1px dashed #990000;
+   width:60%;
+   color: #990000;
+  }
+  th {
+   font-weight:bold;
+   text-align:left;
+   width:25%;
+  }
+  .tr1 {
+   background:#FCCC67;
+  }
+  .tr2 {
+   background:#FCCC67;
+  }
+  a {
+   color:#ffaa00;
+   background:transparent;
+   text-decoration:none;
+  }
+  a:hover, a:focus {
+   color:#FCCC67;
+   background-color:#ffaa00;
+  }
+  .topl {
+   color:#BBBBBB;
+   font-size:90%;
+  }
+  .movie-expand {
+   width:1em;
+   text-align:center;
+   font-size:120%;
+   float:left;
+   margin:0.2em;
+  }
+  p, #note {
+   color:#993300;
+   background:#FEEFCF;
+   border:1px dashed #999999;
+   clear:left;
+   margin:1em 2em;
+   padding:0.5em;
+  }
+  .borrowed0 {
+   color:#BBBBBB;
+   background:transparent;
+   text-decoration:none;
+   font-size:50%;
+   display:block;
+  }
+  .borrowed1 {
+   color:#BBBBBB;
+   background:transparent;
+   text-decoration:none;
+   font-size:50%;
+   display:block;
+  }
+  #note {
+  	text-align:center;
+  }
+ </style>
+</head>
+<body>
+ <h1><a id="top">$$PAGETITLE$$</a></h1>
+[JAVASCRIPT]
+ <form onsubmit="searchMovies(getE('searchText').value); return false" action="">
+  <div>
+  <input type="text" id="searchText" title="$$FORM_INPUT$$" size="20" />
+  <select id="searchType">
+   <option value="title">$$FORM_SEARCH1$$</option>
+   <option value="all">$$FORM_SEARCH2$$</option>
+  </select>
+  <input type="button" class="submit" value="$$FORM_SEARCHBUTTON$$" title="$$FORM_SEARCHTITLE$$" onclick="searchMovies(getE('searchText').value)" />
+  <input type="button" class="submit" value="$$FORM_ALLBUTTON$$" title="$$FORM_ALLTITLE$$" onclick="searchMovies('')" />
+  <br />
+  <br />
+  <input  type="button" class="submit" value="$$FORM_EXPAND$$" onclick="expcolAll('block','$$TOTALNUMBER$$')" title="$$FORM_EXPANDTITLE$$" />
+  <input  type="button" id="collapseAll" class="submit" value="$$FORM_COLLAPSE$$" onclick="expcolAll('none','$$TOTALNUMBER$$')" title="$$FORM_COLLAPSETITLE$$" />
+  </div>
+ </form>
+[/JAVASCRIPT]
+ <div id="links">| _ | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z |</div>
+ <dl>
+[/HEADER]
+[ITEM]
+  <dt>
+[JAVASCRIPT]
+   <script type="text/javascript">writeExpandControl('$$IDX$$',1)</script>
+[/JAVASCRIPT]
+   <a id="movielink_$$IDX$$" href="$$URL$$">$$TITLE_FIELD$$</a> | <a class="topl" href="#top">($$TOP$$)</a>   
+   <span class="borrowed$$borrower_FLAG$$">$$borrower_YESNO$$$$borrower_OREMPTY$$</span>
+  </dt>
+  <dd>
+   <div id="movie$$IDX$$" style="display:none;">
+    <img src="$$boxpic$$" alt="$$name$$" title= "$$name$$" height="$$HEIGHT_PIC$$" />     
+     <table>
+     <tr class="tr1"><th>$$playingtime_LABEL$$</th><td>$$playingtime$$</td></tr>
+     <tr class="tr2"><th>$$mechanics_LABEL$$</th><td>$$mechanics$$</td></tr>
+     <tr class="tr1"><th>$$suggestedage_LABEL$$</th><td>$$suggestedage$$</td></tr>
+	<tr class="tr2"><th>$$players_LABEL$$</th><td>$$players$$</td></tr>
+     <tr class="tr1"><th>$$publishedby_LABEL$$</th><td>$$publishedby$$</td></tr>
+     <tr class="tr2"><th>$$designedby_LABEL$$</th><td>$$designedby$$</td></tr>
+     <tr class="tr1"><th>$$illustratedby_LABEL$$</th><td>$$illustratedby$$</td></tr>
+     <tr class="tr2"><th>$$original_LABEL$$</th><td>$$original$$</td></tr>
+     <tr class="tr1"><th>$$expandedby_LABEL$$</th><td>$$expandedby$$</td></tr>
+     <tr class="tr2"><th>$$expansionfor_LABEL$$</th><td>$$expansionfor$$</td></tr>
+     <tr class="tr1"><th>$$released_LABEL$$</th><td>$$released$$</td></tr>
+    </table>
+    <p>$$description$$<br /><br /><em>$$comment$$</em></p>
+   </div>
+  </dd>
+[/ITEM]
+[FOOTER]
+ </dl>
+ <div id="note">$$GENERATOR_NOTE$$ - Modèle  Piwi - Adapté de Tian</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+
+  my %letters = ();
+  my $idx = 0; foreach (@items)
+  {
+    my $firstLetter = uc(substr($_->{name}, 0, 1));
+    $firstLetter =~ s/[^A-Z]/_/;
+    if (!$letters{$firstLetter})
+    {
+    	$body =~ s/<a id="movielink_$idx"/<a id="$firstLetter"/;
+        $letters{$firstLetter} = 1;
+    }
+    $idx++;
+  }
+
+  foreach (keys %letters)
+  {
+    $header =~ s/\| $_ \|/| <a class="letter" href="#$_">$_<\/a> |/;
+  }
+  $header =~ s/\| ([^<|]) /| <span class="letter">$1<\/span> /g;
+  #$header =~ s/\| ([^<]) \|/| <span class="letter">$1<\/span> |/g;
+[/POST]
\ No newline at end of file
diff --git a/share/gcstar/html_models/GCboardgames/piwi.png b/share/gcstar/html_models/GCboardgames/piwi.png
new file mode 100644
index 0000000..bbd6ce8
Binary files /dev/null and b/share/gcstar/html_models/GCboardgames/piwi.png differ
diff --git a/share/gcstar/html_models/GCbooks/FloFred b/share/gcstar/html_models/GCbooks/FloFred
new file mode 100644
index 0000000..59c625a
--- /dev/null
+++ b/share/gcstar/html_models/GCbooks/FloFred
@@ -0,0 +1,73 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template par Florent pour fred. Adapaté de  rootII.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body
+{
+ color:black;
+}
+.borrowed1
+{
+ color:#777777;
+ font-style:italic;
+}
+#legend
+{
+ margin:1em;
+ border:1px solid black;
+ display:inline;
+ padding:0.5em;
+}
+#note
+{
+ border-top:1px solid black;
+ margin:3em 8%;
+ margin-bottom:2em;
+ padding-top:0.5em;
+ text-align:center;
+ font-size:90%;
+}
+#note a
+{
+ color:black ! important;
+ text-decoration:underline;
+ font-weight:bold;
+}
+</style>
+</head>
+<body>
+<h1>$$PAGETITLE$$</h1>
+<table border="0" align="center" cellspacing="0" cellpadding="0"  width="80%">
+<tr><td><br><hr></td></tr>
+[/HEADER]
+[ITEM]
+<tr><td>
+<table border="0" cellspacing="10" cellpadding="0" width="100%">
+	<tr><td colspan="3"><strong>$$title$$</strong></td></tr>
+	<tr><td rowspan="5" width="80"><img src="$$cover$$" height="$$HEIGHT_PIC$$" alt="$$title$$" title="$$title$$" border="0"/></td></tr>
+	<tr><td style="font-size:10pt;" width="100"><b>$$authors_LABEL$$$$SEPARATOR$$</b></td><td  style="font-size:10pt;">$$authors$$&nbsp;</td></tr>
+	<tr><td style="font-size:10pt;" width="100"><b>$$publisher_LABEL$$$$SEPARATOR$$</b></td><td  style="font-size:10pt;">$$publisher$$</td></tr>
+	<tr><td style="font-size:10pt;" width="100"><b>$$publication_LABEL$$$$SEPARATOR$$</b></td><td  style="font-size:10pt;">$$publication$$</td></tr>
+	<tr><td style="font-size:10pt;" width="100"><b>$$format_LABEL$$$$SEPARATOR$$</b></td><td style="font-size:10pt;">$$format$$</td></tr>
+	<tr><td colspan="3" style="font-size:10pt;">$$description$$</td></tr>
+</table>
+</td></tr>
+<tr><td><br><hr></td></tr>
+[/ITEM]
+[FOOTER]
+</table>
+<p id="note">$$GENERATOR_NOTE$$ - Design Florent</p>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
+
+
+
diff --git a/share/gcstar/html_models/GCbooks/FloFred.png b/share/gcstar/html_models/GCbooks/FloFred.png
new file mode 100644
index 0000000..050fd0a
Binary files /dev/null and b/share/gcstar/html_models/GCbooks/FloFred.png differ
diff --git a/share/gcstar/html_models/GCbooks/NellistosDark b/share/gcstar/html_models/GCbooks/NellistosDark
new file mode 100644
index 0000000..79b983d
--- /dev/null
+++ b/share/gcstar/html_models/GCbooks/NellistosDark
@@ -0,0 +1,67 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template mady by Nellistos.
+  nellistos@hotmail.com
+-->
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+	<title>$$PAGETITLE$$</title>
+	<style type="text/css">
+    body{font-family:sans;font-size:0.7em; background-color: #151515; color: #fff;}
+	h1{text-align:center;}
+	label{font-weight:bold;}
+	a {color:#36A0A6;font-weight:bold;}
+
+	.books{margin:50px;}
+	ul.bookslist{list-style:none;margin:0px;padding:0;}
+	ul.bookslist li {margin:35px 0px 0px 0px;padding:5px 5px 5px 5px;border-top:1px solid #555;border-bottom:1px solid #555; background-color: #333;}
+	ul.fieldslist{margin:0;padding:0;}
+	ul.fieldslist li {margin:0;padding:0;border:none;}
+	
+	.details{margin-top:5px;padding: 5px 5px 5px 5px;}
+	.image{float:left;padding:0; margin:0px 25px 0px 0px;}
+	.clear{clear:both;}
+	</style>
+</head>
+<body>
+	<h1>$$PAGETITLE$$</h1>
+	<div class="books">
+		<ul class="bookslist">
+[/HEADER]
+[ITEM]
+			<li>
+				<div class="item">
+					<div class="caption"><a href="$$gcsfield1$$">$$title$$</a></div>
+					<div class="details">
+						<div class="image"><img src="$$cover$$" height="$$HEIGHT_PIC$$" alt="Book cover" title="$$title$$"/></div>
+						<div class="fields">
+							<ul class="fieldslist">
+								<li><label>$$authors_LABEL$$$$SEPARATOR$$</label>$$authors$$</li>
+								<li><label>$$publisher_LABEL$$$$SEPARATOR$$</label>$$publisher$$</li>
+								<li><label>$$publication_LABEL$$$$SEPARATOR$$</label>$$publication$$</li>
+								<li><label>$$format_LABEL$$$$SEPARATOR$$</label>$$format$$</li>
+								<li><label>$$tag_LABEL$$$$SEPARATOR$$</label>$$tags$$</li>
+							</ul>
+						</div>
+					</div>
+					<div class="description"><small>$$description$$</small>	</div>
+				</div>
+				<div class="clear"/>
+			</li>
+[/ITEM]
+[FOOTER]
+		</ul>
+	</div>
+	<div align="center">Design <a href="mailto:nellistos@hotmail.com">Nellistos</a> 
+	<br/>
+	<small><i>based on microFormats Spec</i></small></div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
+
+
+
diff --git a/share/gcstar/html_models/GCbooks/NellistosDark.png b/share/gcstar/html_models/GCbooks/NellistosDark.png
new file mode 100644
index 0000000..ca505cd
Binary files /dev/null and b/share/gcstar/html_models/GCbooks/NellistosDark.png differ
diff --git a/share/gcstar/html_models/GCbooks/NellistosLight b/share/gcstar/html_models/GCbooks/NellistosLight
new file mode 100644
index 0000000..2cf897d
--- /dev/null
+++ b/share/gcstar/html_models/GCbooks/NellistosLight
@@ -0,0 +1,66 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template mady by Nellistos.
+  nellistos@hotmail.com
+-->
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+	<title>$$PAGETITLE$$</title>
+	<style type="text/css">
+    body{font-family:sans;font-size:0.7em; background-color: #fff; color: #000;}
+	h1{text-align:center;}
+	label{font-weight:bold;}
+
+	.books{margin:50px;}
+	ul.bookslist{list-style:none;margin:0px;padding:0;}
+	ul.bookslist li {margin:35px 0px 0px 0px;padding:5px 5px 5px 5px;border-top:1px solid #cdcdcd;border-bottom:1px solid #cdcdcd; background-color: #fff;}
+	ul.fieldslist{margin:0;padding:0;}
+	ul.fieldslist li {margin:0;padding:0;border:none;}
+	
+	.details{margin-top:5px;padding: 5px 5px 5px 5px;}
+	.image{float:left;padding:0; margin:0px 25px 0px 0px;}
+	.clear{clear:both;}
+	</style>
+</head>
+<body>
+	<h1>$$PAGETITLE$$</h1>
+	<div class="books">
+		<ul class="bookslist">
+[/HEADER]
+[ITEM]
+			<li>
+				<div class="item">
+					<div class="caption"><a href="$$gcsfield1$$">$$title$$</a></div>
+					<div class="details">
+						<div class="image"><img src="$$cover$$" height="$$HEIGHT_PIC$$" alt="Book cover" title="$$title$$"/></div>
+						<div class="fields">
+							<ul class="fieldslist">
+								<li><label>$$authors_LABEL$$$$SEPARATOR$$</label>$$authors$$</li>
+								<li><label>$$publisher_LABEL$$$$SEPARATOR$$</label>$$publisher$$</li>
+								<li><label>$$publication_LABEL$$$$SEPARATOR$$</label>$$publication$$</li>
+								<li><label>$$format_LABEL$$$$SEPARATOR$$</label>$$format$$</li>
+								<li><label>$$tag_LABEL$$$$SEPARATOR$$</label>$$tags$$</li>
+							</ul>
+						</div>
+					</div>
+					<div class="description"><small>$$description$$</small>	</div>
+				</div>
+				<div class="clear"/>
+			</li>
+[/ITEM]
+[FOOTER]
+		</ul>
+	</div>
+	<div align="center">Design <a href="mailto:nellistos@hotmail.com">Nellistos</a> 
+	<br/>
+	<small><i>based on microFormats Spec</i></small></div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
+
+
+
diff --git a/share/gcstar/html_models/GCbooks/NellistosLight.png b/share/gcstar/html_models/GCbooks/NellistosLight.png
new file mode 100644
index 0000000..3186e1b
Binary files /dev/null and b/share/gcstar/html_models/GCbooks/NellistosLight.png differ
diff --git a/share/gcstar/html_models/GCbooks/Shelf b/share/gcstar/html_models/GCbooks/Shelf
new file mode 100644
index 0000000..72def06
--- /dev/null
+++ b/share/gcstar/html_models/GCbooks/Shelf
@@ -0,0 +1,12 @@
+<metamodel>
+	<model>Shelf</model>
+	<fields>
+		<field>authors</field>
+		<field>publisher</field>
+		<field>publication</field>
+		<field>description</field>
+		<field>format</field>
+		<field>rating</field>
+		<field>acquisition</field>
+	</fields>
+</metamodel>
\ No newline at end of file
diff --git a/share/gcstar/html_models/GCbooks/Shelf.png b/share/gcstar/html_models/GCbooks/Shelf.png
new file mode 100644
index 0000000..a74305b
Binary files /dev/null and b/share/gcstar/html_models/GCbooks/Shelf.png differ
diff --git a/share/gcstar/html_models/GCbooks/Simple b/share/gcstar/html_models/GCbooks/Simple
new file mode 100644
index 0000000..b737209
--- /dev/null
+++ b/share/gcstar/html_models/GCbooks/Simple
@@ -0,0 +1,10 @@
+<metamodel>
+	<model>Simple</model>
+	<fields>
+		<field>title</field>
+		<field>authors</field>
+		<field>publisher</field>
+		<field>publication</field>
+		<field>format</field>
+	</fields>
+</metamodel>
\ No newline at end of file
diff --git a/share/gcstar/html_models/GCbooks/Simple.png b/share/gcstar/html_models/GCbooks/Simple.png
new file mode 100644
index 0000000..341a1f7
Binary files /dev/null and b/share/gcstar/html_models/GCbooks/Simple.png differ
diff --git a/share/gcstar/html_models/GCcoins/Simple b/share/gcstar/html_models/GCcoins/Simple
new file mode 100644
index 0000000..2111fe2
--- /dev/null
+++ b/share/gcstar/html_models/GCcoins/Simple
@@ -0,0 +1,11 @@
+<metamodel>
+	<model>Simple</model>
+	<fields>
+		<field>type</field>
+		<field>currency</field>
+		<field>value</field>
+		<field>year</field>
+		<field>country</field>
+		<field>condition</field>
+	</fields>
+</metamodel>
\ No newline at end of file
diff --git a/share/gcstar/html_models/GCcoins/Simple.png b/share/gcstar/html_models/GCcoins/Simple.png
new file mode 100644
index 0000000..8052733
Binary files /dev/null and b/share/gcstar/html_models/GCcoins/Simple.png differ
diff --git a/share/gcstar/html_models/GCfilms/Flat b/share/gcstar/html_models/GCfilms/Flat
new file mode 100644
index 0000000..a33d302
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Flat
@@ -0,0 +1,109 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Yanbab. Flat and compact list.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+
+body {
+	color:black;
+	background-color : white;
+	font-family : arial, sans-serif;
+	font-size : 12px;
+	margin : 10px;
+}
+
+td {
+	font-family : arial, sans-serif;
+	font-size : 12px;
+}
+
+h1 {
+	font-size:130%;
+	font-weight:bold;
+	border-bottom : solid black 1px;
+	margin:0px;
+}
+
+.borrowed1 {
+}
+
+#footer {
+	border-top : solid black 1px;	
+	font-size:small;
+	color : #666;
+}
+a {
+	color : #666;
+	text-decoration : none;	
+
+}
+a:hover {
+	text-decoration : underline;
+}
+#total {
+	float: right;
+	font-weight: bold;
+}
+.title {
+ 	font-size : 110%;
+ 	font-weight : bold;
+}
+
+.synopsis {
+	margin-top : .6em;
+	text-align : justify;
+
+	margin-bottom : 1.5em;
+	color : #333;
+}
+
+.image {
+	margin-bottom : 1.5em;
+}
+
+.detail {
+	float : right;
+	text-align : right;
+	color : #888;
+}
+</style>
+</head>
+<body>
+<div id="total">$$TOTALNUMBER$$ $$ITEMS$$</div>
+<h1>$$PAGETITLE$$</h1>
+<table cellpadding="8" cellspacing="0">
+[/HEADER]
+[ITEM]
+<tr class="borrowed$$borrower_FLAG$$">
+  <td valign="top" align="center" bgcolor="#ddd" width="80" >
+  	<img align="top" src="$$image$$" height="$$HEIGHT_PIC$$" border="0" alt="$$title$$" title="$$title$$" class="image">
+  </td>
+  <td valign="top">
+  	<div class="detail">$$genre$$ - $$country$$ - $$time$$<br>
+    $$date$$</div>
+    
+  	<div class="title">$$title$$</div>
+    $$director$$ <br>
+    
+    <div class="synopsis">$$actors_LABEL$$$$SEPARATOR$$$$actors$$<br>
+    	$$synopsis$$
+    </div>
+    
+  </td>
+</tr>
+[/ITEM]
+[FOOTER]
+</table>
+<div id="footer">
+	$$GENERATOR_NOTE$$
+</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Flat.png b/share/gcstar/html_models/GCfilms/Flat.png
new file mode 100644
index 0000000..5373102
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/Flat.png differ
diff --git a/share/gcstar/html_models/GCfilms/Shelf b/share/gcstar/html_models/GCfilms/Shelf
new file mode 100644
index 0000000..1a7d7ae
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Shelf
@@ -0,0 +1,284 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. It emulates a shelf display.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body
+{
+ color:black;
+}
+h1
+{
+ text-align:left;
+ margin-left:0.5em;
+ font-size:200%;
+ font-weight:bold;
+ color:#6c7b8b;
+}
+h2
+{
+ font-size:150%;
+ text-align:center;
+ color:#1c86ee;
+ font-weight:bold;
+}
+h3
+{
+ font-size:120%;
+ font-weight:bold;
+ margin:1em 0;
+ color:#6c7b8b;
+ border-bottom:1px dashed #6c7b8b;
+}
+#left
+{
+[JAVASCRIPT]
+ width:48%;
+[/JAVASCRIPT]
+ border:1px dashed #6c7b8b;
+ background:#f0f0f0;
+}
+.imgbox
+{
+ float:left;
+ padding:2em 1em 0em;
+ margin:0;
+}
+img
+{
+ margin:0;
+ padding:0;
+[JAVASCRIPT]
+ cursor:pointer;
+[/JAVASCRIPT]
+}
+.imginfo
+{
+ float:left;
+ margin-top:0.5em;
+[JAVASCRIPT]
+ cursor:default;
+[/JAVASCRIPT]
+}
+.synopsis
+{
+ height:8em;
+ overflow:auto;
+ padding:0.2em;
+ background:#f0f0f0;
+}
+table
+{
+ margin:0 0.5em;
+}
+th
+{
+ font-weight:bold;
+ text-align:left;
+ white-space:nowrap;
+ padding:0.5em;
+ background:#f0f0f0;
+}
+td
+{
+ padding:0.5em;
+ background:#f0f0f0;
+}
+#note
+{
+ text-align:center;
+ padding-top:0.5em;
+[JAVASCRIPT]
+ width:48%;
+[/JAVASCRIPT]
+ color:#6c7b8b;
+}
+#note a
+{
+ font-weight:bold;
+ color:#1c86ee;
+}
+#note a:hover
+{
+ color:#6c7b8b;
+}
+.spacer
+{
+  clear: both;
+}
+[JAVASCRIPT]
+.expander
+{
+ padding:0;
+ width:1em;
+ display:block;
+ float:left;
+ text-align:center;
+ margin-right:0.5em;
+ cursor:pointer;
+}
+[/JAVASCRIPT]
+.info
+{
+ position:fixed;
+ top:0;
+ right:1%;
+ width:48%;
+ display:none;
+}
+.details
+{
+ overflow: auto;
+ height: 500px;
+}
+</style>
+[JAVASCRIPT]
+<script type="text/javascript">
+<!--
+function getBoxes()
+{
+  return document.getElementById("left").getElementsByTagName("div")
+}
+function getHeight()
+{
+  //From http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
+  myHeight = 0;
+  if( typeof( window.innerWidth ) == 'number' ) {
+    //Non-IE
+    myHeight = window.innerHeight;
+  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
+    //IE 6+ in 'standards compliant mode'
+    myHeight = document.documentElement.clientHeight;
+  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
+    //IE 4 compatible
+    myHeight = document.body.clientHeight;
+  }
+  return myHeight - 150;
+}
+function init()
+{
+  // CSS changes from http://www.quirksmode.org/dom/changess.html
+  if (!document.styleSheets) return;
+  var theRules = new Array();
+  if (document.styleSheets[0].cssRules)
+    theRules = document.styleSheets[0].cssRules
+  else if (document.styleSheets[0].rules)
+    theRules = document.styleSheets[0].rules
+  theRules[theRules.length-1].style.height = getHeight()+'px';
+
+  boxes = getBoxes()
+  for(i=0; i < boxes.length; i++)
+  {
+    box =  boxes[i]
+    if (box.className == "movie")
+    {
+      boxes2 = box.getElementsByTagName("div")
+      boxes2[0].onclick = function(evt)
+      {
+        div = this.parentNode
+        showMe(div.getElementsByTagName("div")[1], this)
+      }
+    }
+  }
+  headers = document.getElementById("left").getElementsByTagName("h3")
+  for(i=0; i < headers.length; i++)
+  {
+    header =  headers[i]
+    header.style.cursor = 'pointer'
+    header.innerHTML = '<span class="expander">−</span> ' + header.innerHTML
+    header.onclick = function(evt)
+    {
+      table = this.nextSibling
+      while (table.tagName != "TABLE") { table = table.nextSibling }
+      if (table.style.display == "none")
+      {
+        table.style.display = "table"
+        this.innerHTML = this.innerHTML.replace(/\+<\/span>/, '−</span>')
+      }
+      else
+      {
+        table.style.display = "none"
+        this.innerHTML = this.innerHTML.replace(/−<\/span>/, '+</span>')
+      }     
+    }
+  }
+}
+var currentBox = 0
+var currentImg = 0
+function showMe(box, img)
+{
+  hidePrevious()
+  box.style.display = "block"
+  img.style.background = "#4b4f63"
+  img.style.padding = "1em"
+  currentBox = box
+  currentImg = img
+}
+function hidePrevious()
+{
+  if (currentBox)
+  {
+    currentBox.style.display = "none"
+    currentImg.style.background = "#f0f0f0"
+    currentImg.style.padding = "2em 1em 0em"
+  }
+}
+-->
+</script>
+[/JAVASCRIPT]
+</head>
+<body [JAVASCRIPT]onload="init()"[/JAVASCRIPT]>
+<h1>$$PAGETITLE$$</h1>
+<div id="left">
+[/HEADER]
+[ITEM]
+<div class="movie">
+ <div class="imgbox">
+  <img src="$$image$$" height="$$HEIGHT_PIC$$" alt="$$title$$" title="$$title$$" />
+ </div>
+ <div class="info">
+   <h2>$$title$$</h2>
+   <div class="details">
+     <h3>$$info_LABEL$$</h3>
+     <table>
+      <tr>
+        <td rowspan="5" width="10%">
+          <img class="imginfo" src="$$image$$" height="$$HEIGHT_PIC$$" alt="$$title$$" title="$$title$$" />
+        </td>
+        <th>$$date_LABEL$$</th><td>$$date$$</td>
+      </tr>
+      <tr><th>$$director_LABEL$$</th><td>$$director$$</td></tr>
+      <tr><th>$$time_LABEL$$</th><td>$$time$$</td></tr>
+      <tr><th>$$genre_LABEL$$</th><td>$$genre$$</td></tr>
+      <tr><th>$$actors_LABEL$$</th><td>$$actors$$</td></tr>
+      <tr>
+        <td colspan="3">
+          <p class="synopsis">
+            $$synopsis$$
+          </p>
+        </td>
+     </table>
+     <h3>$$details_LABEL$$</h3>
+     <table>
+      <tr><th>$$rating_LABEL$$</th><td>$$rating$$/10</td></tr>
+      <tr><th>$$format_LABEL$$</th><td>$$format$$ ($$number$$)</td></tr>
+      <tr><th>$$borrower_LABEL$$</th><td>$$borrower$$</td></tr>
+     </table>
+   </div>
+ </div>
+</div>
+[/ITEM]
+[FOOTER]
+<div class="spacer">&nbsp;</div>
+</div>
+<p id="note">$$GENERATOR_NOTE$$</p>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Shelf.png b/share/gcstar/html_models/GCfilms/Shelf.png
new file mode 100644
index 0000000..f4423d0
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/Shelf.png differ
diff --git a/share/gcstar/html_models/GCfilms/Simple b/share/gcstar/html_models/GCfilms/Simple
new file mode 100644
index 0000000..ee5a5f8
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Simple
@@ -0,0 +1,100 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. A really simple list that could be printed
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body
+{
+ color:black;
+}
+h1
+{
+ text-align:center;
+ font-size:200%;
+ font-weight:bold;
+}
+table
+{
+ border-collapse:collapse;
+ margin:1em 5%;
+ margin-bottom:3em;
+ width:90%;
+}
+tr+tr
+{
+ border-top:1px solid black;
+}
+.borrowed1
+{
+ color:#777777;
+ font-style:italic;
+}
+th
+{
+ border-bottom:2px solid black;
+ margin:0;
+ padding:1em;
+ font-weight:bold;
+}
+td
+{
+ padding:0.2em 1em;
+}
+#legend
+{
+ margin:1em;
+ border:1px solid black;
+ display:inline;
+ padding:0.5em;
+}
+#note
+{
+ border-top:1px solid black;
+ margin:3em 8%;
+ margin-bottom:2em;
+ padding-top:0.5em;
+ text-align:center;
+ font-size:90%;
+}
+#note a
+{
+ color:black ! important;
+ text-decoration:underline;
+ font-weight:bold;
+}
+</style>
+</head>
+<body>
+<h1>$$PAGETITLE$$</h1>
+<table>
+<tr>
+ <th>$$title_LABEL$$</th>
+ <th>$$director_LABEL$$</th>
+ <th>$$genre_LABEL$$</th>
+ <th>$$date_LABEL$$</th>
+ <th>$$time_LABEL$$</th>
+</tr>
+[/HEADER]
+[ITEM]
+<tr class="borrowed$$borrower_FLAG$$">
+  <td>$$title$$</td>
+  <td>$$director$$</td>
+  <td>$$genre$$</td>
+  <td>$$date$$</td>
+  <td>$$time$$</td>
+</tr>
+[/ITEM]
+[FOOTER]
+</table>
+<p id="legend" class="borrowed1">$$BORROWED_ITEMS$$</p>
+<p id="note">$$GENERATOR_NOTE$$</p>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Simple.png b/share/gcstar/html_models/GCfilms/Simple.png
new file mode 100644
index 0000000..3e23235
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/Simple.png differ
diff --git a/share/gcstar/html_models/GCfilms/Tabs b/share/gcstar/html_models/GCfilms/Tabs
new file mode 100644
index 0000000..bec3b18
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Tabs
@@ -0,0 +1,245 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. It emulates a notebook display.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body {
+ margin:0;
+ padding:0;
+ background:white;
+}
+h1 {
+ text-align:center;
+ color:#7c551a;
+}
+h2 {
+ background:transparent;
+ margin:0 0 1em;
+ color:#ffffff;
+}
+.movie {
+ height:18em;
+ clear:both;
+ margin:1em;
+ padding:0.5em;
+ background:#e3c79e;
+ border:1px dashed #7c551a;
+}
+.imgbox {
+ text-align:center;
+ float:left;
+ margin-right:1em;
+ width:120px;
+}
+h3 {
+ color:#513D23;
+ background:#ffffff;
+ cursor:default;
+ margin:0;
+ padding:0.4em;
+ display:none;
+ font-size:100%;
+ border-left:0.1em solid black;
+ border-bottom:0.1em solid white;
+ border-right:0.1em solid black;
+ border-top:0.1em solid black;
+ -moz-border-radius-topright:2em;
+ z-index:99;
+ position:relative;
+}
+div > h3
+{
+ display:block;
+}
+.details h3, .synopsis h3 {
+ background:#ffffff;
+ border-bottom:0.1em solid black;
+}
+.info, .details, .synopsis {
+ float:left;
+ width:12em;
+}
+.info dl, .details dl, .synopsis p {
+ border:0.1em solid black;
+ padding:1em 0.5em 0.5em;
+ margin:-0.1em 0 0;
+ z-index:1;
+ position:relative;
+ width:45em;
+ height:10em;
+ background:white;
+}
+.details dl, .synopsis p {
+ display:none;
+ margin-left:-11.8em;
+ width:44.8em;
+}
+.synopsis p {
+ margin-left:-23.8em;
+}
+dt {
+ float:left;
+ width:10em;
+ font-weight:bold;
+ height:1.5em;
+ color:#A49480;
+}
+dd {
+ padding:0;
+ margin-left:10em;
+ height:1.5em;
+ color:#555555;
+}
+#note {
+ text-align:center;
+ margin:2em 5em;
+ background:#e3c79e;
+ border:1px solid #7c551a;
+ padding:0.3em;
+}
+#note a {
+ font-weight:bold;
+ color:#7c551a;
+}
+[NOJAVASCRIPT]
+.info:hover dl,.details:hover dl, .synopsis:hover p {
+ padding-top:1em;
+ display:block;
+ color:#555555;
+ z-index:2;
+}
+.details:hover dl, .synopsis:hover p {
+ border:0;
+ border-top:0.1em solid black;
+ margin-top:-0.1em;
+ margin-left:-11.9em;
+ height:9.9em;
+ z-index:100;
+}
+.synopsis:hover p {
+ margin-left:-23.9em;
+}
+.info:hover h3, .details:hover h3, .synopsis:hover h3 {
+ background:#ffffff;
+ border-bottom:0;
+ border-bottom:0.1em solid white;
+ z-index:999;
+}
+[/NOJAVASCRIPT]
+[JAVASCRIPT]
+h3 {
+ cursor:pointer;
+ background:#e8ded0 ! important;
+}
+.details_active dl, .synopsis_active p {
+ padding-top:1em;
+ display:block;
+ color:#555555;
+ z-index:2;
+}
+.details_active dl, .synopsis_active p {
+ border:0;
+ border-top:0.1em solid black;
+ margin-top:-0.1em;
+ margin-left:-11.9em;
+ height:9.9em;
+ z-index:100;
+}
+.synopsis_active p {
+ margin-left:-23.9em;
+}
+.info_active h3, .details_active h3, .synopsis_active h3 {
+ background:#ffffff ! important;
+ border-bottom:0.1em solid white;
+ z-index:999;
+}
+.synopsis p {
+ overflow:auto;
+}
+[/JAVASCRIPT]
+</style>
+[JAVASCRIPT]
+<script type="text/javascript">
+<!--
+ function showMe(cssClass, objectId)
+ {
+  divs = document.getElementById('movie'+objectId).getElementsByTagName("div")
+  for(i=0; i < divs.length; i++)
+  {
+   if ((divs[i].className != 'imgbox') && (divs[i].className.substr(0,4) != 'note'))
+   {
+    if (divs[i].className.indexOf(cssClass) != -1)
+    {
+     divs[i].className = cssClass + '_active ' + cssClass
+    }
+    else
+    {
+     idx = divs[i].className.indexOf(' ')
+     if (idx != -1)
+     {
+      //alert('Setting ' + divs[i].className.substring(idx + 1))
+      divs[i].className = divs[i].className.substring(idx + 1)
+     }
+    }
+   }
+  }
+ }
+-->
+</script>
+[/JAVASCRIPT]
+</head>
+<body>
+<h1>$$PAGETITLE$$</h1>
+[/HEADER]
+[ITEM]
+<div class="movie" id="movie$$IDX$$">
+ <h2>$$title$$</h2>
+ <div class="imgbox">
+  <img src="$$image$$" height="$$HEIGHT_PIC$$" alt="$$title$$" title="$$title$$" />
+ </div>
+ <div class="info[JAVASCRIPT]_active info[/JAVASCRIPT]">
+  <h3[JAVASCRIPT] onclick="showMe('info', $$IDX$$)"[/JAVASCRIPT]>$$info_LABEL$$</h3>
+  <dl>
+   <dt>$$date_LABEL$$</dt>
+   <dd>$$date$$</dd>
+   <dt>$$director_LABEL$$</dt>
+   <dd>$$director$$</dd>
+   <dt>$$time_LABEL$$</dt>
+   <dd>$$time$$</dd>
+   <dt>$$genre_LABEL$$</dt>
+   <dd>$$genre$$</dd>
+   <dt>$$actors_LABEL$$</dt>
+   <dd>$$actors$$</dd>
+  </dl>
+ </div>
+ <div class="details">
+  <h3[JAVASCRIPT] onclick="showMe('details', $$IDX$$)"[/JAVASCRIPT]>$$details_LABEL$$</h3>
+  <dl>
+   <dt>$$rating_LABEL$$</dt>
+   <dd><div class="note$$RATING$$">$$rating$$/10</div></dd>
+   <dt>$$format_LABEL$$</dt>
+   <dd>$$format$$ ($$number$$)</dd>
+   <dt>$$audio_LABEL$$</dt>
+   <dd>$$audio$$</dd>
+   <dt>$$borrower_LABEL$$</dt>
+   <dd>$$borrower$$</dd>
+  </dl>
+ </div>
+ <div class="synopsis">
+  <h3[JAVASCRIPT] onclick="showMe('synopsis', $$IDX$$)"[/JAVASCRIPT]>$$synopsis_LABEL$$</h3>
+  <p>$$synopsis$$</p>
+ </div>
+</div>
+[/ITEM]
+[FOOTER]
+<div id="note">$$GENERATOR_NOTE$$</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Tabs.png b/share/gcstar/html_models/GCfilms/Tabs.png
new file mode 100644
index 0000000..fc217aa
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/Tabs.png differ
diff --git a/share/gcstar/html_models/GCfilms/Tian b/share/gcstar/html_models/GCfilms/Tian
new file mode 100644
index 0000000..c87d34f
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Tian
@@ -0,0 +1,276 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<!--
+  Template made by Tian. It is based on design of Tian's website:
+  http://www.c-sait.net/
+-->
+<head>
+ <title>$$PAGETITLE$$</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+[JAVASCRIPT]
+ <script type="text/javascript">
+<!--
+expandTooltip="Afficher les informations du film";
+collapseTooltip="Masquer les informations du film";
+function prn(s)
+{
+ document.write(s)
+}
+function getE(id)
+{
+ return document.getElementById(id)
+}
+function expcolAll(dir,rowNum)
+{
+ for(x=0;x < rowNum;x++) {
+  try {
+   getE('movie'+x).style.display=dir
+   if(dir=="none") getE('switch'+x).innerHTML="+"
+   else getE('switch'+x).innerHTML="&ndash;"
+  }
+  catch(err) { }
+ }
+}
+function toggleDisplay(id,swt)
+{
+ if((getE(id).style.display=="")||(getE(id).style.display=="none")) {
+  getE(id).style.display="block"
+  getE(swt).innerHTML="&ndash;"
+  getE(swt).title=collapseTooltip
+ } else {
+  getE(id).style.display="none"
+  getE(swt).innerHTML="+"
+  getE(swt).title=expandTooltip
+ }
+ return false
+}
+function writeExpandControl(elementId,collapse)
+{
+ prn("<a href=\"#\" class=\"movie-expand\" id=\"switch"+elementId+"\" onclick=\"return toggleDisplay('movie"+elementId+"','switch"+elementId+"');\" title=\""+((collapse) ? expandTooltip : collapseTooltip)+"\">"+((collapse) ? "+" : "&ndash;")+"</a>")
+}
+function searchMovies(text)
+{
+ getE("collapseAll").click()
+ alldt=document.getElementsByTagName("dt")
+ alldd=document.getElementsByTagName("dd")
+ nb=alldt.length
+ re=new RegExp(text,"i")
+ for(i=0;i<nb;i++) {
+  s1=alldt[i].getElementsByTagName("a")[1].innerHTML
+  s2=alldd[i].innerHTML
+  res=0
+  if(getE("searchType").value=="all") res=(re.test(s1)||re.test(s2))
+  else res=re.test(s1)
+  if(res) st="block"
+  else st="none"
+  alldt[i].style.display=st
+  alldd[i].style.display=st
+ }
+}
+-->
+ </script>
+[/JAVASCRIPT]
+ <style type="text/css">
+   body {
+   background:#f7f8ff;
+  }
+  h1 {
+   font-weight:bold;
+   font-size:160%;
+   text-align:center;
+   margin-bottom:1em;
+  }
+  #top {
+   color:#624a66 ! important;
+   background:transparent ! important;
+  }
+  form {
+   text-align:center;
+   border:1px solid #c0c0c0;
+   background:#e2e2df;
+   margin:0 3em;
+   padding:0.5em;
+  }
+  input,select {
+   border:2px solid #aaaaaa;
+   background:purple;
+   color:white;
+   margin:0 0.5em;
+  }
+  input:focus, input.submit:hover {
+   background:#f3e3f9;
+   color:black;
+  }
+  input.submit {
+   cursor:pointer;
+  }
+  #links {
+   margin-top:0.5em;
+   text-align:center;
+   font-size:120%;
+   color:#aaaaaa;
+  }
+  .letter {
+   padding:0 0.5em;
+  }
+  img {
+   float:left;
+   margin:0 1em 1em 1em;
+  }
+  dt {
+   color:#aaaaaa;
+   font-size:120%;
+   margin:0em 0.5em;
+   clear:both;
+  }
+  dd {
+   margin:0.5em 2em 1em;
+   border-left:1px solid #2e3766;
+   border-bottom:1px solid #2e3766;
+  }
+  table {
+   font-size:90%;
+   margin:0 1em;
+   border:1px solid black;
+   width:60%;
+  }
+  th {
+   font-weight:bold;
+   text-align:left;
+   width:25%;
+  }
+  .tr1 {
+   background:#d4cce0;
+  }
+  .tr2 {
+   background:#c0b9cc;
+  }
+  a {
+   color:#2e3766;
+   background:transparent;
+   text-decoration:none;
+  }
+  a:hover, a:focus {
+   background-color:#e8e8ef;
+  }
+  .topl {
+   color:#aaaaaa;
+   font-size:90%;
+  }
+  .movie-expand {
+   width:1em;
+   text-align:center;
+   font-size:120%;
+   float:left;
+   margin:0.2em;
+  }
+  p, #note {
+   background:white;
+   border:2px solid purple;
+   clear:left;
+   margin:1em 2em;
+   padding:0.5em;
+  }
+  .borrowed0 {
+   font-size:80%;
+   color:#c0b9cc;
+   background:transparent;
+   text-decoration:none;
+   display:block;
+  }
+  .borrowed1 {
+   font-size:80%;
+   color:purple;
+   background:transparent;
+   text-decoration:none;
+   display:block;
+  }
+  #note {
+  	text-align:center;
+  }
+  #note a {
+    text-decoration:underline;
+  }
+ </style>
+</head>
+<body>
+ <h1><a id="top">$$PAGETITLE$$</a></h1>
+[JAVASCRIPT]
+ <form onsubmit="searchMovies(getE('searchText').value); return false" action="">
+  <div>
+  <input type="text" id="searchText" title="$$FORM_INPUT$$" />
+  <select id="searchType">
+   <option value="title">$$FORM_SEARCH1$$</option>
+   <option value="all">$$FORM_SEARCH2$$</option>
+  </select>
+  <input type="button" class="submit" value="$$FORM_SEARCHBUTTON$$" title="$$FORM_SEARCHTITLE$$" onclick="searchMovies(getE('searchText').value)" />
+  <input type="button" class="submit" value="$$FORM_ALLBUTTON$$" title="$$FORM_ALLTITLE$$" onclick="searchMovies('')" />
+  <br />
+  <br />
+  <input  type="button" class="submit" value="$$FORM_EXPAND$$" onclick="expcolAll('block','$$TOTALNUMBER$$')" title="$$FORM_EXPANDTITLE$$" />
+  <input  type="button" id="collapseAll" class="submit" value="$$FORM_COLLAPSE$$" onclick="expcolAll('none','$$TOTALNUMBER$$')" title="$$FORM_COLLAPSETITLE$$" />
+  </div>
+ </form>
+[/JAVASCRIPT]
+ <div id="links">| _ | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z |</div>
+ <dl>
+[/HEADER]
+[ITEM]
+  <dt>
+[JAVASCRIPT]
+   <script type="text/javascript">writeExpandControl('$$IDX$$',1)</script>
+[/JAVASCRIPT]
+   <a id="movielink_$$IDX$$" href="$$URL$$">$$title$$</a> | <a class="topl" href="#top">($$TOP$$)</a>   
+   <span class="borrowed$$borrower_FLAG$$">$$borrower_YESNO$$$$borrower_OREMPTY$$</span>
+  </dt>
+  <dd>
+   <div id="movie$$IDX$$" style="display:none;">
+    <img src="$$image$$" alt="$$title$$" title= "$$title$$" height="$$HEIGHT_PIC$$" />
+    <table>
+     <tr class="tr1"><th>$$time_LABEL$$</th><td>$$time$$</td></tr>
+     <tr class="tr2"><th>$$genre_LABEL$$</th><td>$$genre$$</td></tr>
+     <tr class="tr1"><th>$$date_LABEL$$</th><td>$$date$$</td></tr>
+     <tr class="tr2"><th>$$director_LABEL$$</th><td>$$director$$</td></tr>
+     <tr class="tr1"><th>$$actors_LABEL$$</th><td>$$actors$$</td></tr>
+     <tr class="tr2"><th>$$format_LABEL$$</th><td>$$format$$ ($$number$$)</td></tr>
+     <tr class="tr1"><th>$$rating_LABEL$$</th><td>$$rating$$/10</td></tr>
+     <tr class="tr2"><th>$$audio_LABEL$$</th><td>$$audio$$</td></tr>
+     <tr class="tr1"><th>$$subt_LABEL$$</th><td>$$subt$$</td></tr>
+    </table>
+    <p>$$synopsis$$<br /><br /><em>$$comment$$</em></p>
+   </div>
+  </dd>
+[/ITEM]
+[FOOTER]
+ </dl>
+ <div id="note">$$GENERATOR_NOTE$$</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+
+  my %letters = ();
+  my $idx = 0;
+
+  foreach (@items)
+  {
+    my $title = $self->{options}->{originalList}->transformValue($_->{title}, 'title');
+    my $firstLetter = uc(substr($title, 0, 1));
+    $firstLetter =~ s/[^A-Z]/_/;
+    if (!$letters{$firstLetter})
+    {
+    	$body =~ s/<a id="movielink_$idx"/<a id="$firstLetter"/;
+        $letters{$firstLetter} = 1;
+    }
+    $idx++;
+  }
+
+  foreach (keys %letters)
+  {
+    $header =~ s/\| $_ \|/| <a class="letter" href="#$_">$_<\/a> |/;
+  }
+  $header =~ s/\| ([^<|]) /| <span class="letter">$1<\/span> /g;
+  #$header =~ s/\| ([^<]) \|/| <span class="letter">$1<\/span> |/g;
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Tian-Mario b/share/gcstar/html_models/GCfilms/Tian-Mario
new file mode 100644
index 0000000..15ff986
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Tian-Mario
@@ -0,0 +1,276 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<!--
+  Template made by Tian ( http://www.c-sait.net/ )
+  Color scheme by Mario Tomic ( http://www.mariotomic.com/ )
+-->
+<head>
+ <title>$$PAGETITLE$$</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+[JAVASCRIPT]
+ <script type="text/javascript">
+<!--
+expandTooltip="Afficher les informations du film";
+collapseTooltip="Masquer les informations du film";
+function prn(s)
+{
+ document.write(s)
+}
+function getE(id)
+{
+ return document.getElementById(id)
+}
+function expcolAll(dir,rowNum)
+{
+ for(x=0;x < rowNum;x++) {
+  try {
+   getE('movie'+x).style.display=dir
+   if(dir=="none") getE('switch'+x).innerHTML="+"
+   else getE('switch'+x).innerHTML="&ndash;"
+  }
+  catch(err) { }
+ }
+}
+function toggleDisplay(id,swt)
+{
+ if((getE(id).style.display=="")||(getE(id).style.display=="none")) {
+  getE(id).style.display="block"
+  getE(swt).innerHTML="&ndash;"
+  getE(swt).title=collapseTooltip
+ } else {
+  getE(id).style.display="none"
+  getE(swt).innerHTML="+"
+  getE(swt).title=expandTooltip
+ }
+ return false
+}
+function writeExpandControl(elementId,collapse)
+{
+ prn("<a href=\"#\" class=\"movie-expand\" id=\"switch"+elementId+"\" onclick=\"return toggleDisplay('movie"+elementId+"','switch"+elementId+"');\" title=\""+((collapse) ? expandTooltip : collapseTooltip)+"\">"+((collapse) ? "+" : "&ndash;")+"</a>")
+}
+function searchMovies(text)
+{
+ getE("collapseAll").click()
+ alldt=document.getElementsByTagName("dt")
+ alldd=document.getElementsByTagName("dd")
+ nb=alldt.length
+ re=new RegExp(text,"i")
+ for(i=0;i<nb;i++) {
+  s1=alldt[i].getElementsByTagName("a")[1].innerHTML
+  s2=alldd[i].innerHTML
+  res=0
+  if(getE("searchType").value=="all") res=(re.test(s1)||re.test(s2))
+  else res=re.test(s1)
+  if(res) st="block"
+  else st="none"
+  alldt[i].style.display=st
+  alldd[i].style.display=st
+ }
+}
+-->
+ </script>
+[/JAVASCRIPT]
+ <style type="text/css">
+   body {
+   background:#222222;
+  }
+  h1 {
+   font-weight:bold;
+   font-size:160%;
+   text-align:center;
+   margin-bottom:1em;
+  }
+  #top {
+   color:#ffaa00 ! important;
+   background:transparent ! important;
+  }
+  form {
+   text-align:center;
+   border:1px dashed #999999;
+   background:#111111;
+   margin:0 3em;
+   padding:0.5em;
+  }
+  input,select {
+   border:1px solid #666666;
+   background: #333333;
+   color: #b2b2b2;
+   margin:0 0.5em;
+  }
+  input:focus, input.submit:hover {
+   background:#000000;
+   color: #b2b2b2;
+  }
+    }
+  input:hover, input.submit:hover {
+   background:#000000;
+   color: #b2b2b2;
+  }
+  input.submit {
+   cursor:pointer;
+  }
+  #links {
+   margin-top:0.5em;
+   text-align:center;
+   font-size:120%;
+   color: #333333;
+  }
+  img {
+   float:left;
+   margin:0 1em 1em 1em;
+  }
+  dt {
+   color:#aaaaaa;
+   font-size:120%;
+   margin:0em 0.5em;
+   clear:both;
+  }
+  dd {
+   margin:0.5em 2em 1em;
+   border-left:1px dashed #999999;
+   border-bottom:1px dashed #999999;
+  }
+  table {
+   font-size:90%;
+   margin:0 1em;
+   border:1px dashed #b2b2b2;
+   width:60%;
+   color: #b2b2b2;
+  }
+  th {
+   font-weight:bold;
+   text-align:left;
+   width:25%;
+  }
+  .tr1 {
+   background:#333333;
+  }
+  .tr2 {
+   background:#333333;
+  }
+  a {
+   color:#ffaa00;
+   background:transparent;
+   text-decoration:none;
+  }
+  a:hover, a:focus {
+   color:#000000;
+   background-color:#ffaa00;
+  }
+  .topl {
+   color:#444444;
+   font-size:90%;
+  }
+  .movie-expand {
+   width:1em;
+   text-align:center;
+   font-size:120%;
+   float:left;
+   margin:0.2em;
+  }
+  p, #note {
+   color:#b2b2b2;
+   background:#000000;
+   border:1px dashed #999999;
+   clear:left;
+   margin:1em 2em;
+   padding:0.5em;
+  }
+  .borrowed0 {
+   color:#222222;
+   background:transparent;
+   text-decoration:none;
+   font-size:50%;
+   display:block;
+  }
+  .borrowed1 {
+   color:#333333;
+   background:transparent;
+   text-decoration:none;
+   font-size:50%;
+   display:block;
+  }
+  #note {
+  	text-align:center;
+  }
+ </style>
+</head>
+<body>
+ <h1><a id="top">$$PAGETITLE$$</a></h1>
+[JAVASCRIPT]
+ <form onsubmit="searchMovies(getE('searchText').value); return false" action="">
+  <div>
+  <input type="text" id="searchText" title="$$FORM_INPUT$$" />
+  <select id="searchType">
+   <option value="title">$$FORM_SEARCH1$$</option>
+   <option value="all">$$FORM_SEARCH2$$</option>
+  </select>
+  <input type="button" class="submit" value="$$FORM_SEARCHBUTTON$$" title="$$FORM_SEARCHTITLE$$" onclick="searchMovies(getE('searchText').value)" />
+  <input type="button" class="submit" value="$$FORM_ALLBUTTON$$" title="$$FORM_ALLTITLE$$" onclick="searchMovies('')" />
+  <br />
+  <br />
+  <input  type="button" class="submit" value="$$FORM_EXPAND$$" onclick="expcolAll('block','$$TOTALNUMBER$$')" title="$$FORM_EXPANDTITLE$$" />
+  <input  type="button" id="collapseAll" class="submit" value="$$FORM_COLLAPSE$$" onclick="expcolAll('none','$$TOTALNUMBER$$')" title="$$FORM_COLLAPSETITLE$$" />
+  </div>
+ </form>
+[/JAVASCRIPT]
+ <div id="links">| _ | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z |</div>
+ <dl>
+[/HEADER]
+[ITEM]
+  <dt>
+[JAVASCRIPT]
+   <script type="text/javascript">writeExpandControl('$$IDX$$',1)</script>
+[/JAVASCRIPT]
+   <a id="movielink_$$IDX$$" href="$$URL$$">$$title$$</a> | <a class="topl" href="#top">($$TOP$$)</a>   
+   <span class="borrowed$$borrower_FLAG$$">$$borrower_YESNO$$$$borrower_OREMPTY$$</span>
+  </dt>
+  <dd>
+   <div id="movie$$IDX$$" style="display:none;">
+    <img src="$$image$$" alt="$$title$$" title= "$$title$$" height="$$HEIGHT_PIC$$" />
+    <table>
+     <tr class="tr1"><th>$$time_LABEL$$</th><td>$$time$$</td></tr>
+     <tr class="tr2"><th>$$genre_LABEL$$</th><td>$$genre$$</td></tr>
+     <tr class="tr1"><th>$$date_LABEL$$</th><td>$$date$$</td></tr>
+     <tr class="tr2"><th>$$director_LABEL$$</th><td>$$director$$</td></tr>
+     <tr class="tr1"><th>$$actors_LABEL$$</th><td>$$actors$$</td></tr>
+     <tr class="tr2"><th>$$format_LABEL$$</th><td>$$format$$ ($$number$$)</td></tr>
+     <tr class="tr1"><th>$$rating_LABEL$$</th><td>$$rating$$/10</td></tr>
+     <tr class="tr2"><th>$$audio_LABEL$$</th><td>$$audio$$</td></tr>
+     <tr class="tr1"><th>$$subt_LABEL$$</th><td>$$subt$$</td></tr>
+    </table>
+    <p>$$synopsis$$<br /><br /><em>$$comment$$</em></p>
+   </div>
+  </dd>
+[/ITEM]
+[FOOTER]
+ </dl>
+ <div id="note">$$GENERATOR_NOTE$$</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+
+  my %letters = ();
+  my $idx = 0;
+
+  foreach (@items)
+  {
+    my $title = $self->{options}->{originalList}->transformValue($_->{title}, 'title');
+    my $firstLetter = uc(substr($title, 0, 1));
+    $firstLetter =~ s/[^A-Z]/_/;
+    if (!$letters{$firstLetter})
+    {
+    	$body =~ s/<a id="movielink_$idx"/<a id="$firstLetter"/;
+        $letters{$firstLetter} = 1;
+    }
+    $idx++;
+  }
+
+  foreach (keys %letters)
+  {
+    $header =~ s/\| $_ \|/| <a href="#$_">$_<\/a> |/;
+  }
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Tian-Mario-Kim b/share/gcstar/html_models/GCfilms/Tian-Mario-Kim
new file mode 100644
index 0000000..2772020
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/Tian-Mario-Kim
@@ -0,0 +1,281 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<!--
+  Template made by Tian ( http://www.c-sait.net/ )
+  Color scheme by Mario Tomic ( http://www.mariotomic.com/ )
+-->
+<head>
+ <title>$$PAGETITLE$$</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+[JAVASCRIPT]
+ <script type="text/javascript">
+<!--
+expandTooltip="Afficher les informations du film";
+collapseTooltip="Masquer les informations du film";
+function prn(s)
+{
+ document.write(s)
+}
+function getE(id)
+{
+ return document.getElementById(id)
+}
+function expcolAll(dir,rowNum)
+{
+ for(x=0;x < rowNum;x++) {
+  try {
+   getE('movie'+x).style.display=dir
+   if(dir=="none") getE('switch'+x).innerHTML="+"
+   else getE('switch'+x).innerHTML="&ndash;"
+  }
+  catch(err) { }
+ }
+}
+function toggleDisplay(id,swt)
+{
+ if((getE(id).style.display=="")||(getE(id).style.display=="none")) {
+  getE(id).style.display="block"
+  getE(swt).innerHTML="&ndash;"
+  getE(swt).title=collapseTooltip
+ } else {
+  getE(id).style.display="none"
+  getE(swt).innerHTML="+"
+  getE(swt).title=expandTooltip
+ }
+ return false
+}
+function writeExpandControl(elementId,collapse)
+{
+ prn("<a href=\"#\" class=\"movie-expand\" id=\"switch"+elementId+"\" onclick=\"return toggleDisplay('movie"+elementId+"','switch"+elementId+"');\" title=\""+((collapse) ? expandTooltip : collapseTooltip)+"\">"+((collapse) ? "+" : "&ndash;")+"</a>")
+}
+function searchMovies(text)
+{
+ getE("collapseAll").click()
+ alldt=document.getElementsByTagName("dt")
+ alldd=document.getElementsByTagName("dd")
+ nb=alldt.length
+ re=new RegExp(text,"i")
+ for(i=0;i<nb;i++) {
+  s1=alldt[i].getElementsByTagName("a")[1].innerHTML
+  s2=alldd[i].innerHTML
+  res=0
+  if(getE("searchType").value=="all") res=(re.test(s1)||re.test(s2))
+  else res=re.test(s1)
+  if(res) st="block"
+  else st="none"
+  alldt[i].style.display=st
+  alldd[i].style.display=st
+ }
+}
+-->
+ </script>
+[/JAVASCRIPT]
+ <style type="text/css">
+   body {
+   background:#222222;
+  }
+  h1 {
+   font-weight:bold;
+   font-size:160%;
+   text-align:center;
+   margin-bottom:1em;
+  }
+  #top {
+   color:#ffaa00 ! important;
+   background:transparent ! important;
+  }
+  form {
+   text-align:center;
+   border:1px dashed #999999;
+   background:#111111;
+   margin:0 3em;
+   padding:0.5em;
+  }
+  input,select {
+   border:1px solid #666666;
+   background: #333333;
+   color: #b2b2b2;
+   margin:0 0.5em;
+  }
+  input:focus, input.submit:hover {
+   background:#000000;
+   color: #b2b2b2;
+  }
+    }
+  input:hover, input.submit:hover {
+   background:#000000;
+   color: #b2b2b2;
+  }
+  input.submit {
+   cursor:pointer;
+  }
+  #links {
+   margin-top:0.5em;
+   text-align:center;
+   font-size:120%;
+   color: #333333;
+  }
+  img {
+   float:left;
+   margin:0 1em 1em 1em;
+  }
+  dt {
+   color:#aaaaaa;
+   font-size:120%;
+   margin:0em 0.5em;
+   clear:both;
+  }
+  dd {
+   margin:0.5em 2em 1em;
+   border-left:1px dashed #999999;
+   border-bottom:1px dashed #999999;
+  }
+  table {
+   font-size:90%;
+   margin:0 1em;
+   border:1px dashed #b2b2b2;
+   width:60%;
+   color: #b2b2b2;
+  }
+  th {
+   font-weight:bold;
+   text-align:left;
+   width:25%;
+  }
+  .tr1 {
+   background:#333333;
+  }
+  .tr2 {
+   background:#333333;
+  }
+  a {
+   color:#ffaa00;
+   background:transparent;
+   text-decoration:none;
+  }
+  a:hover, a:focus {
+   color:#000000;
+   background-color:#ffaa00;
+  }
+  .topl {
+   color:#444444;
+   font-size:90%;
+  }
+  .movie-expand {
+   width:1em;
+   text-align:center;
+   font-size:120%;
+   float:left;
+   margin:0.2em;
+  }
+  p, #note {
+   color:#b2b2b2;
+   background:#000000;
+   border:1px dashed #999999;
+   clear:left;
+   margin:1em 2em;
+   padding:0.5em;
+  }
+  .borrowed0 {
+   color:#222222;
+   background:transparent;
+   text-decoration:none;
+   font-size:50%;
+   display:block;
+  }
+  .borrowed1 {
+   color:#333333;
+   background:transparent;
+   text-decoration:none;
+   font-size:50%;
+   display:block;
+  }
+  #note {
+  	text-align:center;
+  }
+ </style>
+</head>
+<body>
+ <h1><a id="top">$$PAGETITLE$$</a></h1>
+[JAVASCRIPT]
+ <form onsubmit="searchMovies(getE('searchText').value); return false" action="">
+  <div>
+  <input type="text" id="searchText" title="$$FORM_INPUT$$" />
+  <select id="searchType">
+   <option value="title">$$FORM_SEARCH1$$</option>
+   <option value="all">$$FORM_SEARCH2$$</option>
+  </select>
+  <input type="button" class="submit" value="$$FORM_SEARCHBUTTON$$" title="$$FORM_SEARCHTITLE$$" onclick="searchMovies(getE('searchText').value)" />
+  <input type="button" class="submit" value="$$FORM_ALLBUTTON$$" title="$$FORM_ALLTITLE$$" onclick="searchMovies('')" />
+  <br />
+  <br />
+  <input  type="button" class="submit" value="$$FORM_EXPAND$$" onclick="expcolAll('block','$$TOTALNUMBER$$')" title="$$FORM_EXPANDTITLE$$" />
+  <input  type="button" id="collapseAll" class="submit" value="$$FORM_COLLAPSE$$" onclick="expcolAll('none','$$TOTALNUMBER$$')" title="$$FORM_COLLAPSETITLE$$" />
+  </div>
+ </form>
+[/JAVASCRIPT]
+ <div id="links">| _ | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z |</div>
+ <dl>
+[/HEADER]
+[ITEM]
+  <dt>
+[JAVASCRIPT]
+   <script type="text/javascript">writeExpandControl('$$IDX$$',1)</script>
+[/JAVASCRIPT]
+   <a id="movielink_$$IDX$$" href="$$URL$$">$$title$$</a> | <a class="topl" href="#top">($$TOP$$)</a>   
+   <span class="borrowed$$borrower_FLAG$$">$$borrower_YESNO$$$$borrower_OREMPTY$$</span>
+  </dt>
+  <dd>
+   <div id="movie$$IDX$$" style="display:none;">
+    <a href="$$backpic$$"><img src="$$image$$" alt="$$title$$" title= "$$title$$" height="$$HEIGHT_PIC$$" /></a>
+    <table>
+     <tr class="tr1"><th>$$date_LABEL$$</th><td>$$date$$</td></tr>
+     <tr class="tr2"><th>$$genre_LABEL$$</th><td>$$genre$$</td></tr>
+     <tr class="tr1"><th>$$id_LABEL$$</th><td>$$id$$</td></tr>
+     <tr class="tr2"><th>$$original_LABEL$$</th><td>$$original$$</td></tr>
+     <tr class="tr1"><th>$$time_LABEL$$</th><td>$$time$$ Min.</td></tr>
+     <tr class="tr2"><th>$$director_LABEL$$</th><td>$$director$$</td></tr>
+     <tr class="tr1"><th>$$actors_LABEL$$</th><td>$$actors$$</td></tr>
+     <tr class="tr2"><th>$$rating_LABEL$$</th><td>$$rating$$/10</td></tr>
+     <tr class="tr1"><th>$$age_LABEL$$</th><td>$$age$$</td></tr>
+     <tr class="tr2"><th>$$country_LABEL$$</th><td>$$country$$</td></tr>
+     <tr class="tr1"><th>$$audio_LABEL$$</th><td>$$audio$$</td></tr>
+     <tr class="tr2"><th>$$comment_LABEL$$</th><td>$$comment$$</td></tr>
+     <tr class="tr1"><th>$$serie_LABEL$$</th><td>$$serie$$</td></tr>
+     <tr class="tr2"><th>$$subt_LABEL$$</th><td>$$subt$$</td></tr>
+    </table>
+    <p>$$synopsis$$</p>
+   </div>
+  </dd>
+[/ITEM]
+[FOOTER]
+ </dl>
+ <div id="note">$$GENERATOR_NOTE$$</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+
+  my %letters = ();
+  my $idx = 0;
+
+  foreach (@items)
+  {
+    my $title = $self->{options}->{originalList}->transformValue($_->{title}, 'title');
+    my $firstLetter = uc(substr($title, 0, 1));
+    $firstLetter =~ s/[^A-Z]/_/;
+    if (!$letters{$firstLetter})
+    {
+    	$body =~ s/<a id="movielink_$idx"/<a id="$firstLetter"/;
+        $letters{$firstLetter} = 1;
+    }
+    $idx++;
+  }
+
+  foreach (keys %letters)
+  {
+    $header =~ s/\| $_ \|/| <a href="#$_">$_<\/a> |/;
+  }
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/Tian-Mario.png b/share/gcstar/html_models/GCfilms/Tian-Mario.png
new file mode 100644
index 0000000..70dc0b3
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/Tian-Mario.png differ
diff --git a/share/gcstar/html_models/GCfilms/Tian.png b/share/gcstar/html_models/GCfilms/Tian.png
new file mode 100644
index 0000000..942f51c
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/Tian.png differ
diff --git a/share/gcstar/html_models/GCfilms/float b/share/gcstar/html_models/GCfilms/float
new file mode 100644
index 0000000..47a9924
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/float
@@ -0,0 +1,120 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+	Template made by float
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body {
+	color:#004DFF;
+	background-color : white;
+	font-family : arial, helvetica, sans-serif;
+	font-size : 12px;
+	margin : 10px;
+}
+
+td {
+	font-family : arial, sans-serif;
+	font-size : 12px;
+}
+h1 {
+	font-size:130%;
+	font-weight:bold;
+	border-bottom : solid black 1px;
+	margin:0px;
+}
+.borrowed1 {
+}
+a {
+	color : #666;
+	text-decoration : none;	
+
+}
+a:hover {
+	text-decoration : underline;
+}
+.title {
+ 	font-size : 110%;
+ 	font-weight : bold;
+}
+.synopsis {
+	margin-top : .6em;
+	text-align : justify;
+
+	margin-bottom : 1.5em;
+	color : #333;
+}
+.image {
+	margin-bottom : 1.5em;
+}
+.detail {
+	float : right;
+	text-align : right;
+	color : #888;
+}
+#total {
+	float: center;
+	font-weight: bold;
+	text-align: center;
+}
+#footer {
+	border-top : solid black 1px;	
+	font-size:small;
+	color : #666;
+	text-align: center;
+}
+#top {
+	text-align: left;
+}
+#middle {
+	text-align: center;
+}
+#bottom {
+	text-align: right;
+}
+</style>
+</head>
+<body>
+<a name="top" id="top"></a>
+<div id="total">$$PAGETITLE$$ - $$TOTALNUMBER$$ $$ITEMS$$</div><br><br>
+<table width="550" align="center" cellpadding="8" cellspacing="0">
+[/HEADER]
+[ITEM]
+<tr class="borrowed$$borrower_FLAG$$">
+  <td valign="top" align="center" bgcolor="#E3E1C6" width="80" >
+  	<img align="top" src="$$image$$" height="$$HEIGHT_PIC$$" border="0" alt="$$title$$" title="$$title$$" class="image">
+  </td>
+  <td valign="top" bgcolor="#ECEBD9">
+  	<div class="detail"><b>$$time_LABEL$$:</b>&nbsp;$$time$$<br>
+    <b>$$genre_LABEL$$:</b>&nbsp;$$genre$$</div>
+    <div class="title">$$title$$</div>
+    <div class="synopsis"><b>$$director_LABEL$$:</b><br>$$director$$
+	<br><br><b>$$actors_LABEL$$:</b><br>$$actors$$
+	<br><br><b>$$synopsis_LABEL$$:</b><br>$$synopsis$$
+	<br><br>
+	<b>
+	<table width="100%">
+	<tr>
+	<td align="left"><a href="#top">$$TOP$$</a></td>
+	<td align="center"><a href="$$trailer$$">$$gtk-media-play$$</a></td>
+	<td align="right"><a href="#bottom">$$BOTTOM$$</a></td>
+	</tr>
+	</table>
+	</div> 
+  </td>
+</tr>
+[/ITEM]
+[FOOTER]
+</table>
+<div id="footer">
+	$$GENERATOR_NOTE$$
+</div>
+<a name="bottom" id="bottom"></a>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
\ No newline at end of file
diff --git a/share/gcstar/html_models/GCfilms/float.png b/share/gcstar/html_models/GCfilms/float.png
new file mode 100644
index 0000000..e047a32
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/float.png differ
diff --git a/share/gcstar/html_models/GCfilms/rootII_design b/share/gcstar/html_models/GCfilms/rootII_design
new file mode 100644
index 0000000..74873aa
--- /dev/null
+++ b/share/gcstar/html_models/GCfilms/rootII_design
@@ -0,0 +1,118 @@
+[HEADER]
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+	<!-- ------------------------------------------------------------------------------------------------
+	rootII 2005
+	Template for HTML export of a GCfilms collection
+	------------------------------------------------------------------------------------------------ -->
+<head>
+	<meta content="text/html; charset=UTF-8"  http-equiv="content-type">
+	<title>$$PAGETITLE$$</title>
+[JAVASCRIPT]
+	<script type="text/javascript" language="javascript1.2"><!--
+		var	alreadyOpennedLayer="";
+		function hidelayer(id){
+			if  (document.getElementById(id).style.visibility=="visible") 
+				document.getElementById(id).style.visibility='hidden';
+		}
+		function showlayer(id){
+			if  (document.getElementById(id) && document.getElementById(id).style.visibility!='visible') 
+			{
+				if (alreadyOpennedLayer!="") hidelayer(alreadyOpennedLayer);
+				alreadyOpennedLayer=id;				
+				document.getElementById(id).style.visibility='visible';
+			}
+		}
+//--></script>
+[/JAVASCRIPT]
+<style type="text/css" media="screen">
+	body {
+		font-family:helvetica, verdana, arial;
+		color:rgb(253, 253, 253); 
+		background-color:rgb(204, 204, 204); 
+		font-family:helvetica, verdana, arial; 
+		font-size:100%;
+	}
+	.synopsis { 
+		background-color:rgb(174,174,174 ); 
+		border:1px none #000000;
+		text-align:justify;
+		font-family:helvetica, verdana, arial; 
+		font-size:90%;
+		visibility:hidden; 
+		position:absolute;
+		width:80%; 
+	}
+	strong {
+		color:#FFFFFF;  
+		font-size:120%;
+	}
+	td {
+		color : #666666;
+	}
+	a {
+		text-decoration : none;
+	}
+	#design {
+		text-align:right;
+		color:rgb(174, 174, 174);	
+	}
+	#gcstar {
+		text-align:right;
+		color:rgb(174, 174, 174);
+	}
+</style>
+<style type="text/css"  media="print" >	
+	body {
+		font-family:helvetica, verdana, arial;
+		font-size:100%;
+	}
+	.synopsis {
+		display: none;
+	}
+	#design {
+		display: none;
+	}
+	#gcstar {
+		text-align:right;
+		color:rgb(174, 174,174);
+	}
+</style>
+</head>
+<body link="#666666" alink="#666666" vlink="#999999">
+	<div id="header-title">
+		<h1>$$PAGETITLE$$</h1>
+	</div>
+	<table border="0" align="center" cellspacing="0" cellpadding="0"  width="80%">
+	<tr>
+		<td>
+[/HEADER]
+[ITEM]
+			<table border="0" align="center" cellspacing="0" cellpadding="0"  width="100%">
+				<tr><td colspan=3><strong>$$title$$</strong></td></tr>
+				<tr><td width="80" rowspan=7><img align="top" src="$$image$$" height="$$HEIGHT_PIC$$" border="0"
+												name="image$$IDX$$" alt="$$title$$" title="$$title$$"
+												[JAVASCRIPT]onMouseOver='showlayer("synop$$IDX$$")'[/JAVASCRIPT]></td>
+						<td width="100"><small>$$original_LABEL$$$$SEPARATOR$$</small></td><td><small>$$original$$</small></td></tr>
+				<tr><td><small>$$director_LABEL$$$$SEPARATOR$$</small></td><td><small>$$director$$</small></td></tr>
+				<tr><td><small>$$date_LABEL$$$$SEPARATOR$$</small></td><td><small>$$date$$</small></td></tr>
+				<tr><td><small>$$time_LABEL$$$$SEPARATOR$$</small></td><td><small>$$time$$</small></td></tr>
+				<tr><td><small>$$country_LABEL$$$$SEPARATOR$$</small></td><td><small>$$country$$</small></td></tr>
+				<tr><td><small>$$genre_LABEL$$$$SEPARATOR$$</small></td><td><small>$$genre$$</small></td></tr>
+				<tr><td><small>$$actors_LABEL$$$$SEPARATOR$$</small></td><td><small>$$actors$$</small></td></tr>
+				<tr><td colspan=3><div class="synopsis" id="synop$$IDX$$" [JAVASCRIPT]onMouseOut='hidelayer("synop$$IDX$$")'[/JAVASCRIPT]>$$synopsis$$</div></td></tr>
+				<tr><td colspan=3><hr></td></tr>
+			</table>
+[/ITEM]
+[FOOTER]
+</td></tr>
+<tr><td>$$TOTALNUMBER$$ films</td></tr>
+	</table>
+	<div id="design"><br><br><br><br><small>design by 
+		<em>rootII design department</em></small></div>
+	<div id="export">$$GENERATOR_NOTE$$</div>	
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCfilms/rootII_design.png b/share/gcstar/html_models/GCfilms/rootII_design.png
new file mode 100644
index 0000000..ffeae14
Binary files /dev/null and b/share/gcstar/html_models/GCfilms/rootII_design.png differ
diff --git a/share/gcstar/html_models/GCgames/Flat b/share/gcstar/html_models/GCgames/Flat
new file mode 100644
index 0000000..8587298
--- /dev/null
+++ b/share/gcstar/html_models/GCgames/Flat
@@ -0,0 +1,111 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Yanbab. Flat and compact list.
+  Adapted to video games by Tian.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+
+body {
+	color:black;
+	background-color : white;
+	font-family : arial, sans-serif;
+	font-size : 12px;
+	margin : 10px;
+}
+
+td {
+	font-family : arial, sans-serif;
+	font-size : 12px;
+}
+
+h1 {
+	font-size:130%;
+	font-weight:bold;
+	border-bottom : solid black 1px;
+	margin:0px;
+}
+
+.borrowed1 {
+}
+
+#footer {
+	border-top : solid black 1px;	
+	font-size:small;
+	color : #666;
+}
+a {
+	color : #666;
+	text-decoration : none;	
+
+}
+a:hover {
+	text-decoration : underline;
+}
+#total {
+	float: right;
+	font-weight: bold;
+}
+.title {
+ 	font-size : 110%;
+ 	font-weight : bold;
+}
+
+.synopsis {
+	margin-top : .6em;
+	text-align : justify;
+
+	margin-bottom : 1.5em;
+	color : #333;
+}
+
+.image {
+	margin-bottom : 1.5em;
+}
+
+.detail {
+	float : right;
+	text-align : right;
+	color : #888;
+}
+</style>
+</head>
+<body>
+<div id="total">$$TOTALNUMBER$$ $$ITEMS$$</div>
+<h1>$$PAGETITLE$$</h1>
+<table cellpadding="8" cellspacing="0">
+[/HEADER]
+[ITEM]
+<tr class="borrowed$$borrower_FLAG$$">
+  <td valign="top" align="center" bgcolor="#ddd" width="80" >
+    <a href="$$web$$">
+      <img align="top" src="$$boxpic$$" height="$$HEIGHT_PIC$$" border="0" alt="$$name$$" title="$$name$$" class="image">
+    </a>
+  </td>
+  <td valign="top">
+  	<div class="detail">$$platform$$ - $$editor$$<br>
+    $$genre$$</div>
+    
+  	<div class="title">$$name$$</div>
+    
+    <div class="synopsis">
+    	$$description$$
+    </div>
+    
+  </td>
+</tr>
+[/ITEM]
+[FOOTER]
+</table>
+<div id="footer">
+	$$GENERATOR_NOTE$$
+</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCgames/Flat.png b/share/gcstar/html_models/GCgames/Flat.png
new file mode 100644
index 0000000..68dc96a
Binary files /dev/null and b/share/gcstar/html_models/GCgames/Flat.png differ
diff --git a/share/gcstar/html_models/GCgames/Simple b/share/gcstar/html_models/GCgames/Simple
new file mode 100644
index 0000000..dc61b0d
--- /dev/null
+++ b/share/gcstar/html_models/GCgames/Simple
@@ -0,0 +1,10 @@
+<metamodel>
+	<model>Simple</model>
+	<fields>
+		<field>name</field>
+		<field>editor</field>
+		<field>platform</field>
+		<field>genre</field>
+		<field>players</field>
+	</fields>
+</metamodel>
diff --git a/share/gcstar/html_models/GCgames/Simple.png b/share/gcstar/html_models/GCgames/Simple.png
new file mode 100644
index 0000000..d1c34d3
Binary files /dev/null and b/share/gcstar/html_models/GCgames/Simple.png differ
diff --git a/share/gcstar/html_models/GCgames/Tabs b/share/gcstar/html_models/GCgames/Tabs
new file mode 100644
index 0000000..e6b5ccb
--- /dev/null
+++ b/share/gcstar/html_models/GCgames/Tabs
@@ -0,0 +1,284 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. It emulates a notebook display.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body {
+ margin:0;
+ padding:0;
+ background:white;
+}
+h1 {
+ text-align:center;
+ color:#7c551a;
+}
+h2 {
+ background:transparent;
+ margin:0 0 1em;
+ color:#ffffff;
+}
+.item {
+ height:23em;
+ clear:both;
+ margin:1em;
+ padding:0.5em;
+ background:#e3c79e;
+ border:1px dashed #7c551a;
+}
+.imgbox {
+ text-align:center;
+ float:left;
+ margin-right:1em;
+ width:120px;
+}
+a img {
+ border:0;
+}
+h3 {
+ color:#513D23;
+ background:#ffffff;
+ cursor:default;
+ margin:0;
+ padding:0.4em;
+ display:none;
+ font-size:100%;
+ border-left:0.1em solid black;
+ border-bottom:0.1em solid white;
+ border-right:0.1em solid black;
+ border-top:0.1em solid black;
+ -moz-border-radius-topright:2em;
+ z-index:99;
+ position:relative;
+}
+div > h3
+{
+ display:block;
+}
+.description h3, .tips h3 {
+ background:#ffffff;
+ border-bottom:0.1em solid black;
+}
+.info, .description, .tips {
+ float:left;
+ width:12em;
+}
+.info dl, .description table, .tips div {
+ border:0.1em solid black;
+ padding:1em 0.5em 0.5em;
+ margin:-0.1em 0 0;
+ z-index:1;
+ position:relative;
+ width:45em;
+ height:15em;
+ background:white;
+}
+.description table, .tips div {
+ display:none;
+ margin-left:-11.8em;
+ width:44.8em;
+}
+.tips div {
+ margin-left:-23.8em;
+}
+dt {
+ float:left;
+ width:15em;
+ font-weight:bold;
+ height:1.5em;
+ color:#A49480;
+}
+dd {
+ padding:0;
+ margin-left:15em;
+ height:1.5em;
+ color:#555555;
+}
+.codes {
+ width:99%;
+}
+.codes td, .codes th {
+ padding:0.2em;
+ width:50%;
+}
+.codes th, .codes .odd td {
+ background:#e8ded0;
+}
+.codes + .codes {
+ margin:1em 0;
+ padding:1em 0;
+ border-top:2px solid #7c551a;
+ border-bottom:2px solid #7c551a;
+}
+#note {
+ text-align:center;
+ margin:2em 5em;
+ background:#e3c79e;
+ border:1px solid #7c551a;
+ padding:0.3em;
+}
+#note a {
+ font-weight:bold;
+ color:#7c551a;
+}
+[NOJAVASCRIPT]
+.info:hover dl,.description:hover table, .tips:hover div {
+ padding-top:1em;
+ display:block;
+ color:#555555;
+ z-index:2;
+}
+.description:hover table, .tips:hover div {
+ border:0;
+ border-top:0.1em solid black;
+ margin-top:-0.1em;
+ margin-left:-11.9em;
+ height:14.9em;
+ z-index:100;
+}
+.tips:hover div {
+ margin-left:-23.9em;
+}
+.info:hover h3, .description:hover h3, .tips:hover h3 {
+ background:#ffffff;
+ border-bottom:0;
+ border-bottom:0.1em solid white;
+ z-index:999;
+}
+[/NOJAVASCRIPT]
+[JAVASCRIPT]
+h3 {
+ cursor:pointer;
+ background:#e8ded0 ! important;
+}
+.description_active table, .tips_active div {
+ padding-top:1em;
+ display:block;
+ color:#555555;
+ z-index:2;
+}
+.description_active table, .tips_active div {
+ border:0;
+ border-top:0.1em solid black;
+ margin-top:-0.1em;
+ margin-left:-11.9em;
+ height:14.9em;
+ z-index:100;
+}
+.tips_active div {
+ margin-left:-23.9em;
+}
+.info_active h3, .description_active h3, .tips_active h3 {
+ background:#ffffff ! important;
+ border-bottom:0.1em solid white;
+ z-index:999;
+}
+.tips div {
+ overflow:auto;
+}
+td.desc {
+ height:5em;
+}
+td.desc p {
+ margin:0;
+ padding:0;
+ overflow:auto;
+ height:7em;
+}
+[/JAVASCRIPT]
+</style>
+[JAVASCRIPT]
+<script type="text/javascript">
+<!--
+ function showMe(cssClass, objectId)
+ {
+  divs = document.getElementById('item'+objectId).getElementsByTagName("div")
+  for(i=0; i < divs.length; i++)
+  {
+   if ((divs[i].className != 'imgbox') && (divs[i].className.substr(0,4) != 'note'))
+   {
+    if (divs[i].className.indexOf(cssClass) != -1)
+    {
+     divs[i].className = cssClass + '_active ' + cssClass
+    }
+    else
+    {
+     idx = divs[i].className.indexOf(' ')
+     if (idx != -1)
+     {
+      //alert('Setting ' + divs[i].className.substring(idx + 1))
+      divs[i].className = divs[i].className.substring(idx + 1)
+     }
+    }
+   }
+  }
+ }
+-->
+</script>
+[/JAVASCRIPT]
+</head>
+<body>
+<h1>$$PAGETITLE$$</h1>
+[/HEADER]
+[ITEM]
+<div class="item" id="item$$IDX$$">
+ <h2>$$name$$</h2>
+ <div class="imgbox">
+  <img src="$$boxpic$$" height="$$HEIGHT_PIC$$" alt="$$name$$" title="$$name$$" />
+ </div>
+ <div class="info[JAVASCRIPT]_active info[/JAVASCRIPT]">
+  <h3[JAVASCRIPT] onclick="showMe('info', $$IDX$$)"[/JAVASCRIPT]>$$info_LABEL$$</h3>
+  <dl>
+   <dt>$$platform_LABEL$$</dt>
+   <dd>$$platform$$</dd>
+   <dt>$$genre_LABEL$$</dt>
+   <dd>$$genre$$</dd>
+   <dt>$$players_LABEL$$</dt>
+   <dd>$$players$$</dd>
+   <dt>$$editor_LABEL$$</dt>
+   <dd>$$editor$$</dd>
+   <dt>$$released_LABEL$$</dt>
+   <dd>$$released$$</dd>
+   <dt>$$rating_LABEL$$</dt>
+   <dd>$$rating$$/10</dd>
+   <dt>$$completion_LABEL$$</dt>
+   <dd>$$completion$$</dd>
+   <dt>$$borrower_LABEL$$</dt>
+   <dd>$$borrower$$</dd>
+  </dl>
+ </div>
+ <div class="description">
+  <h3[JAVASCRIPT] onclick="showMe('description', $$IDX$$)"[/JAVASCRIPT]>$$description_LABEL$$</h3>
+  <table>
+   <tr><td><a href="$$screenshot1$$"><img height="100" src="$$screenshot1$$" alt="$$screenshot1_LABEL$$" /></a></td>
+   <td><a href="$$screenshot2$$"><img height="100" src="$$screenshot2$$" alt="$$screenshot2_LABEL$$" /></a></td></tr>
+   <tr><td colspan="2" class="desc"><p>$$description$$</p></td></tr>
+  </table>
+ </div>
+ <div class="tips">
+  <h3[JAVASCRIPT] onclick="showMe('tips', $$IDX$$)"[/JAVASCRIPT]>$$tips_LABEL$$</h3>
+  <div>
+   <table class="codes">
+   <tr><th>$$code_LABEL$$</th><th>$$Effect_LABEL$$</th></tr>
+    $$code_TABLE$$
+   </table>
+   <table class="codes">
+   <tr><th>$$unlockable_LABEL$$</th><th>$$Howto_LABEL$$</th></tr>
+    $$unlockable_TABLE$$
+   </table>
+   <p>$$secrets$$</p>
+  </div>
+ </div>
+</div>
+[/ITEM]
+[FOOTER]
+<div id="note">$$GENERATOR_NOTE$$</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCgames/Tabs.png b/share/gcstar/html_models/GCgames/Tabs.png
new file mode 100644
index 0000000..01adbc7
Binary files /dev/null and b/share/gcstar/html_models/GCgames/Tabs.png differ
diff --git a/share/gcstar/html_models/GCminicars/Tian-Jim b/share/gcstar/html_models/GCminicars/Tian-Jim
new file mode 100644
index 0000000..1d942bf
--- /dev/null
+++ b/share/gcstar/html_models/GCminicars/Tian-Jim
@@ -0,0 +1,279 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<!--
+  Template made by Tian. It is based on design of Tian's website:
+  http://www.c-sait.net/
+-->
+<head>
+ <title>$$PAGETITLE$$</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+[JAVASCRIPT]
+ <script type="text/javascript">
+<!--
+expandTooltip="Afficher les informations de la Miniature";
+collapseTooltip="Masquer les informations de la Miniature";
+function prn(s)
+{
+ document.write(s)
+}
+function getE(id)
+{
+ return document.getElementById(id)
+}
+function expcolAll(dir,rowNum)
+{
+ for(x=0;x < rowNum;x++) {
+  try {
+   getE('minicar'+x).style.display=dir
+   if(dir=="none") getE('switch'+x).innerHTML="+"
+   else getE('switch'+x).innerHTML="&ndash;"
+  }
+  catch(err) { }
+ }
+}
+function toggleDisplay(id,swt)
+{
+ if((getE(id).style.display=="")||(getE(id).style.display=="none")) {
+  getE(id).style.display="block"
+  getE(swt).innerHTML="&ndash;"
+  getE(swt).name=collapseTooltip
+ } else {
+  getE(id).style.display="none"
+  getE(swt).innerHTML="+"
+  getE(swt).name=expandTooltip
+ }
+ return false
+}
+function writeExpandControl(elementId,collapse)
+{
+ prn("<a href=\"#\" class=\"minicar-expand\" id=\"switch"+elementId+"\" onclick=\"return toggleDisplay('minicar"+elementId+"','switch"+elementId+"');\" title=\""+((collapse) ? expandTooltip : collapseTooltip)+"\">"+((collapse) ? "+" : "&ndash;")+"</a>")
+}
+function searchMinicars(text)
+{
+ getE("collapseAll").click()
+ alldt=document.getElementsByTagName("dt")
+ alldd=document.getElementsByTagName("dd")
+ nb=alldt.length
+ re=new RegExp(text,"i")
+ for(i=0;i<nb;i++) {
+  s1=alldt[i].getElementsByTagName("a")[1].innerHTML
+  s2=alldd[i].innerHTML
+  res=0
+  if(getE("searchType").value=="all") res=(re.test(s1)||re.test(s2))
+  else res=re.test(s1)
+  if(res) st="block"
+  else st="none"
+  alldt[i].style.display=st
+  alldd[i].style.display=st
+ }
+}
+-->
+ </script>
+[/JAVASCRIPT]
+ <style type="text/css">
+   body {
+   background:#f7f8ff;
+  }
+  h1 {
+   font-weight:bold;
+   font-size:160%;
+   text-align:center;
+   margin-bottom:1em;
+  }
+  #top {
+   color:#624a66 ! important;
+   background:transparent ! important;
+  }
+  form {
+   text-align:center;
+   border:1px solid #c0c0c0;
+   background:#e2e2df;
+   margin:0 3em;
+   padding:0.5em;
+  }
+  input,select {
+   border:2px solid #aaaaaa;
+   background:purple;
+   color:white;
+   margin:0 0.5em;
+  }
+  input:focus, input.submit:hover {
+   background:#f3e3f9;
+   color:black;
+  }
+  input.submit {
+   cursor:pointer;
+  }
+  #links {
+   margin-top:0.5em;
+   text-align:center;
+   font-size:120%;
+   color:#aaaaaa;
+  }
+  .letter {
+   padding:0 0.5em;
+  }
+  img {
+   float:left;
+   margin:0 1em 1em 1em;
+   border:1px solid #aaaaaa;
+  }
+  dt {
+   color:#aaaaaa;
+   font-size:120%;
+   margin:0em 0.5em;
+   clear:both;
+  }
+  dd {
+   margin:0.5em 2em 1em;
+   border-left:1px solid #2e3766;
+   border-bottom:1px solid #2e3766;
+  }
+  table {
+   font-size:90%;
+   margin:0 1em;
+   border:1px solid black;
+   width:60%;
+  }
+  th {
+   font-weight:bold;
+   text-align:left;
+   width:25%;
+  }
+  .tr1 {
+   background:#d4cce0;
+  }
+  .tr2 {
+   background:#c0b9cc;
+  }
+  a {
+   color:#2e3766;
+   background:transparent;
+   text-decoration:none;
+  }
+  a:hover, a:focus {
+   background-color:#e8e8ef;
+  }
+  .topl {
+   color:#aaaaaa;
+   font-size:90%;
+  }
+  .minicar-expand {
+   width:1em;
+   text-align:center;
+   font-size:120%;
+   float:left;
+   margin:0.2em;
+  }
+  p, #note {
+   background:white;
+   border:2px solid purple;
+   clear:left;
+   margin:1em 2em;
+   padding:0.5em;
+  }
+  .borrowed0 {
+   font-size:80%;
+   color:#c0b9cc;
+   background:transparent;
+   text-decoration:none;
+   display:block;
+  }
+  .borrowed1 {
+   font-size:80%;
+   color:purple;
+   background:transparent;
+   text-decoration:none;
+   display:block;
+  }
+  #note {
+  	text-align:center;
+  }
+  #note a {
+    text-decoration:underline;
+  }
+ </style>
+</head>
+<body>
+ <h1><a id="top">$$PAGETITLE$$</a></h1>
+[JAVASCRIPT]
+ <form onsubmit="searchMinicars(getE('searchText').value); return false" action="">
+  <div>
+  <input type="text" id="searchText" title="$$FORM_INPUT$$" />
+  <select id="searchType">
+   <option value="name">$$FORM_SEARCH1$$</option>
+   <option value="all">$$FORM_SEARCH2$$</option>
+  </select>
+  <input type="button" class="submit" value="$$FORM_SEARCHBUTTON$$" title="$$FORM_SEARCHTITLE$$" onclick="searchMinicars(getE('searchText').value)" />
+  <input type="button" class="submit" value="$$FORM_ALLBUTTON$$" title="$$FORM_ALLTITLE$$" onclick="searchMinicars('')" />
+  <br />
+  <br />
+  <input  type="button" class="submit" value="$$FORM_EXPAND$$" onclick="expcolAll('block','$$TOTALNUMBER$$')" title="$$FORM_EXPANDTITLE$$" />
+  <input  type="button" id="collapseAll" class="submit" value="$$FORM_COLLAPSE$$" onclick="expcolAll('none','$$TOTALNUMBER$$')" title="$$FORM_COLLAPSETITLE$$" />
+  </div>
+ </form>
+[/JAVASCRIPT]
+ <div id="links">| _ | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z |</div>
+ <dl>
+[/HEADER]
+[ITEM]
+  <dt>
+[JAVASCRIPT]
+   <script type="text/javascript">writeExpandControl('$$IDX$$',1)</script>
+[/JAVASCRIPT]
+   <a id="minicarlink_$$IDX$$" href="$$URL$$">$$name$$</a> | <a class="topl" href="#top">($$TOP$$)</a>   
+   <span class="borrowed$$borrower_FLAG$$">$$borrower_YESNO$$$$borrower_OREMPTY$$</span>
+  </dt>
+  <dd>
+   <div id="minicar$$IDX$$" style="display:none;">
+    <img src="$$picture$$" alt="$$name$$" title="$$name$$" height="160" />		
+	<table>
+     <tr class="tr1"><th>$$scale_LABEL$$</th><td>$$scale$$</td></tr>
+     <tr class="tr2"><th>$$manufacturer_LABEL$$</th><td>$$manufacturer$$</td></tr>
+     <tr class="tr1"><th>$$type1_LABEL$$</th><td>$$type1$$</td></tr>
+     <tr class="tr2"><th>$$constructor_LABEL$$</th><td>$$constructor$$</td></tr>
+     <tr class="tr1"><th>$$modele_LABEL$$</th><td>$$modele$$</td></tr>
+     <tr class="tr2"><th>$$version_LABEL$$</th><td>$$version$$</td></tr>
+     <tr class="tr1"><th>$$color_LABEL$$</th><td>$$color$$</td></tr>
+	 <tr class="tr2"><th>$$pub_LABEL$$</th><td>$$pub$$</td></tr>
+     <tr class="tr1"><th>$$year_LABEL$$</th><td>$$year$$</td></tr>
+	 <tr class="tr2"><th>$$reference_LABEL$$</th><td>$$reference$$</td></tr>
+	 <tr class="tr1"><th>$$rating1_LABEL$$</th><td>$$rating1$$/10</td></tr>	 
+    </table>
+    <p><em>$$comments1$$</em></p>
+   </div>
+  </dd>
+[/ITEM]
+[FOOTER]
+ </dl>
+ <div id="note">$$GENERATOR_NOTE$$</div>
+</body>
+</html>
+[/FOOTER]
+[POST]
+
+  my %letters = ();
+  my $idx = 0;
+
+  foreach (@items)
+  {
+    my $name = $self->{options}->{originalList}->transformValue($_->{name}, 'name');
+    my $firstLetter = uc(substr($name, 0, 1));
+    $firstLetter =~ s/[^A-Z]/_/;
+    if (!$letters{$firstLetter})
+    {
+    	$body =~ s/<a id="minicarlink_$idx"/<a id="$firstLetter"/;
+        $letters{$firstLetter} = 1;
+    }
+    $idx++;
+  }
+
+  foreach (keys %letters)
+  {
+    $header =~ s/\| $_ \|/| <a class="letter" href="#$_">$_<\/a> |/;
+  }
+  $header =~ s/\| ([^<|]) /| <span class="letter">$1<\/span> /g;
+  #$header =~ s/\| ([^<]) \|/| <span class="letter">$1<\/span> |/g;
+[/POST]
diff --git a/share/gcstar/html_models/GCminicars/Tian-Jim.png b/share/gcstar/html_models/GCminicars/Tian-Jim.png
new file mode 100644
index 0000000..3815533
Binary files /dev/null and b/share/gcstar/html_models/GCminicars/Tian-Jim.png differ
diff --git a/share/gcstar/html_models/GCmusics/Shelf b/share/gcstar/html_models/GCmusics/Shelf
new file mode 100644
index 0000000..429f179
--- /dev/null
+++ b/share/gcstar/html_models/GCmusics/Shelf
@@ -0,0 +1,298 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. It emulates a shelf display.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body
+{
+ color:black;
+}
+h1
+{
+ text-align:left;
+ margin-left:0.5em;
+ font-size:200%;
+ font-weight:bold;
+ color:#6c7b8b;
+}
+h2
+{
+ font-size:150%;
+ text-align:center;
+ color:#1c86ee;
+ font-weight:bold;
+ height:3em;
+}
+h3
+{
+ font-size:120%;
+ font-weight:bold;
+ margin:1em 0;
+ color:#6c7b8b;
+ border-bottom:1px dashed #6c7b8b;
+}
+#left
+{
+[JAVASCRIPT]
+ width:48%;
+[/JAVASCRIPT]
+ border:1px dashed #6c7b8b;
+ background:#f0f0f0;
+}
+.imgbox
+{
+ float:left;
+ padding:2em 1em 0em;
+ margin:0;
+}
+img
+{
+ margin:0;
+ padding:0;
+[JAVASCRIPT]
+ cursor:pointer;
+[/JAVASCRIPT]
+}
+.imginfo
+{
+ float:left;
+ margin-top:0.5em;
+[JAVASCRIPT]
+ cursor:default;
+[/JAVASCRIPT]
+}
+.synopsis
+{
+ height:8em;
+ overflow:auto;
+ padding:0.2em;
+ background:#f0f0f0;
+}
+table
+{
+ margin:0 2%;
+ width:95%;
+}
+th
+{
+ font-weight:bold;
+ text-align:left;
+ white-space:nowrap;
+ padding:0.5em;
+ background:#f0f0f0;
+ width:40%;
+}
+td
+{
+ padding:0.5em;
+ background:#f0f0f0;
+ display:block;
+ min-height:1.5em;
+ max-height:10em;
+ overflow:auto;
+}
+#tracks td
+{
+ display:table-cell;
+}
+tr.even td
+{
+ background:#f0f0f0;
+}
+tr.odd td
+{
+ background:#e0e0d0;
+}
+#note
+{
+ text-align:center;
+ padding-top:0.5em;
+[JAVASCRIPT]
+ width:48%;
+[/JAVASCRIPT]
+ color:#6c7b8b;
+}
+#note a
+{
+ font-weight:bold;
+ color:#1c86ee;
+}
+#note a:hover
+{
+ color:#6c7b8b;
+}
+.spacer
+{
+  clear: both;
+}
+[JAVASCRIPT]
+.expander
+{
+ padding:0;
+ width:1em;
+ display:block;
+ float:left;
+ text-align:center;
+ margin-right:0.5em;
+ cursor:pointer;
+}
+[/JAVASCRIPT]
+.info
+{
+ position:fixed;
+ top:0;
+ right:1%;
+ width:48%;
+ display:none;
+}
+.details
+{
+ overflow: auto;
+ height: 500px;
+}
+</style>
+[JAVASCRIPT]
+<script type="text/javascript">
+<!--
+function getBoxes()
+{
+  return document.getElementById("left").getElementsByTagName("div")
+}
+function getHeight()
+{
+  //From http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
+  myHeight = 0;
+  if( typeof( window.innerWidth ) == 'number' ) {
+    //Non-IE
+    myHeight = window.innerHeight;
+  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
+    //IE 6+ in 'standards compliant mode'
+    myHeight = document.documentElement.clientHeight;
+  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
+    //IE 4 compatible
+    myHeight = document.body.clientHeight;
+  }
+  return myHeight - 150;
+}
+function init()
+{
+  // CSS changes from http://www.quirksmode.org/dom/changess.html
+  if (!document.styleSheets) return;
+  var theRules = new Array();
+  if (document.styleSheets[0].cssRules)
+    theRules = document.styleSheets[0].cssRules
+  else if (document.styleSheets[0].rules)
+    theRules = document.styleSheets[0].rules
+  theRules[theRules.length-1].style.height = getHeight()+'px';
+
+  boxes = getBoxes()
+  for(i=0; i < boxes.length; i++)
+  {
+    box =  boxes[i]
+    if (box.className == "movie")
+    {
+      boxes2 = box.getElementsByTagName("div")
+      boxes2[0].onclick = function(evt)
+      {
+        div = this.parentNode
+        showMe(div.getElementsByTagName("div")[1], this)
+      }
+    }
+  }
+  headers = document.getElementById("left").getElementsByTagName("h3")
+  for(i=0; i < headers.length; i++)
+  {
+    header =  headers[i]
+    header.style.cursor = 'pointer'
+    header.innerHTML = '<span class="expander">−</span> ' + header.innerHTML
+    header.onclick = function(evt)
+    {
+      table = this.nextSibling
+      while (table.tagName != "TABLE") { table = table.nextSibling }
+      if (table.style.display == "none")
+      {
+        table.style.display = "table"
+        this.innerHTML = this.innerHTML.replace(/\+<\/span>/, '−</span>')
+      }
+      else
+      {
+        table.style.display = "none"
+        this.innerHTML = this.innerHTML.replace(/−<\/span>/, '+</span>')
+      }     
+    }
+  }
+}
+var currentBox = 0
+var currentImg = 0
+function showMe(box, img)
+{
+  hidePrevious()
+  box.style.display = "block"
+  img.style.background = "#4b4f63"
+  img.style.padding = "1em"
+  currentBox = box
+  currentImg = img
+}
+function hidePrevious()
+{
+  if (currentBox)
+  {
+    currentBox.style.display = "none"
+    currentImg.style.background = "#f0f0f0"
+    currentImg.style.padding = "2em 1em 0em"
+  }
+}
+-->
+</script>
+[/JAVASCRIPT]
+</head>
+<body [JAVASCRIPT]onload="init()"[/JAVASCRIPT]>
+<h1>$$PAGETITLE$$</h1>
+<div id="left">
+[/HEADER]
+[ITEM]
+<div class="movie">
+ <div class="imgbox">
+  <img src="$$COVER_FIELD$$" height="$$HEIGHT_PIC$$" alt="$$TITLE_FIELD$$" title="$$TITLE_FIELD$$" />
+ </div>
+ <div class="info">
+   <h2>$$TITLE_FIELD$$</h2>
+   <div class="details">
+     <h3>$$main_LABEL$$</h3>
+     <table>
+      <tr><th>$$artist_LABEL$$</th><td>$$artist$$</td></tr>
+      <tr><th>$$label_LABEL$$</th><td>$$label$$</td></tr>
+      <tr><th>$$release_LABEL$$</th><td>$$release$$</td></tr>
+      <tr><th>$$running_LABEL$$</th><td>$$running$$</td></tr>
+      <tr><th>$$genre_LABEL$$</th><td>$$genre$$</td></tr>
+     </table>
+
+     <h3>$$details_LABEL$$</h3>
+     <table>
+      <tr><th>$$producer_LABEL$$</th><td>$$producer$$</td></tr>
+      <tr><th>$$composer_LABEL$$</th><td>$$composer$$</td></tr>
+      <tr><th>$$comments_LABEL$$</th><td>$$comments$$</td></tr>
+     </table>
+   
+     <h3>$$tracks_LABEL$$</h3>
+     <table id="tracks">   
+       $$tracks_TABLE$$
+     </table>
+   </div>
+ </div>
+</div>
+[/ITEM]
+[FOOTER]
+<div class="spacer">&nbsp;</div>
+</div>
+<p id="note">$$GENERATOR_NOTE$$</p>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCmusics/Shelf.png b/share/gcstar/html_models/GCmusics/Shelf.png
new file mode 100644
index 0000000..83dbfd8
Binary files /dev/null and b/share/gcstar/html_models/GCmusics/Shelf.png differ
diff --git a/share/gcstar/html_models/GCmusics/Simple b/share/gcstar/html_models/GCmusics/Simple
new file mode 100644
index 0000000..7cef04c
--- /dev/null
+++ b/share/gcstar/html_models/GCmusics/Simple
@@ -0,0 +1,10 @@
+<metamodel>
+	<model>Simple</model>
+	<fields>
+		<field>title</field>
+		<field>artist</field>
+		<field>running</field>
+		<field>label</field>
+		<field>genre</field>
+	</fields>
+</metamodel>
diff --git a/share/gcstar/html_models/GCmusics/Simple.png b/share/gcstar/html_models/GCmusics/Simple.png
new file mode 100644
index 0000000..4bc59cf
Binary files /dev/null and b/share/gcstar/html_models/GCmusics/Simple.png differ
diff --git a/share/gcstar/html_models/GCstar/Shelf b/share/gcstar/html_models/GCstar/Shelf
new file mode 100644
index 0000000..e699fdc
--- /dev/null
+++ b/share/gcstar/html_models/GCstar/Shelf
@@ -0,0 +1,282 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. It emulates a shelf display.
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body
+{
+ color:black;
+}
+h1
+{
+ text-align:left;
+ margin-left:0.5em;
+ font-size:200%;
+ font-weight:bold;
+ color:#6c7b8b;
+}
+h2
+{
+ font-size:150%;
+ text-align:center;
+ color:#1c86ee;
+ font-weight:bold;
+ height:3em;
+}
+h3
+{
+ font-size:120%;
+ font-weight:bold;
+ margin:1em 0;
+ color:#6c7b8b;
+ border-bottom:1px dashed #6c7b8b;
+}
+#left
+{
+[JAVASCRIPT]
+ width:48%;
+[/JAVASCRIPT]
+ border:1px dashed #6c7b8b;
+ background:#f0f0f0;
+}
+.imgbox
+{
+ float:left;
+ padding:2em 1em 0em;
+ margin:0;
+}
+.imgbox img
+{
+ margin:0;
+ padding:0;
+[JAVASCRIPT]
+ cursor:pointer;
+[/JAVASCRIPT]
+}
+.imginfo
+{
+ float:left;
+ margin-top:0.5em;
+[JAVASCRIPT]
+ cursor:default;
+[/JAVASCRIPT]
+}
+.info
+{
+ position:fixed;
+ top:0;
+ right:1%;
+ width:48%;
+ display:none;
+}
+.synopsis
+{
+ height:8em;
+ overflow:auto;
+ padding:0.2em;
+ background:#f0f0f0;
+}
+table
+{
+ margin:0 2%;
+ width:95%;
+}
+th
+{
+ font-weight:bold;
+ text-align:left;
+ white-space:nowrap;
+ padding:0.5em;
+ background:#f0f0f0;
+ width:40%;
+}
+td
+{
+ padding:0.5em;
+ background:#f0f0f0;
+ display:block;
+ min-height:1.5em;
+ max-height:12em;
+ overflow:auto;
+}
+#note
+{
+ text-align:center;
+ padding-top:0.5em;
+[JAVASCRIPT]
+ width:48%;
+[/JAVASCRIPT]
+ color:#6c7b8b;
+}
+#note a
+{
+ font-weight:bold;
+ color:#1c86ee;
+}
+#note a:hover
+{
+ color:#6c7b8b;
+}
+.spacer
+{
+  clear: both;
+}
+[JAVASCRIPT]
+.expander
+{
+ padding:0;
+ width:1em;
+ display:block;
+ float:left;
+ text-align:center;
+ margin-right:0.5em;
+ cursor:pointer;
+}
+[/JAVASCRIPT]
+.info
+{
+ position:fixed;
+ top:0;
+ right:1%;
+ width:48%;
+ display:none;
+}
+.details
+{
+ overflow: auto;
+ height: 500px;
+}
+</style>
+[JAVASCRIPT]
+<script type="text/javascript">
+<!--
+function getBoxes()
+{
+  return document.getElementById("left").getElementsByTagName("div")
+}
+function getHeight()
+{
+  //From http://www.howtocreate.co.uk/tutorials/javascript/browserwindow
+  myHeight = 0;
+  if( typeof( window.innerWidth ) == 'number' ) {
+    //Non-IE
+    myHeight = window.innerHeight;
+  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
+    //IE 6+ in 'standards compliant mode'
+    myHeight = document.documentElement.clientHeight;
+  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
+    //IE 4 compatible
+    myHeight = document.body.clientHeight;
+  }
+  return myHeight - 150;
+}
+function init()
+{
+  // CSS changes from http://www.quirksmode.org/dom/changess.html
+  if (!document.styleSheets) return;
+  var theRules = new Array();
+  if (document.styleSheets[0].cssRules)
+    theRules = document.styleSheets[0].cssRules
+  else if (document.styleSheets[0].rules)
+    theRules = document.styleSheets[0].rules
+  theRules[theRules.length-1].style.height = getHeight()+'px';
+
+  boxes = getBoxes()
+  for(i=0; i < boxes.length; i++)
+  {
+    box =  boxes[i]
+    if (box.className == "movie")
+    {
+      boxes2 = box.getElementsByTagName("div")
+      boxes2[0].onclick = function(evt)
+      {
+        div = this.parentNode
+        showMe(div.getElementsByTagName("div")[1], this)
+      }
+    }
+  }
+  headers = document.getElementById("left").getElementsByTagName("h3")
+  for(i=0; i < headers.length; i++)
+  {
+    header =  headers[i]
+    header.style.cursor = 'pointer'
+    header.innerHTML = '<span class="expander">−</span> ' + header.innerHTML
+    header.onclick = function(evt)
+    {
+      table = this.nextSibling
+      while (table.tagName != "TABLE") { table = table.nextSibling }
+      if (table.style.display == "none")
+      {
+        table.style.display = "table"
+        this.innerHTML = this.innerHTML.replace(/\+<\/span>/, '−</span>')
+      }
+      else
+      {
+        table.style.display = "none"
+        this.innerHTML = this.innerHTML.replace(/−<\/span>/, '+</span>')
+      }     
+    }
+  }
+}
+var currentBox = 0
+var currentImg = 0
+function showMe(box, img)
+{
+  hidePrevious()
+  box.style.display = "block"
+  img.style.background = "#4b4f63"
+  img.style.padding = "1em"
+  currentBox = box
+  currentImg = img
+}
+function hidePrevious()
+{
+  if (currentBox)
+  {
+    currentBox.style.display = "none"
+    currentImg.style.background = "#f0f0f0"
+    currentImg.style.padding = "2em 1em 0em"
+  }
+}
+-->
+</script>
+[/JAVASCRIPT]
+</head>
+<body [JAVASCRIPT]onload="init()"[/JAVASCRIPT]>
+<h1>$$PAGETITLE$$</h1>
+<div id="left">
+[/HEADER]
+[ITEM]
+<div class="movie">
+ <div class="imgbox">
+  <img src="$$COVER_FIELD$$" height="$$HEIGHT_PIC$$" alt="$$TITLE_FIELD$$" title="$$TITLE_FIELD$$" />
+ </div>
+ <div class="info">
+   <h2>$$TITLE_FIELD$$</h2>
+   <div class="details">
+     [LOOP0 values=GCSgroups idx=GROUP]
+     <h3>$$GROUP_LABEL$$</h3>
+     <table>
+      [LOOP1 values=GROUP idx=VALUE]
+      <tr><th>$$VALUE_LABEL$$</th><td>$$VALUE$$</td></tr>
+      [/LOOP1]
+     </table>
+     [/LOOP0]
+   </div>
+ </div>
+</div>
+[/ITEM]
+[FOOTER]
+<div class="spacer">&nbsp;</div>
+</div>
+<p id="note">$$GENERATOR_NOTE$$</p>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCstar/Shelf.png b/share/gcstar/html_models/GCstar/Shelf.png
new file mode 100644
index 0000000..f4423d0
Binary files /dev/null and b/share/gcstar/html_models/GCstar/Shelf.png differ
diff --git a/share/gcstar/html_models/GCstar/Simple b/share/gcstar/html_models/GCstar/Simple
new file mode 100644
index 0000000..1db1548
--- /dev/null
+++ b/share/gcstar/html_models/GCstar/Simple
@@ -0,0 +1,96 @@
+[HEADER]
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<!--
+  Template made by Tian. A really simple list that could be printed
+-->
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<title>$$PAGETITLE$$</title>
+<style type="text/css">
+body
+{
+ color:black;
+}
+h1
+{
+ text-align:center;
+ font-size:200%;
+ font-weight:bold;
+}
+table
+{
+ border-collapse:collapse;
+ margin:1em 5%;
+ margin-bottom:3em;
+ width:90%;
+}
+tr+tr
+{
+ border-top:1px solid black;
+}
+.borrowed1
+{
+ color:#777777;
+ font-style:italic;
+}
+th
+{
+ border-bottom:2px solid black;
+ margin:0;
+ padding:1em;
+ font-weight:bold;
+}
+td
+{
+ padding:0.2em 1em;
+}
+#legend
+{
+ margin:1em;
+ border:1px solid black;
+ display:inline;
+ padding:0.5em;
+}
+#note
+{
+ border-top:1px solid black;
+ margin:3em 8%;
+ margin-bottom:2em;
+ padding-top:0.5em;
+ text-align:center;
+ font-size:90%;
+}
+#note a
+{
+ color:black ! important;
+ text-decoration:underline;
+ font-weight:bold;
+}
+</style>
+</head>
+<body>
+<h1>$$PAGETITLE$$</h1>
+<table>
+<tr>
+ [LOOP1 values=GCSfields idx=title]
+ <th>$$title_LABEL$$</th>
+ [/LOOP1]
+</tr>
+[/HEADER]
+[ITEM]
+<tr class="borrowed$$borrower_FLAG$$">
+ [LOOP2 values=GCSfields idx=field]
+ <td>$$field$$</td>
+ [/LOOP2]
+</tr>
+[/ITEM]
+[FOOTER]
+</table>
+[LENDING]<p id="legend" class="borrowed1">$$BORROWED_ITEMS$$</p>[/LENDING]
+<p id="note">$$GENERATOR_NOTE$$</p>
+</body>
+</html>
+[/FOOTER]
+[POST]
+[/POST]
diff --git a/share/gcstar/html_models/GCstar/Simple.png b/share/gcstar/html_models/GCstar/Simple.png
new file mode 100644
index 0000000..3e23235
Binary files /dev/null and b/share/gcstar/html_models/GCstar/Simple.png differ
-- 
cgit v1.2.3