SOLR-3444: Optimize Navigation for global Items

git-svn-id: https://svn.apache.org/repos/asf/lucene/dev/trunk@1339518 13f79535-47bb-0310-9956-ffa450edef68
This commit is contained in:
Stefan Matheis 2012-05-17 08:45:29 +00:00
parent 3e7339af68
commit 422828cfd6
8 changed files with 62 additions and 87 deletions

View File

@ -76,12 +76,30 @@ limitations under the License.
<div>
<ul id="menu">
<li id="index" class="global"><p><a href="#/">Dashboard</a></p></li>
<li id="logging" class="global"><p><a href="#/~logging">Logging</a></p></li>
<li id="cloud" class="global optional"><p><a href="#/~cloud">Cloud</a></p></li>
<li id="logging" class="global"><p><a href="#/~logging">Logging</a></p>
<ul>
<li class="level"><a href="#/~logging/level">Level</a></li>
</ul>
</li>
<li id="cloud" class="global optional"><p><a href="#/~cloud">Cloud</a></p>
<ul>
<li class="tree"><a href="#/~cloud">Tree</a></li>
<li class="graph"><a href="#/~cloud?view=graph">Graph</a></li>
<li class="rgraph"><a href="#/~cloud?view=rgraph">Graph (Radial)</a></li>
<li class="dump"><a href="#/~cloud">Dump</a></li>
</ul>
</li>
<li id="cores" class="global"><p><a href="#/~cores">Core Admin</a></p></li>
<li id="java-properties" class="global"><p><a href="#/~java-properties">Java Properties</a></li>
<li id="threads" class="global"><p><a href="#/~threads">Thread Dump</a></p></li>
</ul>
<ul id="menu-selector">

View File

@ -3,32 +3,6 @@
position: relative;
}
#content #cloud #navigation
{
width: 11%;
}
#content #cloud #navigation .tree a { background-image: url( ../../img/ico/folder-tree.png ); }
#content #cloud #navigation .graph a { background-image: url( ../../img/ico/molecule.png ); }
#content #cloud #navigation .rgraph a { background-image: url( ../../img/ico/asterisk.png ); }
#content #cloud #navigation .dump a { background-image: url( ../../img/ico/download-cloud.png ); }
#content #cloud #navigation .dump
{
margin-top: 10px;
}
#content #cloud #navigation .dump a:hover
{
color: #008;
}
#content #cloud #frame
{
float: right;
width: 88%;
}
#content #cloud #frame .content
{
display: none;

View File

@ -1,17 +1,3 @@
#content #logging #navigation
{
width: 8%;
}
#content #logging #navigation .viewer a { background-image: url( ../../img/ico/document-text.png ); }
#content #logging #navigation .level a { background-image: url( ../../img/ico/gear.png ); }
#content #logging #frame
{
float: right;
width: 90%;
}
#content #logging .loader
{
background-position: 0 50%;

View File

@ -17,7 +17,8 @@
border-color: #c0c0c0;
}
#menu-wrapper p a
#menu-wrapper p a,
#menu a
{
background-position: 5px 50%;
padding-left: 26px;
@ -138,19 +139,27 @@
background-image: url( ../../img/ico/box.png );
}
#menu-selector ul
#menu-selector ul,
#menu ul
{
display: none;
padding-top: 5px;
padding-bottom: 10px;
}
#menu-selector .active ul
#menu-selector .active ul,
#menu .active ul
{
display: block;
}
#menu-selector ul li a
#menu ul li
{
border-bottom: 0;
}
#menu-selector ul li a,
#menu ul li a
{
background-position: 7px 50%;
border-bottom: 1px solid #f0f0f0;
@ -159,18 +168,21 @@
padding-left: 26px;
}
#menu-selector ul li:last-child a
#menu-selector ul li:last-child a,
#menu ul li:last-child a
{
border-bottom: 0;
}
#menu-selector ul li a:hover
#menu-selector ul li a:hover,
#menu ul li a:hover
{
background-color: #f0f0f0;
color: #333;
}
#menu-selector ul li.active a
#menu-selector ul li.active a,
#menu ul li.active a
{
background-color: #d0d0d0;
border-color: #d0d0d0;
@ -178,11 +190,21 @@
}
#menu #index.global p a { background-image: url( ../../img/ico/dashboard.png ); }
#menu #logging.global p a { background-image: url( ../../img/ico/inbox-document-text.png ); }
#menu #logging.global .level a { background-image: url( ../../img/ico/gear.png ); }
#menu #java-properties.global p a { background-image: url( ../../img/ico/jar.png ); }
#menu #threads.global p a { background-image: url( ../../img/ico/ui-accordion.png ); }
#menu #cores.global p a { background-image: url( ../../img/ico/databases.png ); }
#menu #cloud.global p a { background-image: url( ../../img/ico/network-cloud.png ); }
#menu #cloud.global .tree a { background-image: url( ../../img/ico/folder-tree.png ); }
#menu #cloud.global .graph a { background-image: url( ../../img/ico/molecule.png ); }
#menu #cloud.global .rgraph a { background-image: url( ../../img/ico/asterisk.png ); }
#menu #cloud.global .dump a { background-image: url( ../../img/ico/download-cloud.png ); }
#menu-selector .ping.error a
{

View File

@ -18,7 +18,7 @@
var init_debug = function( cloud_element )
{
var debug_element = $( '#debug', cloud_element );
var debug_button = $( '.dump a', cloud_element );
var debug_button = $( '#menu #cloud .dump a' );
var clipboard_element = $( '.clipboard', debug_element );
var clipboard_button = $( 'a', clipboard_element );
@ -65,7 +65,6 @@ var init_debug = function( cloud_element )
'show',
function( event )
{
debug_button.hide();
debug_element.show();
$.ajax
@ -147,7 +146,6 @@ var init_debug = function( cloud_element )
clipboard_client.destroy();
debug_button.show();
debug_element.hide();
}
);
@ -675,7 +673,7 @@ sammy.get
.html( template );
var cloud_element = $( '#cloud', content_element );
var navigation_element = $( '#navigation', content_element );
var navigation_element = $( '#menu #cloud' );
init_debug( cloud_element );
@ -686,7 +684,7 @@ sammy.get
'activate',
function( event )
{
$( this ).addClass( 'current' );
$( this ).addClass( 'active' );
init_tree( $( '#tree-content', cloud_element ) );
}
);
@ -698,7 +696,7 @@ sammy.get
'activate',
function( event )
{
$( this ).addClass( 'current' );
$( this ).addClass( 'active' );
init_graph( $( '#graph-content', cloud_element ) );
}
);
@ -710,7 +708,7 @@ sammy.get
'activate',
function( event )
{
$( this ).addClass( 'current' );
$( this ).addClass( 'active' );
init_rgraph( $( '#graph-content', cloud_element ) );
}
);

