massive css beauty

git-svn-id: http://yolanda.mister-muffin.de/svn@256 7eef14d0-6ed0-489d-bf55-20463b2d70db

trunk/locale/en-us.xml

@@ -33,9 +33,9 @@
     <string id="button_lucky">Instant Access</string>
     <string id="button_advanced">Advanced Search</string>
 
-    <string id="query_latestadditions">latest additions</string>
+    <string id="query_latestadditions">new videos</string>
     <string id="query_mostdownloads">most downloaded</string>
-    <string id="query_mostviews">most viewed</string>
+    <string id="query_mostviews">popular videos</string>
 
     <!-- errors -->
     <string id="error_202c">Error 202c - Access forbidden by government.</string>
@@ -159,7 +159,6 @@
     <string id="video_playback">plackback</string>
     <string id="junk_video">mark as junk</string>
     <string id="edit_video">edit</string>
-    <string id="megabytes">MB</string>
     <string id="watch_browserplugin">use browser plugin</string>
     <string id="watch_cortadoapplet">use java applet</string>
     <string id="license_conditions">license conditions</string>
@@ -200,6 +199,12 @@
     <string id="rss_description_1">This is an RSS Feed for the query "</string>
     <string id="rss_description_2">".</string>
 
+    <!-- units -->
+    <string id="unit_megabytes">MB</string>
+    <string id="unit_seconds">sec</string>
+    <string id="unit_minutes">min</string>
+    <string id="unit_hours">h</string>
+
 </strings>
 
 </xsl:stylesheet>

trunk/style/colors/tango.css

@@ -5,8 +5,8 @@ Yolanda default stylesheet colors (using tango color palette)
 This file is licensed under the WTF Public License
 (License terms: Do what the fuck you want.)
 
-Purpose of this file is to provide colors according to the Tango! palette.
+Purpose of this file is to provide graphics according to the Tango! palette.
-Protip: Use only CSS properties that contain "color" !
+Protip: Graphics are colors, background and pseudo-content images !
 
 Please replace the colors in this file with suitable Tango! equivalents.
 ↑↑ Remove this notice as soon as this file holds only Tango! colors. ↑↑
@@ -49,18 +49,37 @@ a
 
 div
 {
+    /* "Aluminium 5" */
+    border-color:   #555753;
 }
 
-    div.footer,
+    div.button-download
-    div.header
     {
-        border-color:       #c0c0c0;
+    }
+
+        div.button-download img
+        {
+        }
+
+div.loginbox
+{
+}
+
+    div.loginbox form
+    {
+    }
+
+        div.loginbox form fieldset
+        {
+        }
+
+            div.loginbox form fieldset input:after
+            {
+                content:       url(../../images/openid-icon.png);
             }
 
     div.messagebox
     {
-        /* "Aluminium 5" */
-        border-color:   #555753;
     }
 
         div.messagebox#error
@@ -69,10 +88,10 @@ div
             background-color:   #f46060;
         }
 
-        div.messagebox#warning
+        div.messagebox#error:before
         {
-            /* "Orange 1" */
+        /* TODO: find out how to set vertical-align:middle for this image */
-            background-color:   #fcaf3e;
+        content:        url(../../images/tango/32x32/dialog-error.png);
         }
 
         div.messagebox#information
@@ -81,25 +100,91 @@ div
             background-color:   #a9ec68;
         }
 
+        div.messagebox#information:before
+        {
+        /* TODO: find out how to set vertical-align:middle for this image */
+        content:        url(../../images/tango/32x32/dialog-information.png);
+        }
+
+        div.messagebox#warning
+        {
+            /* "Orange 1" */
+            background-color:   #fcaf3e;
+        }
+
+        div.messagebox#warning:before
+        {
+        /* TODO: find out how to set vertical-align:middle for this image */
+        content:        url(../../images/tango/32x32/dialog-warning.png);
+        }
+
     div.page-number
     {
         /* "Aluminium 5" */
         border-color:   #555753;
     }
 
-    div.tagcloud
+div#preview
+{
+}
+
+        div#preview form
+        {
+        }
+
+    div.result
+    {
+    }
+
+        div.result img
         {
-        /* Aluminium 1 */
-        background-color:   #eeeeec;
             /* "Aluminium 5" */
             border-color:   #555753;
         }
 
+    div.searchbar
+    {
+    }
+
+    div.splashbox
+    {
+    }
+
+    div.tagcloud
+    {
+    }
+
+
+form
+{
+}
+
+    form fieldset
+    {
+    }
+
+        form fieldset input[type="text"]
+        {
+        }
+
 span
 {
 }
 
-    span.instruction,
+    span.duration
+    {
+    }
+
+    span.heading
+    {
+    }
+
+    span.instruction
+    {
+        /* "Aluminium 5" */
+        color:   #555753;
+    }
+
     span.protip
     {
         /* "Aluminium 5" */
@@ -110,8 +195,40 @@ ul
 {
 }
 
-ul li:hover
+    ul#footer,
+    ul#header
+    {
+        /* "Aluminium 5" */
+        border-color:   #555753;
+    }
+
+        ul#footer li:hover,
+        ul#header li:hover
         {
             /* Aluminium 1 */
             background-color:   #eeeeec;
         }
+
+            ul#footer li a,
+            ul#footer li a
+            {
+            }
+
+    ul#queries
+    {
+    }
+
+        ul#queries li#latestadditions
+        {
+            list-style-image:       url(../../images/tango/16x16/actions/document-new.png)
+        }
+
+        ul#queries li#mostviews
+        {
+            list-style-image:       url(../../images/tango/16x16/emblems/emblem-favorite.png)
+        }
+
+        ul#queries li#mostdownloads
+        {
+            list-style-image:       url(../../images/tango/16x16/actions/document-save.png)
+        }

trunk/style/decoration/bridget.css

@@ -9,15 +9,16 @@ Purpose of this file is to provide decorations, such as:
     - borders (size, width, style etc.)
     - font properties (family, size, style, weight etc.)
     - spacing between elements and / or content (margin, padding)
-    - content generated by css (:before, :after)
+    - css pseudo-content that isn't graphics (:before, :after)
 */
 
 body
 {
     font-family:        sans-serif;
     font-size:          8pt;
-    font-weight:        bold;
+/*    font-weight:        bold;*/
     margin:             1.5em;
+    text-align:         center;
 }
 
 a
@@ -42,7 +43,23 @@ a
 
 div
 {
-    border-width:       0px;
+    border-style:       solid;
+    border-width:       1px;
+    margin:             0.5em;
+    padding:            0.5em;
+}
+
+    div.button-download
+    {
+        /* TODO: find out /why we do this/ (see div.searchbar) ! */
+        margin-top:         0em;
+    }
+
+    div.description
+    {
+        /* TODO: find out /why we do this/ (see div.searchbar) ! */
+        margin-top:         0em;
+        text-align:         justify;
     }
 
     div.footer,
@@ -50,17 +67,14 @@ div
     {
     }
 
-    div.button-download,
+    div.button-download
-    div.button-edit,
-    div.button-junk
     {
-        margin:         0.5em;
+        /* TODO: find out /why we do this/ (see div.searchbar) ! */
+        margin-top:         0em;
         vertical-align:     top;
     }
 
-    div.button-download img,
+        div.button-download img
-    div.button-edit img,
-    div.button-junk img
         {
             margin:     0.5em;
         }
@@ -71,40 +85,50 @@ div
 
         div.cc-license-chooser img
         {
-            margin:         0.25em;
             vertical-align: middle;
         }
 
-        div#container form
+    div.commentform,
+    div.loginform,
+    div.registerform,
+    div.settingsform,
+    div.uploadform
     {
-            padding-left:   auto;
+        line-height:    2.5em;
-            padding-right:  auto;
+        margin:         1.5em;
+    }
+
+    div.loginbox
+    {
+        /* TODO: find out /why we do this/ (see div.searchbar) ! */
+        margin-top:         0em;
+        text-align:         justify;
     }
 
     div.messagebox
     {
-        border-style:   solid;
+        /* correct spacing to avoid overlapping with float:right elements */
-        border-width:   1px;
+        margin-right:       22em;
-        margin:         1.5em;
     }
 
         div.messagebox#error
         {
         }
 
-        div.messagebox#warning
-        {
-        }
-
         div.messagebox#information
         {
         }
 
-            div.messagebox img
+        div.messagebox#warning
         {
-                margin:             0.75em;
+        }
-                overflow:           visible;
+
-                vertical-align:     middle;
+    div.metadata
+    {
+        /* TODO: find out /why we do this/ (see div.searchbar) ! */
+        margin-top:         0em;
+        line-height:        1.5em;
+        text-align:         justify;
     }
 
     div.page-number
@@ -113,16 +137,97 @@ div
         overflow:       visible;
     }
 
