From f65680a7aed5a8578db46ff2b6c3c24f1f7a18e7 Mon Sep 17 00:00:00 2001
From: Nathan Gray <nathangray.bsc@gmail.com>
Date: Thu, 25 Jul 2013 20:28:32 +0000
Subject: [PATCH] Add CSS to better match egw.  Fix chosen sizes using new
 width attribute.  Not perfect, but at least never too small.

---
 phpgwapi/inc/class.html.inc.php            |  2 +-
 phpgwapi/js/jquery/chosen/chosen.css       | 43 ++++++++++++++++++++++
 phpgwapi/js/jquery/chosen/chosen.jquery.js |  5 +++
 3 files changed, 49 insertions(+), 1 deletion(-)

diff --git a/phpgwapi/inc/class.html.inc.php b/phpgwapi/inc/class.html.inc.php
index 1c40bdbcbe..20e441b1eb 100644
--- a/phpgwapi/inc/class.html.inc.php
+++ b/phpgwapi/inc/class.html.inc.php
@@ -295,7 +295,7 @@ class html
 		if($enhanced) {
 			egw_framework::validate_file('/phpgwapi/js/jquery/chosen/chosen.jquery.js');
 			egw_framework::includeCSS('/phpgwapi/js/jquery/chosen/chosen.css',null,false);
-			$out .= "<script>var lab = egw_LAB || \$LAB; lab.wait(function() {\$j(function() {if(\$j().chosen) \$j('select[name=\"$name\"]').chosen();});})</script>\n";
+			$out .= "<script>var lab = egw_LAB || \$LAB; lab.wait(function() {\$j(function() {if(\$j().chosen) \$j('select[name=\"$name\"]').chosen({width: '100%'});});})</script>\n";
 		}
 		return $out;
 	}
diff --git a/phpgwapi/js/jquery/chosen/chosen.css b/phpgwapi/js/jquery/chosen/chosen.css
index 303721e3cc..7adf669f1b 100644
--- a/phpgwapi/js/jquery/chosen/chosen.css
+++ b/phpgwapi/js/jquery/chosen/chosen.css
@@ -418,3 +418,46 @@
   }
 }
 /* @end */
+
+/**
+ * Egw customizations for Chosen widget 
+ */
+.chzn-container {
+	display: inline-block;
+	font-size: inherit;
+}
+.chzn-container .chzn-single {
+	height: 19px;
+	line-height: 20px;
+}
+.chzn-container .chzn-results {
+	padding: 0 0 0 0px;
+}
+.chzn-container .chzn-results li {
+	line-height: 13px;
+	padding: 3px 6px;
+}
+.chzn-container-multi .chzn-choices .search-field input {
+	height: 12px;
+}
+.chzn-container-multi .chzn-choices .search-choice {
+	line-height: 12px;
+	margin: 2px 0 2px 1px;
+}
+.chzn-container .chzn-drop {
+	border-top-width: 0px;
+}
+.chzn-container-active.chzn-with-drop.chzn-above .chzn-single {
+  border-radius : 0px 0px 4px 4px;
+  border-top-width: 0px;
+}
+
+.chzn-container.chzn-above .chzn-drop {
+  top:auto;
+  bottom:23px;
+  border-width:1px 1px 0px 1px;
+  border-radius: 4px 4px 0px 0px;
+  -webkit-box-shadow: 0 -4px 5px rgba(0,0,0,.15);
+  -moz-box-shadow   : 0 -4px 5px rgba(0,0,0,.15);
+  box-shadow        : 0 -4px 5px rgba(0,0,0,.15);
+}
\ No newline at end of file
diff --git a/phpgwapi/js/jquery/chosen/chosen.jquery.js b/phpgwapi/js/jquery/chosen/chosen.jquery.js
index 3324d905f9..d9e81c927a 100644
--- a/phpgwapi/js/jquery/chosen/chosen.jquery.js
+++ b/phpgwapi/js/jquery/chosen/chosen.jquery.js
@@ -777,6 +777,11 @@
       this.form_field_jq.trigger("liszt:showing_dropdown", {
         chosen: this
       });
+	  var windowHeight = $(window).height(),
+		dropdownTop = this.container.offset().top + this.container.height() - $(window).scrollTop()
+		totalHeight = this.dropdown.height() + dropdownTop
+
+	  this.dropdown.toggleClass('chzn-above', totalHeight > windowHeight);
       this.results_showing = true;
       this.search_field.focus();
       this.search_field.val(this.search_field.val());