i-dots changes:

-  lay-out fixes in header
-  background in loginscreen to make it a little less boring
-  IE fix for wrong z-index with Selectboxes: temporarely hide selectboxes when showing menulayers
-  extra option to disable IE png fix
-  extra option to choose Click or Mouse Over to show menu's
-  extra option to auto hide sideboxmenu's (a lot of people will like this)
-  extra option to use sliders for showing menu, default enabled (see testresults below):

Mozilla-firebird Windows -> OK
Mozilla-firebird Linux -> OK
Internet Explorer 6.0 Windows 2000 - OK
Konqueror 3.1 Linux -> gets very slow, lay-out bugs (don't use this option with konqueror)
Opera 6 Linux -> showing works, hiding not, lay-out bugs (test again please)
Opera 7 Linux -> very annoing bug with temporarely hiding selectboxes (must not be hard to fix, pathes are welcome)

please also test this with Safari, Mac IE 5,  Win IE 5.0 and 5.5 and report bugs at sf

phpgwapi/templates/idots/css/idots.css

@@ -117,7 +117,7 @@ td
 .divSidebox 
 {
 	position:relative;
-	width: 160px; 
+	width: 147px; 
 	border-right: #9c9c9c 1px solid; 
 	border-top: #9c9c9c 1px solid; 
 	border-left: #9c9c9c 1px solid; 
@@ -187,17 +187,19 @@ a.textSidebox
 
 #extraIcons
 {
-	position:absolute;
+/*	position:absolute;
 	z-index:13;
 	right:10px;
 	top:113px;
-	visibility:hidden;
+	visibility:hidden;*/
 	background-image:url(../images/alpha-white.png);
 	border-width:1px;
 	border-color:#7e7e7e;
 	border-style:solid;
 }
 
+
+
 #divMain
 {
 	background-color:white;
@@ -240,20 +242,22 @@ a.textSidebox
 	/*	margin-bottom: 2px;*/
 }
 
-#divSubContainer
+/*#divSubContainer
 {
 }
-
+*/
 #tdSidebox
 {
 	width:170px;
 	background-color:white;
+	overflow:visible;
 }
 
+
 #tdAppbox
 {
 	background-color:white;
-	padding-left:9px;
+	padding-left:5px;
 	width: 100%;
 }
 #divSideboxContainer
@@ -263,7 +267,6 @@ a.textSidebox
 	top:0px;
 	left:0px;
 	background-color:white;
-	border-color:red;
 	border-width:1px;
 	border-style:solid;
 	z-index:40;

phpgwapi/templates/idots/head.inc.php

@@ -20,6 +20,9 @@
 		$GLOBALS['page_start_time'] = $mtime; 
 	}
 	
+	// get used language code
+	$lang_code='en';
+
 	
 	$bodyheader = ' bgcolor="' . $GLOBALS['phpgw_info']['theme']['bg_color'] . '" alink="'
 		. $GLOBALS['phpgw_info']['theme']['alink'] . '" link="' . $GLOBALS['phpgw_info']['theme']['link'] . '" vlink="'
@@ -37,7 +40,30 @@
 		$theme_css = $GLOBALS['phpgw_info']['server']['webserver_url'] . '/phpgwapi/templates/idots/css/'.$GLOBALS['phpgw_info']['user']['preferences']['common']['theme'].'.css';
 	}
 
-	$pngfix = $GLOBALS['phpgw_info']['server']['webserver_url'] . '/phpgwapi/templates/idots/js/pngfix.js';
+	//pngfix defaults to yes
+	if(!$GLOBALS['phpgw_info']['user']['preferences']['common']['disable_pngfix'])
+	{
+		$pngfix_src = $GLOBALS['phpgw_info']['server']['webserver_url'] . '/phpgwapi/templates/idots/js/pngfix.js';
+		$pngfix ='<!-- This solves the Internet Explorer PNG-transparency bug, but only for IE 5.5 and higher --> 
+		<!--[if gte IE 5.5000]>
+		<script src="'.$pngfix_src.'" type=text/javascript>
+		</script>
+		<![endif]-->';
+	}
+	
+		if(!$GLOBALS['phpgw_info']['user']['preferences']['common']['disable_slider_effects'])
+		{
+			$slider_effects_src=$GLOBALS['phpgw_info']['server']['webserver_url'] . '/phpgwapi/templates/idots/js/slidereffects.js';
+			$slider_effects='<script src="'.$slider_effects_src.'" type=text/javascript>
+			</script>';
+		}
+		else
+		{
+			$simple_show_hide_src=$GLOBALS['phpgw_info']['server']['webserver_url'] . '/phpgwapi/templates/idots/js/simple_show_hide.js';
+			$simple_show_hide='<script src="'.$simple_show_hide_src.'" type=text/javascript>
+			</script>';
+		}
+
 	
 	$tpl = CreateObject('phpgwapi.Template',PHPGW_TEMPLATE_DIR);
 	$tpl->set_unknowns('remove');
