dani/lemonldap-ng
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Manager skin:

Browse Source 
* Full screen size for menu tree
* Help no more draggable/resizable
* Hide/display box contents with clik on title
* Edited configuration key is displayed in editon box title
This commit is contained in:
Clément Oudot 2010-01-06 11:26:45 +00:00
parent dc5b0cbed6
commit 88d237da47
3 changed files with 76 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
modules/lemonldap-ng-manager/example/skins/default/manager.css
View File

@ -9,11 +9,17 @@
*/
/* Main */
html,body
{
margin:0;
padding:0;
height:100%;
min-height:100%;
}
body
{
font:normal 9pt sans-serif;
margin:0;
padding:10px;
background:#000;
}
@ -47,6 +53,12 @@ input
}
/* Divs */
#container
{
height:96%;
padding:1%;
}
#header img, #header p
{
float:left;
@ -61,7 +73,9 @@ input
#page
{
clear:both;
overflow:hidden;
margin-top:50px;
height:92%;
}
#menu
@ -69,55 +83,45 @@ input
float:left;
padding:10px;
width:300px;
border-right:2px solid #bbb;
border-right:4px double #aaa;
height:96%;
overflow-x:hidden;
overflow-y:auto;
}
#data
{
margin:0 0 0 320px;
padding:10px;
border-left:2px solid #bbb;
}
#buttons, #edition
#buttons, #edition, #help
{
text-align:center;
margin:10px 50px;
padding:0 0 5px 0;
padding:5px;
border:solid #bbb 1px;
}
#help
{
width:600px;
padding:5px 10px;
background:#eee;
margin:10px auto;
border:1px solid #bbb;
position:absolute;
left:393px;
top:230px;
}
#help h1, #buttons h1, #edition h1
{
text-align:center;
font-size:12pt;
padding:5px 10px;
margin:5px 10px;
cursor:pointer;
}
#help_content, #buttons_content, #content
{
padding:5px 10px;
margin:5px 10px;
overflow:auto;
}
#help_content
{
padding:5px;
overflow:auto;
cursor:help;
}
/* jQuery UI */
.ui-draggable h1
{
cursor:move;
text-align:left;
}
/* jQuery Simple Tree */

17
modules/lemonldap-ng-manager/example/skins/default/manager.js
View File

@ -5,14 +5,15 @@
var simpleTreeCollection;
$(document).ready(function(){
/* Help div (require jQuery UI) */
// Allow drag
$("#help").draggable({ handle: 'h1', opacity: '0.70' });
// Allow resize
$("#help").resizable({ handles: 'all', alsoResize: '#help_content', ghost: 'true'});
// Display/hide content with double click on title bar
$("#help h1").dblclick(function(){
$("#help_content").slideToggle('slow');
/* Display/hide divs */
$("#buttons h1").click(function(){
$("#buttons_content").slideToggle('fast');
});
$("#edition h1").click(function(){
$("#content").slideToggle('fast');
});
$("#help h1").click(function(){
$("#help_content").slideToggle('fast');
});
/* Simple Tree */

53
modules/lemonldap-ng-manager/example/skins/default/manager.tpl
View File

@ -19,31 +19,36 @@ var scriptname='<TMPL_VAR NAME="SCRIPT_NAME">';var imagepath='<TMPL_VAR NAME="DI
</head>
<body>
<!-- Container -->
<div id="container" class="ui-widget ui-helper-clearfix">
<!-- Header -->
<div id="header" class="ui-widget">
<div id="header">
<img alt="Lemonldap::NG" src="<TMPL_VAR NAME="DIR">/logo_lemonldap-ng.png" class="logo" width="200" height="38" />
<p class="ui-state-default ui-corner-all ui-state-active"><a href="index.pl"><lang en="Configuration management" fr="Gestion de la configuration"/></a></p>
<p class="ui-state-default ui-corner-all"><a href="sessions.pl"><lang en="Sessions explorer" fr="Explorateur de sessions"/></a></p>
<!-- Header -->
</div>
<!-- Main -->
<!-- Page -->
<div id="page" class="ui-corner-all ui-helper-clearfix ui-widget-content">
<!-- Menu (tree) -->
<div id="menu" class="ui-widget">
<div id="menu">
<TMPL_VAR NAME="MENU">
</div>
<!-- Data -->
<div id="data">
<!-- All buttons -->
<div id="buttons" class="ui-widget ui-corner-all">
<!-- Buttons -->
<div id="buttons" class="ui-corner-all">
<h1 class="ui-widget-header ui-corner-all">
<lang en="Available actions" fr="Actions disponibles" />
</h1>
<div id="buttons_content" class="ui-corner-all ui-widget-content">
<button id="bsave" onclick="uploadConf()" class="ui-state-default ui-corner-all" >
<lang en="Save" fr="Sauver" />
</button>
@ -79,21 +84,25 @@ var scriptname='<TMPL_VAR NAME="SCRIPT_NAME">';var imagepath='<TMPL_VAR NAME="DI
<button id="delkb" style="display:none;" onclick="delKey();return false;" class="ui-state-default ui-corner-all">
<lang en="Delete key" fr="Effacer la clef" />
</button>
</div>
<!-- Buttons -->
</div>
<div id="edition" class="ui-widget ui-corner-all">
<span id="content_title">&nbsp;</span>
<!-- Edition -->
<div id="edition" class="ui-corner-all">
<form action="#" onsubmit="return false">
<h1 class="ui-widget-header ui-corner-all">
<lang en="Values to edit" fr="Valeurs à éditer" />
<lang en="Edit key " fr="Édition de la clé " />
<span id="content_title">&nbsp;</span>
</h1>
<!-- Form content -->
<div id="content">
<!-- Edition content -->
<div id="content" class="ui-corner-all ui-widget-content">
<!-- Default text -->
<div id="content_default" class="content">
@ -144,21 +153,31 @@ var scriptname='<TMPL_VAR NAME="SCRIPT_NAME">';var imagepath='<TMPL_VAR NAME="DI
</div>
</div>
</form>
</div>
</div>
</form>
</div>
<!-- Edition -->
</div>
<div id="help" class="ui-widget ui-corner-all">
<!-- Help -->
<div id="help" class="ui-corner-all">
<h1 class="ui-widget-header ui-corner-all"><lang en="Help" fr="Aide"/></h1>
<div id="help_content" class="ui-widget-content">
<div id="help_content" class="ui-widget-content ui-corner-all">
<!-- AJAX content -->
<lang en="Click on the configuration tree to edit parameters" fr="Cliquer sur l'arbre de configuration pour éditer les paramètres" />
</div>
<!-- Help -->
</div>
<!-- Data -->
</div>
<!-- Page -->
</div>
<!-- Container -->
</div>
</body>