projects / pompage.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: e9fd5c2)
MOD Amélioration de la CSS (mineur)
authorpifou <pifou@02bbb61a-6d21-0410-aba0-cb053bdfd66a>
Sat, 9 Jun 2007 14:12:09 +0000 (14:12 +0000)
committerpifou <pifou@02bbb61a-6d21-0410-aba0-cb053bdfd66a>
Sat, 9 Jun 2007 14:12:09 +0000 (14:12 +0000)
git-svn-id: svn://euphorik.ch/pompage@10 02bbb61a-6d21-0410-aba0-cb053bdfd66a

css/yopyop.css patch | blob | history
js/yopyop.js patch | blob | history
xsl/yopyop.xsl patch | blob | history

diff --git a/css/yopyop.css b/css/yopyop.css
index ca657f1..399d9d1 100644 (file)
--- a/css/yopyop.css
+++ b/css/yopyop.css
@@ -6,13 +6,19 @@
     color: #000000;\r
 }\r
 \r
+body {\r
+       background-color: #DDDDDD;\r
+}\r
+\r
 h1 {\r
        font-size: 20pt;\r
-       font-style: italic;     \r
+       font-style: italic;\r
+       font-weight: bold;\r
+       margin-left: 40px;\r
 }\r
 \r
 th {\r
-       font-size: 13pt;\r
+       font-size: 14pt;\r
        font-weight: bold;      \r
 }\r
 \r
@@ -30,11 +36,51 @@ table#liste th {
        padding: 3px;\r
 }\r
 \r
+table#liste th.titre {\r
+       text-align: left;\r
+}\r
+\r
+table#liste th.annee {\r
+       width: 50px;\r
+}\r
+\r
+table#liste th.duree {\r
+       width: 80px;\r
+}\r
+\r
+table#liste th.lien {\r
+       width: 50px;\r
+}\r
+\r
+table#liste th.fichier {\r
+       width: 50px;\r
+}\r
+\r
 table#liste td {\r
     background-color: #BBBBEE; \r
        padding: 3px;\r
 }\r
 \r
+table#liste td.titre {\r
+       font-weight: bold;\r
+}\r
+\r
+table#liste td.annee {\r
+       text-align: right;\r
+}\r
+\r
+table#liste td.duree {\r
+       text-align: right;\r
+}\r
+\r
+table#liste td.lien {\r
+       text-align: center;\r
+}\r
+\r
+table#liste td.fichier {\r
+       text-align: center;\r
+}\r
+\r
 table#liste td.titre:hover {\r
     background-color: #CCCCFF; \r
        padding: 3px;\r
diff --git a/js/yopyop.js b/js/yopyop.js
index 1125312..abd3b0f 100644 (file)
--- a/js/yopyop.js
+++ b/js/yopyop.js
@@ -2,9 +2,9 @@
   * Callback appelé lorsque un film est clické.\r
   * Affiche ou cache les informations détaillés pour ce film.\r
   */\r
-function detailFilm(poulpe)\r
+function detailFilm(id)\r
 {\r
-   var detail = document.getElementById(poulpe)\r
+   var detail = document.getElementById(id)\r
    \r
    if (detail.style.visibility == "visible")\r
    {\r
diff --git a/xsl/yopyop.xsl b/xsl/yopyop.xsl
index 3a4fbbf..5c1a1fd 100644 (file)
--- a/xsl/yopyop.xsl
+++ b/xsl/yopyop.xsl
@@ -1,39 +1,40 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="2.0">\r
- <xsl:template match="/">
+ <xsl:template match="filmographie">
   <html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
    <head>
     <title>yopYop</title>\r
     <link rel="stylesheet" href="../css/yopyop.css" type="text/css" />\r
     <script type="text/javascript" src="../js/yopyop.js" ></script>
-    </head>
-    <body>
+   </head>
+   <body>
     <h1>DivX</h1>
     <table id="liste">
      <tr>
-      <th>Titre</th>
-      <th>Année</th>\r
-      <th>Durée</th>\r
-      <th>Lien</th>\r
-      <th>Fichier</th>
+      <th class="titre">Titre</th>
+      <th class="annee">Année</th>\r
+      <th class="duree">Durée</th>\r
+      <th class="lien">Lien</th>\r
+      <th class="fichier">Fichier</th>
      </tr>\r
      
-     <xsl:for-each select="filmographie/film">
-      <xsl:sort select="annee"/>
+     <xsl:for-each select="film">
+      <xsl:sort select="annee" order="descending" />\r
+      <xsl:sort select="titre" />
       <tr>
        <td onclick="detailFilm('{@id}')" class="titre"><xsl:value-of select="titre"/></td>
-       <td><xsl:value-of select="annee"/></td>\r
-       <td><xsl:value-of select="duree"/> min</td>\r
-       <td></td>\r
-       <td><xsl:value-of select="fichier"/> </td>
+       <td class="annee"><xsl:value-of select="annee"/></td>\r
+       <td class="duree"><xsl:value-of select="duree"/> min</td>\r
+       <td class="lien"><a href="{url}">GO</a></td>\r
+       <td class="fichier"><a href="divx:///{fichier}">GO</a></td>
       </tr>\r
       <tr>\r
        <td colspan="5" class="detail">\r
         <table class="detail" id="{@id}">\r
-         <tr><td class="titreDetail">Genre(s)</td><td><xsl:for-each select="genres/genre"><xsl:value-of select="."/>, </xsl:for-each></td></tr>\r
-         <tr><td class="titreDetail">Réalisateur(s)</td><td><xsl:for-each select="realisateurs/realisateur"><xsl:value-of select="."/>, </xsl:for-each></td></tr>\r
-         <tr><td class="titreDetail">Acteurs(s)</td><td><xsl:for-each select="acteurs/acteur"><xsl:value-of select="."/>, </xsl:for-each></td></tr>\r
-         <tr><td class="titreDetail">Pays</td><td><xsl:for-each select="lespays/pays"><xsl:value-of select="."/>, </xsl:for-each></td></tr>\r
+         <tr><td class="titreDetail">Genre<xsl:if test="count(genres/genre) > 1">s</xsl:if></td><td><xsl:for-each select="genres/genre"><xsl:value-of select="."/><xsl:if test="not(position() = last())">, </xsl:if></xsl:for-each></td></tr>\r
+         <tr><td class="titreDetail">Réalisateur<xsl:if test="count(realisateurs/realisateur) > 1">s</xsl:if></td><td><xsl:for-each select="realisateurs/realisateur"><xsl:value-of select="."/><xsl:if test="not(position() = last())">, </xsl:if></xsl:for-each></td></tr>\r
+         <tr><td class="titreDetail">Acteur<xsl:if test="count(acteurs/acteur) > 1">s</xsl:if></td><td><xsl:for-each select="acteurs/acteur"><xsl:value-of select="."/><xsl:if test="not(position() = last())">, </xsl:if></xsl:for-each></td></tr>\r
+         <tr><td class="titreDetail">Pays</td><td><xsl:for-each select="lespays/pays"><xsl:value-of select="."/><xsl:if test="not(position() = last())">, </xsl:if></xsl:for-each></td></tr>\r
          <tr><td class="titreDetail">Synopsis</td><td><xsl:value-of select="synopsis"/></td></tr>\r
         </table>\r
        </td>\r
Pompage is a tool to manage your movie list in a automatic manner. It can generate a XML file from a set of files and grab movie information from web site like imdb.com. A XSL stylesheet can display the list in an accessible way with a search box. See http://dev.euphorik.ch/projects/show/pmp for more information.