@@ -50,6 +76,9 @@
 		'img_icon'      => PHPGW_IMAGES_DIR . '/favicon.ico',
 		'img_shortcut'  => PHPGW_IMAGES_DIR . '/favicon.ico',
 		'pngfix'        => $pngfix,
+		'slider_effects'=> $slider_effects,
+		'simple_show_hide'=> $simple_show_hide,
+		'lang_code'=> $lang_code,
 		'charset'       => $GLOBALS['phpgw']->translation->charset(),
 		'font_family'   => $GLOBALS['phpgw_info']['theme']['font'],
 		'website_title' => $GLOBALS['phpgw_info']['server']['site_title'].$app,

phpgwapi/templates/idots/head.tpl

@@ -1,128 +1,24 @@
 <!-- BEGIN head -->
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
-<html xml:lang="nl" xmlns="http://www.w3.org/1999/xhtml">
+<html xml:lang="{lang_code}" xmlns="http://www.w3.org/1999/xhtml">
 	<head>
-		<!--
-		HTML Coding Standards:
-		1. use lowercase is possible, because of xhtml validation
-		2. make your template validate either html 4.01 or xhtml 1
-		3. make your application validat both if possible
-		4. always use quotionmarks when possible e.g. <img src="/path/to/image" class="class" alt="this is an image :)" />
-		5. use png-graphics if possible, but keep in ming IE has a transparency bug when it renders png's
-		-->
-
-		<!-- LAY-OUT BUGS 
-		1. in IE no link cursor is displayd when for png's that link
-		2. tabs are ugly in preferences
-		3. spacers inside sidebox
-		-->
 		<title>{website_title}</title>
 		<meta http-equiv="content-type" content="text/html; charset={charset}" />
 		<meta name="keywords" content="eGroupWare" />
 		<meta name="description" content="eGroupware" />
 		<meta name="keywords" content="eGroupWare" />
 		<meta name="copyright" content="eGroupWare http://www.egroupware.org (c) 2003" />
-		<meta name="language" content="en" />
+		<meta name="language" content="{lang_code}" />
 		<meta name="author" content="eGroupWare http://www.egroupware.org" />
 		<meta name="robots" content="none" />
 		<link rel="icon" href="{img_icon}" type="image/x-ico" />
 		<link rel="shortcut icon" href="{img_shortcut}" />
 		<link href="{theme_css}" type="text/css" rel="StyleSheet" />
+		{slider_effects}
+		{simple_show_hide}
+		{pngfix}
 		{css}
 		{java_script}
-
-		<!-- This solves the Internet Explorer PNG-transparency bug, but only for IE 5.5 and higher --> 
-		<!--[if gte IE 5.5000]>
-		<script src="{pngfix}" type=text/javascript>
-		</script>
-		<![endif]-->
-
-		<script language="Javascript" type="text/javascript">
-		/*
-			javascript for showing and hiding layers starting with the one in the iconbar
-		*/
-		
-		// Javascript Browser Sniff 1.0 Jim Cummins - http://www.conxiondesigns.com	
-		
-		var isIE = false;
-		var isOther = false;
-		var isNS4 = false;
-		var isNS6 = false;
-		if(document.getElementById)
-		{
-			if(!document.all)
-			{
-				isNS6=true;
-			}
-			if(document.all)
-			{
-				isIE=true;
-			}
-		}
-		else
-		{
-			if(document.layers)
-			{
-				isNS4=true;
-			}
-			else
-			{
-				isOther=true;
-			}
-		}
-
-		// End of Browser Sniff 1.0
-
-
-		// Access Layer Style Properties Jim Cummins - http://www.conxiondesigns.com
-		
-		function aLs(layerID)
-		{
-		var returnLayer;
-			if(isIE)
-			{
-				returnLayer = eval("document.all." + layerID + ".style");
-			}
-			if(isNS6)
-			{
-				returnLayer = eval("document.getElementById('" + layerID + "').style");
-			}
-			if(isNS4)
-			{
-				returnLayer = eval("document." + layerID);
-			}
-			if(isOther)
-			{
-				returnLayer = "null";
-				alert("Error:\nDue to your browser you will probably not\nbe able to view all of the following page\nas it was designed to be viewed. We regret\nthis error sincerely.");
-			}
-		return returnLayer;
-		}
-
-		// HideShow 1.0	Jim Cummins - http://www.conxiondesigns.com
-		function ShowL(ID)
-		{
-				aLs(ID).visibility = "visible";
-		}
-		
-		function HideL(ID)
-		{
-				aLs(ID).visibility = "hidden";
-		}
-
-		function HideShow(ID)
-		{
-			if((aLs(ID).visibility == "visible") || (aLs(ID).visibility == ""))
-			{
-				aLs(ID).visibility = "hidden";
-			}
-			else if(aLs(ID).visibility == "hidden")
-			{
-				aLs(ID).visibility = "visible";
-			}
-		}
-		</script>
-
 	</head>
 	<!-- we don't need body tags anymore, do we?) we do!!! onload!! LK -->
 	<body {body_tags}>