-    div.result
+div#preview
+{
+        /* correct spacing to avoid overlapping with float:right elements */
+        margin-right:       22em;
+}
+
+        div#preview form
         {
         }
 
-        div.result img
+            div#preview form button[name="playback"]
+            {
+                /* crude center hack (second part in fake6.css) */
+                margin-left:    -15em;
+                margin-top:     -7.5em;
+            }
+
+            div#preview form button[name="download"]
+            {
+                /* crude center hack (second part in fake6.css) */
+                margin-left:    0em;
+                margin-top:     -7.5em;
+            }
+
+        div#preview img
+        {
+        }
+
+    div.results
+    {
+/*        border-width:       0px;*/
+        /* correct spacing to avoid overlapping with float:right elements */
+        margin:             0em;
+        margin-right:       22em !important;
+        padding:            0em;
+    }
+
+        div.results div.result
+        {
+            border-width:       0px;
+            padding:            0em;
+        }
+
+            div.results div.result img
             {
-            border-color:   black;
                 border-width:   1px;
             }
 
+    div.searchbar
+    {
+        /* TODO: find out /why we do this/ !
+        does float make zero top margin really necessary or is it a bug ?
+        latter seems unlikely because it works across browsers. */
+        margin-top:         0em;
+        text-align:         justify;
+    }
+
+    div.splashbox
+    {
+        /* correct spacing to avoid overlapping with float:right elements */
+        margin-right:       22em;
+        text-align:         justify;
+    }
+
+    div.tagcloud
+    {
+        /* TODO: find out /why we do this/ (see div.searchbar) ! */
+        margin-top:         0em;
+        text-align:         justify;
+    }
+
+form
+{
+}
+
+    form fieldset
+    {
+        border-width:       0px;
+    }
+
+        form fieldset input[type="text"]
+        {
+        }
+
+    h1
+    {
+        font-weight:        normal;
+        font-size:          2em;
+        text-align:         center;
+    }
+
 input
 {
     text-align:         left;
@@ -133,6 +238,29 @@ img
     border-width:       0;
 }
 
+span
+{
+}
+
+    span.duration:after
+    {
+        content:            ") ";
+    }
+
+    span.duration:before
+    {
+        content:            " (";
+    }
+
+    span.instruction
+    {
+    }
+
+    span.protip
+    {
+        font-weight:bold;
+    }
+
     span.protip:after
     {
         content:            " )";
@@ -143,20 +271,46 @@ span.protip:before
         content:            "( ";
     }
 
-ul[role="navigation"]
+ul
+{
+}
+
+    ul#footer,
+    ul#header
     {
         border-style:           solid;
-    list-style-type:        none;
         border-width:           1px;
+        font-weight:bold;
+        list-style-type:        none;
+        margin:                 0.5em;
     }
 
-    ul[role="navigation"] li
+        ul li
         {
         }
 
-        ul[role="navigation"] li a
+            ul#footer li a,
+            ul#header li a
             {
                 font-size:          1em;
                 line-height:        3em;
                 padding:            1em;
             }
+
+    ul#queries
+    {
+        font-size:          1.5em;
+        font-weight:        bold;
+    }
+
+        ul#queries li#latestadditions
+        {
+        }
+
+        ul#queries li#mostviews
+        {
+        }
+
+        ul#queries li#mostdownloads
+        {
+        }

trunk/style/structure/fake6.css

@@ -16,7 +16,6 @@ Please clear this file of any CSS properties that do not define structure.
 body
 {
     min-height:         100%;
-    text-align:         center;
 }
 
 a
@@ -33,46 +32,46 @@ a
 
     a.tag
     {
-        display:        inline-block;
+        display:        block;
+        float:          left;
     }
 
 div
 {
 }
 
-    div.button-download,
+    div.button-download
-    div.button-edit,
-    div.button-junk
     {
-        display:        inline-block;
+        clear:          right;
-    }
+        float:          right;
-
+        width:          20em;
-    div#container
-    {
-            position: relative;
-    }
-
-        div#container form
-        {
-            position:       absolute;
-            top:            50%;
-            width:          100%
-        }
-
-    div.commentform,
-    div.loginform,
-    div.registerform,
-    div.settingsform,
-    div.uploadform
-    {
-        line-height:    2.5em;
-        margin:         1.5em;
     }
 
     div.comments
     {
     }
 
+    div.description
+    {
+        clear:          right;
+        float:          right;
+        width:          20em;
+    }
+
+    div.loginbox
+    {
+        clear:          right;
+        float:          right;
+        width:          20em;
+    }
+
+    div.metadata
+    {
+        clear:          right;
+        float:          right;
+        width:          20em;
+    }
+
     div.page-number
     {
         display:        inline-block;
@@ -82,56 +81,68 @@ div
         overflow:       visible;
     }
 
-    div.result
+    div#preview
     {
-        display:        inline-block;
         position: relative;
-        vertical-align: top;
     }
 
