Changeset 4329


Ignore:
Timestamp:
01/24/14 10:57:47 (10 years ago)
Author:
twagoo
Message:

collapse/expand facets in mockup

Location:
vlo/branches/vlo-3.0/vlo-web-app/src/main/html
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • vlo/branches/vlo-3.0/vlo-web-app/src/main/html/index.html

    r4328 r4329  
    2424-->
    2525<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    26 <html xmlns="http://www.w3.org/1999/xhtml" xmlns:wicket="http://wicket.apache.org" xml:lang="en">
     26<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    2727
    2828    <head>
    29         <title>template: home</title>
     29        <title>CLARIN VLO</title>
    3030        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    3131        <meta name="viewport" content="width=device-width"/>
    … …  
    4141
    4242    <body>
    43         <script src="js/jquery-1.10.2.js"></script>
    44         <script>
     43        <script src="js/jquery-1.10.2.js" type="text/javascript"></script>
     44        <script type="text/javascript">
     45            //<![CDATA[
     46
    4547            $(document).ready(function() {
     48                /* collection selection */
    4649                $("li.collection").hide();
    4750                $(".allcollections input").change(function(event) {
    … …  
    6164                    }
    6265                });
     66
     67                /* facet collapse/expand */
     68                $("a.expandfacet").click(function(event) {
     69                    var p = $(this).parent(".collapsedfacet");
     70                    p.addClass("expandedfacet");
     71                    p.removeClass("collapsedfacet");
     72                });
     73                $("a.collapsefacet").click(function(event) {
     74                    var p = $(this).parent(".expandedfacet");
     75                    p.addClass("collapsedfacet");
     76                    p.removeClass("expandedfacet");
     77                });
    6378            });
     79
     80
     81            //]]>
    6482        </script>
    6583
    … …  
    7492                <h1>Collections</h1>
    7593                <p>Collections to search in:</p>
    76                 <form id="collections">
     94                <form action="" id="collections">
    7795                    <ul>
    78                         <li class="allcollections"><input type="checkbox" checked="true">Search in all collections (604056)</input> <a href="#" id="showcollections">or select...</a></li>
    79                         <li class="collection"><input type="checkbox">Meertens collection: Liederenbank (243129)</input></li>
    80                         <li class="collection"><input type="checkbox">UBU Clarin Set (69311)</input></li>
    81                         <li class="collection"><input type="checkbox">Nederlands Instituut voor Beeld en Geluid Academia collectie (46156)</input></li>
    82                         <li class="collection"><input type="checkbox">TLA: childes (29266)</input></li>
    83                         <li class="collection"><input type="checkbox">TLA: DoBeS archive (24722)</input></li>
    84                         <li class="collection"><input type="checkbox">TLA: Language and Cognition (23535)</input></li>
    85                         <li class="collection"><input type="checkbox">TLA: talkbank (14593)</input></li>
    86                         <li class="collection"><input type="checkbox">Bavarian Archive for Speech Signals (BAS) (14416)</input></li>
    87                         <li class="collection"><input type="checkbox">TLA: Acquisition (14363)</input></li>
    88                         <li class="collection"><input type="checkbox">Institut fÃŒr Deutsche Sprache, CLARIN-D Zentrum, Mannheim (14320)</input></li>
    89                         <li class="collection"><input type="checkbox">Meertens collection: Liederenbank (243129)</input></li>
     96                        <li class="allcollections"><input type="checkbox" checked="checked" />Search in all collections (604056)<a href="#" id="showcollections">or select...</a></li>
     97                        <li class="collection"><input type="checkbox"/>Meertens collection: Liederenbank (243129)</li>
     98                        <li class="collection"><input type="checkbox"/>UBU Clarin Set (69311)</li>
     99                        <li class="collection"><input type="checkbox"/>Nederlands Instituut voor Beeld en Geluid Academia collectie (46156)</li>
     100                        <li class="collection"><input type="checkbox"/>TLA: childes (29266)</li>
     101                        <li class="collection"><input type="checkbox"/>TLA: DoBeS archive (24722)</li>
     102                        <li class="collection"><input type="checkbox"/>TLA: Language and Cognition (23535)</li>
     103                        <li class="collection"><input type="checkbox"/>TLA: talkbank (14593)</li>
     104                        <li class="collection"><input type="checkbox"/>Bavarian Archive for Speech Signals (BAS) (14416)</li>
     105                        <li class="collection"><input type="checkbox"/>TLA: Acquisition (14363)</li>
     106                        <li class="collection"><input type="checkbox"/>Institut fÌr Deutsche Sprache, CLARIN-D Zentrum, Mannheim (14320)</li>
     107                        <li class="collection"><input type="checkbox"/>Meertens collection: Liederenbank (243129)</li>
    90108                    </ul>
    91109                    <div id="collections-end"></div>
    … …  
    154172            </div>
    155173            <div class="sidebar">
    156                 <div class="sidebaritem">
    157                     <!-- rounded corners - top **** -->
    158                     <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
     174                <div class="sidebaritem collapsedfacet">
     175                    <!-- rounded corners - top **** -->
     176                    <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
     177                    <a href="#" class="expandfacet">expand</a>
     178                    <a href="#" class="collapsefacet">collapse</a>
    159179                    <h1>Genre</h1>
    160180                    <div class="sbilinks">
    161181                        <ul>
    162                             <li><a href="">Dutch (148081)</a></li>
    163                             <li><a href="">English (72435) </a></li>
    164                             <li><a href="">German (42365) </a></li>
    165                             <li><a href="">French (9165) </a></li>
    166                             <li><a href="">Spanish (8612) </a></li>
    167                             <li><a href="">Danish (8427) </a></li>
    168                             <li><a href="">Japanese (6757) </a></li>
    169                             <li><a href="">Turkish (4968) </a></li>
    170                             <li><a href="">Chinese (1971)</a></li>
     182                            <li><a href="">discourse (81536)</a></li>
     183                            <li><a href="" title="info:eu-repo/semantics/article">info:eu-repo/... (34677)</a></li>
     184                            <li><a href="">kinderlied (19218)</a></li>
     185                            <li><a href="">primary_text (12428)</a></li>
     186                            <li><a href="">narrative (11459)</a></li>
     187                            <li><a href="">language_description (11084)</a></li>
     188                            <li><a href="" title="info:eu-repo/semantics/masterthesis">info:eu-repo/... (10890)</a></li>
     189                            <li><a href="">liefdeslied (8381)</a></li>
     190                            <li><a href="">stimuli (8103)</a></li>
     191                            <li class="more-link"><a href="">more...</a></li>
    171192                        </ul>
    172193                    </div>

  • vlo/branches/vlo-3.0/vlo-web-app/src/main/html/style/vlo.css

    r4328 r4329  
    4949    clear: left;
    5050}
     51
     52a.expandfacet, a.collapsefacet {
     53    float: right;
     54    margin-right: 1em;
     55}
     56
     57.expandedfacet a.expandfacet {
     58    display:  none;
     59}
     60
     61.collapsedfacet .sbilinks {
     62    display:  none;
     63}
     64
     65.collapsedfacet a.collapsefacet {
     66    display:  none;
     67}
Note: See TracChangeset for help on using the changeset viewer.