phpgwapi/templates/idots/hook_settings.inc.php

@@ -15,5 +15,23 @@
 	create_input_box('Max number of icons in navbar','max_icons',
 'How many icons should be shown in the navbar (top of the page). Additional icons go into a kind of pulldown menu, callable by the icon on the far right side of the navbar.','10',3);
 
+	create_check_box('Autohide Sidebox menu\'s','auto_hide_sidebox',
+'Automacally hide the Sidebox menu\'s?');
+
+	$click_or_onmouseover = array(
+	'click'          => lang('Click'),
+	'onmouseover'         => lang('On Mouse Over'),
+	);
+
+	create_select_box('Click or Mouse Over to show menu\'s','click_or_onmouseover',$click_or_onmouseover,
+'Click or Mouse Over to show menu\'s?');
+
+
+	create_check_box('Disable slider effects','disable_slider_effects',
+'Disable the animated slider effects when showing or hiding menu\'s in the page? Opera and Konqueror users will probably must want this.');
+
+	create_check_box('Disable Internet Explorer png-image-bugfix','disable_pngfix',
+	'Diable the execution a bugfixscript for Internet Explorer 5.5 and higher to show transparency in PNG-images?');
+
 	create_check_box('Show page generation time','show_generation_time',
 	'Show page generation time on the bottom of the page?');

phpgwapi/templates/idots/js/simple_show_hide.js