-        div.result img
+        div#preview form
         {
+            height:         100%;
+            width:          100%;
         }
 
-/*
+            div#preview form button
-        indefinitely postponed - does any major browser support absolute
-        positioning /inside inline-blocks/ ?
-
-        div.result img.flag
             {
+                /* crude center hack (second part in bridget.css) */
                 position:       absolute;
-            bottom:         32px;
+                top:            50%;
-            right:          10px;
+                left:           50%;
-        }
+                width:          15em;
-*/
+                height:         15em;
-
-    div.search
-    {
-        padding:            0.75em;
             }
 
-    div.search-small
+        div#preview img
+        {
+        }
+
+    div.results
+    {
+    
+    }
+
+        div.results div.result
+        {
+            float:          left;
+            position:       relative;
+        }
+
+            div.results div.result img
+            {
+            }
+
+            div.results div.result img.flag
+            {
+                bottom:         3em;
+                position:       absolute;
+                right:          0.5em;
+            }
+
+    div.searchbar
     {
-        clear:              both;
         float:          right;
-        height:             0em;
+        width:          20em;
-        overflow:           visible;
-        text-align:         right;
     }
 
-    div.toplists
+    div.splashbox
     {
-        padding:    0.75em;
     }
 
     div.tagcloud
     {
-        border-style:       solid;
+        clear:          right;
-        border-width:       1px;
+        float:          right;
-        margin:             0.75em;
+        width:          20em;
-        margin-left:        20%;
-        margin-right:       20%;
-        padding:            0.75em;
     }
 
     div.video
@@ -153,47 +164,45 @@ div
             margin-top:     0.5em;
         }
 
-    div.video-metadata
-    {
-        display:            inline-block;
-        line-height:        1.5em;
-        margin-left:        1.5em;
-        text-align:         left;
-        vertical-align:     top;
-        width:              256px;
-    }
-
     div.videotitle
     {
         font-size:          1.5em;
-        margin-bottom:      0.5em;
     }
 
-fieldset
+form
 {
-    border-width:           0px;
 }
 
-    img.logo-big
+    form fieldset
     {
-        padding-bottom:     0.5em;
     }
 
-    img.openid-icon
+        form fieldset input[type="text"]
         {
-        padding-left:       0.2em;
-        vertical-align:     text-top;
         }
 
-span.code
+h1
+{
+}
+
+span
+{
+}
+
+    span.duration
     {
-    font-family:    monospace;
-    font-weight:    normal;
     }
 
     span.heading
     {
-    font-size:      1.5em;
+    }
+
+    span.instruction
+    {
+    }
+
+    span.protip
+    {
     }
 
 table.metadata,
@@ -228,13 +237,41 @@ td.metadata-title
     color:          #606060;
 }
 
-ul[role="navigation"]
+ul
 {
+}
+
+    ul#footer,
+    ul#header
+    {
+        clear:          both;
         display:        block;
         height:         3em;
     }
 
-    ul[role="navigation"] li
+        ul#footer li,
+        ul#header li
         {
             float:          left;
         }
+
+            ul#footer li a,
+            ul#header li a
+            {
+            }
+
+    ul#queries
+    {
+    }
+
+        ul#queries li#latestadditions
+        {
+        }
+
+        ul#queries li#mostviews
+        {
+        }
+
+        ul#queries li#mostdownloads
+        {
+        }

trunk/xsl/xhtml.xsl

@@ -17,15 +17,19 @@
     omit-xml-declaration="no"
 />
 
+<!-- each xsl:template should have it's own file -->
 <xsl:include href="./xhtml/advancedsearch.xsl" />
 <xsl:include href="./xhtml/embedded.xsl" />
 <xsl:include href="./xhtml/footer.xsl" />
-<xsl:include href="./xhtml/frontpage.xsl"/>
 <xsl:include href="./xhtml/header.xsl" />
-<xsl:include href="./xhtml/loginform.xsl"/>
+<xsl:include href="./xhtml/messagebox.xsl" />
+<xsl:include href="./xhtml/loginbox.xsl" />
 <xsl:include href="./xhtml/register.xsl" />
 <xsl:include href="./xhtml/results.xsl" />
 <xsl:include href="./xhtml/settings.xsl" />
+<xsl:include href="./xhtml/splash.xsl" />
+<xsl:include href="./xhtml/searchbar.xsl" />
+<xsl:include href="./xhtml/tagcloud.xsl" />
 <xsl:include href="./xhtml/upload.xsl" />
 <xsl:include href="./xhtml/video.xsl" />
 <xsl:include href="./xhtml/xhtml-body.xsl" />
@@ -43,8 +47,11 @@
 <xsl:variable name="site_strings" select="document('../site/main.xml')//strings/string" />
 <xsl:variable name="locale_strings" select="document(concat('../locale/', $locale, '.xml'))//strings/string" />
 
-<!-- this kills 99% of the processed XML... sorry Tim Bray.... -->
+<!--
-<!-- had to look up Bray in Wikipedia, 2 points off my geek score -->
+this kills 99% of the processed XML
+we have to do this because XHTML + CSS presentation is dependant on the order of XHTML elements
+hopefully, CSS 3 will fix this
+-->
 <xsl:template match="@*|node()">
     <xsl:if test="not(/)">
         <xsl:copy>
@@ -63,51 +70,4 @@
     </html>
 </xsl:template>
 
-<xsl:template name="searchbar">
-
-    <div class="search-small">
-        <form method="get" enctype="text/plain">
-            <xsl:attribute name="action">
-                <xsl:value-of select="$site_strings[@id='path_results']" />
-            </xsl:attribute>
-            <fieldset>
-                <xsl:value-of select="$locale_strings[@id='search']" />:
-                <input type="text" name="query" size="15">
-                    <xsl:attribute name="value">
-                        <xsl:if test="//results/@argument='query'">
-                            <xsl:value-of select="//results/@value" />
-                        </xsl:if>
-                    </xsl:attribute>
-                </input>
-            </fieldset>
-        </form>
-    </div>
-
-</xsl:template>
-
-<xsl:template name="message">
-
-    <div class="messagebox">
-        <xsl:attribute name="id">
-            <xsl:value-of select="/page/message/@type" />
-        </xsl:attribute>
-        <xsl:choose>
-            <xsl:when test="/page/message/@type='error'">
-                <img src="/images/tango/dialog-error.png" />
-            </xsl:when>
-            <xsl:when test="/page/message/@type='information'">
-                <img src="/images/tango/dialog-information.png" />
-            </xsl:when>
-            <xsl:when test="/page/message/@type='warning'">
-                <img src="/images/tango/dialog-warning.png" />
-            </xsl:when>
-        </xsl:choose>
-        <xsl:variable name="messagetext" select="/page/message/@text" />
-        <xsl:value-of select="$locale_strings[@id=$messagetext]" />
-        <xsl:value-of select="/page/message/@value" />
-        <!-- probably one can do this on one line, dunno how -->
-    </div>
-
-</xsl:template>
-
 </xsl:stylesheet>

