ldap step 1 files (including js libraries, new css, and a few new images)....

ldap step 1 files (including js libraries, new css, and a few new images). There is still an IE bug with the 'advanced settings' that causes it to crash.

git-svn-id: http://svn.igniterealtime.org/svn/repos/wildfire/trunk@4859 b35dd754-fafc-0310-a699-88a17e54d16e

src/web/js/lightbox.js

+/*
+Created By: Chris Campbell
+Website: http://particletree.com
+Date: 2/1/2006
+
+Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
+*/
+
+/*-------------------------------GLOBAL VARIABLES------------------------------------*/
+
+var detect = navigator.userAgent.toLowerCase();
+var OS,browser,version,total,thestring;
+
+/*-----------------------------------------------------------------------------------------------*/
+
+//Browser detect script origionally created by Peter Paul Koch at http://www.quirksmode.org/
+
+function getBrowserInfo() {
+	if (checkIt('konqueror')) {
+		browser = "Konqueror";
+		OS = "Linux";
+	}
+	else if (checkIt('safari')) browser 	= "Safari"
+	else if (checkIt('omniweb')) browser 	= "OmniWeb"
+	else if (checkIt('opera')) browser 		= "Opera"
+	else if (checkIt('webtv')) browser 		= "WebTV";
+	else if (checkIt('icab')) browser 		= "iCab"
+	else if (checkIt('msie')) browser 		= "Internet Explorer"
+	else if (!checkIt('compatible')) {
+		browser = "Netscape Navigator"
+		version = detect.charAt(8);
+	}
+	else browser = "An unknown browser";
+
+	if (!version) version = detect.charAt(place + thestring.length);
+
+	if (!OS) {
+		if (checkIt('linux')) OS 		= "Linux";
+		else if (checkIt('x11')) OS 	= "Unix";
+		else if (checkIt('mac')) OS 	= "Mac"
+		else if (checkIt('win')) OS 	= "Windows"
+		else OS 								= "an unknown operating system";
+	}
+}
+
+function checkIt(string) {
+	place = detect.indexOf(string) + 1;
+	thestring = string;
+	return place;
+}
+
+/*-----------------------------------------------------------------------------------------------*/
+
+Event.observe(window, 'load', initialize, false);
+Event.observe(window, 'load', getBrowserInfo, false);
+Event.observe(window, 'unload', Event.unloadCache, false);
+
+var lightbox = Class.create();
+
+lightbox.prototype = {
+
+	yPos : 0,
+	xPos : 0,
+
+	initialize: function(ctrl) {
+		this.content = ctrl.href;
+		Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
+		ctrl.onclick = function(){return false;};
+	},
+	
+	// Turn everything on - mainly the IE fixes
+	activate: function(){
+		if (browser == 'Internet Explorer'){
+			this.getScroll();
+			this.prepareIE('100%', 'hidden');
+			this.setScroll(0,0);
+			this.hideSelects('hidden');
+		}
+		this.displayLightbox("block");
+	},
+	
+	// Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
+	prepareIE: function(height, overflow){
+		bod = document.getElementsByTagName('body')[0];
+		bod.style.height = height;
+		bod.style.overflow = overflow;
+  
+		htm = document.getElementsByTagName('html')[0];
+		htm.style.height = height;
+		htm.style.overflow = overflow; 
+	},
+	
+	// In IE, select elements hover on top of the lightbox
+	hideSelects: function(visibility){
+		selects = document.getElementsByTagName('select');
+		for(i = 0; i < selects.length; i++) {
+			selects[i].style.visibility = visibility;
+		}
+	},
+	
+	// Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
+	getScroll: function(){
+		if (self.pageYOffset) {
+			this.yPos = self.pageYOffset;
+		} else if (document.documentElement && document.documentElement.scrollTop){
+			this.yPos = document.documentElement.scrollTop; 
+		} else if (document.body) {
+			this.yPos = document.body.scrollTop;
+		}
+	},
+	
+	setScroll: function(x, y){
+		window.scrollTo(x, y); 
+	},
+	
+	displayLightbox: function(display){
+		$('overlay').style.display = display;
+		$('lightbox').style.display = display;
+		if(display != 'none') this.loadInfo();
+	},
+	
+	// Begin Ajax request based off of the href of the clicked linked
+	loadInfo: function() {
+		var myAjax = new Ajax.Request(
+        this.content,
+        {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
+		);
+		
+	},
+	
+	// Display Ajax response
+	processInfo: function(response){
+		info = "<div id='lbContent'>" + response.responseText + "</div>";
+		new Insertion.Before($('lbLoadMessage'), info)
+		$('lightbox').className = "done";	
+		this.actions();			
+	},
+	
+	// Search through new links within the lightbox, and attach click event
+	actions: function(){
+		lbActions = document.getElementsByClassName('lbAction');
+
+		for(i = 0; i < lbActions.length; i++) {
+			Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false);
+			lbActions[i].onclick = function(){return false;};
+		}
+
+	},
+	
+	// Example of creating your own functionality once lightbox is initiated
+	insert: function(e){
+	   link = Event.element(e).parentNode;
+	   Element.remove($('lbContent'));
+	 
+	   var myAjax = new Ajax.Request(
+			  link.href,
+			  {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
+	   );
+	 
+	},
+	
+	// Example of creating your own functionality once lightbox is initiated
+	deactivate: function(){
+		Element.remove($('lbContent'));
+		
+		if (browser == "Internet Explorer"){
+			this.setScroll(0,this.yPos);
+			this.prepareIE("auto", "auto");
+			this.hideSelects("visible");
+		}
+		
+		this.displayLightbox("none");
+	}
+}
+
+/*-----------------------------------------------------------------------------------------------*/
+
+// Onload, make all links that need to trigger a lightbox active
+function initialize(){
+	addLightboxMarkup();
+	lbox = document.getElementsByClassName('lbOn');
+	for(i = 0; i < lbox.length; i++) {
+		valid = new lightbox(lbox[i]);
+	}
+}
+
+// Add in markup necessary to make this work. Basically two divs:
+// Overlay holds the shadow
+// Lightbox is the centered square that the content is put into.
+function addLightboxMarkup() {
+	bod 				= document.getElementsByTagName('body')[0];
+	overlay 			= document.createElement('div');
+	overlay.id		= 'overlay';
+	lb					= document.createElement('div');
+	lb.id				= 'lightbox';
+	lb.className 	= 'loading';
+	lb.innerHTML	= '<div id="lbLoadMessage">' +
+						  '<p>Loading</p>' +
+						  '</div>';
+	bod.appendChild(overlay);
+	bod.appendChild(lb);
+}
\ No newline at end of file

src/web/js/tooltips/domTT_drag.js

+/** $Id: domTT_drag.js 2315 2006-06-12 05:45:36Z dallen $ */
+// {{{ license
+
+/*
+ * Copyright 2002-2005 Dan Allen, Mojavelinux.com (dan.allen@mojavelinux.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// }}}
+// {{{ globals (DO NOT EDIT)
+
+var domTT_dragEnabled = true;
+var domTT_currentDragTarget;
+var domTT_dragMouseDown;
+var domTT_dragOffsetLeft;
+var domTT_dragOffsetTop;
+
+// }}}
+// {{{ domTT_dragStart()
+
+function domTT_dragStart(in_this, in_event)
+{
+	if (typeof(in_event) == 'undefined') { in_event = window.event; }
+
+	var eventButton = in_event[domLib_eventButton];
+	if (eventButton != 1 && !domLib_isKHTML)
+	{
+		return;
+	}
+
+	domTT_currentDragTarget = in_this;
+	in_this.style.cursor = 'move';
+
+	// upgrade our z-index
+	in_this.style.zIndex = ++domLib_zIndex;
+
+	var eventPosition = domLib_getEventPosition(in_event);
+
+	var targetPosition = domLib_getOffsets(in_this);
+	domTT_dragOffsetLeft = eventPosition.get('x') - targetPosition.get('left');
+	domTT_dragOffsetTop = eventPosition.get('y') - targetPosition.get('top');
+	domTT_dragMouseDown = true;
+}
+
+// }}}
+// {{{ domTT_dragUpdate()
+
+function domTT_dragUpdate(in_event)
+{
+	if (domTT_dragMouseDown)
+	{
+		if (domLib_isGecko)
+		{
+			window.getSelection().removeAllRanges()
+		}
+
+		if (domTT_useGlobalMousePosition && domTT_mousePosition != null)
+		{
+			var eventPosition = domTT_mousePosition;
+		}
+		else
+		{
+			if (typeof(in_event) == 'undefined') { in_event = window.event; }
+			var eventPosition = domLib_getEventPosition(in_event);
+		}
+
+		domTT_currentDragTarget.style.left = (eventPosition.get('x') - domTT_dragOffsetLeft) + 'px';
+		domTT_currentDragTarget.style.top = (eventPosition.get('y') - domTT_dragOffsetTop) + 'px';
+
+		// update the collision detection
+		domLib_detectCollisions(domTT_currentDragTarget);
+	}
+}
+
+// }}}
+// {{{ domTT_dragStop()
+
+function domTT_dragStop()
+{
+	if (domTT_dragMouseDown) {
+		domTT_dragMouseDown = false; 
+		domTT_currentDragTarget.style.cursor = 'default';
+		domTT_currentDragTarget = null;
+		if (domLib_isGecko)
+		{
+			window.getSelection().removeAllRanges()
+		}
+	}
+}
+
+// }}}

src/web/js/tooltips/fadomatic.js

+/** $Id$ */
+// Title: Fadomatic
+// Version: 1.2
+// Homepage: http://chimpen.com/fadomatic
+// Author: Philip McCarthy <fadomatic@chimpen.com>
+
+// Fade interval in milliseconds
+// Make this larger if you experience performance issues
+Fadomatic.INTERVAL_MILLIS = 50;
+
+// Creates a fader
+// element - The element to fade
+// speed - The speed to fade at, from 0.0 to 100.0
+// initialOpacity (optional, default 100) - element's starting opacity, 0 to 100
+// minOpacity (optional, default 0) - element's minimum opacity, 0 to 100
+// maxOpacity (optional, default 0) - element's minimum opacity, 0 to 100
+function Fadomatic (element, rate, initialOpacity, minOpacity, maxOpacity) {
+  this._element = element;
+  this._intervalId = null;
+  this._rate = rate;
+  this._isFadeOut = true;
+
+  // Set initial opacity and bounds
+  // NB use 99 instead of 100 to avoid flicker at start of fade
+  this._minOpacity = 0;
+  this._maxOpacity = 99;
+  this._opacity = 99;
+
+  if (typeof minOpacity != 'undefined') {
+    if (minOpacity < 0) {
+      this._minOpacity = 0;
+    } else if (minOpacity > 99) {
+      this._minOpacity = 99;
+    } else {
+      this._minOpacity = minOpacity;
+    }
+  }
+
+  if (typeof maxOpacity != 'undefined') {
+    if (maxOpacity < 0) {
+      this._maxOpacity = 0;
+    } else if (maxOpacity > 99) {
+      this._maxOpacity = 99;
+    } else {
+      this._maxOpacity = maxOpacity;
+    }
+
+    if (this._maxOpacity < this._minOpacity) {
+      this._maxOpacity = this._minOpacity;
+    }
+  }
+  
+  if (typeof initialOpacity != 'undefined') {
+    if (initialOpacity > this._maxOpacity) {
+      this._opacity = this._maxOpacity;
+    } else if (initialOpacity < this._minOpacity) {
+      this._opacity = this._minOpacity;
+    } else {
+      this._opacity = initialOpacity;
+    }
+  }
+
+  // See if we're using W3C opacity, MSIE filter, or just
+  // toggling visiblity
+  if(typeof element.style.opacity != 'undefined') {
+
+    this._updateOpacity = this._updateOpacityW3c;
+
+  } else if(typeof element.style.filter != 'undefined') {
+
+    // If there's not an alpha filter on the element already,
+    // add one
+    if (element.style.filter.indexOf("alpha") == -1) {
+
+      // Attempt to preserve existing filters
+      var existingFilters="";
+      if (element.style.filter) {
+        existingFilters = element.style.filter+" ";
+      }
+      element.style.filter = existingFilters+"alpha(opacity="+this._opacity+")";
+    }
+
+    this._updateOpacity = this._updateOpacityMSIE;
+    
+  } else {
+
+    this._updateOpacity = this._updateVisibility;
+  }
+
+  this._updateOpacity();
+}
+
+// Initiates a fade out
+Fadomatic.prototype.fadeOut = function () {
+  this._isFadeOut = true;
+  this._beginFade();
+}
+
+// Initiates a fade in
+Fadomatic.prototype.fadeIn = function () {
+  this._isFadeOut = false;
+  this._beginFade();
+}
+
+// Makes the element completely opaque, stops any fade in progress
+Fadomatic.prototype.show = function () {
+  this.haltFade();
+  this._opacity = this._maxOpacity;
+  this._updateOpacity();
+}
+
+// Makes the element completely transparent, stops any fade in progress
+Fadomatic.prototype.hide = function () {
+  this.haltFade();
+  this._opacity = 0;
+  this._updateOpacity();
+}
+
+// Halts any fade in progress
+Fadomatic.prototype.haltFade = function () {
+
+  clearInterval(this._intervalId);
+}
+
+// Resumes a fade where it was halted
+Fadomatic.prototype.resumeFade = function () {
+
+  this._beginFade();
+}
+
+// Pseudo-private members
+
+Fadomatic.prototype._beginFade = function () {
+
+  this.haltFade();
+  var objref = this;
+  this._intervalId = setInterval(function() { objref._tickFade(); },Fadomatic.INTERVAL_MILLIS);
+}
+
+Fadomatic.prototype._tickFade = function () {
+
+  if (this._isFadeOut) {
+    this._opacity -= this._rate;
+    if (this._opacity < this._minOpacity) {
+      this._opacity = this._minOpacity;
+      this.haltFade();
+    }
+  } else {
+    this._opacity += this._rate;
+    if (this._opacity > this._maxOpacity ) {
+      this._opacity = this._maxOpacity;
+      this.haltFade();
+    }
+  }
+
+  this._updateOpacity();
+}
+
+Fadomatic.prototype._updateVisibility = function () {
+  
+  if (this._opacity > 0) {
+    this._element.style.visibility = 'visible';
+  } else {
+    this._element.style.visibility = 'hidden';
+  }
+}
+
+Fadomatic.prototype._updateOpacityW3c = function () {
+  
+  this._element.style.opacity = this._opacity/100;
+  this._updateVisibility();
+}
+
+Fadomatic.prototype._updateOpacityMSIE = function () {
+  
+  this._element.filters.alpha.opacity = this._opacity;
+  this._updateVisibility();
+}
+
+Fadomatic.prototype._updateOpacity = null;

src/web/setup/setup-ldap-server_test.jsp

+	
+	<!-- BEGIN connection settings test panel -->
+	<div class="jive-testPanel">
+		<div class="jive-testPanel-content">
+		
+			<div align="right" class="jive-testPanel-close">
+				<a href="#" class="lbAction" rel="deactivate">Close</a>
+			</div>
+			
+			
+			<h2>Test: <span>Connection Settings</span></h2>
+			
+			<h4 class="jive-testSuccess">Success!</h4>
+			<!-- <h4 class="jive-testError">Error</h4> -->
+			
+			<p>A connection was successfully established to the LDAP server using the settings above. 
+			Close this test panel and continue to the next step.</p>
+		
+		</div>
+	</div>
+	<!-- END connection settings test panel -->
\ No newline at end of file

src/web/style/lightbox.css

+/* - - - - - - - - - - - - - - - - - - - - -
+
+Title : Lightbox CSS
+Author : Kevin Hale
+URL : http://particletree.com/features/lightbox-gone-wild/
+
+Created : January 13, 2006
+Modified : February 1, 2006
+Modified for DSG's bragging board : August 3, 2006
+
+- - - - - - - - - - - - - - - - - - - - - */
+
+#lightbox{
+	display: none;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	right: 50%;
+	z-index: 8999;
+	width: 725px;
+	margin: -50px 0 0 -300px;
+	padding: 0px 0px 0px 0px;
+	background: transparent;
+	text-align: left;
+	}
+
+#lightbox[id]{
+	position: fixed;
+	}
+
+#overlay{
+	display: none;
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	z-index: 5000;
+	background-color: #000;
+	-moz-opacity: 0.4;
+	opacity: .40;
+	filter: alpha(opacity=40);
+	
+	}
+#overlay[id]{
+	position: fixed;
+	}
+
+#lightbox.done #lbLoadMessage{
+	display: none;
+	}
+#lightbox.done #lbContent{
+	display: block;
+	}
+#lightbox.loading #lbContent{
+	display: none;
+	}
+#lightbox.loading #lbLoadMessage{
+	display: block;
+	}