@@ -0,0 +1,183 @@
+/*****************************************************
+ * ypSlideOutMenu
+ * 3/04/2001
+ * 
+ * a nice little script to create exclusive, slide-out
+ * menus for ns4, ns6, mozilla, opera, ie4, ie5 on 
+ * mac and win32. I've got no linux or unix to test on but 
+ * it should(?) work... 
+ *
+ * --youngpup--
+ *****************************************************/
+
+//var isIE = false;
+//var isOther = false;
+//var isNS4 = false;
+//var isNS6 = false;
+// constructor
+function ypSlideOutMenu(id, dir, left, top, width, height,pos)
+{
+
+	this.ie  = document.all ? 1 : 0
+		this.ns4 = document.layers ? 1 : 0
+		this.dom = document.getElementById ? 1 : 0
+
+		if (this.ie || this.ns4 || this.dom) {
+			this.id			 = id
+				this.dir		 = dir
+				this.orientation = dir == "left" || dir == "right" ? "h" : "v"
+				this.dirType	 = dir == "right" || dir == "down" ? "-" : "+"
+				this.dim		 = this.orientation == "h" ? width : height
+				//this.hideTimer	 = false
+				//this.aniTimer	 = false
+				this.open		 = false
+				this.over		 = false
+				//this.startTime	 = 0
+
+				// global reference to this object
+				//this.gRef = "ypSlideOutMenu_"+id
+				//eval(this.gRef+"=this")
+
+				// add this menu object to an internal list of all menus
+				//ypSlideOutMenu.Registry[id] = this
+
+				var d = document
+
+				var strCSS = '<style type="text/css">';
+			strCSS += '#' + this.id + 'Container { visibility:hidden; '
+				if(pos)
+				{
+					strCSS += pos+':' + left + 'px; '
+				}
+				else
+				{
+					strCSS += 'left:' + left + 'px; '
+				}
+				strCSS += 'top:' + top + 'px; '
+					strCSS += 'overflow:visible; z-index:10000; }'
+					strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
+						strCSS += 'width:' + width + 'px; '
+							//		strCSS += 'height:' + height + 'px; '
+							//		strCSS += 'clip:rect(0 ' + width + ' ' + height + ' 0); '
+							strCSS += '}'
+							strCSS += '</style>';
+
+						d.write(strCSS);
+						//	alert(strCSS);
+//						this.load()
+
+					}
+		}
+
+	ypSlideOutMenu.aLs = function(layerID)
+	{
+
+		this.isIE = false;
+		this.isOther = false;
+		this.isNS4 = false;
+		this.isNS6 = false;
+		if(document.getElementById)
+		{
+			if(!document.all)
+			{
+				this.isNS6=true;
+			}
+			if(document.all)
+			{
+				this.isIE=true;
+			}
+		}
+		else
+		{
+			if(document.layers)
+			{
+				this.isNS4=true;
+			}
+			else
+			{
+				this.isOther=true;
+			}
+		}
+
+		var returnLayer;
+		if(this.isIE)
+		{
+			returnLayer = eval("document.all." + layerID + ".style");
+		}
+		if(this.isNS6)
+		{
+			returnLayer = eval("document.getElementById('" + layerID + "').style");
+		}
+		if(this.isNS4)
+		{
+			returnLayer = eval("document." + layerID);
+		}
+		if(this.isOther)
+		{
+			returnLayer = "null";
+			alert("Error:\nDue to your browser you will probably not\nbe able to view all of the following page\nas it was designed to be viewed. We regret\nthis error sincerely.");
+		}
+		return returnLayer;
+	}
+	// HideShow 1.0	Jim Cummins - http://www.conxiondesigns.com
+
+	ypSlideOutMenu.ShowL = function(ID)
+	{
+		ypSlideOutMenu.aLs(ID).visibility = "visible";
+	}
+
+	ypSlideOutMenu.HideL =function(ID)
+	{
+		ypSlideOutMenu.aLs(ID).visibility = "hidden";
+	}
+
+	ypSlideOutMenu.HideShow = function(ID)
+	{
+
+		if((ypSlideOutMenu.aLs(ID).visibility == "visible") || (ypSlideOutMenu.aLs(ID).visibility == ""))
+		{
+			ypSlideOutMenu.aLs(ID).visibility = "hidden";
+		}
+		else if(ypSlideOutMenu.aLs(ID).visibility == "hidden")
+		{
+			ypSlideOutMenu.aLs(ID).visibility = "visible";
+		}
+	}
+
+
+	ypSlideOutMenu.showMenu = function(id)
+	{
+		//temporarly hide all selectboxes to fix IE bug with z-index  
+		if(document.all)
+		{
+			for (var i=0; i<document.all.length; i++) {
+				o = document.all(i)
+					if (o.type == 'select-one' || o.type == 'select-multiple') {
+						// todo: add check for select in div?
+						if (o.style) o.style.display = 'none';
+					}
+			}
+		}
+		ypSlideOutMenu.ShowL(id+'Container');
+
+	}
+
+	ypSlideOutMenu.hide = function(id)
+	{
+		ypSlideOutMenu.HideL(id+'Container');
+		//show all selectboxes again to fix IE bug with z-index  
+		if(document.all)
+		{
+			for (var i=0; i<document.all.length; i++) {
+				o = document.all(i)
+					if (o.type == 'select-one' || o.type == 'select-multiple') {
+						// todo: add check for select in div?
+						if (o.style) o.style.display = 'inline';
+					}
+			}
+		}
+
+	}
+
+
+

phpgwapi/templates/idots/js/slidereffects.js

