josch/yolanda
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

upload pagination prototype

Browse source 
results listing pagination is a form now
48x48 is the new standard icon size


git-svn-id: http://yolanda.mister-muffin.de/svn@352 7eef14d0-6ed0-489d-bf55-20463b2d70db
This commit is contained in:
erlehmann 2008-05-26 16:02:54 +00:00
parent 9642cf2bba
commit 50245bcb25
13 changed files with 323 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
trunk/images/tango/48x48/actions/document-send.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
trunk/images/tango/48x48/actions/go-first.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
trunk/images/tango/48x48/actions/go-last.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
trunk/images/tango/48x48/actions/go-next.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
trunk/images/tango/48x48/actions/go-previous.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

7
trunk/style/colors/tango.css
View file

@ -76,6 +76,13 @@ fieldset,
border-color: #555753;
}
ul#queries
{
margin-bottom: 0.5em;
margin-left: 2em;
margin-top: 1em;
}
/* TODO: make images configurable (maybe via symlinks?) */
li#search_custom_one
{

1
trunk/style/embedded.css
View file

@ -1,3 +1,4 @@
@import "reset.css";
@import "colors/tango.css";
body

5
trunk/style/reset.css
View file

@ -4,9 +4,10 @@ Eric Meyers reset stylesheet, stolen from
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
/*h1, h2, h3, h4, h5, h6,*/
p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,

17
trunk/style/structure/fake6.css
View file

@ -101,10 +101,21 @@ fieldset
/* forms */
button[name="upload"]
form.pagination
{
width: 164px;
height: 164px;
/*
works with Firefox 2 (for demonstration purposes only)
=== REMOVE THIS IN FINAL BUILD ===
*/
display: -moz-inline-box;
display: inline-block;
}
form.pagination fieldset
{
border-width: 0px !important;
margin: 0px !important;
padding: 0px !important;
}
input[type="text"],

192
trunk/xsl/xhtml/results.xsl
View file

@ -36,9 +36,7 @@
<xsl:call-template name="results-listing"/>
<xsl:if test="//results/@lastpage &gt; 1">
<xsl:call-template name="pagination-arrows"/>
</xsl:if>
<xsl:call-template name="pagination-arrows"/>
</fieldset>
@ -89,59 +87,153 @@
</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>
<a>
<xsl:attribute name="href">
<xsl:value-of select="concat($query_string, '&amp;page=1')" />
</xsl:attribute>
<xsl:if test="//results/@currentpage&lt;=1">
<xsl:attribute name="style">
visibility: hidden;
</xsl:attribute>
</xsl:if>
<img src="./images/tango/go-first.png" />
</a>
<a>
<xsl:attribute name="href">
<xsl:value-of select="concat($query_string, '&amp;page=', //results/@currentpage - 1)" />
</xsl:attribute>
<xsl:if test="//results/@currentpage&lt;=1">
<xsl:attribute name="style">
visibility: hidden;
</xsl:attribute>
</xsl:if>
<img src="./images/tango/go-previous.png" />
</a>
<!-- divitis, this div is not necessary -->
<div class="page-number">
<xsl:value-of select="//results/@currentpage" />
</div>
<form class="pagination" method="get" enctype="application/x-www-form-urlencoded">
<xsl:attribute name="action">
<xsl:value-of select="$site_strings[@id='path_search']" />
</xsl:attribute>
<a>
<xsl:attribute name="href">
<xsl:value-of select="concat($query_string, '&amp;page=', //results/@currentpage + 1)" />
<fieldset>
<input type="hidden" name="query">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@query" />
</xsl:attribute>
</input>
<input type="hidden" name="page">
<xsl:attribute name="value">1</xsl:attribute>
</input>
<input type="hidden" name="pagesize">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@pagesize" />
</xsl:attribute>
</input>
<button>
<xsl:if test="//results/@currentpage&lt;=1">
<xsl:attribute name="disabled">
disabled
</xsl:attribute>
</xsl:if>
<img src="/images/tango/48x48/actions/go-first.png" />
</button>
</fieldset>
</form>
<form class="pagination" method="get" enctype="application/x-www-form-urlencoded">
<xsl:attribute name="action">
<xsl:value-of select="$site_strings[@id='path_search']" />
</xsl:attribute>
<xsl:if test="//results/@lastpage&lt;=//results/@currentpage">
<xsl:attribute name="style">
visibility: hidden;
</xsl:attribute>
</xsl:if>
<img src="./images/tango/go-next.png" />
</a>
<a>
<xsl:attribute name="href">
<xsl:value-of select="concat($query_string, '&amp;page=', //results/@lastpage)" />
<fieldset>
<input type="hidden" name="query">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@query" />
</xsl:attribute>
</input>
<input type="hidden" name="page">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@currentpage - 1" />
</xsl:attribute>
</input>
<input type="hidden" name="pagesize">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@pagesize" />
</xsl:attribute>
</input>
<button>
<xsl:if test="//results/@currentpage&lt;=1">
<xsl:attribute name="disabled">
disabled
</xsl:attribute>
</xsl:if>
<img src="/images/tango/48x48/actions/go-previous.png" />
</button>
</fieldset>
</form>
<form class="pagination" method="get" enctype="application/x-www-form-urlencoded">
<xsl:attribute name="action">
<xsl:value-of select="$site_strings[@id='path_search']" />
</xsl:attribute>
<xsl:if test="//results/@lastpage&lt;=//results/@currentpage">
<xsl:attribute name="style">
visibility: hidden;
</xsl:attribute>
</xsl:if>
<img src="./images/tango/go-last.png" />
</a>
<fieldset>
<input type="hidden" name="query">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@query" />
</xsl:attribute>
</input>
<input type="hidden" name="page">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@currentpage + 1" />
</xsl:attribute>
</input>
<input type="hidden" name="pagesize">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@pagesize" />
</xsl:attribute>
</input>
<button>
<xsl:if test="//results/@lastpage&lt;=//results/@currentpage">
<xsl:attribute name="disabled">
disabled
</xsl:attribute>
</xsl:if>
<img src="/images/tango/48x48/actions/go-next.png" />
</button>
</fieldset>
</form>
<form class="pagination" method="get" enctype="application/x-www-form-urlencoded">
<xsl:attribute name="action">
<xsl:value-of select="$site_strings[@id='path_search']" />
</xsl:attribute>
<fieldset>
<input type="hidden" name="query">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@query" />
</xsl:attribute>
</input>
<input type="hidden" name="page">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@lastpage" />
</xsl:attribute>
</input>
<input type="hidden" name="pagesize">
<xsl:attribute name="value">
<xsl:value-of select="/page/results/@pagesize" />
</xsl:attribute>
</input>
<button>
<xsl:if test="//results/@lastpage&lt;=//results/@currentpage">
<xsl:attribute name="disabled">
disabled
</xsl:attribute>
</xsl:if>
<img src="/images/tango/48x48/actions/go-last.png" />
</button>
</fieldset>
</form>
<br />
<xsl:value-of select="//results/@currentpage" />
</div>
</xsl:template>
</xsl:stylesheet>

4
trunk/xsl/xhtml/searchbar.xsl
View file

@ -23,8 +23,8 @@
<input type="text" name="query">
<xsl:attribute name="value">
<xsl:if test="//results/@argument='query'">
<xsl:value-of select="//results/@value" />
<xsl:if test="/page/results/@query">
<xsl:value-of select="/page/results/@query" />
</xsl:if>
</xsl:attribute>
</input>

147
trunk/xsl/xhtml/upload.xsl
View file

@ -11,6 +11,127 @@
>
<xsl:template name="uploadform">
<script type="text/javascript">
<!--
this looks awfully ugly, but nevertheless generates javascript inside _valid_ XHTML
kudos to toby white who details the solution on http://scispace.net/tow21/weblog/718.html
-->
<xsl:text disable-output-escaping="yes">&lt;![CDATA[
<![CDATA[
// stupid and quick hack, paging information should be provided via xforms
function show_page_1()
{
document.getElementById('data').parentNode.style.display = 'none';
document.getElementById('dcterms:abstract').parentNode.style.display = 'block';
document.getElementById('dcterms:alternative').parentNode.style.display = 'block';
document.getElementById('dcterms:created').parentNode.style.display = 'none';
document.getElementById('dcterms:creator').parentNode.style.display = 'block';
document.getElementById('dcterms:contributor').parentNode.style.display = 'block';
document.getElementById('dcterms:hasFormat').parentNode.style.display = 'none';
document.getElementById('dcterms:hasPart').parentNode.style.display = 'none';
document.getElementById('dcterms:isFormatOf').parentNode.style.display = 'none';
document.getElementById('dcterms:isPartOf').parentNode.style.display = 'none';
document.getElementById('dcterms:language').parentNode.style.display = 'none';
document.getElementById('dcterms:license').parentNode.style.display = 'none';
document.getElementById('dcterms:references').parentNode.style.display = 'none';
document.getElementById('dcterms:replaces').parentNode.style.display = 'none';
document.getElementById('dcterms:rightsHolder').parentNode.style.display = 'none';
document.getElementById('dcterms:source').parentNode.style.display = 'none';
document.getElementById('dcterms:spatial').parentNode.style.display = 'none';
document.getElementById('dcterms:subject').parentNode.style.display = 'block';
document.getElementById('dcterms:temporal').parentNode.style.display = 'none';
document.getElementById('dcterms:title').parentNode.style.display = 'block';
document.getElementById('commercial').parentNode.parentNode.style.display = 'none';
document.getElementById('remix').parentNode.parentNode.style.display = 'none';
document.getElementById('next').removeAttribute('disabled');
document.getElementById('next').setAttribute('onclick', 'show_page_2()');
document.getElementById('previous').removeAttribute('onclick');
document.getElementById('previous').setAttribute('disabled', 'disabled');
document.getElementById('upload').setAttribute('disabled', 'disabled');
}
function show_page_2()
{
document.getElementById('data').parentNode.style.display = 'none';
document.getElementById('dcterms:abstract').parentNode.style.display = 'none';
document.getElementById('dcterms:alternative').parentNode.style.display = 'none';
document.getElementById('dcterms:created').parentNode.style.display = 'block';
document.getElementById('dcterms:creator').parentNode.style.display = 'none';
document.getElementById('dcterms:contributor').parentNode.style.display = 'none';
document.getElementById('dcterms:hasFormat').parentNode.style.display = 'block';
document.getElementById('dcterms:hasPart').parentNode.style.display = 'block';
document.getElementById('dcterms:isFormatOf').parentNode.style.display = 'block';
document.getElementById('dcterms:isPartOf').parentNode.style.display = 'block';
document.getElementById('dcterms:language').parentNode.style.display = 'block';
document.getElementById('dcterms:license').parentNode.style.display = 'none';
document.getElementById('dcterms:references').parentNode.style.display = 'none';
document.getElementById('dcterms:replaces').parentNode.style.display = 'none';
document.getElementById('dcterms:rightsHolder').parentNode.style.display = 'none';
document.getElementById('dcterms:source').parentNode.style.display = 'none';
document.getElementById('dcterms:spatial').parentNode.style.display = 'block';
document.getElementById('dcterms:subject').parentNode.style.display = 'none';
document.getElementById('dcterms:temporal').parentNode.style.display = 'block';
document.getElementById('dcterms:title').parentNode.style.display = 'none';
document.getElementById('commercial').parentNode.parentNode.style.display = 'none';
document.getElementById('remix').parentNode.parentNode.style.display = 'none';
document.getElementById('next').removeAttribute('disabled');
document.getElementById('next').setAttribute('onclick', 'show_page_3()');
document.getElementById('previous').removeAttribute('disabled');
document.getElementById('previous').setAttribute('onclick', 'show_page_1()');
document.getElementById('upload').setAttribute('disabled', 'disabled');
}
function show_page_3()
{
document.getElementById('data').parentNode.style.display = 'none';
document.getElementById('dcterms:abstract').parentNode.style.display = 'none';
document.getElementById('dcterms:alternative').parentNode.style.display = 'none';
document.getElementById('dcterms:created').parentNode.style.display = 'none';
document.getElementById('dcterms:creator').parentNode.style.display = 'none';
document.getElementById('dcterms:contributor').parentNode.style.display = 'none';
document.getElementById('dcterms:hasFormat').parentNode.style.display = 'none';
document.getElementById('dcterms:hasPart').parentNode.style.display = 'none';
document.getElementById('dcterms:isFormatOf').parentNode.style.display = 'none';
document.getElementById('dcterms:isPartOf').parentNode.style.display = 'none';
document.getElementById('dcterms:language').parentNode.style.display = 'none';
document.getElementById('dcterms:license').parentNode.style.display = 'block';
document.getElementById('dcterms:references').parentNode.style.display = 'none';
document.getElementById('dcterms:replaces').parentNode.style.display = 'none';
document.getElementById('dcterms:rightsHolder').parentNode.style.display = 'block';
document.getElementById('dcterms:source').parentNode.style.display = 'none';
document.getElementById('dcterms:spatial').parentNode.style.display = 'none';
document.getElementById('dcterms:subject').parentNode.style.display = 'none';
document.getElementById('dcterms:temporal').parentNode.style.display = 'none';
document.getElementById('dcterms:title').parentNode.style.display = 'none';
document.getElementById('commercial').parentNode.parentNode.style.display = 'block';
document.getElementById('remix').parentNode.parentNode.style.display = 'block';
document.getElementById('next').removeAttribute('onclick');
document.getElementById('next').setAttribute('disabled', 'disabled');
document.getElementById('previous').removeAttribute('disabled');
document.getElementById('previous').setAttribute('onclick', 'show_page_2()');
document.getElementById('upload').removeAttribute('disabled');
}
]]]]></xsl:text>
<xsl:text disable-output-escaping="yes">></xsl:text>
</script>
<form method="post">
<xsl:attribute name="action">
@ -192,11 +313,33 @@
<br />
<button name="upload" type="submit">
<button disabled="disabled" id="previous" type="button" >
<xsl:attribute name="value">
<xsl:value-of select="$lang_strings[@id='button_next_page']" />
</xsl:attribute>
<img src="/images/tango/128x128/actions/document-send.png">
<img src="/images/tango/48x48/actions/go-previous.png">
<xsl:attribute name="alt">
<xsl:value-of select="$lang_strings[@id='button_upload_send_file']" />
</xsl:attribute>
</img>
</button>
<button disabled="disabled" id="next" type="button" >
<xsl:attribute name="value">
<xsl:value-of select="$lang_strings[@id='button_next_page']" />
</xsl:attribute>
<img src="/images/tango/48x48/actions/go-next.png">
<xsl:attribute name="alt">
<xsl:value-of select="$lang_strings[@id='button_upload_send_file']" />
</xsl:attribute>
</img>
</button>
<button id="upload" type="submit">
<xsl:attribute name="value">
<!-- <xsl:value-of select="$lang_strings[@id='button_next_page']" />-->
</xsl:attribute>
<img src="/images/tango/48x48/actions/document-send.png">
<xsl:attribute name="alt">
<xsl:value-of select="$lang_strings[@id='button_upload_send_file']" />
</xsl:attribute>

12
trunk/xsl/xhtml/xhtml-body.xsl
View file

@ -20,6 +20,12 @@
</xsl:attribute>
</xsl:if>
<xsl:if test="/page/xforms:instance">
<xsl:attribute name="onload">
show_page_1()
</xsl:attribute>
</xsl:if>
<xsl:call-template name="header"/>
<xsl:call-template name="searchbar" />
@ -42,15 +48,15 @@
<xsl:call-template name="results"/>
</xsl:when>
<xsl:when test="//page/video">
<xsl:when test="/page/video">
<xsl:call-template name="video"/>
</xsl:when>
<xsl:when test="//page/results">
<xsl:when test="/page/results">
<xsl:call-template name="results"/>
</xsl:when>
<xsl:when test="//page/xforms:instance">
<xsl:when test="/page/xforms:instance">
<xsl:call-template name="uploadform"/>
</xsl:when>