src/web/style/setup.css

@@ -131,6 +131,9 @@ form {
 	margin: 0px;
 	padding: 0px 0px 14px 0px;
 	}
+#jive-body h1 span {
+	color: #255480;
+	}
 #jive-body p {
 	margin: 0px;
 	padding: 0px 0px 14px 0px;
@@ -147,18 +150,169 @@ form {
 	background: #f5f5f5 url(../images/setup_contentbox_bg.gif) repeat-x top;
 	-moz-border-radius: 4px;
 	}
-.jive-contentBox h2 {	
+.jive-contentBox h2 {
 	margin: 0px;
 	padding: 0px 0px 10px 0px;
 	font-size: 11pt;
 	color: #09345b;
 	}
+
+
+
+/* styles specific to the 'stepbar' (seen on the LDAP screens) */
+#jive-contentBox_stepbar {
+	display: block;
+	margin: 5px 0px 0px 0px;
+	padding: 3px;
+	border: 1px solid #aec2d6;
+	background-color: #eaf1f8;
+	color: #09345b;
+	font-size: 8pt;
+	}
+#jive-contentBox_stepbar span {
+	margin-right: 32px;
+	}
+#jive-contentBox_stepbar span strong {
+	color: #09345b;
+	}
+#jive-contentBox_stepbar span em {
+	color: #666;
+	font-style: normal;
+	}
+/* contentBox style, used with 'stepbar' above (seen on the LDAP screens) */
+.jive-contentBox_for-stepbar {
+	margin: 0px 0px 20px 0px;
+	border-top: 0px;
+	-moz-border-radius: 0px 0px 4px 4px;
+	}
+.jive-contentBox_for-stepbar h2 {
+	font-size: 14pt;
+	color: #396b9c;
+	}
+.jive-contentBox_for-stepbar h2 span {
+	font-size: 10pt;
+	color: #000;
+	}
+
+/* blue div container (seen on the LDAP screens) */
+.jive-contentBox_bluebox {
+	display: block;
+	position: relative;
+	border: 1px solid #dcdcdc;
+	background-color: #eaeff4;
+	-moz-border-radius: 3px;
+	margin: 0px 0px 12px 0px;
+	padding: 12px;
+	}
+.jive-contentBox_bluebox strong {
+	color: #09345b;
+	}
+
+/* form elements for LDAP */
+.jive-contentBox td select {
+	z-index: 10;
+	float: left;
+	}
+.jive-contentBox td input {
+	float: left;
+	}
+.jive-contentBox td select#jiveLDAPserverType,
+.jive-contentBox td input#jiveLDAPbasedn,
+.jive-contentBox td input#jiveLDAPadmindn {
+	width: 270px;
+	}
+.jive-contentBox td input#jiveLDAPhost,
+.jive-contentBox td input#jiveLDAPadminpwd {
+	width: 160px;
+	}
+
+
+/* button to toggle the advanced settings panel */
+.jiveAdvancedButton {
+	display: block;
+	position: relative;
+	width: auto;
+	clear: both;
+	margin-top: 0px;
+	}
+.jiveAdvancedButton a {
+	padding: 2px 0px 2px 14px;
+	margin: 0px 0px 5px 0px;
+	background: url('../images/twisty_closed_9x9.gif') no-repeat left;
+	background-position: 1px;
+	color: #34679a;
+	}
+a.jiveAdvancedButtonOn {
+	background: transparent url('../images/twisty_opened_9x9.gif') no-repeat left;
+	background-position: 1px;
+	}
+/* advanced settings panel (for Connection Settings) */
+.jiveadvancedPanelcs {
+	display: block;
+	position: relative;
+	clear: both;
+	background: #ececec;
+	border: 1px solid #dcdcdc;
+	margin: 5px 0px 10px 0px;
+	padding: 0px;
+	overflow: hidden;
+	-moz-border-radius: 4px;
+	}
+.jiveadvancedPanelcs div {
+	margin: 12px;
+	}
+.jiveadvancedPanelcs div table {
+	
+	background-color: #fff;
+	border: 1px solid #ccc;
+	}
+.jiveadvancedPanelcs div table th,
+.jiveadvancedPanelcs div table td {
+	font-size: 11px;
+	padding: 3px 5px 3px 5px;
+	}
+.jiveadvancedPanelcs div table th {
+	color: #fff;
+	font-weight: bold;
+	background-color: #82a1bc;
+	}
+.jiveadvancedPanelcs div table td.jive-advancedLabel {
+	color: #09345b;
+	font-weight: bold;
+	background-color: #eaeff4;
+	text-align: right;
+	}
+.jiveadvancedPanelcs div table td.jive-advancedDesc {
+	color: #333;
+	}
+.jiveadvancedPanelcs div table td.jive-advancedCenter {
+	text-align: center;
+	}
+.jiveadvancedPanelcs div table td input {
+	float: none;
+	}
+.jiveadvancedPanelcs div table td.jive-advancedBorderBottom {
+	border-bottom: 1px solid #e8e8e8;
+	}
+.jiveadvancedPanelcs div table td.jive-advancedBorderRight {
+	border-right: 1px solid #e8e8e8;
+	}
+
+
+
+/* language selection specific styles */
 #jive-setup-language {
 	padding: 0px 0px 10px 18px;
 	}
 #jive-setup-language p {
 	line-height: 180%;
 	}