@@ -0,0 +1,217 @@
+/*****************************************************
+ * ypSlideOutMenu
+ * 3/04/2001
+ * 
+ * a nice little script to create exclusive, slide-out
+ * menus for ns4, ns6, mozilla, opera, ie4, ie5 on 
+ * mac and win32. I've got no linux or unix to test on but 
+ * it should(?) work... 
+ *
+ * --youngpup--
+ *****************************************************/
+
+ypSlideOutMenu.Registry = []
+ypSlideOutMenu.aniLen = 250
+ypSlideOutMenu.hideDelay = 1000
+ypSlideOutMenu.minCPUResolution = 10
+
+// constructor
+function ypSlideOutMenu(id, dir, left, top, width, height,pos)
+{
+	this.ie  = document.all ? 1 : 0
+		this.ns4 = document.layers ? 1 : 0
+		this.dom = document.getElementById ? 1 : 0
+
+		if (this.ie || this.ns4 || this.dom) {
+			this.id			 = id
+				this.dir		 = dir
+				this.orientation = dir == "left" || dir == "right" ? "h" : "v"
+				this.dirType	 = dir == "right" || dir == "down" ? "-" : "+"
+				this.dim		 = this.orientation == "h" ? width : height
+				this.hideTimer	 = false
+				this.aniTimer	 = false
+				this.open		 = false
+				this.over		 = false
+				this.startTime	 = 0
+
+				// global reference to this object
+				this.gRef = "ypSlideOutMenu_"+id
+				eval(this.gRef+"=this")
+
+				// add this menu object to an internal list of all menus
+				ypSlideOutMenu.Registry[id] = this
+
+				var d = document
+
+				var strCSS = '<style type="text/css">';
+			strCSS += '#' + this.id + 'Container { visibility:hidden; '
+				if(pos)
+				{
+					strCSS += pos+':' + left + 'px; '
+				}
+				else
+				{
+					strCSS += 'left:' + left + 'px; '
+				}
+				strCSS += 'top:' + top + 'px; '
+					strCSS += 'overflow:visible; z-index:10000; }'
+					strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
+						strCSS += 'width:' + width + 'px; '
+							//		strCSS += 'height:' + height + 'px; '
+							//		strCSS += 'clip:rect(0 ' + width + ' ' + height + ' 0); '
+							strCSS += '}'
+							strCSS += '</style>';
+
+						d.write(strCSS)
+
+							this.load()
+					}
+		}
+
+	ypSlideOutMenu.prototype.load = function() {
+		var d = document
+			var lyrId1 = this.id + "Container"
+			var lyrId2 = this.id + "Content"
+			var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1]
+			if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
+				var temp
+
+					if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100)
+					else {
+						this.container	= obj1
+							this.menu		= obj2
+							this.style		= this.ns4 ? this.menu : this.menu.style
+							this.homePos	= eval("0" + this.dirType + this.dim)
+							this.outPos		= 0
+							this.accelConst	= (this.outPos - this.homePos) / ypSlideOutMenu.aniLen / ypSlideOutMenu.aniLen 
+
+							// set event handlers.
+							if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
+						this.menu.onmouseover = new Function("ypSlideOutMenu.showMenu('" + this.id + "')")
+							this.menu.onmouseout = new Function("ypSlideOutMenu.hideMenu('" + this.id + "')")
+
+							//set initial state
+							this.endSlide()
+					}
+	}
+
+	ypSlideOutMenu.showMenu = function(id)
+	{
+		var reg = ypSlideOutMenu.Registry
+			var obj = ypSlideOutMenu.Registry[id]
+
+			//document.all.select.style="visibily:hidden";
+
+
+			//temporarly hide all selectboxes to fix IE bug with z-index  
+			if(document.all)
+			{
+				for (var i=0; i<document.all.length; i++) {
+					o = document.all(i)
+						if (o.type == 'select-one' || o.type == 'select-multiple') {
+							// todo: add check for select in div?
+							if (o.style) o.style.display = 'none';
+						}
+				}
+			}
+
+
+		if (obj.container) {
+			obj.over = true
+
+				// close other menus.
+				for (menu in reg) if (id != menu) ypSlideOutMenu.hide(menu)
+
+					// if this menu is scheduled to close, cancel it.
+					if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer) }
+
+			// if this menu is closed, open it.
+			if (!obj.open && !obj.aniTimer) reg[id].startSlide(true)
+		}
+	}
+
+	ypSlideOutMenu.hideMenu = function(id)
+	{
+		// schedules the menu to close after <hideDelay> ms, which
+		// gives the user time to cancel the action if they accidentally moused out
+		var obj = ypSlideOutMenu.Registry[id]
+			if (obj.container) {
+				if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
+					obj.hideTimer = window.setTimeout("ypSlideOutMenu.hide('" + id + "')", ypSlideOutMenu.hideDelay);
+			}
+	}
+
+	ypSlideOutMenu.hide = function(id)
+	{
+		var obj = ypSlideOutMenu.Registry[id]
+			obj.over = false
+
+			if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
+
+				// flag that this scheduled event has occured.
+				obj.hideTimer = 0
+
+					// if this menu is open, close it.
+					if (obj.open && !obj.aniTimer) obj.startSlide(false)
+
+						//show all selectboxes again to fix IE bug with z-index  
+						if(document.all)
+						{
+							for (var i=0; i<document.all.length; i++) {
+								o = document.all(i)
+									if (o.type == 'select-one' || o.type == 'select-multiple') {
+										// todo: add check for select in div?
+										if (o.style) o.style.display = 'inline';
+									}
+							}
+						}
+
+
+
+	}
+
+ypSlideOutMenu.prototype.startSlide = function(open) {
+	this[open ? "onactivate" : "ondeactivate"]()
+	this.open = open
+	if (open) this.setVisibility(true)
+	this.startTime = (new Date()).getTime()	
+	this.aniTimer = window.setInterval(this.gRef + ".slide()", ypSlideOutMenu.minCPUResolution)
+}
+
+ypSlideOutMenu.prototype.slide = function() {
+	var elapsed = (new Date()).getTime() - this.startTime
+	if (elapsed > ypSlideOutMenu.aniLen) this.endSlide()
+	else {
+		var d = Math.round(Math.pow(ypSlideOutMenu.aniLen-elapsed, 2) * this.accelConst)
+		if (this.open && this.dirType == "-")		d = -d
+		else if (this.open && this.dirType == "+")	d = -d
+		else if (!this.open && this.dirType == "-")	d = -this.dim + d
+		else										d = this.dim + d
+
+		this.moveTo(d)
+	}
+}
+
+ypSlideOutMenu.prototype.endSlide = function() {
+	this.aniTimer = window.clearTimeout(this.aniTimer)
+	this.moveTo(this.open ? this.outPos : this.homePos)
+	if (!this.open) this.setVisibility(false)
+	if ((this.open && !this.over) || (!this.open && this.over)) {
+		this.startSlide(this.over)
+	}
+}
+
+ypSlideOutMenu.prototype.setVisibility = function(bShow) { 
+	var s = this.ns4 ? this.container : this.container.style
+	s.visibility = bShow ? "visible" : "hidden"
+}
+ypSlideOutMenu.prototype.moveTo = function(p) { 
+	this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px"
+}
+ypSlideOutMenu.prototype.getPos = function(c) {
+	return parseInt(this.style[c])
+}
+
+// events
+ypSlideOutMenu.prototype.onactivate		= function() { }
+ypSlideOutMenu.prototype.ondeactivate	= function() { }

