diff --git a/chosen/chosen-sprite.png b/chosen/chosen-sprite.png index 6ec9bbf..f20db44 100644 Binary files a/chosen/chosen-sprite.png and b/chosen/chosen-sprite.png differ diff --git a/chosen/chosen.css b/chosen/chosen.css index ba7d9db..92b8f7e 100644 --- a/chosen/chosen.css +++ b/chosen/chosen.css @@ -1,241 +1,218 @@ -div.chzn-container { +/* @group Base */ +select.chzn-select { + visibility: hidden; + height: 28px !important; + min-height: 28px !important; +} +.chzn-container { font-size: 13px; position: relative; + display: inline-block; + zoom: 1; + *display: inline; } - -div.chzn-container input { +.chzn-container .chzn-drop { background: #fff; - background: -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee)); - background: -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%); - background: -o-linear-gradient(bottom, white 85%, #eeeeee 99%); - background: -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); - filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); - background: linear-gradient(top, #ffffff 85%,#eeeeee 99%); border: 1px solid #aaa; - font-family: sans-serif; - font-size: 1em; - margin: 0px; - padding: 4px 5px; - outline: none; - -moz-border-radius: 3px; - -webkit-border-radius: 3px; - -o-border-radius: 3px; - -ms-border-radius: 3px; - -khtml-border-radius: 3px; - border-radius: 3px; -} -div.chzn-container textarea:focus { - border-color: #058cf5; - -moz-box-shadow: 0px 0px 3px #aaa; - -webkit-box-shadow: 0px 0px 3px #aaa; - box-shadow: 0px 0px 3px #aaa; -} - - -div.chzn-container div.chzn-drop { - background: #FFF; - border: 1px solid #aaa; - border-width: 0 1px 1px; - left: 0; + border-top: 0; position: absolute; top: 29px; - -webkit-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15); - -moz-box-shadow: 0px 4px 5px rgba(0, 0, 0, 0.15); - box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15); + left: 0; + -webkit-box-shadow: 0 4px 5px rgba(0,0,0,.15); + -moz-box-shadow : 0 4px 5px rgba(0,0,0,.15); + -o-box-shadow : 0 4px 5px rgba(0,0,0,.15); + box-shadow : 0 4px 5px rgba(0,0,0,.15); z-index: 999; } -div.chzn-container-single div.chzn-drop { - -moz-border-radius: 0 0 4px 4px; - -webkit-border-radius: 0 0 4px 4px; - -o-border-radius: 0 0 4px 4px; - -ms-border-radius: 0 0 4px 4px; - -khtml-border-radius: 0 0 4px 4px; - border-radius: 0 0 4px 4px; -} +/* @end */ - -/* SINGLE */ -div.chzn-container a.chzn-single { - background: #ffffff; +/* @group Single Chosen */ +.chzn-container-single .chzn-single { + background-color: #fff; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(0.5, white)); + background-image: -webkit-linear-gradient(center bottom, #eeeeee 0%, white 50%); background-image: -moz-linear-gradient(center bottom, #eeeeee 0%, white 50%); background-image: -o-linear-gradient(top, #eeeeee 0%,#ffffff 50%); background-image: -ms-linear-gradient(top, #eeeeee 0%,#ffffff 50%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff',GradientType=0 ); background-image: linear-gradient(top, #eeeeee 0%,#ffffff 50%); + -webkit-border-radius: 4px; + -moz-border-radius : 4px; + border-radius : 4px; + -moz-background-clip : padding; + -webkit-background-clip: padding-box; + background-clip : padding-box; border: 1px solid #aaa; display: block; overflow: hidden; - -moz-border-radius: 4px; - -webkit-border-radius: 4px; - -o-border-radius: 4px; - -ms-border-radius: 4px; - -khtml-border-radius: 4px; - border-radius: 4px; - height: 25px; - color: #444; - line-height: 26px; - padding: 0px 0px 0px 8px; - position: relative; - text-decoration: none; white-space: nowrap; + position: relative; + height: 26px; + line-height: 26px; + padding: 0 0 0 8px; + color: #444; + text-decoration: none; } -div.chzn-container a.chzn-single span { - display: block; +.chzn-container-single .chzn-single span { margin-right: 26px; + display: block; overflow: hidden; + white-space: nowrap; + -o-text-overflow: ellipsis; + -ms-text-overflow: ellipsis; text-overflow: ellipsis; } -div.chzn-container a.chzn-single div { - -moz-border-radius-topright: 4px; - -webkit-border-top-right-radius: 4px; - -o-border-top-right-radius: 4px; - -ms-border-top-right-radius: 4px; - -khtml-border-top-right-radius: 4px; - border-top-right-radius: 4px; - -moz-border-radius-bottomright: 4px; - -webkit-border-bottom-right-radius: 4px; - -o-border-bottom-right-radius: 4px; - -ms-border-bottom-right-radius: 4px; - -khtml-border-bottom-right-radius: 4px; - border-bottom-right-radius: 4px; +.chzn-container-single .chzn-single div { + -webkit-border-radius: 0 4px 4px 0; + -moz-border-radius : 0 4px 4px 0; + border-radius : 0 4px 4px 0; + -moz-background-clip : padding; + -webkit-background-clip: padding-box; + background-clip : padding-box; background: #ccc; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ccc), color-stop(0.6, #eee)); + background-image: -webkit-linear-gradient(center bottom, #ccc 0%, #eee 60%); background-image: -moz-linear-gradient(center bottom, #ccc 0%, #eee 60%); background-image: -o-linear-gradient(bottom, #ccc 0%, #eee 60%); background-image: -ms-linear-gradient(top, #cccccc 0%,#eeeeee 60%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#eeeeee',GradientType=0 ); background-image: linear-gradient(top, #cccccc 0%,#eeeeee 60%); border-left: 1px solid #aaa; - display: block; - height: 100%; position: absolute; right: 0; top: 0; + display: block; + height: 100%; width: 18px; } -div.chzn-container a.chzn-single div b { +.chzn-container-single .chzn-single div b { background: url('chosen-sprite.png') no-repeat 0 1px; display: block; width: 100%; height: 100%; } -div.chzn-container div.chzn-search { +.chzn-container-single .chzn-search { padding: 3px 4px; - margin: 0px; + margin: 0; white-space: nowrap; } -div.chzn-container div.chzn-search input { - background: url('chosen-sprite.png') no-repeat 97% -35px, #ffffff; - background: url('chosen-sprite.png') no-repeat 97% -35px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee)); - background: url('chosen-sprite.png') no-repeat 97% -35px, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%); - background: url('chosen-sprite.png') no-repeat 97% -35px, -o-linear-gradient(bottom, white 85%, #eeeeee 99%); - background: url('chosen-sprite.png') no-repeat 97% -35px, -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); - background: url('chosen-sprite.png') no-repeat 97% -35px, -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); - background: linear-gradient(top, #ffffff 85%,#eeeeee 99%) - -moz-border-radius: 0px; - -webkit-border-radius: 0px; - -o-border-radius: 0px; - -ms-border-radius: 0px; - -khtml-border-radius: 0px; - border-radius: 0px; +.chzn-container-single .chzn-search input { + background: #fff url('chosen-sprite.png') no-repeat 100% -20px; + background: url('chosen-sprite.png') no-repeat 100% -20px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee)); + background: url('chosen-sprite.png') no-repeat 100% -20px, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%); + background: url('chosen-sprite.png') no-repeat 100% -20px, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%); + background: url('chosen-sprite.png') no-repeat 100% -20px, -o-linear-gradient(bottom, white 85%, #eeeeee 99%); + background: url('chosen-sprite.png') no-repeat 100% -20px, -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); + background: url('chosen-sprite.png') no-repeat 100% -20px, -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); + background: url('chosen-sprite.png') no-repeat 100% -20px, linear-gradient(top, #ffffff 85%,#eeeeee 99%); margin: 1px 0; + padding: 4px 20px 4px 5px; outline: 0; + border: 1px solid #aaa; + font-family: sans-serif; + font-size: 1em; } +.chzn-container-single .chzn-drop { + -webkit-border-radius: 0 0 4px 4px; + -moz-border-radius : 0 0 4px 4px; + border-radius : 0 0 4px 4px; + -moz-background-clip : padding; + -webkit-background-clip: padding-box; + background-clip : padding-box; +} +/* @end */ - -/* Multi */ -div.chzn-container ul.chzn-choices { - background: #fff; +/* @group Multi Chosen */ +.chzn-container-multi .chzn-choices { + background-color: #fff; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee)); + background-image: -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%); background-image: -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%); background-image: -o-linear-gradient(bottom, white 85%, #eeeeee 99%); background-image: -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); background-image: linear-gradient(top, #ffffff 85%,#eeeeee 99%); - margin: 0; - cursor: text; border: 1px solid #aaa; + margin: 0; + padding: 0; + cursor: text; overflow: hidden; height: auto !important; height: 1%; - padding: 0; position: relative; } -div.chzn-container ul.chzn-choices:focus { - border-color: #058cf5; - -moz-box-shadow: 0px 0px 5px #999; - -webkit-box-shadow: 0px 0px 5px #999; - box-shadow: 0px 0px 5px #999; -} -div.chzn-container ul.chzn-choices li { +.chzn-container-multi .chzn-choices li { float: left; - list-style-type: none; - margin: 0px; + list-style: none; } -div.chzn-container ul.chzn-choices li.search-field { - margin: 0px; +.chzn-container-multi .chzn-choices .search-field { white-space: nowrap; - padding: 0px; + margin: 0; + padding: 0; } -div.chzn-container ul.chzn-choices li.search-field input { +.chzn-container-multi .chzn-choices .search-field input { color: #666; background: transparent !important; - border: 0px !important; + border: 0 !important; padding: 5px; margin: 1px 0; outline: 0; -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; + -moz-box-shadow : none; + -o-box-shadow : none; + box-shadow : none; } -div.chzn-container ul.chzn-choices li.search-field input.default { +.chzn-container-multi .chzn-choices .search-field .default { color: #999; } -div.chzn-container ul.chzn-choices li.search-choice { - -moz-border-radius: 3px; +.chzn-container-multi .chzn-choices .search-choice { -webkit-border-radius: 3px; - border-radius: 3px; - background: #e4e4e4; + -moz-border-radius : 3px; + border-radius : 3px; + -moz-background-clip : padding; + -webkit-background-clip: padding-box; + background-clip : padding-box; + background-color: #e4e4e4; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #e4e4e4), color-stop(0.7, #eeeeee)); + background-image: -webkit-linear-gradient(center bottom, #e4e4e4 0%, #eeeeee 70%); background-image: -moz-linear-gradient(center bottom, #e4e4e4 0%, #eeeeee 70%); background-image: -o-linear-gradient(bottom, #e4e4e4 0%, #eeeeee 70%); - background: -ms-linear-gradient(top, #e4e4e4 0%,#eeeeee 70%); + background-image: -ms-linear-gradient(top, #e4e4e4 0%,#eeeeee 70%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e4e4', endColorstr='#eeeeee',GradientType=0 ); - background: linear-gradient(top, #e4e4e4 0%,#eeeeee 70%); + background-image: linear-gradient(top, #e4e4e4 0%,#eeeeee 70%); color: #333; border: 1px solid #b4b4b4; line-height: 13px; padding: 3px 19px 3px 6px; + margin: 3px 0 3px 5px; position: relative; - margin: 3px 0px 3px 5px; } -div.chzn-container ul.chzn-choices li.search-choice span { +.chzn-container-multi .chzn-choices .search-choice span { cursor: default; } -div.chzn-container ul.chzn-choices li.search-choice.search-choice-focus { +.chzn-container-multi .chzn-choices .search-choice-focus { background: #d4d4d4; } -div.chzn-container ul.chzn-choices li.search-choice a.search-choice-close { +.chzn-container-multi .chzn-choices .search-choice .search-choice-close { + display: block; position: absolute; right: 5px; top: 6px; - display: block; width: 8px; height: 9px; font-size: 1px; background: url(chosen-sprite.png) right top no-repeat; } -div.chzn-container ul.chzn-choices li.search-choice a.search-choice-close:hover { +.chzn-container-multi .chzn-choices .search-choice .search-choice-close:hover { background-position: right -9px; } -div.chzn-container ul.chzn-choices li.search-choice.search-choice-focus a.search-choice-close { +.chzn-container-multi .chzn-choices .search-choice-focus .search-choice-close { background-position: right -9px; } +/* @end */ - -/* Results */ -div.chzn-container ul.chzn-results { +/* @group Results */ +.chzn-container .chzn-results { margin: 0 4px 4px 0; max-height: 190px; padding: 0 0 0 4px; @@ -243,92 +220,120 @@ div.chzn-container ul.chzn-results { overflow-x: hidden; overflow-y: auto; } -div.chzn-container-multi ul.chzn-results { +.chzn-container-multi .chzn-results { margin: -1px 0 0; padding: 0; } -div.chzn-container-multi ul.chzn-results li { - border-left: 0px !important; - border-right: 0px !important; -} -div.chzn-container ul.chzn-results li { +.chzn-container .chzn-results li { line-height: 80%; padding: 7px 7px 8px; margin: 0; - list-style-type: none; + list-style: none; } -div.chzn-container ul.chzn-results li.active-result { +.chzn-container .chzn-results .active-result { cursor: pointer; } -div.chzn-container ul.chzn-results li em { - font-style: normal; - background: #FEFFDC; -} -div.chzn-container ul.chzn-results li.highlighted { +.chzn-container .chzn-results .highlighted { background: #3875d7; color: #fff; } -div.chzn-container ul.chzn-results li.highlighted em { +.chzn-container .chzn-results li em { + background: #feffde; + font-style: normal; +} +.chzn-container .chzn-results .highlighted em { background: transparent; } -div.chzn-container ul.chzn-results li.no-results { - background: #F4F4F4; +.chzn-container .chzn-results .no-results { + background: #f4f4f4; } -div.chzn-container ul.chzn-results li.group-result { +.chzn-container .chzn-results .group-result { cursor: default; color: #999; font-weight: bold; } -div.chzn-container ul.chzn-results li.group-option { +.chzn-container .chzn-results .group-option { padding-left: 20px; } - -div.chzn-container-multi div.chzn-drop li.result-selected { +.chzn-container-multi .chzn-drop .result-selected { display: none; } +/* @end */ - - -/* Active */ -div.chzn-container-active a.chzn-single { - -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); - -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); - box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); +/* @group Active */ +.chzn-container-active .chzn-single { + -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3); + -moz-box-shadow : 0 0 5px rgba(0,0,0,.3); + -o-box-shadow : 0 0 5px rgba(0,0,0,.3); + box-shadow : 0 0 5px rgba(0,0,0,.3); border: 1px solid #5897fb; } -div.chzn-container-active a.chzn-single-with-drop { +.chzn-container-active .chzn-single-with-drop { border: 1px solid #aaa; - border-width: 1px 1px 1px; - -moz-box-shadow: 0px 1px 0px #FFF inset; - -webkit-box-shadow: 0px 1px 0px #FFF inset; - box-shadow: 0px 1px 0px #FFF inset; - background: #EEE; + -webkit-box-shadow: 0 1px 0 #fff inset; + -moz-box-shadow : 0 1px 0 #fff inset; + -o-box-shadow : 0 1px 0 #fff inset; + box-shadow : 0 1px 0 #fff inset; + background-color: #eee; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, white), color-stop(0.5, #eeeeee)); + background-image: -webkit-linear-gradient(center bottom, white 0%, #eeeeee 50%); background-image: -moz-linear-gradient(center bottom, white 0%, #eeeeee 50%); background-image: -o-linear-gradient(bottom, white 0%, #eeeeee 50%); background-image: -ms-linear-gradient(top, #ffffff 0%,#eeeeee 50%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); background-image: linear-gradient(top, #ffffff 0%,#eeeeee 50%); - -webkit-border-bottom-left-radius: 0px; - -webkit-border-bottom-right-radius: 0px; - -moz-border-radius-bottomleft: 0px; - -moz-border-radius-bottomright: 0px; - border-bottom-left-radius: 0px; - border-bottom-right-radius: 0px; + -webkit-border-bottom-left-radius : 0; + -webkit-border-bottom-right-radius: 0; + -moz-border-radius-bottomleft : 0; + -moz-border-radius-bottomright: 0; + border-bottom-left-radius : 0; + border-bottom-right-radius: 0; } -div.chzn-container-active a.chzn-single-with-drop div { +.chzn-container-active .chzn-single-with-drop div { background: transparent; border-left: none; } -div.chzn-container-active a.chzn-single-with-drop div b { +.chzn-container-active .chzn-single-with-drop div b { background-position: -18px 1px; } -div.chzn-container-active ul.chzn-choices { - -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); - -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); - box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); +.chzn-container-active .chzn-choices { + -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3); + -moz-box-shadow : 0 0 5px rgba(0,0,0,.3); + -o-box-shadow : 0 0 5px rgba(0,0,0,.3); + box-shadow : 0 0 5px rgba(0,0,0,.3); border: 1px solid #5897fb; } -div.chzn-container-active ul.chzn-choices input { +.chzn-container-active .chzn-choices .search-field input { color: #111 !important; } +/* @end */ + +/* @group Right to Left */ +.chzn-rtl { direction:rtl;text-align: right; } +.chzn-rtl .chzn-single { padding-left: 0; padding-right: 8px; } +.chzn-rtl .chzn-single span { margin-left: 26px; margin-right: 0; } +.chzn-rtl .chzn-single div { + left: 0; right: auto; + border-left: none; border-right: 1px solid #aaaaaa; + -webkit-border-radius: 4px 0 0 4px; + -moz-border-radius : 4px 0 0 4px; + border-radius : 4px 0 0 4px; +} +.chzn-rtl .chzn-choices li { float: right; } +.chzn-rtl .chzn-choices .search-choice { padding: 3px 6px 3px 19px; margin: 3px 5px 3px 0; } +.chzn-rtl .chzn-choices .search-choice .search-choice-close { left: 5px; right: auto; background-position: right top;} +.chzn-rtl.chzn-container-single .chzn-results { margin-left: 4px; margin-right: 0; padding-left: 0; padding-right: 4px; } +.chzn-rtl .chzn-results .group-option { padding-left: 0; padding-right: 20px; } +.chzn-rtl.chzn-container-active .chzn-single-with-drop div { border-right: none; } +.chzn-rtl .chzn-search input { + background: url('chosen-sprite.png') no-repeat -38px -20px, #ffffff; + background: url('chosen-sprite.png') no-repeat -38px -20px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee)); + background: url('chosen-sprite.png') no-repeat -38px -20px, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%); + background: url('chosen-sprite.png') no-repeat -38px -20px, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%); + background: url('chosen-sprite.png') no-repeat -38px -20px, -o-linear-gradient(bottom, white 85%, #eeeeee 99%); + background: url('chosen-sprite.png') no-repeat -38px -20px, -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); + background: url('chosen-sprite.png') no-repeat -38px -20px, -ms-linear-gradient(top, #ffffff 85%,#eeeeee 99%); + background: url('chosen-sprite.png') no-repeat -38px -20px, linear-gradient(top, #ffffff 85%,#eeeeee 99%); + padding: 4px 5px 4px 20px; +} +/* @end */ \ No newline at end of file diff --git a/chosen/chosen.proto.js b/chosen/chosen.proto.js index 1588041..f3ffdbb 100644 --- a/chosen/chosen.proto.js +++ b/chosen/chosen.proto.js @@ -1,22 +1,29 @@ +// Chosen, a Select Box Enhancer for jQuery and Protoype +// by Patrick Filler for Harvest, http://getharvest.com +// +// Version 0.9.1 +// Full source at https://github.com/harvesthq/chosen +// Copyright (c) 2011 Harvest http://getharvest.com + +// MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md +// This file is generated by `cake build`, do not edit it by hand. (function() { /* - Chosen, a Select Box Enhancer for jQuery and Protoype - by Patrick Filler for Harvest, http://getharvest.com - - Available for use under the MIT License, http://en.wikipedia.org/wiki/MIT_License - + Chosen source: generate output using 'cake build' Copyright (c) 2011 by Harvest - */ var Chosen, SelectParser, get_side_border_padding, root; + */ var Chosen, get_side_border_padding, root; var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }; - root = typeof exports !== "undefined" && exports !== null ? exports : this; + root = this; Chosen = (function() { function Chosen(elmn) { this.set_default_values(); this.form_field = elmn; this.is_multiple = this.form_field.multiple; + this.is_rtl = this.form_field.hasClassName("chzn-rtl"); this.default_text_default = this.form_field.multiple ? "Select Some Options" : "Select an Option"; this.set_up_html(); this.register_observers(); + this.form_field.addClassName("chzn-done"); } Chosen.prototype.set_default_values = function() { this.click_test_action = __bind(function(evt) { @@ -28,21 +35,21 @@ this.result_highlighted = null; this.result_single_selected = null; this.choices = 0; - this.single_temp = new Template('#{default}
'); - this.multi_temp = new Template('
'); + this.single_temp = new Template('#{default}
'); + this.multi_temp = new Template('
'); this.choice_temp = new Template('
  • #{choice}
    • '); return this.no_results_temp = new Template('
  • No results match "#{terms}"
    • '); }; Chosen.prototype.set_up_html = function() { var base_template, container_props, dd_top, dd_width, sf_width; - this.container_id = this.form_field.identify().replace('.', '_') + "_chzn"; + this.container_id = this.form_field.identify().replace(/(:|\.)/g, '_') + "_chzn"; this.f_width = this.form_field.getStyle("width") ? parseInt(this.form_field.getStyle("width"), 10) : this.form_field.getWidth(); container_props = { 'id': this.container_id, - 'class': 'chzn-container', + 'class': "chzn-container " + (this.is_rtl ? 'chzn-rtl' : ''), 'style': 'width: ' + this.f_width + 'px' }; - this.default_text = this.form_field.readAttribute('title') ? this.form_field.readAttribute('title') : this.default_text_default; + this.default_text = this.form_field.readAttribute('data-placeholder') ? this.form_field.readAttribute('data-placeholder') : this.default_text_default; base_template = this.is_multiple ? new Element('div', container_props).update(this.multi_temp.evaluate({ "default": this.default_text })) : new Element('div', container_props).update(this.single_temp.evaluate({ @@ -198,7 +205,7 @@ var content, data, startTime, _i, _len, _ref; startTime = new Date(); this.parsing = true; - this.results_data = SelectParser.select_to_array(this.form_field); + this.results_data = root.SelectParser.select_to_array(this.form_field); if (this.is_multiple && this.choices > 0) { this.search_choices.select("li.search-choice").invoke("remove"); this.choices = 0; @@ -338,7 +345,7 @@ target = evt.target.hasClassName("active-result") ? evt.target : evt.target.up(".active-result"); if (target) { this.result_highlight = target; - return this.result_select(); + return this.result_select(evt); } }; Chosen.prototype.search_results_mouseover = function(evt) { @@ -389,7 +396,7 @@ this.result_deselect(link.readAttribute("rel")); return link.up('li').remove(); }; - Chosen.prototype.result_select = function() { + Chosen.prototype.result_select = function(evt) { var high, item, position; if (this.result_highlight) { high = this.result_highlight; @@ -409,7 +416,9 @@ } else { this.selected_item.down("span").update(item.html); } - this.results_hide(); + if (!(evt.metaKey && this.is_multiple)) { + this.results_hide(); + } this.search_field.value = ""; if (typeof Event.simulate === 'function') { this.form_field.simulate("change"); @@ -520,8 +529,13 @@ Chosen.prototype.winnow_results_set_highlight = function() { var do_high; if (!this.result_highlight) { - do_high = this.search_results.down(".active-result"); - if (do_high) { + if (!this.is_multiple) { + do_high = this.search_results.down(".result-selected"); + } + if (!(do_high != null)) { + do_high = this.search_results.down(".active-result"); + } + if (do_high != null) { return this.result_do_highlight(do_high); } } @@ -607,7 +621,7 @@ case 13: evt.preventDefault(); if (this.results_showing) { - return this.result_select(); + return this.result_select(evt); } break; case 27: @@ -619,6 +633,8 @@ case 38: case 40: case 16: + case 91: + case 17: break; default: return this.results_search(); @@ -693,7 +709,9 @@ return side_border_padding = layout.get("border-left") + layout.get("border-right") + layout.get("padding-left") + layout.get("padding-right"); }; root.get_side_border_padding = get_side_border_padding; - root = typeof exports !== "undefined" && exports !== null ? exports : this; +}).call(this); +(function() { + var SelectParser; SelectParser = (function() { function SelectParser() { this.options_index = 0; @@ -762,5 +780,5 @@ } return parser.parsed; }; - root.SelectParser = SelectParser; + this.SelectParser = SelectParser; }).call(this);