trunk/xsl/xhtml/footer.xsl

@@ -45,11 +45,15 @@
     <xsl:value-of select="$locale_strings[@id='footer_copyright']" />
 -->
 
-    <br />
-
     <span class="protip">
         <xsl:value-of select="$locale_strings[@id='footer_warranty']" />
     </span>
+    <br />
+    <img alt="AGPL 3 Free Software">
+        <xsl:attribute name="src">
+            <xsl:value-of select="$site_strings[@id='path_root']" />/images/agplv3-155x51.png
+        </xsl:attribute>
+    </img>
 
 </xsl:template>
 

trunk/xsl/xhtml/frontpage.xsl

@@ -1,98 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" ?>
-<xsl:stylesheet version="1.0"
-    xmlns="http://www.w3.org/1999/xhtml"
-    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
-    xmlns:dc="http://purl.org/dc/elements/1.1/"
-    xmlns:cc="http://web.resource.org/cc/"
-    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
->
-
-<xsl:template name="frontpage">
-
-    <img class="logo-big" src="/images/logo-big.png" alt="Yolanda logo (320x100)" />
-
-    <div class="search">
-        <form method="get" enctype="text/plain">
-            <xsl:attribute name="action">
-                <xsl:value-of select="$site_strings[@id='path_results']" />
-            </xsl:attribute>
-            <fieldset>
-                <input type="text" name="query" size="40" /><br />
-                <input type="submit">
-                    <xsl:attribute name="value">
-                        <xsl:value-of select="$locale_strings[@id='button_find']" />
-                    </xsl:attribute>
-                </input>
-                <input type="submit" name="lucky">
-                    <xsl:attribute name="value">
-                        <xsl:value-of select="$locale_strings[@id='button_lucky']" />
-                    </xsl:attribute>
-                </input>
-                <input type="submit" name="advanced">
-                    <xsl:attribute name="value">
-                        <xsl:value-of select="$locale_strings[@id='button_advanced']" />
-                    </xsl:attribute>
-                </input>
-            </fieldset>
-        </form>
-    </div>
-
-    <div class="toplists">
-        <a>
-            <xsl:attribute name="href">
-                <xsl:value-of select="$site_strings[@id='path_query_latestadditions']" />
-            </xsl:attribute>
-            <xsl:value-of select="$locale_strings[@id='query_latestadditions']" />
-        </a>
-        <xsl:value-of select="$locale_strings[@id='separator']" />
-        <a>
-            <xsl:attribute name="href">
-                <xsl:value-of select="$site_strings[@id='path_query_mostdownloads']" />
-            </xsl:attribute>
-            <xsl:value-of select="$locale_strings[@id='query_mostdownloads']" />
-        </a>
-        <xsl:value-of select="$locale_strings[@id='separator']" />
-        <a>
-            <xsl:attribute name="href">
-                <xsl:value-of select="$site_strings[@id='path_query_mostviews']" />
-            </xsl:attribute>
-            <xsl:value-of select="$locale_strings[@id='query_mostviews']" />
-        </a>
-    </div>
-
-    <xsl:call-template name="tagcloud"/>
-
-</xsl:template>
-
-<xsl:template name="tagcloud">
-    <xsl:variable name="max" select="//tagcloud/tag/count[not(//tagcloud/tag/count &gt; .)]" />
-    <xsl:variable name="min" select="//tagcloud/tag/count[not(//tagcloud/tag/count &lt; .)]" />
-    <div class="tagcloud">
-        <xsl:for-each select="//tagcloud/tag">
-            <xsl:sort select="text" order="ascending" data-type="text" />
-            <a class="tag">
-                <xsl:attribute name="style">
-<!--
-                scale *should* be logarihmic, but that's not widely supportet
--->
-                    font-size:<xsl:value-of select="round((32-12)*(number(count)-number($min))div (number($max)-number($min)))+12" />px
-                </xsl:attribute>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="$site_strings[@id='path_results']" />
-                    tag:
-                    <xsl:value-of select="text" />
-                </xsl:attribute>
-                
-                <xsl:value-of select="text" />
-<!--
-                unnecessary, except for debug purposes
-                (<xsl:value-of select="count" />)
--->
-            </a>
-            &#8204;
-        </xsl:for-each>
-    </div>
-
-</xsl:template>
-
-</xsl:stylesheet>

trunk/xsl/xhtml/header.xsl

@@ -11,33 +11,6 @@
 
     <ul id="header" role="navigation">
 
-        <li>
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="$site_strings[@id='path_query_latestadditions']" />
-                </xsl:attribute>
-                <xsl:value-of select="$locale_strings[@id='query_latestadditions']" />
-            </a>
-        </li>
-
-        <li>
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="$site_strings[@id='path_query_mostviews']" />
-                </xsl:attribute>
-                <xsl:value-of select="$locale_strings[@id='query_mostviews']" />
-            </a>
-        </li>
-
-        <li>
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="$site_strings[@id='path_query_mostdownloads']" />
-                </xsl:attribute>
-                <xsl:value-of select="$locale_strings[@id='query_mostdownloads']" />
-            </a>
-        </li>
-
         <xsl:choose>
             <xsl:when test="string-length(//@username)=0">
 
@@ -50,17 +23,8 @@
                     </a>
                 </li>
 
-                <li>
-                    <a>
-                        <xsl:attribute name="href">
-                            <xsl:value-of select="$site_strings[@id='path_login']" />
-                        </xsl:attribute>
-                        <xsl:value-of select="$locale_strings[@id='login']" />
-                    </a>
-                </li>
-
 <!--
-                "login with openid" is fukken obsolete and will be removed in future iterations
+                "login with openid" is obsolete and will be removed in future iterations
 -->
 
                 <li>

trunk/xsl/xhtml/loginbox.xsl

@@ -7,7 +7,47 @@
     xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 >
 
+<xsl:template name="loginbox">
+    <div class="loginbox">
+        <form method="post">
+            <xsl:attribute name="action">
+                <xsl:value-of select="$site_strings[@id='path_login']" />
+            </xsl:attribute>
+            <fieldset>
+
+<!--
+                why do we need this hidden input ?
+-->
+                <input name="action" type="hidden" value="login" />
+
+                <label for="user">
+                    <xsl:value-of select="$locale_strings[@id='username']" />:
+                </label>
+                <br />                
+                <input name="user" type="text" />
+                <br />
+
+                <label for="pass">
+                    <xsl:value-of select="$locale_strings[@id='password']" />:
+                </label>
+                <br />
+                <input name="pass" type="password" />
+
+                <input type="submit" name="login" >
+                    <xsl:attribute name="value">
+                        <xsl:value-of select="$locale_strings[@id='button_login']" />
+                    </xsl:attribute>
+                </input>
+            </fieldset>
+        </form>
+    </div>
+
+</xsl:template>
+
 <xsl:template name="loginform">