phpgwapi/templates/idots/login.tpl

@@ -36,19 +36,19 @@
 <body bgcolor="#ffffff">
 <div id="divLogo"><a href="http://{logo_url}" target="_blank"><img src="{logo_file}" border="0" alt="{logo_title}" title="{logo_title}"/></a></div>
 
-<div id="divMain">
+<div id="divMain"style= "background-repeat:no-repeat;background-position: center center;background-image:url(./phpgwapi/templates/idots/images/login-background.jpg)">
 	<div id="divAppIconBar">
 		<table width="100%" border="0" cellspacing="0" cellpadding="0">
 			<tr>
-				<td width="180" valign="top" align="left"><img src="./phpgwapi/templates/idots/images/grey-pixel.png" width="1" height="68" alt="spacer" /></td>
+				<td width="180" valign="top" align="left"><img src="./phpgwapi/templates/idots/images/grey-pixel.png" width="1" height="69" alt="spacer" /></td>
 				<td>
 					<table width="100%" border="0" cellspacing="0" cellpadding="0">
 						<tr>
 							<td width="100%"><img src="./phpgwapi/templates/idots/images/spacer.gif" width="1" height="68" alt="spacer" /></td>
 						</tr>
-						<tr>
+<!--						<tr>
 							<td width="100%">&nbsp;</td>
-						</tr>
+						</tr>-->
 					</table>
 
 				</td>

phpgwapi/templates/idots/navbar.inc.php

@@ -26,11 +26,25 @@
 		$GLOBALS['idots_tpl']->set_block('navbar','extra_block_row','extra_block_row');
 		$GLOBALS['idots_tpl']->set_block('navbar','extra_block_spacer','extra_block_spacer');
 		$GLOBALS['idots_tpl']->set_block('navbar','extra_blocks_footer','extra_blocks_footer');
+		$GLOBALS['idots_tpl']->set_block('navbar','sidebox_hide_header','sidebox_hide_header');
+		$GLOBALS['idots_tpl']->set_block('navbar','sidebox_hide_footer','sidebox_hide_footer');
+		$GLOBALS['idots_tpl']->set_block('navbar','appbox','appbox');
 		$GLOBALS['idots_tpl']->set_block('navbar','navbar_footer','navbar_footer');
 		
 		$var['img_root'] = $GLOBALS['phpgw_info']['server']['webserver_url'] . '/phpgwapi/templates/idots/images';
 		$var['table_bg_color'] = $GLOBALS['phpgw_info']['theme']['navbar_bg'];
 
