Changeset 686


Ignore:
Timestamp:
12/07/12 17:45:36 (12 years ago)
Author:
npipsl
Message:

Interface option global et comparison

Location:
geisa/web
Files:
1 added
3 edited

Legend:

Unmodified
Added
Removed

  • geisa/web/initGeisa.jsp

    r675 r686  
    3333        <div id="tabs" class="containerTabs"></div> 
    3434 
    35         <div id="information" class="information"> This tool is to draw spectroscopic parameters in fonction of wave number. 
     35        <div id="informationContents" class="information"> This tool is to draw spectroscopic parameters in fonction of wave number. 
    3636            Please select the differents parameters to draw your own graph. 
     37            <br> 
     38            For further information, please download the <a href="#">user manual</a>. 
     39        </div> 
     40 
     41        <div style="display:none;" id="informationGlobal" class="information"> This tool is to draw global representation. 
     42            <br> 
     43            For further information, please download the <a href="#">user manual</a>. 
     44        </div> 
     45 
     46        <div style="display:none;" id="informationComparison" class="information"> This tool is to compare two databases. 
    3747            <br> 
    3848            For further information, please download the <a href="#">user manual</a>. 
    … …  
    4656                        <div id="database" class="database"> 
    4757                            <fieldset class="options"><legend> <b>Choosing database :</b></legend> 
    48                                 <div id="database1" class="containerInsideOptions"></div> 
    4958                                <!--Pour l'onglet "Database comparison"   --> 
    50                                 <div style="display:none;" id="database2" class="containerInsideOptionsRight"></div> 
     59                                <div style="display:none;" id="titreDatabase1" class="containerBeginDatabase">First database :</div> 
     60                                <div id="database1" class="containerBeginDatabase"></div> 
     61                                <!--Pour l'onglet "Database comparison"   --> 
     62                                <div style="display:none;" id="titreDatabase2" class="containerBeginDatabase">Seconde database :    </div> 
     63                                <div style="display:none;" id="database2" class="containerDatabase"></div> 
    5164                            </fieldset> 
    5265                        </div> 
    … …  
    90103 
    91104                        <div id="axeY1Gene" class="axeY1Gene"> 
    92                             <fieldset class="options"><legend><a href="#" TITLE="Choose the spectral parameter to draw (intensity, HWM ..etc.) according to wavenumbers."><b>?</b></a>  <b>Choosing line transition parameter :</b></legend> 
     105                            <fieldset class="options"><legend><b>Choosing line transition parameter :  </b><a href="#" TITLE="Selection of spectral parameter to draw (intensity, HWM ..etc.) according to wavenumbers. Note that, it’s possible to draw also the number of transitions when a bin-average greater than 0 is chosen (see advanced options). "><img src="resources/images/elements/index.jpeg" height="16px" width="16px"></a>  </legend> 
    93106                                <div id="axeY1" class="containerInsideOptions"></div> 
    94107                            </fieldset> 
    … …  
    100113                            <div id="scaleY1Titre" class="containerInsideOptions"></div> 
    101114                            <div id="scaleY1" class="containerInsideOptions"></div> 
     115                            <!--Pour l'onglet "Database comparison"   --> 
     116                            <div style="display:none;" id="titreTypePlotY1" class="containerBeginPlot">First database</div> 
    102117                            <div id="typePlotY1" class="containerInsideOptions"></div> 
    103118                            <!--Pour l'onglet "Database comparison"   --> 
    104                             <div style="display:none;" id="typePlotDatabase2" class="containerInsideOptions"></div> 
     119                            <div style="display:none;" id="titreTypePlotDatabase2" class="containerBeginPlot">Second database</div> 
     120                            <div style="display:none;" id="typePlotDatabase2" class="containerPlot"></div> 
    105121                            </fieldset> 
    106122                        </div> 
    … …  
    114130                    <fieldset class="general"><legend><span class="fieldsetGeneralTitle">Advanced Options :</span></legend> 
    115131                        <div id="transition" class="transition"> 
    116                             <fieldset class="options"><legend><a href="#" TITLE="You can choose an upper and/or a lower vibrational state related to a given molecule. This option is available only when a single molecule is selected. The list of available states depends on the chosen molecule and on the spectral interval. "><b>?</b></a>  <b>Choosing vibrational transitions :</b></legend> 
     132                            <fieldset class="options"><legend>  <b>Choosing vibrational transitions :  </b><a href="#" TITLE="Selection of an upper and/or a lower vibrational state related to one given molecule. The list of available states depends on the chosen molecule and on the spectral interval."><img src="resources/images/elements/index.jpeg" height="16px" width="16px"></a></legend> 
    117133                                <div id="transitionValue" class="transitionValue"> 
    118134                                    <div  id="transitionUpper" class="containerInsideOptions"></div> 
    … …  
    125141 
    126142                        <div  id="meanValue" class="meanValue"> 
    127                             <fieldset class="options"><legend><a href="#" TITLE="To draw average values of the selected parameter, choose a bin-average greater than 0. The bin-average is the step according to which the averages values are calculated."><b>?</b></a>  <b>Parameter mean values :</b></legend> 
     143                            <fieldset class="options"><legend> <b>Parameter mean values :  </b><a href="#" TITLE="To draw average values of the selected parameter, choose a bin-average greater than 0. The bin-average is the step according to which the averages values are calculated. "><img src="resources/images/elements/index.jpeg" height="16px" width="16px"></a></legend> 
    128144                                <div id="meanValue1" class="containerInsideOptions"></div> 
    129145                            </fieldset> 
    … …  
    131147 
    132148                        <div id="axeY2Gene" class="axeY2Gene"> 
    133                             <fieldset class="options"><legend><a href="#" TITLE="By this option, you can draw a secondary parameter (coupled with a primary one) using the right Y-Axis. "><b>?</b></a>  <b>Choosing secondary line transition parameter :</b></legend> 
     149                            <fieldset class="options"><legend>  <b>Choosing secondary line transition parameter :  </b><a href="#" TITLE="Optional option, for drawing a secondary parameter (coupled with the primary one)."><img src="resources/images/elements/index.jpeg" height="16px" width="16px"></a></legend> 
    134150                                <div id="axeY2Titre" class="containerInsideOptions"></div> 
    135151                                <div id="axeY2" class="containerInsideOptions"></div> 

  • geisa/web/initGeisa_script.jsp

    r675 r686  
    485485 
    486486                // Create menu deroulant  choix de la base2 pour l'onglet "Database comparison" 
     487 
    487488                var paramDatabase2 = new Object(); 
    488489                paramDatabase2.id = "selectDatabase2"; 
    489490                paramDatabase2.parent = $("#database2"); 
    490                 this.selectDatabase2 = new Select( paramDatabase ); 
     491                this.selectDatabase2 = new Select( paramDatabase2 ); 
    491492                this.selectDatabase2.add( 'GEISA2011', "GEISA 2011", jQuery.proxy(this.onClickSelectDatabase, this), '<%=IsotopeG09.class%>' ); 
    492493                this.selectDatabase2.add( 'GEISA2003', "GEISA 2003", jQuery.proxy(this.onClickSelectDatabase, this), '<%=IsotopeG03.class%>' ); 
    … …  
    517518                document.getElementById("spectralRangeLower").innerHTML = "Lower value, cm<sup>-1</sup> : "; 
    518519                document.getElementById("spectralRangeUpper").innerHTML = "Upper value, cm<sup>-1</sup> : "; 
    519                 document.getElementById("samplingStep").innerHTML = "<br><a href='#' TITLE='Allows to explore the chosen spectral range by generating a graph every spectral step (in the whole chosen spectral range). The default value is equal to size of the selected spectral range.'><b>?</b></a> Sampling step : "; 
     520                document.getElementById("samplingStep").innerHTML = "<br> Splitting step, cm<sup>-1</sup> : <a href='#' TITLE='Split equally the selected spectral range for generating a series of graphs. Default case: one graph for the whole spectral range.'><img src='resources/images/elements/index.jpeg' height='16px' width='16px'></a> "; 
    520521                //zone texte  SpectralRangeLower 
    521522                var inputSpectralRangeLower = $( document.createElement( "input" ) ); 
    … …  
    565566                this.selectTraceAxeY1 = new Select( paramSelectAxeY1 ); 
    566567                this.selectTraceAxeY1.add( 'B', "Intensity", jQuery.proxy(this.onClickSelectTraceAxeY1, this )); 
    567                 this.selectTraceAxeY1.add( 'C', "Air broadening pressure halfwidth", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
     568                this.selectTraceAxeY1.add( 'C', "Air broadening pressure halfwidth HWHM", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
    568569                this.selectTraceAxeY1.add( 'D', "Energy of the lower transition level", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
    569                 this.selectTraceAxeY1.add( 'F', "Temperature of the air broadening halfwidth ", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
    570                 this.selectTraceAxeY1.add( 'N', "Self broadening pressure halfwidth (HWHM)", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
     570                this.selectTraceAxeY1.add( 'F', "Temperature dependence coefficient n of HWHM", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
     571                this.selectTraceAxeY1.add( 'N', "Self broadening pressure halfwidth (HWHMself)", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
    571572                this.selectTraceAxeY1.add( 'O', "Air pressure shift of the line transition", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
    572                 this.selectTraceAxeY1.add( 'R', "Temperature of the air pressure shift ", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
     573                this.selectTraceAxeY1.add( 'R', "Temperature dependence coeff. of the air pressure shift", jQuery.proxy(this.onClickSelectTraceAxeY1, this ) ); 
    573574                this.selectTraceAxeY1.selectFirst( false ); 
    574575 
    … …  
    626627                paramSelectTypeTraceDatabase2.id = "selectTypePlotDatabase2"; 
    627628                paramSelectTypeTraceDatabase2.parent = $("#typePlotDatabase2"); 
    628                 this.selectTypeTraceDatabase2 = new Select( paramSelectTypeTraceY1 ); 
     629                this.selectTypeTraceDatabase2 = new Select( paramSelectTypeTraceDatabase2 ); 
    629630                this.selectTypeTraceDatabase2.add( 'l', "Lines" ); 
    630631                this.selectTypeTraceDatabase2.add( 'p', "Dots" ); 
    … …  
    695696                this.selectTraceAxeY2.add( 'no', "None", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    696697                this.selectTraceAxeY2.add( 'B', "Intensity", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    697                 this.selectTraceAxeY2.add( 'C', "Air broadening pressure halfwidth", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
     698                this.selectTraceAxeY2.add( 'C', "Air broadening pressure halfwidth HWHM", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    698699                this.selectTraceAxeY2.add( 'D', "Energy of the lower transition level", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    699                 this.selectTraceAxeY2.add( 'F', "Temperature of the air broadening halfwidth ", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    700                 this.selectTraceAxeY2.add( 'N', "Self broadening pressure halfwidth (HWHM)", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
     700                this.selectTraceAxeY2.add( 'F', "Temperature dependence coefficient n of HWHM", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
     701                this.selectTraceAxeY2.add( 'N', "Self broadening pressure halfwidth (HWHMself)", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    701702                this.selectTraceAxeY2.add( 'O', "Air pressure shift of the line transition", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    702                 this.selectTraceAxeY2.add( 'R', "Temperature of the air pressure shift ", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
     703                this.selectTraceAxeY2.add( 'R', "Temperature dependence coeff. of the air pressure shift", jQuery.proxy(this.onClickSelectTraceAxeY2, this ) ); 
    703704                this.selectTraceAxeY2.selectFirst( false ); 
    704705 
    … …  
    11031104                if (this.nbGraph > 20) 
    11041105                { 
    1105                     alert("Too many graphics will be drawn ("+this.nbGraph+"). Please change the value of the sampling step or change the value of the type of graph."); 
     1106                    alert("Too many graphics will be drawn ("+this.nbGraph+"). Please change the value of the sampling step or change the type of graph."); 
    11061107                    return; 
    11071108                } 
    … …  
    16711672                document.getElementById('titlePage').innerHTML = "Graphic vizualisation of the GEISA database"; 
    16721673                //Eléments qui apparaissent avec cette option 
     1674                document.getElementById("informationContents").style.display= ""; 
    16731675                document.getElementById("axeY1Gene").style.display= ""; 
    16741676                document.getElementById("showAdvancedOptions").style.display= ""; 
    … …  
    16761678                document.getElementById("drawingOptionsY2").style.display= ""; 
    16771679                //Eléments qui disparaissent avec cette option 
     1680                document.getElementById("informationGlobal").style.display= "none"; 
     1681                document.getElementById("informationComparison").style.display= "none"; 
     1682                document.getElementById("titreDatabase1").style.display= "none"; 
     1683                document.getElementById("titreDatabase2").style.display= "none"; 
    16781684                document.getElementById("database2").style.display= "none"; 
     1685                document.getElementById("titreTypePlotY1").style.display= "none"; 
     1686                document.getElementById("titreTypePlotY2").style.display= "none"; 
    16791687                document.getElementById("typePlotDatabase2").style.display= "none"; 
    16801688                document.getElementById("outputDatabaseComparison").style.display= "none"; 
     1689                //ProblÚme de marge avec le bord du fieldset 
     1690                $("#database1").removeClass("containerDatabase"); 
     1691                $("#database1").addClass("containerBeginDatabase"); 
    16811692            }, 
    16821693            //Action quand on clique sur l'onglet   GlobalRepresentation 
    … …  
    16901701                document.getElementById('titlePage').innerHTML = ""; 
    16911702                document.getElementById('titlePage').innerHTML = "Global Representation"; 
     1703                //Eléments qui apparaissent avec cette option 
     1704                document.getElementById("informationGlobal").style.display= ""; 
    16921705                //Eléments qui disparaissent avec cette option 
     1706                document.getElementById("informationContents").style.display= "none"; 
     1707                document.getElementById("informationComparison").style.display= "none"; 
     1708                document.getElementById("titreDatabase1").style.display= "none"; 
     1709                document.getElementById("titreDatabase2").style.display= "none"; 
    16931710                document.getElementById("database2").style.display= "none"; 
    16941711                document.getElementById("axeY1Gene").style.display= "none"; 
    1695                document.getElementById("typePlotDatabase2").style.display= "none"; 
     1712                document.getElementById("titreTypePlotY1").style.display= "none"; 
     1713                document.getElementById("titreTypePlotY2").style.display= "none"; 
     1714                document.getElementById("typePlotDatabase2").style.display= "none"; 
    16961715                document.getElementById("showAdvancedOptions").style.display= "none"; 
    16971716                document.getElementById("advancedOptions").style.display= "none"; 
     1717                //ProblÚme de marge avec le bord du fieldset 
     1718                $("#database1").removeClass("containerDatabase"); 
     1719                $("#database1").addClass("containerBeginDatabase"); 
    16981720 
    16991721            }, 
    … …  
    17091731                document.getElementById('titlePage').innerHTML = "Databases Comparison"; 
    17101732                //Eléments qui apparaissent avec cette option 
     1733                document.getElementById("informationComparison").style.display= ""; 
     1734                document.getElementById("titreDatabase1").style.display= ""; 
     1735                document.getElementById("titreDatabase2").style.display= ""; 
    17111736                document.getElementById("database2").style.display= ""; 
     1737                document.getElementById("titreTypePlotY1").style.display= ""; 
     1738                document.getElementById("titreTypePlotY2").style.display= ""; 
    17121739                document.getElementById("typePlotDatabase2").style.display= ""; 
    17131740                document.getElementById("showAdvancedOptions").style.display= ""; 
    17141741                document.getElementById("outputDatabaseComparison").style.display= ""; 
    17151742                //Eléments qui disparaissent avec cette option 
     1743                document.getElementById("informationContents").style.display= "none"; 
     1744                document.getElementById("informationGlobal").style.display= "none"; 
    17161745                document.getElementById("axeY2Gene").style.display= "none"; 
    17171746                document.getElementById("drawingOptionsY2").style.display= "none"; 
     1747 
     1748                //ProblÚme de marge avec le bord du fieldset 
     1749                $("#database1").removeClass("containerBeginDatabase"); 
     1750                $("#database1").addClass("containerDatabase"); 
    17181751            }, 
    17191752 
    … …  
    23132346                this.selectButton.setValue("Select all isotopologues"); 
    23142347 
    2315                 //spectral range 
    2316                 //$("#rangeLower").val(0); 
    2317                 //$("#rangeUpper").val(35877.030506); 
    2318                 $("#rangeLower").val(""); 
    2319                 $("#rangeUpper").val(""); 
     2348                 //spectral range 
     2349                 //remettre les valeurs par défaut en fonction de la base sélectionnée : 
     2350                switch (this.selectDatabase.getValue()) { 
     2351                    case 'GEISA2003': 
     2352                        $("#rangeLower").val(0); 
     2353                        $("#rangeUpper").val(35877.030506); 
     2354                        break; 
     2355                    case 'GEISA2011': 
     2356                        $("#rangeLower").val(0); 
     2357                        $("#rangeUpper").val(35877.030506); 
     2358                        break; 
     2359                    case 'GEISAIASI2003': 
     2360                        $("#rangeLower").val(599.000793); 
     2361                        $("#rangeUpper").val(3000.998767); 
     2362                        break; 
     2363                    case 'GEISAIASI2011': 
     2364                        $("#rangeLower").val(599.000793); 
     2365                        $("#rangeUpper").val(3000.998767); 
     2366                        break; 
     2367                } 
     2368 
    23202369                $("#sampStep").val(""); 
    23212370 

  • geisa/web/resources/css/geisa.css

    r675 r686  
    224224 
    225225.inputs { 
    226     float: none; 
     226   /* float: none; */ 
    227227    margin-left: 30px; 
    228228    margin-right: 30px; 
    … …  
    256256margin-left: 35px; 
    257257} 
    258 .containerInsideOptionsRight { 
    259     margin-left: 35px; 
    260  
    261 } 
     258 
    262259 
    263260 
    264261.database { 
    265262    width: 864px; 
    266     float: left; 
     263    /*float: left;*/ 
    267264    margin-bottom: 10px; 
    268265    margin-left: 5px; 
     266} 
     267 
     268.containerBeginDatabase { 
     269    margin-left: 35px; 
     270    float:left; 
     271} 
     272 
     273.containerDatabase { 
     274    margin-left: 6px; 
     275    float:left; 
    269276} 
    270277 
    271278.molecules { 
    272279    width: 864px; 
    273     float: left; 
     280    /*float: left;*/ 
    274281    padding-bottom: 15px; 
    275282    margin-left: 5px; 
    … …  
    287294.spectralRange{ 
    288295    width: 410px; 
    289     float: left; 
     296    /*float: left;*/ 
    290297    margin-left: 5px; 
    291298    margin-bottom: 8px; 
    … …  
    294301.intensity { 
    295302    width: 410px; 
     303    /*float: left;*/ 
     304    padding-bottom: 8px; 
     305    margin-left: 5px; 
     306} 
     307 
     308.axeY1Gene{ 
     309    /*float: left;*/ 
     310    width: 410px; 
     311    margin-left: 5px; 
     312    margin-bottom: 8px; 
     313} 
     314 
     315.drawingOptionsY1{ 
     316    /*float: left;*/ 
     317    width: 410px; 
     318    margin-left: 5px; 
     319    margin-bottom: 8px; 
     320} 
     321 
     322.containerBeginPlot { 
     323    margin-left: 35px; 
    296324    float:left; 
    297     padding-bottom: 8px; 
    298     margin-left: 5px; 
    299 } 
    300  
    301 .axeY1Gene{ 
    302     float: left; 
    303     width: 410px; 
    304     margin-left: 5px; 
    305     margin-bottom: 8px; 
    306 } 
    307  
    308 .drawingOptionsY1{ 
    309     float: left; 
    310     width: 410px; 
    311     margin-left: 5px; 
    312     margin-bottom: 8px; 
     325} 
     326 
     327.containerPlot { 
     328    margin-left: 6px; 
     329    float:left; 
    313330} 
    314331 
    … …  
    323340.transition{ 
    324341    width: 410px; 
    325     float: left; 
     342    /*float: left;*/ 
    326343    margin-left: 5px; 
    327344    margin-bottom: 8px; 
    … …  
    341358.meanValue{ 
    342359    width: 410px; 
    343     float: left; 
     360    /*float: left;*/ 
    344361    margin-left: 5px; 
    345362    margin-bottom: 8px; 
    … …  
    347364 
    348365.axeY2Gene{ 
    349     float: left; 
     366    /*float: left;*/ 
    350367    width: 410px; 
    351368    margin-left: 5px; 
    … …  
    358375 
    359376.drawingOptionsY2{ 
    360     float: left; 
     377    /*float: left;*/ 
    361378    position: relative; 
    362379    width: 410px; 
    … …  
    366383 
    367384.outputDatabaseComparison{ 
    368     float: left; 
     385    /*float: left;*/ 
    369386    position: relative; 
    370387    width: 410px; 
Note: See TracChangeset for help on using the changeset viewer.