View File

@ -398,9 +398,6 @@ sammy.get
content_element
.html( template );
$( '#navigation a[href="' + context.path + '"]', content_element )
.parent().addClass( 'current' );
frame_element = $( '#frame', content_element );
frame_element
.html
@ -472,7 +469,7 @@ sammy.get
// #/~logging/level
sammy.get
(
/^#\/~(logging)\/level$/,
/^#\/(~logging)\/level$/,
function( context )
{
var core_basepath = $( 'li[data-basepath]', app.menu_element ).attr( 'data-basepath' );
@ -487,8 +484,8 @@ sammy.get
content_element
.html( template );
$( '#navigation a[href="' + context.path + '"]', content_element )
.parent().addClass( 'current' );
$( '#menu a[href="' + context.path + '"]' )
.parent().addClass( 'active' );
$.ajax
(

View File

@ -43,23 +43,12 @@ limitations under the License.
</div>
<div id="navigation" class="clearfix">
<ul>
<li class="tree"><a href="#/~cloud">Tree</a></li>
<li class="graph"><a href="#/~cloud?view=graph">Graph</a></li>
<li class="rgraph"><a href="#/~cloud?view=rgraph">Graph (Radial)</a></li>
<li class="dump"><a href="#/~cloud">Dump</a></li>
<div id="debug">
<ul class="clearfix">
<li class="clipboard"><a href="#" data-copied="Copied to Clipboard!">Copy to Clipboard (BUGGY!)</a></li>
<li class="close"><a href="#">Close</a></li>
</ul>
<div id="debug">
<ul class="clearfix">
<li class="clipboard"><a href="#" data-copied="Copied to Clipboard!">Copy to Clipboard (BUGGY!)</a></li>
<li class="close"><a href="#">Close</a></li>
</ul>
<pre class="debug"></pre>
</div>
<pre class="debug"></pre>
</div>
</div>

View File

@ -20,13 +20,4 @@ limitations under the License.
</div>
<div id="navigation" class="clearfix">
<ul>
<li class="viewer"><a href="#/~logging">Viewer</a></li>
<li class="level"><a href="#/~logging/level">Level</a></li>
</ul>
</div>
</div>