+		if($GLOBALS['phpgw_info']['user']['preferences']['common']['click_or_onmouseover']=='onmouseover')
+		{
+			$show_menu_event='onMouseOver';
+		}
+		else
+		{
+			$show_menu_event='onClick';
+		}
+
+
+		
 		$applications = '';
 	
 		//	== 'icons_and_text')
@@ -99,14 +113,25 @@
 		if($i>$max_icons)
 		{
 			$app_extra_icons_div='
+			<script language="javascript">
+			new ypSlideOutMenu("menu1", "down", 10, 114, 160, 200,\'right\')
+			</script>	
+				<div id="menu1Container">
+				<div id="menu1Content" style="position: relative; left: 0; text-align: left;">
+				
 					<div id="extraIcons">
-					<table>'.$app_extra_icons.'
-						<tr><td>&nbsp;</td><td nowrap=nowrap align="right"><a href="javascript:void(0);" onClick="HideL(\'extraIcons\');" title="'.lang('close').'"><img border="0" src="'.$var['img_root'].'/close.png"/></a></td></tr>
-					</table>
-				</div>';
+					<table>
+						<tr><td>&nbsp;</td><td nowrap=nowrap align="right"><a href="#" '.$show_menu_event.'="ypSlideOutMenu.hide(\'menu1\')" title="'.lang('close').'"><img style="margin:4px;" border="0" src="'.$var['img_root'].'/close.png"/></a></td></tr>
+'.$app_extra_icons.'					</table>
+				</div>
+			
+				</div>
+				</div>
+				';
 			
 			$var['app_extra_icons_div']= $app_extra_icons_div;
-			$var['app_extra_icons_icon']= '<td width="26" valign="top" align="right" style="padding-right:3px;padding-top:50px;"><a title="'.lang('show_more_apps').'" href="javascript:void(0);" onClick="HideShow(\'extraIcons\');"><img src="'.$var['img_root'].'/extra_icons.png" border="0" /></a></td>';
+//			$var['app_extra_icons_icon']= '<td width="26" valign="top" align="right" style="padding-right:3px;padding-top:50px;"><a title="'.lang('show_more_apps').'" href="javascript:void(0);" onClick="HideShow(\'extraIcons\');"><img src="'.$var['img_root'].'/extra_icons.png" border="0" /></a></td>';
+			$var['app_extra_icons_icon']= '<td width="26" valign="top" align="right" style="padding-right:3px;padding-top:50px;"><a title="'.lang('show_more_apps').'" href="#"  '.$show_menu_event.'="ypSlideOutMenu.showMenu(\'menu1\')"><img src="'.$var['img_root'].'/extra_icons.png" border="0" /></a></td>';
 		
 		}
 
@@ -159,6 +184,11 @@
 		$GLOBALS['idots_tpl']->set_var($var);
 		$GLOBALS['idots_tpl']->pfp('out','navbar_header');
 
+	
+		/******************************************************\
+		* The sidebox menu's                                   *
+		\******************************************************/
+
 		$menu_title = lang('General Menu');
 
 		$file['Home'] = $GLOBALS['phpgw_info']['navbar']['home']['url'];
@@ -167,16 +197,47 @@
 			$file['Preferences'] = $GLOBALS['phpgw_info']['navbar']['preferences']['url'];
 		}
 		$file += array(
-			'About %1'=>$GLOBALS['phpgw_info']['navbar']['about']['url'],
+			'About '.$appname=>$GLOBALS['phpgw_info']['navbar']['about']['url'],
 			'Logout'=>$GLOBALS['phpgw_info']['navbar']['logout']['url']
 		);		
 		