+<!--
+    the loginform template is deprecated
+-->
     <div class="loginform">
         <xsl:choose>
             <xsl:when test="//loginform/@action='openid'">

trunk/xsl/xhtml/messagebox.xsl

@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<xsl:stylesheet version="1.0"
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+    xmlns:dc="http://purl.org/dc/elements/1.1/"
+    xmlns:cc="http://web.resource.org/cc/"
+    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+>
+
+<xsl:template name="message">
+
+    <div class="messagebox">
+        <xsl:attribute name="id">
+            <xsl:value-of select="/page/message/@type" />
+        </xsl:attribute>
+        <xsl:choose>
+            <xsl:when test="/page/message/@type='error'">
+            </xsl:when>
+            <xsl:when test="/page/message/@type='information'">
+            </xsl:when>
+            <xsl:when test="/page/message/@type='warning'">
+            </xsl:when>
+        </xsl:choose>
+        <xsl:variable name="messagetext" select="/page/message/@text" />
+        <strong>
+            <xsl:value-of select="$locale_strings[@id=$messagetext]" />
+            <xsl:value-of select="/page/message/@value" />
+            <!-- probably one can do this on one line, dunno how -->
+        </strong>
+    </div>
+
+</xsl:template>
+
+</xsl:stylesheet>

trunk/xsl/xhtml/results.xsl

@@ -7,63 +7,9 @@
     xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 >
 
-<xsl:template name="innerresults">
-
-    <xsl:for-each select="//results/result">
-        <div class="result">
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="rdf:RDF/cc:Work/dc:identifier" />
-                </xsl:attribute>
-                <img>
-                    <xsl:attribute name="src">
-                        <xsl:value-of select="@thumbnail" />
-                    </xsl:attribute>
-                    <xsl:attribute name="alt">
-                        <xsl:value-of select="rdf:RDF/cc:Work/dc:title" />
-                    </xsl:attribute>
-                </img>
-<!--
-                postponed - css positioning fails it in firefox and konqueror
-
-                <img class="flag">
-                    <xsl:attribute name="src">
-                        <xsl:value-of select="concat('/images/flags/', $locale, '.png')" />
-                    </xsl:attribute>
-                    <xsl:attribute name="alt">
-                        <xsl:value-of select="$locale" />
-                    </xsl:attribute>
-                </img>
--->
-            </a>
-            <br />
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="rdf:RDF/cc:Work/dc:identifier" />
-                </xsl:attribute>
-                <xsl:value-of select="rdf:RDF/cc:Work/dc:title" />
-            </a>
-            <br />
-            <xsl:variable name="hours" select="floor(@duration div 3600)" />
-            <xsl:variable name="minutes" select="floor((@duration - $hours*3600) div 60)" />
-            <xsl:variable name="seconds" select="@duration - $minutes*60 - $hours*3600" />
-            <xsl:choose>
-                <xsl:when test="$hours=0">
-                    (<xsl:value-of select="concat(format-number($minutes, '00'), ':', format-number($seconds, '00'))" />)
-                </xsl:when>
-                <xsl:otherwise>
-                    (<xsl:value-of select="concat($hours, ':', format-number($minutes, '00'), ':', format-number($seconds, '00'))" />)
-                </xsl:otherwise>
-            </xsl:choose>
-        </div>
-    </xsl:for-each>
-</xsl:template>
-
-
 <xsl:template name="results">
 
-    <div>
+    <h1>
-        <span class="heading">
         <xsl:value-of select="$locale_strings[@id='results_heading_1']" />&#160;
         <xsl:value-of select="//results/@pagesize * (//results/@currentpage - 1) + 1" />&#160;
         <xsl:value-of select="$locale_strings[@id='results_heading_2']" />&#160;
@@ -78,10 +24,9 @@
         <xsl:value-of select="$locale_strings[@id='results_heading_3']" />&#160;
         <xsl:value-of select="//results/@resultcount" />&#160;
         <xsl:value-of select="$locale_strings[@id='results_heading_4']" />
-        </span>
+    </h1>
-    </div>
 
-    <xsl:call-template name="innerresults"/>
+    <xsl:call-template name="results-listing"/>
 
     <xsl:if test="//results/@lastpage &gt; 1">
         <xsl:call-template name="pagination-arrows"/>
@@ -89,6 +34,60 @@
 
 </xsl:template>
 
+
+<xsl:template name="results-listing">
+    <div class="results">
+        <xsl:for-each select="//results/result">
+            <div class="result">
+                <a>
+                    <xsl:attribute name="href">
+                        <xsl:value-of select="rdf:RDF/cc:Work/dc:identifier" />
+                    </xsl:attribute>
+                    <img>
+                        <xsl:attribute name="src">
+                            <xsl:value-of select="@thumbnail" />
+                        </xsl:attribute>
+                        <xsl:attribute name="alt">
+                            <xsl:value-of select="rdf:RDF/cc:Work/dc:title" />
+                        </xsl:attribute>
+                    </img>
+
+                    <img class="flag">
+                        <xsl:attribute name="src">
+                            <xsl:value-of select="concat('/images/flags/', rdf:RDF/cc:Work/dc:language, '.png')" />
+                        </xsl:attribute>
+                        <xsl:attribute name="alt">
+                            <xsl:value-of select="rdf:RDF/cc:Work/dc:language" />
+                        </xsl:attribute>
+                    </img>
+
+                </a>
+                <br />
+                <a>
+                    <xsl:attribute name="href">
+                        <xsl:value-of select="rdf:RDF/cc:Work/dc:identifier" />
+                    </xsl:attribute>
+                    <xsl:value-of select="rdf:RDF/cc:Work/dc:title" />
+                </a>
+                <br />
+                <span class="duration">
+                    <xsl:variable name="hours" select="floor(@duration div 3600)" />
+                    <xsl:variable name="minutes" select="floor((@duration - $hours*3600) div 60)" />
+                    <xsl:variable name="seconds" select="@duration - $minutes*60 - $hours*3600" />
+                    <xsl:choose>
+                        <xsl:when test="$hours=0">
+                            <xsl:value-of select="concat(format-number($minutes, '00'), ':', format-number($seconds, '00'))" />
+                        </xsl:when>
+                        <xsl:otherwise>
+                            <xsl:value-of select="concat($hours, ':', format-number($minutes, '00'), ':', format-number($seconds, '00'))" />
+                        </xsl:otherwise>
+                    </xsl:choose>
+                </span>
+            </div>
+        </xsl:for-each>
+    </div>
+</xsl:template>
+
 <xsl:template name="pagination-arrows">
     <xsl:variable name="query_string" select="concat($site_strings[@id='path_results'], //results/@query, '&amp;pagesize=', //results/@pagesize)" />
     <div>