+
+
+/* form buttons throughout setup process */
+.jive-buttons {
+	padding-top: 15px;
+	}
 .jive-contentBox input#jive-setup-save {
 	padding: 2px 5px 2px 5px;
 	margin: 0px;
@@ -169,7 +323,8 @@ form {
 	border: 1px solid #7c7c7c;
 	background: #d6892c url(../images/setup_btn_bg-orange.gif) repeat-x;
 	}
-.jive-contentBox input#jive-setup-skip {
+.jive-contentBox input#jive-setup-skip,
+.jive-contentBox input#jive-setup-back {
 	padding: 2px 5px 2px 5px;
 	margin: 0px 10px 0px 0px;
 	font-size: 11px;
@@ -179,6 +334,39 @@ form {
 	border: 1px solid #7c7c7c;
 	background: #8c8c8c url(../images/setup_btn_bg-grey.gif) repeat-x;
 	}
+.jive-contentBox button#jive-setup-test {
+	padding: 2px 5px 1px 5px;
+	margin: 0px 10px 0px 0px;
+	font-size: 11px;
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-weight: bold;
+	color: #fff;
+	border: 1px solid #7c7c7c;
+	background: #8c8c8c url(../images/setup_btn_bg-grey.gif) repeat-x;
+	}
+.jive-contentBox button#jive-setup-test img {
+	vertical-align: text-top;
+	margin: 0px;
+	padding: 0px;
+	border: 0px;
+	}
+.jive-contentBox a#jive-setup-test2 {
+	padding: 3px 5px 3px 5px;
+	margin: 0px 10px 0px 0px;
+	font-size: 11px;
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-weight: bold;
+	color: #fff;
+	border: 1px solid #7c7c7c;
+	text-decoration: none;
+	background: #8c8c8c url(../images/setup_btn_bg-grey.gif) repeat-x;
+	}
+.jive-contentBox a#jive-setup-test2 img {
+	vertical-align: text-top;
+	margin: 0px;
+	padding: 0px;
+	border: 0px;
+	}
 .jive-description {
 	font-size: 11px;
 	}
