Changeset 1526 for trunk/web-app


Ignore:
Timestamp:
Feb 16, 2011, 11:12:14 AM (10 years ago)
Author:
robert@…
Message:

Added assay search and improved query form

Location:
trunk/web-app
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/web-app/css/advancedQuery.css

    r1524 r1526  
    11label { display: inline-block; zoom: 1; *display: inline; width: 110px; margin-top: 10px;  }
    22
    3 #searchForm { position: relative; border: 1px solid #666666; padding: 5px 10px; margin: 10px 0; }
     3#searchForm { position: relative; margin: 10px 0; font-size: 11px; }
     4#searchForm h3 { font-size: 13px; }
     5#searchForm h3 .nummer { display: inline-block; zoom: 1; *display: inline; width: 25px; }
    46
    5 #searchForm ul#criteria { margin-left: 110px; padding-left: 0px; margin-top: -19px; list-style-type: none;  }
    6 #searchForm ul#criteria li { margin: 2px 0; padding-left: 0; }
     7#searchForm p { margin-left: 25px; }
     8
     9#searchForm ul#criteria { margin-left: 25px; padding-left: 0px; list-style-type: none;  }
     10#searchForm ul#criteria li { margin: 2px 0; padding: 2px 0; }
    711#searchForm ul#criteria li span,
    812#searchForm ul#criteria li a { display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-right: 5px; }
    9 #searchForm ul#criteria li .entityfield { width: 180px; }
     13#searchForm ul#criteria li .entityfield { width: 200px; }
    1014#searchForm ul#criteria li .operator { width: 100px; }
    1115#searchForm ul#criteria li .value { width: 240px; }
     16#searchForm ul#criteria li .addButton { margin: 4px 0; }
     17#searchForm ul#criteria li input, #searchForm ul#criteria li select { font-size: 11px; }
    1218
    13 #searchForm ul#criteria li.emptyList { color: #666; }
    14 #searchForm ul#criteria li.emptyList:hover { cursor: default; }
     19#searchForm ul#criteria li.titlerow { font-weight: bold; border-bottom: 1px solid #aaa; }
    1520
    16 #searchForm ul#criteria li:hover { cursor: pointer; }
    17 #searchForm ul#criteria li:hover span { text-decoration: line-through; }
    18 
    19 #input_criteria { display: block; float: right; width: 260px; border-left: 1px solid #666; padding: 10px; position: relative; height: 100%; }
    20 #input_criteria h2 { margin-top: 2px; margin-bottom: 8px; font-weight: bold; }
    21 #input_criteria label { width: 80px; margin-top: 8px; }
    22 #input_criteria input.text, #input_criteria select { width: 165px; }
    23 #input_criteria input.button {  margin-top: 8px; }
    24 #input_criteria .explanation { font-size: 10px; }
     21#searchMode { display: none; }
    2522
    2623.ui-menu-item .entity { color: #666; font-style: italic; }
  • trunk/web-app/js/advancedQuery.js

    r1482 r1526  
    88        // By replacing it with javascript, users without javascript will still be able to use the select
    99        $( '#queryFieldSelect' ).after( $( '<input type="text" class="text" id="queryFieldText">' ));
    10         $( '#queryFieldText' ).after( $( '<input type="hidden" name="field" id="queryField"></span>' ));
     10        $( '#queryFieldText' ).after( $( '<input type="hidden" name="criteria.0.entityfield" id="queryField"></span>' ));
    1111        $( '#queryFieldSelect' ).remove();
    1212
     
    4040
    4141// Is used to keep track of a unique ID for all criteria.
    42 var criteriumId = 0;
     42// ID = 0 is used for the input fields, in order to have them sent as well
     43// when the user clicks 'run query'
     44var criteriumId = 1;
    4345
    4446/**
    4547 * Adds a criteria to the list of search criteria
    4648 */
    47 function addCriterium() {
    48         var field_descriptor = $( '#input_criteria [name=field]' ).val();
    49         var value = $( '#input_criteria input[name=value]' ).val();
    50         var operator = $( '#input_criteria select[name=operator]' ).val();
     49function addCriterion() {
     50        var field_descriptor = $( '#searchForm #queryField' ).val();
     51        var value = $( '#searchForm input#value' ).val();
     52        var operator = $( '#searchForm select#operator' ).val();
    5153       
    5254        // Show the title and a remove button
    5355        showCriterium(field_descriptor, value, operator);
    54         showHideNoCriteriaItem();
     56        toggleSearchMode();
    5557       
    5658        // Clear the input form
    57         $( '#input_criteria #queryFieldText' ).val( '' );
    58         $( '#input_criteria [name=field]' ).val( '' );
    59         $( '#input_criteria select[name=operator]' ).val( 'equals' );
    60         $( '#input_criteria input[name=value]' ).val( '' );
    61 }
    62 
    63 function showHideNoCriteriaItem() {
    64         remainingCriteria = $( '#criteria' ).children().length - 1; // -1 because one element is the 'empty' item
    65 
    66         if( remainingCriteria == 0 ) {
    67                 // Show the 'none box'
    68                 $('#criteria .emptyList').show();
    69                 $('.submitcriteria' ).attr( 'disabled', 'disabled' );
    70         } else {
    71                 // Hide the 'none box'
    72                 $('#criteria .emptyList').hide();
    73                 $('.submitcriteria' ).attr( 'disabled', '' );
    74         }       
     59        $( '#searchForm #queryFieldText' ).val( '' );
     60        $( '#searchForm #queryField' ).val( '' );
     61        $( '#searchForm select#operator' ).val( 'equals' );
     62        $( '#searchForm input#value' ).val( '' );
    7563}
    7664
     
    8068function removeCriterium(element) {
    8169        element.remove();
    82         showHideNoCriteriaItem();
     70        toggleSearchMode();
    8371}
     72
     73function toggleSearchMode() {
     74        if( $('#criteria' ).children( 'li' ) - 2 == 0 ) {
     75                $( '#searchMode' ).hide();
     76        } else {
     77                $( '#searchMode' ).show();
     78        }
     79}
     80
    8481
    8582/**
     
    9895                valueSpan = createCriteriumElement( 'value', value );
    9996       
     97        var input = $( '<a href="#" onClick="return false;"><img src="../plugins/famfamfam-1.0.1/images/icons/delete.png" border="0"></a>' );
     98        input.bind( 'click', function() {
     99                if( confirm( "Are you sure you want to remove this criterium?" ) ) {
     100                        removeCriterium( $(this).closest( 'li' ) );
     101                        return false;
     102                }
     103        });
     104        var span = $( '<span></span>' );
     105        span.append( "\n" ).append( input );
     106       
    100107        // Increase the criteriumID to ensure a unique number every time
    101108        criteriumId++;
     
    103110        // Append them to a list item
    104111        var li = $( '<li></li>' );
    105         li.append( fieldSpan ).append( operatorSpan ).append( valueSpan );
     112        li.append( fieldSpan ).append( "\n" ).append( operatorSpan ).append( "\n" ).append( valueSpan ).append( "\n" ).append( span );
    106113       
    107         li.bind( 'click', function() {
    108                 if( confirm( "Are you sure you want to remove this criterium?" ) ) {
    109                         removeCriterium( $(this) );
    110                         return false;
    111                 }
    112         });
    113114
    114         $('#criteria').append(li);
     115        $('#criteria .newCriterion').before(li);
    115116}
    116117
Note: See TracChangeset for help on using the changeset viewer.