trunk/xsl/xhtml/searchbar.xsl

@@ -0,0 +1,72 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<xsl:stylesheet version="1.0"
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+    xmlns:dc="http://purl.org/dc/elements/1.1/"
+    xmlns:cc="http://web.resource.org/cc/"
+    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+>
+
+<xsl:template name="searchbar">
+
+    <div class="searchbar">
+
+        <form method="get" enctype="text/plain">
+            <xsl:attribute name="action">
+                <xsl:value-of select="$site_strings[@id='path_results']" />
+            </xsl:attribute>
+            <fieldset>
+                <label for="query">
+                    <xsl:value-of select="$locale_strings[@id='search']" />:<br />
+                </label>
+                <input type="text" name="query">
+                    <xsl:attribute name="value">
+                        <xsl:if test="//results/@argument='query'">
+                            <xsl:value-of select="//results/@value" />
+                        </xsl:if>
+                    </xsl:attribute>
+                </input>
+                <input type="submit">
+                    <xsl:attribute name="value">
+                        <xsl:value-of select="$locale_strings[@id='button_find']" />
+                    </xsl:attribute>
+                </input>
+            </fieldset>
+        </form>
+
+    <ul id="queries" role="navigation">
+
+        <li id="latestadditions">
+            <a>
+                <xsl:attribute name="href">
+                    <xsl:value-of select="$site_strings[@id='path_query_latestadditions']" />
+                </xsl:attribute>
+                <xsl:value-of select="$locale_strings[@id='query_latestadditions']" />
+            </a>
+        </li>
+
+        <li id="mostviews">
+            <a>
+                <xsl:attribute name="href">
+                    <xsl:value-of select="$site_strings[@id='path_query_mostviews']" />
+                </xsl:attribute>
+                <xsl:value-of select="$locale_strings[@id='query_mostviews']" />
+            </a>
+        </li>
+
+        <li id="mostdownloads">
+            <a>
+                <xsl:attribute name="href">
+                    <xsl:value-of select="$site_strings[@id='path_query_mostdownloads']" />
+                </xsl:attribute>
+                <xsl:value-of select="$locale_strings[@id='query_mostdownloads']" />
+            </a>
+        </li>
+
+    </ul>
+
+    </div>
+
+</xsl:template>
+
+</xsl:stylesheet>

trunk/xsl/xhtml/splash.xsl

@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<xsl:stylesheet version="1.0"
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+    xmlns:dc="http://purl.org/dc/elements/1.1/"
+    xmlns:cc="http://web.resource.org/cc/"
+    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+>
+
+<xsl:template name="splashbox">
+
+    <div class="splashbox">
+
+<!--
+    This is placeholder content,
+    final content will be OH HELO THAR.
+-->
+
+        <h1>Welcome to the Yolanda Video CMS Demo Platform</h1>
+
+<p>Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen Sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. Es ist ein paradiesmatisches Land, in dem einem gebratene Satzteile in den Mund fliegen. Nicht einmal von der allmächtigen Interpunktion werden die Blindtexte beherrscht - ein geradezu unorthographisches Leben.Doch alles Gutzureden konnte es nicht überzeugen und so dauerte es nicht lange, bis ihm ein paar heimtückische Werbetexter auflauerten, es mit Longe und Parole betrunken machten und es dann in ihre Agentur schleppten, wo sie es für ihre Projekte wieder und wieder mißbrauchten. Und wenn es nicht umgeschrieben wurde, dann benutzen Sie es immernoch.</p>
<p>Unterwegs traf es eine Copy. Die Copy warnte das Blindtextchen, da, wo sie herkäme wäre sie zigmal umgeschrieben worden und alles, was von ihrem Ursprung noch übrig wäre, sei das Wort „und“ und das Blindtextchen solle umkehren und wieder in sein eigenes, sicheres Land zurückkehren.</p>
<p>Doch alles Gutzureden konnte es nicht überzeugen und so dauerte es nicht lange, bis ihm ein paar heimtückische Werbetexter auflauerten, es mit Longe und Parole betrunken machten und es dann in ihre Agentur schleppten, wo sie es für ihre Projekte wieder und wieder mißbrauchten. Und wenn es nicht umgeschrieben wurde, dann benutzen Sie es immernoch.</p>
+    </div>
+
+</xsl:template>
+
+</xsl:stylesheet>

trunk/xsl/xhtml/tagcloud.xsl

@@ -0,0 +1,42 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<xsl:stylesheet version="1.0"
+    xmlns="http://www.w3.org/1999/xhtml"
+    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
+    xmlns:dc="http://purl.org/dc/elements/1.1/"
+    xmlns:cc="http://web.resource.org/cc/"
+    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+>
+
+<xsl:template name="tagcloud">
+
+    <xsl:variable name="max" select="//tagcloud/tag/count[not(//tagcloud/tag/count &gt; .)]" />
+    <xsl:variable name="min" select="//tagcloud/tag/count[not(//tagcloud/tag/count &lt; .)]" />
+    <div class="tagcloud">
+        <xsl:for-each select="//tagcloud/tag">
+            <xsl:sort select="text" order="ascending" data-type="text" />
+            <a class="tag">
+                <xsl:attribute name="style">
+<!--
+                scale /should/ be logarithmic, but that's not widely supported
+-->
+                    font-size:<xsl:value-of select="round((32-12)*(number(count)-number($min))div (number($max)-number($min)))+12" />px
+                </xsl:attribute>
+                <xsl:attribute name="href">
+                    <xsl:value-of select="$site_strings[@id='path_results']" />
+                    tag:
+                    <xsl:value-of select="text" />
+                </xsl:attribute>
+                
+                <xsl:value-of select="text" />
+<!--
+                unnecessary, except for debug purposes
+                (<xsl:value-of select="count" />)
+-->
+            </a>
+            &#8204;
+        </xsl:for-each>
+    </div>
+
+</xsl:template>
+
+</xsl:stylesheet>

trunk/xsl/xhtml/upload.xsl

@@ -198,7 +198,7 @@
                     </fieldset>
                 </form>
 
-                <xsl:call-template name="innerresults"/>
+                <xsl:call-template name="results-listing"/>
 
             </xsl:when>
 

trunk/xsl/xhtml/video.xsl

@@ -10,7 +10,6 @@
 <xsl:template name="video">
 
     <!--
-    <xsl:if test="not(//@embed='true')">        
     <div class="videotitle">
         <xsl:value-of select="//video/rdf:RDF/cc:Work/dc:title" />
         <xsl:variable name="hours" select="floor(//video/@duration div 3600)" />
@@ -25,7 +24,6 @@
             </xsl:otherwise>
         </xsl:choose>
     </div>
-    </xsl:if>
 -->
 
     <script type="text/javascript">