@@ -201,6 +389,112 @@ form {
 	}
 
 
+
+
+/* --------------------------------------------- */
+/*  Tooltip styles                               */
+/* --------------------------------------------- */
+.jive-setup-helpicon {
+	display: block;
+	float: left;
+	width: 17px;
+	height: 17px;
+	}
+.jive-setup-helpicon a {
+	display: block;
+	width: 14px;
+	height: 14px;
+	margin: 3px 0px 0px 3px;
+	background: transparent url(../images/setup_helpicon.gif) no-repeat;
+	}
+div.jiveTooltip {
+	position: absolute;
+	width: 330px;
+	padding: 6px;
+	background-color: #f9f5d5;
+	border: 1px solid #999;
+	text-align: left;
+	z-index: 20;
+	-moz-border-radius: 0px;
+	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=92);
+	-moz-opacity: .92;
+	-khtml-opacity: .92;
+	}
+div.jiveTooltip .contents {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	font-size: 11px;
+	color: #333;
+	margin: 0;
+	padding: 0 3px;
+	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
+	-moz-opacity: 1;
+	-khtml-opacity: 1;
+	}
+
+
+
+/* --------------------------------------------- */
+/*  Test settings panel                          */
+/* --------------------------------------------- */
+
+.jive-testPanel {
+	display: block;
+	position: relative;
+	float: left;
+	margin: 0px;
+	padding: 0px;
+	border: 2px solid #666666;
+	background-color: #f8f7eb;
+	overflow: hidden;
+	z-index: 9997;
+	-moz-border-radius: 6px;
+	}
+.jive-testPanel-content {
+	display: block;
+	float: left;
+	padding: 20px;
+	font-size: 8pt;
+	z-index: 9999;
+	}
+.jive-testPanel-close a,
+.jive-testPanel-close a:visited {
+	float: right;
+	color: #666;
+	padding: 2px 5px 2px 18px;
+	margin: 0px;
+	font-size: 8pt;
+	background: transparent url(../images/setup_btn_closetestx.gif) no-repeat left;
+	background-position: 4;
+	border: 1px solid #ccc;
+	z-index: 9999;
+	}
+.jive-testPanel-close a:hover {
+	background-color: #e9e8d9;
+	}
+.jive-testPanel-content h2 {
+	font-size: 14pt;
+	color: #396b9c;
+	margin: 0px 0px 10px 0px;
+	padding: 0px;
+	}
+.jive-testPanel-content h2 span {
+	font-size: 10pt;
+	color: #000;
+	}
+.jive-testPanel-content h4 {
+	font-size: 12pt;
+	margin: 0px 0px 10px 0px;
+	padding: 0px;
+	}
+.jive-testPanel-content h4.jive-testSuccess {
+	color: #1e7100;
+	}
+.jive-testPanel-content h4.jive-testError {
+	color: #890000;
+	}
+
+
+
 /* --------------------------------------------- */
 /*  Footer                                       */
 /* --------------------------------------------- */