-		display_sidebox('',$menu_title,$file);
+		if($GLOBALS['phpgw_info']['user']['preferences']['common']['auto_hide_sidebox']==1)
+		{
+			$GLOBALS['idots_tpl']->set_var('show_menu_event',$show_menu_event);
+			$GLOBALS['idots_tpl']->pparse('out','sidebox_hide_header');
 			
+			display_sidebox('',$menu_title,$file);
 			$GLOBALS['phpgw']->hooks->single('sidebox_menu',$GLOBALS['phpgw_info']['flags']['currentapp']);
 			
+			$GLOBALS['idots_tpl']->pparse('out','sidebox_hide_footer');
+
+			$var[sideboxcolstart]='';
+			
+			$GLOBALS['idots_tpl']->set_var($var);
+			$GLOBALS['idots_tpl']->pparse('out','appbox');
+			$var[remove_padding]='style="padding-left:0px;"';	
+			$var[sideboxcolend]='';
+
+		}
+		else
+		{
+			$var[menu_link]='';
+			$var[sideboxcolstart]='<td id="tdSidebox" valign="top">';
+			$var[remove_padding]='';	
+			$GLOBALS['idots_tpl']->set_var($var);
+			$GLOBALS['idots_tpl']->pparse('out','appbox');
+			
+			display_sidebox('',$menu_title,$file);
+			$GLOBALS['phpgw']->hooks->single('sidebox_menu',$GLOBALS['phpgw_info']['flags']['currentapp']);
+			
+			$var[sideboxcolend]='</td>';
+		}
+
+		$GLOBALS['idots_tpl']->set_var($var);
 		$GLOBALS['idots_tpl']->pparse('out','navbar_footer');
 
+
+
 		// If the application has a header include, we now include it
 		if(!@$GLOBALS['phpgw_info']['flags']['noappheader'] && @isset($GLOBALS['HTTP_GET_VARS']['menuaction']))
 		{

phpgwapi/templates/idots/navbar.tpl

@@ -3,6 +3,7 @@
 
 {app_extra_icons_div}
 
+
 <div id="divMain">
 	<div id="divAppIconBar">
 		<table width="100%" border="0" cellspacing="0" cellpadding="0">
@@ -27,22 +28,62 @@
 		</table>
 	</div>
 	<div id="divStatusBar"><table width="100%" cellspacing="0" cellpadding="0" border="0"><tr><td align="left" id="user_info">{user_info}</td><td align="right" id="admin_info">{current_users}</td></tr></table></div>
+
+
+
+<!-- END navbar_header -->
+
+
+<!-- BEGIN appbox -->	
 	<div id="divSubContainer">
 		<table width="100%" cellspacing="0" cellpadding="0">
 		<tr>
 		<!-- Sidebox Column -->
-				<td id="tdSidebox" valign="top">
+			{sideboxcolstart}
+<!--		<td id="{tdsiteboxid}" valign="top">-->
+
+<!-- END appbox -->
+
+<!-- BEGIN sidebox_hide_header -->
+	<!--<script language="javascript" src="SlideOut.js"></script>-->
+	<script language="javascript">
+		new ypSlideOutMenu("menu2", "right", 0, 165, 160, 200)
+	</script>
+
+	<div id="sideboxdragarea" style="position:absolute;left:0px;top:175px">
+	<a href="#" {show_menu_event}="ypSlideOutMenu.showMenu('menu2')" onmouseover="//ypSlideOutMenu.showMenu('menu2')" title="{lang_show_menu}"><img src="{img_root}/dragarea_right.png" /></a>
+	</div>
+
+	<div id="menu2Container">
+	<div id="menu2Content" style="position: relative; left: 0; text-align: left;">
+		<table cellspacing="0" cellpadding="0">
+		 <tr><td>
+		  
+		<div style="background-color:#ffffff;border: #9c9c9c 1px solid;padding:5px;">
+<!-- END sidebox_hide_header -->
+
+
+
+<!-- BEGIN sidebox_hide_footer -->
+</div>
+</td><td style="padding-top:10px" valign="top">
+<a href="#" onClick="ypSlideOutMenu.hide('menu2')" ><img src="{img_root}/dragarea_left.png" align="right" /></a>
+</td></tr></table>
+</div>
+</div>
+<!-- END sidebox_hide_footer -->
+
+
+
 
-						<!-- start blocks -->
-<!-- END navbar_header -->
 
 
 <!-- BEGIN navbar_footer -->	
-						</td>
+		{sideboxcolend}
 		<!-- End Sidebox Column -->
 
 		<!-- Applicationbox Column -->
-		<td id="tdAppbox" valign="top">
+		<td id="tdAppbox" valign="top" {remove_padding}>
 		<div id="divAppboxHeader">{current_app_title}</div>
 		<div id="divAppbox">
 		<table width="98%" cellpadding"0" cellspacing="0">
@@ -76,7 +117,7 @@
 
 
 <!-- BEGIN extra_block_spacer -->
-<tr> 
-	<td colspan="2" height="8"></td>
+<tr class="divSideboxEntry"> 
+	<td colspan="2" height="8" class="textSidebox"></td>
 </tr>
 <!-- END extra_block_spacer -->