@@ -41,133 +39,37 @@
         function hide_movie()
             {
             document.getElementById('video').style.display = 'none';
-            document.getElementById('container').style.display = 'block';
+            document.getElementById('preview').style.display = 'block';
             }
 
         function show_movie()
             {
             document.getElementById('video').style.display = 'inline';
-            document.getElementById('container').style.display = 'none';
+            document.getElementById('preview').style.display = 'none';
+            window.setTimeout("hide_movie()",
+        ]]>
+        </xsl:text>
+<!--
+        window.setTimeout is the stupidest hack i could imagine
+        it doesn't work reliably because of BUFFERING, but
+        3 seconds for initializing should be enough for now ...
+-->
+        <xsl:value-of select="(//video/@duration + 3) * 1000" />
+        <xsl:text disable-output-escaping="yes">
+        <![CDATA[
+            );
             }
-
         ]]]]></xsl:text>
         <xsl:text disable-output-escaping="yes">></xsl:text>
     </script>
 
-    <object type="application/ogg" id="video">
+    <xsl:call-template name="video-description" />
 
-        <xsl:attribute name="width">
+    <xsl:call-template name="video-metadata" />
-            <xsl:value-of select="//video/@width" />
-        </xsl:attribute>
-        <xsl:attribute name="height">
-            <xsl:value-of select="//video/@height" />
-        </xsl:attribute>
-        <xsl:attribute name="data">
-            <xsl:value-of select="concat(//video/rdf:RDF/cc:Work/@rdf:about,'view=true')" />
-        </xsl:attribute>
 
-        <div class="messagebox" id="error">
+    <xsl:call-template name="video-actions" />
-            <img src="/images/tango/dialog-error.png" />
-            <xsl:value-of select="$locale_strings[@id='error_no_ogg_plugin']" />
-        </div>
 
