Changeset 1125 for MDService2/trunk


Ignore:
Timestamp:
02/15/11 21:20:46 (13 years ago)
Author:
gaba
Message:

UI-LAYOUT - first version

Location:
MDService2/trunk/MDService2/WebContent
Files:
14 added
4 edited

Legend:

Unmodified
Added
Removed

  • MDService2/trunk/MDService2/WebContent/index.jsp

    r1108 r1125  
    1010<link rel="stylesheet" href="style/jquery/clarindotblue/jquery-ui-1.8.5.custom.css" type="text/css" />
    1111<link href="style/jquery/jquery-treeview/jquery.treeview.css" rel="stylesheet" />
    12 <link href="style/cmds-ui.css" type="text/css" rel="stylesheet" />
    1312<link href="style/jquery/jquery-textboxlist/TextboxList.css" rel="stylesheet" type="text/css" />
    1413<link href="style/jquery/jquery-autocomplete/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
    1514<link href="style/jquery/treetable/jquery.treeTable.css" rel="stylesheet" type="text/css" />
     15<link href="style/jquery/jquery-layout/layout-default-latest.css" rel="stylesheet" type="text/css" />
     16<link href="style/cmds-ui.css" type="text/css" rel="stylesheet" />
     17
    1618
    1719<script src="scripts/jquery/js/jquery-1.4.2.js" type="text/javascript"></script>
    … …  
    2224<script src="scripts/jquery/jsTree.v.1.0rc2/jquery.jstree.js" type="text/javascript"></script>
    2325<script src="scripts/jquery/jquery-autocomplete/jquery.autocomplete.js" type="text/javascript"></script>
     26<script src="scripts/jquery/jquery-layout/jquery.layout-1.3.0.rc29.12.js" type="text/javascript"></script>
     27<script src="scripts/mdservice_ui_settings.js" type="text/javascript"></script>
    2428<script src="scripts/mdservice_helpers.js" type="text/javascript"></script>
     29<script src="scripts/mdservice_ui_helpers.js" type="text/javascript"></script>
    2530<script src="scripts/mdservice_searchclause.js" type="text/javascript"></script>
    2631<script src="scripts/mdservice_widgets.js" type="text/javascript"></script>
    2732<script src="scripts/mdservice_model.js" type="text/javascript"></script>
    28 <script src="scripts/mdservice2_ui.js" type="text/javascript"></script>
     33<script src="scripts/mdservice_ui_load.js" type="text/javascript"></script>
     34<script src="scripts/mdservice_ui.js" type="text/javascript"></script>
    2935</head>
     36
    3037<body>
    31 <div id="header" >
     38
     39<div class="cmds-ui-block" id="base_east_p"></div>
     40<div class="cmds-ui-block" id="base_center_p"></div>
     41
     42<!--  - BLOCK -->
     43<div class="cmds-ui-block" id="titlelogin">
    3244        <div id="logo"><a href="http://www.clarin.eu" ><img src="style/imgs/clarin-logo.png" alt="CLARIN"></img></a> <div id="site-name" >Metadata Browser</div>
    3345        </div>
    … …  
    4759                                <div id="notifylist" class="note"> <!--  class="cmds-elem-plus note" > -->
    4860                                </div>
    49                         </div>
    50                        
    51                
    52         <!-- <a href="static/profiles_stats.html" >Info from CompReg and DCR about Elements vs. DatCats</a>  -->
     61                        </div>
    5362        </div>
    5463</div>
    55 <div id="left-menu" >
    56         <div id="public-space" class="cmds-ui-block">
     64<!-- --------------------- -->
     65
     66<!-- QUERYSEARCH - BLOCK -->     
     67<div class="cmds-ui-block init-show"  id="querysearch" >
     68                <div class="header ui-widget-header ui-state-default ui-corner-top" >Querysearch</div>
     69                <div class="content" id="query-input" >         
     70                         <s:form action="searchretrieve">                                                       
     71                                <input type="text" id="input-simplequery" name="_query"/>
     72                                <input type="submit"  value="submit" id="submit-query"/>
     73                               
     74                                        <table class="cmds-ui-elem-stretch ui-advanced">
     75                                        <tr><td>
     76                                                <div id="searchclauselist"></div>
     77                                                        &nbsp;&nbsp;&nbsp;
     78                                                <div id="repositories" >               
     79                                                                <label>Repository</label> <select id="repositories_select" ></select>
     80                                                                <input type="checkbox" checked="false" id="input-withsummary" name="WS"/><label>with Summary</label>
     81                                                </div>
     82                                        </td>
     83                                        </tr>
     84                                        <tr>
     85                                        <td valign="top">       
     86                                                <label>columns</label><br/>
     87                                                <div id="columns-widget" class="c-widget"></div>       
     88                                        </td>
     89                                        <td valign="top">
     90                                                <label>collections</label><br/>
     91                                                <div id="collections-widget" class="c-widget"></div>
     92                                        </td>               
     93                                        </tr>
     94                                        <tr>
     95                                        <td valign="top">       
     96                                                <!-- TERMS BLOCK -->
     97                                                                <div class="cmds-ui-block" id="terms-block">
     98                                                                        <div class="header">Terms</div>
     99                                                                        <div id="terms" class="content">
     100                                                                                <div id="model_profiles"></div>
     101                                                                                <div id="model_terms"></div>
     102                                                                        </div>
     103                                                                        <div id="terms_autocomplete"></div>
     104                                                                </div>
     105                                                        <!-- ------------------------------------- -->
     106                                        </td>
     107                                        <td valign="top">
     108                                                <!-- COLLECTIONS BLOCK -->
     109                                                        <div class="cmds-ui-block" id="collections-block">
     110                                                                        <div class="header">Collections</div>
     111                                                                        <div id="collections" class="content"></div>
     112                                                        </div>
     113                                                        <!-- ------------------------------------- -->         
     114                                        </td>               
     115                                        </tr>
     116                                        </table>       
     117                                       
     118                        </s:form>
     119                </div>
     120</div>         
     121       
     122<!-- QUERYLIST BLOCK -->
     123<div id="querylistblock" class="cmds-ui-block">
     124<div class="header ui-widget-header ui-state-default ui-corner-top" >QUERYLIST</div>
     125<div class="content">
     126<div id="querylist"></div>
     127</div>
     128</div>
     129       
     130<div id="detailblock" class="cmds-ui-block">
     131<div class="header ui-widget-header ui-state-default ui-corner-top" >DETAIL</div>
     132<div class="content"></div>
     133</div>
     134
     135<div id="public-space" class="cmds-ui-block">
    57136                <div class="header">Public Space</div>
    58137
    59                 <div id="serverqs" class="content" data="">
    60 <!--             
    61                         <div id="repositories" >               
    62                         <label>Repositories</label><select id="repositories_select" ></select>
    63                         </div>
    64        
    65                         <div id="serverquerysets" >             
    66                         <label>Querysets</label><select id="serverqts_select" ></select>
    67                         </div>
    68                         <div id="serverqueries" ></div>
    69                         -->
    70                 </div>
    71                        
    72         </div>
     138                <div id="serverqs" class="content" >
     139                </div> 
     140</div>
    73141
    74          
    75         <div class="cmds-ui-block init-show">
     142<div class="cmds-ui-block init-show" id="user-space">
    76143        <div class="header" >Personal Workspace</div>   
    77                 <div id="userqs" class="content">
     144        <div id="userqs" class="content">
    78145                        <div id="userquerysets" >               
    79146                                <label>Querysets</label><select id="qts_select" ></select>
    … …  
    87154                        <span id="qts_save" class="cmd cmd_save" ></span>
    88155                        <div id="userqueries" ></div>
    89                        
    90                         <div id="usertermsets" >               
    91                                 <label>Termsets</label><select id="ts_select" ></select>
    92                                 <span id="ts_add" class="cmd cmd_add" ></span>
    93                                 <span id="ts_delete" class="cmd cmd_del" ></span>
    94                         </div>         
    95                         <label>name</label>
    96                         <input type="text" id="ts_input" ></input>
    97                         <span id="ts_save" class="cmd cmd_save" ></span>
    98                         <div id="userterms" ></div>
    99                 </div>
    100                
    101         </div>
    102        
    103         <div class="cmds-ui-block">
    104                 <div class="header">Collections</div>
    105                 <div id="collections" class="content">
    106                 </div>
    107         </div>
    108         <div class="cmds-ui-block">
    109                 <div class="header">Terms</div>
    110                 <div id="terms" class="content">
    111                         <div id="model_profiles">               
    112                         </div>
    113                         <div id="model_terms">         
    114                         </div>
    115                 </div>
    116                 <div id="terms_autocomplete"></div>
    117         </div>
    118        
    119         <div class="cmds-ui-block">
    120                 <div class="header">Profiles/Components</div>   
    121                 <div id="compreg" class="content">
    122                         <div id="profiles" >           
    123                         </div>
    124                         <div id="components" >
    125                         </div>
    126                 </div>         
     156        </div> 
     157</div>
     158
     159<!-- ---QUERYLISTELEMENT-------------------------
     160<div id='querylistelement' class='query_wrapper ui-widget' >
     161     <div class='query_header ui-widget-header ui-state-default ui-corner-top'>
     162         <span class='cmd cmd_get'></span>
     163        <span class='query_id'>qid</span>:
     164        <span class='query'>collection:query, repository:repository</span>
     165        <span class='cmd cmd_detail'></span>
    127166        </div>
    128167</div>
    129168
    130 <div id="main" class="ui-widget">       
    131         <div id="search">       
    132 <!--    <label id="toggle_inputmode_cmd" >TEXT</label> -->
    133                 <div  class="cmds-ui-block init-show" >
    134                 <!-- <div class="ui-widget-header ui-state-default ui-corner-top" >Query</div>
    135                 <div class="ui-widget-content ui-corner-bottom">  -->
    136                 <div class="header" >Query</div>
    137                 <div id="query-input" class="content">         
    138                          <s:form action="searchretrieve">
    139                                 <!-- <label id="toggle_inputmode_cmd"  value="TEXT" />-->                                                       
    140                                 <input type="text" id="input-simplequery" name="_query"  />
    141                                 <input type="submit"  value="submit" id="submit-query"/>                               
    142                                 <input type="text" id="query_list" name="_query_" />   
    143                                 <table class="cmds-ui-elem-stretch"><tr>
    144                                 <td valign="top">       
    145                                         <label>collections</label><br/>
    146                                         <div id="collections-widget" class="c-widget">
    147                                         <!--<textarea id="collection_list" class="cmds-ui-elem-stretch"></textarea>
    148                                          -->
    149                                 </td>
    150                                 <td valign="top">
    151                                         <label>columns</label><br/>
    152                                         <div id="columns-widget" class="c-widget">
    153                                         <!--  <input type='text' class='input-widget autocomplete-input' />
    154                                         <div class='index-context'><table></table></div>
    155                                         <div id='columns-list' class='list-widget'></div>
    156                                         -->
    157                                         </div>
    158                                         <!-- <textarea id="columns_list" class="cmds-ui-elem-stretch"></textarea>
    159                                          -->   
    160                                 </td>           
    161                                 <td valign="top">
    162                                         <div id="repositories" >               
    163                                                 <label>Repository</label> <select id="repositories_select" ></select>
    164                                                 </div>
    165                                 <input type="checkbox" checked="false" id="input-withsummary" name="WS"/><label>with Summary</label>
    166                                 &nbsp;&nbsp;&nbsp;<a target="_blank" href="docs/htmlpage/queries" > example queries</a>
    167                                         </td>     
    168                                 </tr></table>           
    169                         </s:form>
    170                   </div>
    171                 </div> 
    172         </div> 
    173         <div id="querylist" class="block">
     169<div id='detail_querylistelement' class='query_wrapper ui-widget' >
     170     <div class='query_header ui-widget-header ui-state-default ui-corner-top'>
     171         <span class='cmd cmd_get'></span>
     172         <span class='cmd cmd_save'></span>
     173         <span class='cmd cmd_del'> </span>
     174        <span class='query_id'>qid</span>:
     175        <span class='query'>collection:query, repository:repository</span>
     176        <a class='cmd cmd_xml' target='_blank' href=''>xml</a>
     177        <a class='cmd cmd_link' target='_blank' href='' >link</a>
    174178        </div>
    175        
    176         <div id="detail-float"> 
    177         </div>
    178         <div id="notify-float"> 
    179         </div>
    180         <div id="detail">               
    181         </div> 
    182        
     179        <div class='result ui-widget-content ui-corner-bottom'></div>
    183180</div>
    184 <div id="bubble">
    185 </div>
    186 
     181-->
    187182</body>
    188183</html>

  • MDService2/trunk/MDService2/WebContent/scripts/mdservice_helpers.js

    r1081 r1125  
    1 
    2 
     1// url params reading
     2var params;
     3function getUrlVars()
     4{
     5    var vars = [], hash;
     6    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
     7    for(var i = 0; i < hashes.length; i++)
     8    {
     9        hash = hashes[i].split('=');
     10        vars.push(hash[0]);
     11        vars[hash[0]] = hash[1];
     12    }
     13    return vars;
     14}
     15
     16//
    317function handleUIBlock (elems)
    418{
    … …  
    205219
    206220if(typeof String.prototype.trim !== 'function') {   String.prototype.trim = function() {     return this.replace(/^\s+|\s+$/g, '');    } }
     221
     222
     223String.prototype.beginsWith = function(t, i) { if (i==false) { return
     224         (t == this.substring(0, t.length)); } else { return (t.toLowerCase()
     225         == this.substring(0, t.length).toLowerCase()); } } ;
     226
     227
     228String.prototype.endsWith = function(t, i) { if (i==false) { return (t
     229         == this.substring(this.length - t.length)); } else { return
     230         (t.toLowerCase() == this.substring(this.length -
     231         t.length).toLowerCase()); } } ;
     232
     233
     234var Url = {
     235                 
     236                        // public method for url encoding
     237                encode : function (string) {
     238                        return escape(this._utf8_encode(string));
     239                },
     240         
     241                // public method for url decoding
     242                decode : function (string) {
     243                        return this._utf8_decode(unescape(string));
     244                },
     245         
     246                // private method for UTF-8 encoding
     247                _utf8_encode : function (string) {
     248                        string = string.replace(/\r\n/g,"\n");
     249                        var utftext = "";
     250         
     251                        for (var n = 0; n < string.length; n++) {
     252         
     253                                var c = string.charCodeAt(n);
     254         
     255                                if (c < 128) {
     256                                        utftext += String.fromCharCode(c);
     257                                }
     258                                else if((c > 127) && (c < 2048)) {
     259                                        utftext += String.fromCharCode((c >> 6) | 192);
     260                                        utftext += String.fromCharCode((c & 63) | 128);
     261                                }
     262                                else {
     263                                        utftext += String.fromCharCode((c >> 12) | 224);
     264                                        utftext += String.fromCharCode(((c >> 6) & 63) | 128);
     265                                        utftext += String.fromCharCode((c & 63) | 128);
     266                                }
     267         
     268                        }
     269         
     270                        return utftext;
     271                },
     272         
     273                // private method for UTF-8 decoding
     274                _utf8_decode : function (utftext) {
     275                        var string = "";
     276                        var i = 0;
     277                        var c = c1 = c2 = 0;
     278         
     279                        while ( i < utftext.length ) {
     280         
     281                                c = utftext.charCodeAt(i);
     282         
     283                                if (c < 128) {
     284                                        string += String.fromCharCode(c);
     285                                        i++;
     286                                }
     287                                else if((c > 191) && (c < 224)) {
     288                                        c2 = utftext.charCodeAt(i+1);
     289                                        string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
     290                                        i += 2;
     291                                }
     292                                else {
     293                                        c2 = utftext.charCodeAt(i+1);
     294                                        c3 = utftext.charCodeAt(i+2);
     295                                        string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
     296                                        i += 3;
     297                                }
     298         
     299                        }
     300         
     301                        return string;
     302                }
     303         
     304};

  • MDService2/trunk/MDService2/WebContent/scripts/mdservice_model.js

    r1112 r1125  
    1 // client-side oportunistic modelling of "business-objects":
     1 // client-side oportunistic modelling of "business-objects":
    22// Query, Queryset, Component?
    33var page_record_count = 10;
    … …  
    341341
    342342Query.prototype.render = function () {
     343/*
    343344        var x = "<div id='" + this.listid + "' class='query_wrapper ui-widget' ><div class='query_header ui-widget-header ui-state-default ui-corner-top'>" +
    344345        "<span class='cmd cmd_get'></span><span class='cmd cmd_save'></span><span class='cmd cmd_del'> </span>" +
    … …  
    349350                        //"<div class='ui-context-dialog columns-wrapper'><div class='query-columns'></div><span class='cmd cmd_del'></span></div><div class='result ui-widget-content ui-corner-bottom'></div>";
    350351                        "<div class='result ui-widget-content ui-corner-bottom'></div>";
     352                        */
     353        /*
     354        var x = $('#querylistelement').html().toString();
     355        x.replace('querylistelement', this.listid);
     356        $(x).find(".query-id").text(this.listid);
     357        $(x).children().children(".query").text(this.getcollectiontext("name") + ":" + Query.queryliststring(this.squery, this.query) + ", repository:" + this.repository.toString());
     358        */
     359        var x = "<div id='" + this.listid + "' class='query_wrapper ui-widget' ><div class='query_header ui-widget-header ui-state-default ui-corner-top'>" +
     360        "<span class='cmd cmd_get'></span><span class='cmd cmd_del'> </span>" +
     361        "<span class='query_id'>" +     this.listid + "</span>: <span class='query'>" +
     362        this.getcollectiontext("name") + ":" + Query.queryliststring(this.squery, this.query) + ", repository:" + this.repository.toString() + "</span>" +
     363                        "<span class='cmd cmd_detail'></span></div>" +
     364                        "<div class='result ui-widget-content ui-corner-bottom'></div>";
    351365        addToQuerylist(x);     
    352366       
    … …  
    373387        createTooltip(this.container);
    374388 };
     389 
     390 Query.prototype.renderDetail = function () {
     391         
     392                var x = "<div id='detail-" + this.listid + "' class='cmd-ui-block query_wrapper ui-widget' ><div class='query-header ui-widget-header ui-state-default ui-corner-top'>" +
     393                "<span class='cmd cmd_up'></span><span class='cmd cmd_save'></span><span class='cmd cmd_del'> </span>" +
     394                "<span class='query_id'>" +     this.listid + "</span>: <span class='query'>" +
     395                this.getcollectiontext("name") + ":" + Query.queryliststring(this.squery, this.query) + ", repository:" + this.repository.toString() + "</span>" +
     396                                "<a class='cmd cmd_xml' target='_blank' href='" + this.link("xml") + "'>xml</a> <a class='cmd cmd_link' target='_blank' href='" + this.link("fullpage") + "' >link</a></div>" +
     397                                "<div class='ui-widget-content ui-corner-bottom'></div>";
     398                               
     399                addToDetailList(x);     
     400               
     401                var q_header = $(x).find('.query_header');
     402               
     403                q_header.find('.cmd_reload').click(function() {
     404                        // reload  from columns-wrapper
     405                        if ($(this).parent().attr('class').indexOf("columns-wrapper") > 0) {
     406                                $(this).closest('.columns-wrapper').hide();
     407                        }
     408                        var str = $(this).closest('.query_wrapper').attr("id");
     409                        var qid = str.substring(7);
     410                        queryset.resubmit(qid);
     411                });
     412                q_header.find('.cmd_prev').click(function() {
     413                        var str = $(this).closest('.query_wrapper').attr("id");
     414                        var qid = str.substring(7);
     415                        queryset.next(qid,-1);
     416                });
     417                q_header.find('.cmd_next').click(function() {
     418                        var str = $(this).closest('.query_wrapper').attr("id");
     419                        var qid = str.substring(7);
     420                                queryset.next(qid,1);
     421                });
     422               
     423                q_header.find('.value-format').change(function(){
     424                        var str = $(this).closest('.query_wrapper').attr("id");
     425                        var qid = str.substring(7);
     426                        var q = queryset.getQuery(qid);
     427                        q.format = $(this).find('option:selected').val();
     428                        queryset.resubmit(qid);
     429                       
     430                });
     431                q_header.find('.cmd_columns').live('click',  function(event) {
     432                        notifyUser("DEBUG: submit() .cmd_columns");
     433                        $(this).closest('.query_wrapper').find('.columns-wrapper').toggle();
     434                });     
     435
     436                q_header.find('.cmd_add').click(function(){
     437                       
     438                        query_wrapper_add_column($(this));
     439                });
     440               
     441                q_header.find('.cmd_del').click(function(){
     442                        if ($(this).parent().parent().attr("class") == "query-columnslist"){
     443                                var list = $(this).closest('.query-columns').children('.query-columnslist');
     444                                var qid = $(this).closest('.query_wrapper').attr("id");
     445                                var q = queryset.getQuery(qid);
     446                               
     447                                $(this).parent().remove();
     448                                q.updatecolumnstext($(list).children());
     449                                       
     450                        }
     451                        if ($(this).parent().attr('class') == 'columns-wrapper'){
     452                                $(this).parent().hide();
     453                        }
     454                });
     455               
     456                q_header.find('.columns-wrapper').hide();
     457                q_header.find('.terms-tree').treeTable({initialState:"collapsed"});
     458               
     459               
     460          };
     461Query.prototype.showDetail = function() {
     462       
     463        $('#detail-'+this.listid).find('.ui-widget-content').show();
     464        $('#detail-'+this.listid).find('.cmd_down').toggleClass('cmd_down cmd_up');     
     465};
    375466
    376467 Query.prototype.open = function (type) {
    … …  
    434525                                        var q_header;
    435526                                        q_header = $(this).parent().find('.query_header');                                     
    436                                         q_header.append(result_header);                                 
    437                                         q_header.find('.cmd_reload').click(function() {
    438                                                 // reload  from columns-wrapper
    439                                                 if ($(this).parent().attr('class').indexOf("columns-wrapper") > 0) {
    440                                                         $(this).closest('.columns-wrapper').hide();
    441                                                 }
    442                                                 var qid = $(this).closest('.query_wrapper').attr("id");
    443                                                 queryset.resubmit(qid);
    444                                         });
    445                                         q_header.find('.cmd_prev').click(function() {
    446                                                 var qid = $(this).closest('.query_wrapper').attr("id");
    447                                                 queryset.next(qid,-1);
    448                                         });
    449                                         q_header.find('.cmd_next').click(function() {
    450                                                         var qid = $(this).closest('.query_wrapper').attr("id");
    451                                                         queryset.next(qid,1);
    452                                         });
     527                                        q_header.append(result_header);
    453528                                       
    454                                         q_header.find('.value-format').change(function(){
    455                                                 var qid = $(this).closest('.query_wrapper').attr("id");
    456                                                 var q = queryset.getQuery(qid);
    457                                                 q.format = $(this).find('option:selected').val();
    458                                                 queryset.resubmit(qid);
    459                                                
    460                                         });
    461                                         q_header.find('.cmd_columns').live('click',  function(event) {
    462                                                 notifyUser("DEBUG: submit() .cmd_columns");
    463                                                 $(this).closest('.query_wrapper').find('.columns-wrapper').toggle();
    464                                         });     
    465                        
    466                                         q_header.find('.cmd_add').click(function(){
    467                                                
    468                                                 query_wrapper_add_column($(this));
    469                                         });
    470529                                       
    471                                         q_header.find('.cmd_del').click(function(){
    472                                                 if ($(this).parent().parent().attr("class") == "query-columnslist"){
    473                                                         var list = $(this).closest('.query-columns').children('.query-columnslist');
    474                                                         var qid = $(this).closest('.query_wrapper').attr("id");
    475                                                         var q = queryset.getQuery(qid);
    476                                                        
    477                                                         $(this).parent().remove();
    478                                                         q.updatecolumnstext($(list).children());
    479                                                                
    480                                                 }
    481                                                 if ($(this).parent().attr('class') == 'columns-wrapper'){
    482                                                         $(this).parent().hide();
    483                                                 }
    484                                         });
    485                                        
    486                                         q_header.find('.columns-wrapper').hide();
    487                                         q_header.find('.terms-tree').treeTable({initialState:"collapsed"});
    488530                                        createTooltip($(this));
    489531                                });

  • MDService2/trunk/MDService2/WebContent/style/cmds-ui.css

    r1085 r1125  
    200200        ul { list-style-type: disc;     }
    201201}
     202
     203/* ui layout */
     204
     205        .base-west ,
     206        .base-east ,
     207        .base-center ,
     208        .base_center_p-north ,
     209        .base_center_p-center  {
     210                /*background-color: #EEE;*/
     211                border:                 0; /* cosmetic */
     212                padding:                0;
     213                overflow:               hidden;
     214        }
     215       
     216       
     217 
     218        /*
     219         
     220        customize borders on panes/resizers to make pretty
     221         */
     222        .ui-layout-pane-west            { border-right:         0; }
     223        .ui-layout-resizer-west         { border-left:          1px solid #BBB; }
     224        .ui-layout-pane-east            { border-left:          0; }
     225        .ui-layout-resizer-east         { border-right:         1px solid #BBB; }
     226        .ui-layout-pane-north           { border-bottom:        0; }
     227        .ui-layout-resizer-north        { border-top:           1px solid #BBB; }
     228        .ui-layout-pane-south           { border-top:           0; }
     229        .ui-layout-resizer-south        { border-bottom:        1px solid #BBB; }
     230        /*
     231         
     232        add borders to resizers when pane is 'closed'
     233         
     234 
     235         
     236.ui-layout-resizer-closed       { border:                       1px solid #BBB; }
     237         */
     238        /*
     239         
     240        show both borders when the resizer is 'dragging'
     241         */
     242        .ui-layout-resizer-west-dragging ,
     243        .ui-layout-resizer-east-dragging {
     244                border-left:            1px solid #BBB;
     245                border-right:           1px solid #BBB;
     246        }
     247        .ui-layout-resizer-north-dragging ,
     248        .ui-layout-resizer-south-dragging {
     249                border-top:             1px solid #BBB;
     250                border-bottom:  1px solid #BBB;
     251        }
     252 
     253
     254
     255
Note: See TracChangeset for help on using the changeset viewer.