From 6a3e9e285bd76141ce1475f3ecc0c3f220a5c968 Mon Sep 17 00:00:00 2001 From: pifou Date: Tue, 12 Jun 2007 17:34:52 +0000 Subject: [PATCH] =?utf8?q?ADD=20Images=20(img)=20ADD=20Recherche=20de=20ti?= =?utf8?q?tre=20(js)=20MOD=20Am=C3=A9lioration=20du=20css?= MIME-Version: 1.0 Content-Type: text/plain; charset=utf8 Content-Transfer-Encoding: 8bit git-svn-id: svn://euphorik.ch/pompage@12 02bbb61a-6d21-0410-aba0-cb053bdfd66a --- css/yopyop.css | 114 ++++++++++++++++++++++++++++++++++++++++++------ js/yopyop.js | 36 +++++++++------ mise_en_prod.rb | 14 +++--- xsl/yopyop.xsl | 76 ++++++++++++++++++-------------- 4 files changed, 174 insertions(+), 66 deletions(-) diff --git a/css/yopyop.css b/css/yopyop.css index 07ebd42..6f9e440 100644 --- a/css/yopyop.css +++ b/css/yopyop.css @@ -1,13 +1,38 @@ * { - margin: 0; - padding: 0; - border-width: 0; - font: normal 12pt Arial, Verdana, Helvetica, sans-serif; - color: #000000; + margin: 0; + padding: 0; + border-width: 0; +} + +html { + background-color: #8DDD83; + height: auto; + font: normal 12pt Arial, Verdana, Helvetica, sans-serif; +} + +a { + text-decoration: none; +} +a:link { + color: #51874A; +} +a:visited { + color: #51874A; +} +a:hover { + color: #5DDF4C; +} +a:active { + color: #5DDF4C; } body { - background-color: #DDDDDD; + width: 90%; + height: auto; + margin-left: auto; + margin-right: auto; + margin-top: 0px; + text-align: left; } h1 { @@ -26,14 +51,72 @@ td { vertical-align:top; } +div.entete { + width: 90%; + position: fixed; + background-color: #65A35D; + height: 50px; + color: #8DDD83; + -moz-border-radius: 0px 0px 20px 20px; +} + +div.entete img { + position: absolute; + left: 180px; + top: -3px; +} + +div.entete h1 { + float: left; + margin-top: 10px; +} + +div.pied { + position: fixed; + bottom: 0px; + height: 50px; + width: 90%; + background-image: url(../img/collines.png) +} + +div form { + float: right; + padding-right: 10px; + padding-top: 5px; +} + +div form input { + font-size: 16pt; + background-color: #B1F1A9; +} + +div form button { + position: relative; + top: -5px; + height: 25px; + width: 25px; + margin: 2px; + background-color: #B1F1A9; + border: 0px; + background-image: url(../img/clear.png); + background-position: center; + background-repeat: no-repeat; +} + +div.contenu { + padding-top: 50px; +} + table#liste { width: 100%; border-spacing: 0px 0px; + margin-bottom:50px; } table#liste th { - background-color: #9999DD; + background-color: #8DDD83; padding: 3px; + font-size: 13pt; } table#liste th.titre { @@ -42,22 +125,27 @@ table#liste th.titre { table#liste th.annee { width: 50px; + text-align: center; } table#liste th.duree { width: 80px; + text-align: center; } table#liste th.lien { width: 50px; + text-align: center; } table#liste th.fichier { width: 50px; + text-align: center; } table#liste td { - background-color: #BBBBEE; + background-color: #7BC671; + color: #20531A; padding: 3px; } @@ -82,24 +170,24 @@ table#liste td.fichier { } table#liste td.titre:hover { - background-color: #CCCCFF; + background-color: #B1F1A9; padding: 3px; } table#liste td.detail { - background-color: #FFFFFF; + background-color: #8DDD83; padding: 0px 0px 0px 0px; } table#liste table.detail { - visibility:hidden; - position:absolute; + display:none; + padding-bottom: 10px; border-spacing: 0px 0px; } table#liste table.detail td { padding: 3px; - background-color: #DDDDFF; + background-color: #B1F1A9; } table#liste table.detail td.titreDetail { diff --git a/js/yopyop.js b/js/yopyop.js index 3b489ee..7232cc9 100644 --- a/js/yopyop.js +++ b/js/yopyop.js @@ -11,32 +11,40 @@ function detailFilm(id) { var detail = document.getElementById("detail"+id) - if (detail.style.visibility == "visible") - { - detail.style.visibility = "hidden" - detail.style.position = "absolute" - } + if (detail.style.display == "table") + detail.style.display = "none" else - { - detail.style.visibility = "visible" - detail.style.position = "relative" - } + detail.style.display = "table" } + /** * Effectue une recherche, n'affiche que les films qui contiennent le motif recherché. */ function doRecherche() { var motif = document.getElementById("recherche").value + var rechercheRegExp = new RegExp(".*" + motif + ".*", "i") var liste = document.getElementById("liste") var lignes = liste.childNodes - for(i = 0; i < lignes.length; i++) + for(i = 1; i < lignes.length; i += 2) { - var titre = lignes[i].getElements - - - alert(tr[i].id) + var titre = lignes[i].firstChild.innerHTML + if (rechercheRegExp.exec(titre) == null) + { + lignes[i].style.display = "none" + lignes[i+1].firstChild.firstChild.style.display = "none" + } + else + { + lignes[i].style.display = "table-row" + } } +} + +function viderRecherche() +{ + document.getElementById("recherche").value = "" + doRecherche() } \ No newline at end of file diff --git a/mise_en_prod.rb b/mise_en_prod.rb index 8830586..473156b 100644 --- a/mise_en_prod.rb +++ b/mise_en_prod.rb @@ -1,12 +1,14 @@ -if $*.length < 1 - puts 'Usage: mise_en_prod.rb destination' - exit 1 -end +dest = "Z:\\var\\www\\divx" -dest = $*[0] +#if $*.length < 1 +# puts 'Usage: mise_en_prod.rb destination' +# exit 1 +#end + +dest = $*[0] if $*.length > 1 # pour windows -['xml', 'xsl', 'js', 'css'].each{|rep| +['xml', 'xsl', 'js', 'css', 'img'].each{|rep| `mkdir #{dest}\\#{rep}` `xcopy /Y #{rep} #{dest}\\#{rep}` } \ No newline at end of file diff --git a/xsl/yopyop.xsl b/xsl/yopyop.xsl index d77bbbd..7e46785 100644 --- a/xsl/yopyop.xsl +++ b/xsl/yopyop.xsl @@ -7,40 +7,50 @@ - -

DivX

- - - - - - - - - - - - - - - - - - + +
+

DivX - TV

+ +
+ + + +
+
+
TitreAnnéeDuréeLienFichier
minGOGO
+ + + + + + - - - - -
TitreAnnéeDuréeLienFichier
- - - - - - -
Genres,
Réalisateurs,
Acteurs,
Pays,
Synopsis
-
+ + + + + + + + min + GO + GO + + + + + + + + + +
Genres,
Réalisateurs,
Acteurs,
Pays,
Synopsis
+ + + + + +
-- 2.43.0