-        <div>
+    <xsl:call-template name="video-object" />
-            <img src="/images/vlc.png"/>
-            <img src="/images/mplayer.png"/>
-            <img src="/images/totem.png"/>
-        </div>
-
-    </object>
-
-    <div id="container" style="display: none;">
-
-        <img>
-            <xsl:attribute name="src">
-                <xsl:value-of select="//video/@thumbnail" />
-            </xsl:attribute>
-            <xsl:attribute name="alt">
-                <xsl:value-of select="//video/rdf:RDF/cc:Work/dc:title" />
-            </xsl:attribute>
-            <xsl:attribute name="height">
-                <xsl:value-of select="//video/@height" />
-            </xsl:attribute>
-            <xsl:attribute name="width">
-                <xsl:value-of select="//video/@width" />
-            </xsl:attribute>
-        </img>
-
-        <form>
-            <xsl:attribute name="action">
-                <xsl:value-of select="//video/rdf:RDF/cc:Work/@rdf:about" />
-            </xsl:attribute>
-            <button
-                name="playback"
-                type="button"
-                value="playback"
-                onclick="show_movie()">
-                <img src="/images/tango/media-playback-start.png" alt="playback" />
-                <br />
-                <xsl:value-of select="$locale_strings[@id='video_playback']" />
-                <br />
-                <xsl:variable name="hours" select="floor(//video/@duration div 3600)" />
-                <xsl:variable name="minutes" select="floor((//video/@duration - $hours*3600) div 60)" />
-                <xsl:variable name="seconds" select="//video/@duration - $minutes*60 - $hours*3600" />
-                <xsl:choose>
-                    <xsl:when test="$hours=0">
-                        (<xsl:value-of select="concat(format-number($minutes, '00'), ':', format-number($seconds, '00'))" />)
-                    </xsl:when>
-                    <xsl:otherwise>
-                        (<xsl:value-of select="concat($hours, ':', format-number($minutes, '00'), ':', format-number($seconds, '00'))" />)
-                    </xsl:otherwise>
-                </xsl:choose>
-            </button>
-            <button
-                name="download"
-                type="submit"
-                value="download">
-                <img src="/images/tango/document-save.png" alt="download" />
-                <br />
-                <xsl:value-of select="$locale_strings[@id='video_download']" />
-                <br />
-                (<xsl:value-of select="format-number(number(round(//video/@filesize) div 1048576), '0.0#')" />&#160;<xsl:value-of select="$locale_strings[@id='megabytes']" />)
-            </button>
-        </form>
-
-    </div>
-
-    <xsl:if test="not(//@embed='true')">
-
-<!--
-        <object type="application/xml" style="float: left">
-            <xsl:attribute name="data">
-                <xsl:value-of select="concat(//rdf:RDF/cc:Work/dc:identifier, 'embed=video')"/>
-            </xsl:attribute>
-            <xsl:attribute name="width">
-                75%
-            </xsl:attribute>
-        </object>
--->
-
-        <xsl:call-template name="videometadata"/>
-        <br />
-
-        <div class="button-download">
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="//video/rdf:RDF/cc:Work/@rdf:about" />
-                </xsl:attribute>
-                <img src="/images/tango/document-save.png" />
-            </a>
-            <br />
-            <a>
-                <xsl:attribute name="href">
-                    <xsl:value-of select="//video/rdf:RDF/cc:Work/@rdf:about" />
-                </xsl:attribute>
-                <xsl:value-of select="$locale_strings[@id='video_download']" />
-            </a>
-            <br />
-            (<xsl:value-of select="format-number(number(round(//video/@filesize) div 1048576), '0.0#')" />&#160;<xsl:value-of select="$locale_strings[@id='megabytes']" />)
-        </div>
 
     <xsl:call-template name="cclicense"/>
 
@@ -175,20 +77,24 @@
         <span class="protip-embed">
             <xsl:value-of select="$locale_strings[@id='protip_embed']" />
             <br />
-                <span class="code">
+            <code>
                 &lt;object data="<xsl:value-of select="concat(//rdf:RDF/cc:Work/dc:identifier, 'embed=true')" />"
                     type="application/xml"
                     width=<xsl:value-of select="//video/@width + 24" />
                     height=<xsl:value-of select="//video/@height + 48" />
                 /&gt;
-                </span>
+            </code>
         </span>
     </div>
 
+<!--
+    comment system is broken (similar to the german online petition system)
+    if a video ever gets OVER NEIN THOUSAND comments, the shit hits the fan
+
     <xsl:call-template name="commentform"/>
     <xsl:call-template name="comments"/>
+-->
 
-    </xsl:if>
 </xsl:template>
 
 <xsl:template name="comments">
@@ -307,13 +213,53 @@
 
 </xsl:template>
 
-<xsl:template name="videometadata">
+<xsl:template name="video-actions">
+    <div class="button-download">
+        <a>
+            <xsl:attribute name="href">
+                <xsl:value-of select="//video/rdf:RDF/cc:Work/@rdf:about" />
+            </xsl:attribute>
+            <img src="/images/tango/document-save.png" />
+        </a>
+        <br />
+        <a>
+            <xsl:attribute name="href">
+                <xsl:value-of select="//video/rdf:RDF/cc:Work/@rdf:about" />
+            </xsl:attribute>
+            <xsl:value-of select="$locale_strings[@id='video_download']" />
+        </a>
+        <br />
+        (<xsl:value-of select="format-number(number(round(//video/@filesize) div 1048576), '0.0#')" />&#160;<xsl:value-of select="$locale_strings[@id='unit_megabytes']" />)
+    </div>
+</xsl:template>
 
-    <div class="video-metadata">
+<xsl:template name="video-description">
 
+    <div class="description">
+        <h1>
+            <xsl:value-of select="//video/rdf:RDF/cc:Work/dc:title" />
+            <span class="duration">
+                <xsl:variable name="hours" select="floor(//video/@duration div 3600)" />
+                <xsl:variable name="minutes" select="floor((//video/@duration - $hours*3600) div 60)" />
+                <xsl:variable name="seconds" select="//video/@duration - $minutes*60 - $hours*3600" />
+                <xsl:choose>
+                    <xsl:when test="$hours=0">
+                        <xsl:value-of select="concat(format-number($minutes, '00'), ':', format-number($seconds, '00'))" />
+                    </xsl:when>
+                    <xsl:otherwise>
+                        <xsl:value-of select="concat($hours, ':', format-number($minutes, '00'), ':', format-number($seconds, '00'))" />
+                    </xsl:otherwise>
+                </xsl:choose>
+            </span>
+        </h1>
         <xsl:value-of select="//video/rdf:RDF/cc:Work/dc:description" />
+    </div>
 
-        <hr />
+</xsl:template>
+
+<xsl:template name="video-metadata">
+
+    <div class="metadata">
 
         <table class="metadata">
 
@@ -396,4 +342,88 @@
 
 </xsl:template>
 
+<xsl:template name="video-object">
+
+    <object type="application/ogg" id="video">
+
+        <xsl:attribute name="width">
+            <xsl:value-of select="//video/@width" />
+        </xsl:attribute>
+        <xsl:attribute name="height">
+            <xsl:value-of select="//video/@height" />
+        </xsl:attribute>
+        <xsl:attribute name="data">
+            <xsl:value-of select="concat(//video/rdf:RDF/cc:Work/@rdf:about,'view=true')" />
+        </xsl:attribute>
+
+        <div class="messagebox" id="error">
+            <xsl:value-of select="$locale_strings[@id='error_no_ogg_plugin']" />
+        </div>
+
+        <div style="margin-right:22em;">
+<!--
+        TODO: we need a plugin download area
+        (has to contain download links for every system)
+-->
+            <img src="/images/vlc.png"/>
+            <img src="/images/mplayer.png"/>
+            <img src="/images/totem.png"/>
+        </div>
+
+    </object>
+
+    <div id="preview" style="display: none;">
+
+        <img>
+            <xsl:attribute name="src">
+                <xsl:value-of select="//video/@thumbnail" />
+            </xsl:attribute>
+            <xsl:attribute name="alt">
+                <xsl:value-of select="//video/rdf:RDF/cc:Work/dc:title" />
+            </xsl:attribute>
+            <xsl:attribute name="height">
+                <xsl:value-of select="//video/@height" />
+            </xsl:attribute>
+            <xsl:attribute name="width">
+                <xsl:value-of select="//video/@width" />
+            </xsl:attribute>
+        </img>
+
+        <form>
+            <xsl:attribute name="action">
+                <xsl:value-of select="//video/rdf:RDF/cc:Work/@rdf:about" />
+            </xsl:attribute>
+            <button
+                name="playback"
+                type="button"
+                onclick="show_movie()"
+            >
+                <xsl:attribute name="value">
+                    <xsl:value-of select="$locale_strings[@id='video_playback']" />
+                </xsl:attribute>
+                <img src="/images/tango/128x128/player_play.png">
+                    <xsl:attribute name="alt">
+                        <xsl:value-of select="$locale_strings[@id='video_playback']" />
+                    </xsl:attribute>
+                </img>
+            </button>
+            <button
+                name="download"
+                type="submit"
+            >
+                <xsl:attribute name="value">
+                    <xsl:value-of select="$locale_strings[@id='video_download']" />
+                </xsl:attribute>
+                <img src="/images/tango/128x128/document-save.png">
+                    <xsl:attribute name="alt">
+                        <xsl:value-of select="$locale_strings[@id='video_download']" />
+                    </xsl:attribute>
+                </img>
+            </button>
+        </form>
+
+    </div>
+
+</xsl:template>
+
 </xsl:stylesheet>

trunk/xsl/xhtml/xhtml-body.xsl

@@ -17,24 +17,38 @@
             </xsl:attribute>
         </xsl:if>
 
-        <xsl:if test="not(//@embed)">
-
         <xsl:call-template name="header"/>
 
+        <xsl:choose>
+            <xsl:when test="//frontpage">
+                <xsl:call-template name="searchbar" />
+                <xsl:call-template name="loginbox" />
+                <xsl:call-template name="tagcloud" />
+
                 <xsl:if test="//message">
                     <xsl:call-template name="message"/>
                 </xsl:if>
 
-            <xsl:if test="//search">
+                <xsl:call-template name="splashbox" />
+            </xsl:when>
+
+            <xsl:when test="//video">
                 <xsl:call-template name="searchbar" />
+
+                <xsl:if test="//message">
+                    <xsl:call-template name="message"/>
                 </xsl:if>
 
-        </xsl:if>
+                <xsl:call-template name="video"/>
+            </xsl:when>
+
+            <xsl:when test="//search">
+                <xsl:call-template name="searchbar" />
+                <xsl:call-template name="results"/>
+            </xsl:when>
+        </xsl:choose>
 
         <xsl:choose>
-            <xsl:when test="//frontpage">
-                <xsl:call-template name="frontpage"/>
-            </xsl:when>
             <xsl:when test="//registerform">
                 <xsl:call-template name="registerform"/>
             </xsl:when>
@@ -44,26 +58,16 @@
             <xsl:when test="//uploadform">
                 <xsl:call-template name="uploadform"/>
             </xsl:when>
-            <xsl:when test="//search">
-                <xsl:call-template name="results"/>
-            </xsl:when>
             <xsl:when test="//advancedsearch">
                 <xsl:call-template name="advancedsearch"/>
             </xsl:when>
-            <xsl:when test="//video">
-                <xsl:call-template name="video"/>
-            </xsl:when>
             <xsl:when test="//settings">
                 <xsl:call-template name="settings"/>
             </xsl:when>
         </xsl:choose>
 
-        <xsl:if test="not(//@embed)">
-
         <xsl:call-template name="footer"/>
 
-        </xsl:if>
-
     </body>
 
 </xsl:template>