Merge branch 'feature-1720-tag-taxonomies'
Merge branch 'feature-1720-tag-taxonomies'

file:a/README.rst -> file:b/README.rst
--- a/README.rst
+++ b/README.rst
@@ -13,6 +13,11 @@
 
 * A custom Package edit form
 
+* A custom Group edit form
+
+* A plugin that allows for custom forms to be used for datasets based on 
+  their "type".
+
 * A custom User registration and edition form
 
 * Some simple template customisations
@@ -25,7 +30,6 @@
   pip install -e git+https://github.com/okfn/ckanext-example#egg=ckanext-example
 
 Then activate it by setting ``ckan.plugins = example`` in your main ``ini``-file.
-
 
 Orientation
 ===========
@@ -58,4 +62,19 @@
   updating. In the meantime, follow the instructions at: 
   http://readthedocs.org/docs/ckan/en/latest/forms.html
 
+Example Tags With Vocabularies
+==============================
 
+To add example tag vocabulary data to the database, from the ckanext-example directory run:
+
+::
+
+    paster example create-example-vocabs -c <path to your ckan config file>
+
+This data can be removed with
+
+::
+
+    paster example clean -c <path to your ckan config file>
+
+

--- /dev/null
+++ b/ckanext/example/commands.py
@@ -1,1 +1,83 @@
+from ckan import model
+from ckan.lib.cli import CkanCommand
+from ckan.logic import get_action, NotFound
+import forms
 
+import logging
+log = logging.getLogger()
+
+
+class ExampleCommand(CkanCommand):
+    '''
+    CKAN Example Extension
+
+    Usage::
+
+        paster example create-example-vocabs -c <path to config file>
+
+        paster example clean -c <path to config file>
+            - Remove all data created by ckanext-example
+
+    The commands should be run from the ckanext-example directory.
+    '''
+    summary = __doc__.split('\n')[0]
+    usage = __doc__
+
+    def command(self):
+        '''
+        Parse command line arguments and call appropriate method.
+        '''
+        if not self.args or self.args[0] in ['--help', '-h', 'help']:
+            print ExampleCommand.__doc__
+            return
+
+        cmd = self.args[0]
+        self._load_config()
+
+        if cmd == 'create-example-vocabs':
+            self.create_example_vocabs()
+        if cmd == 'clean':
+            self.clean()
+        else:
+            log.error('Command "%s" not recognized' % (cmd,))
+
+    def create_example_vocabs(self):
+        '''
+        Adds example vocabularies to the database if they don't already exist.
+        '''
+        user = get_action('get_site_user')({'model': model, 'ignore_auth': True}, {})
+        context = {'model': model, 'session': model.Session, 'user': user['name']}
+
+        try:
+            data = {'id': forms.GENRE_VOCAB}
+            get_action('vocabulary_show')(context, data)
+            log.info("Example genre vocabulary already exists, skipping.")
+        except NotFound:
+            log.info("Creating vocab %s" % forms.GENRE_VOCAB)
+            data = {'name': forms.GENRE_VOCAB}
+            vocab = get_action('vocabulary_create')(context, data)
+            log.info("Adding tag %s to vocab %s" % ('jazz', forms.GENRE_VOCAB))
+            data = {'name': 'jazz', 'vocabulary_id': vocab['id']}
+            get_action('tag_create')(context, data)
+            log.info("Adding tag %s to vocab %s" % ('soul', forms.GENRE_VOCAB))
+            data = {'name': 'soul', 'vocabulary_id': vocab['id']}
+            get_action('tag_create')(context, data)
+
+        try:
+            data = {'id': forms.COMPOSER_VOCAB}
+            get_action('vocabulary_show')(context, data)
+            log.info("Example composer vocabulary already exists, skipping.")
+        except NotFound:
+            log.info("Creating vocab %s" % forms.COMPOSER_VOCAB)
+            data = {'name': forms.COMPOSER_VOCAB}
+            vocab = get_action('vocabulary_create')(context, data)
+            log.info("Adding tag %s to vocab %s" % ('Bob Mintzer', forms.COMPOSER_VOCAB))
+            data = {'name': 'Bob Mintzer', 'vocabulary_id': vocab['id']}
+            get_action('tag_create')(context, data)
+            log.info("Adding tag %s to vocab %s" % ('Steve Lewis', forms.COMPOSER_VOCAB))
+            data = {'name': 'Steve Lewis', 'vocabulary_id': vocab['id']}
+            get_action('tag_create')(context, data)
+
+    def clean(self):
+        log.error("Clean command not yet implemented")
+

--- /dev/null
+++ b/ckanext/example/forms.py
@@ -1,1 +1,261 @@
-
+import os
+import logging
+from pylons import tmpl_context as c
+from ckan.authz import Authorizer
+from ckan.logic.converters import convert_to_extras,\
+    convert_from_extras, convert_to_tags, convert_from_tags, free_tags_only
+from ckan.logic import get_action, NotFound
+from ckan.logic.schema import package_form_schema, group_form_schema
+from ckan.lib.base import c, model
+from ckan.plugins import IDatasetForm, IGroupForm, IConfigurer
+from ckan.plugins import IGenshiStreamFilter
+from ckan.plugins import implements, SingletonPlugin
+from ckan.lib.navl.validators import ignore_missing, keep_extras
+
+log = logging.getLogger(__name__)
+
+GENRE_VOCAB = u'genre_vocab'
+COMPOSER_VOCAB = u'composer_vocab'
+
+
+class ExampleGroupForm(SingletonPlugin):
+    """This plugin demonstrates how a class packaged as a CKAN
+    extension might extend CKAN behaviour by providing custom forms
+    based on the type of a Group.
+
+    In this case, we implement two extension interfaces to provide custom
+    forms for specific types of group.
+
+      - ``IConfigurer`` allows us to override configuration normally
+        found in the ``ini``-file.  Here we use it to specify where the
+        form templates can be found.
+        
+      - ``IGroupForm`` allows us to provide a custom form for a dataset
+        based on the 'type' that may be set for a group.  Where the 
+        'type' matches one of the values in group_types then this 
+        class will be used. 
+    """
+    implements(IGroupForm, inherit=True)
+    implements(IConfigurer, inherit=True)
+    
+    def update_config(self, config):
+        """
+        This IConfigurer implementation causes CKAN to look in the
+        ```templates``` directory when looking for the group_form()
+        """
+        here = os.path.dirname(__file__)
+        rootdir = os.path.dirname(os.path.dirname(here))
+        template_dir = os.path.join(rootdir, 'ckanext',
+                                    'example', 'theme', 'templates')
+        config['extra_template_paths'] = ','.join([template_dir,
+                config.get('extra_template_paths', '')])
+            
+    def group_form(self):
+        """
+        Returns a string representing the location of the template to be
+        rendered.  e.g. "forms/group_form.html".
+        """
+        return 'forms/group_form.html'
+
+    def group_types(self):
+        """
+        Returns an iterable of group type strings.
+
+        If a request involving a group of one of those types is made, then
+        this plugin instance will be delegated to.
+
+        There must only be one plugin registered to each group type.  Any
+        attempts to register more than one plugin instance to a given group
+        type will raise an exception at startup.
+        """
+        return ["testgroup"]
+
+    def is_fallback(self):
+        """
+        Returns true iff this provides the fallback behaviour, when no other
+        plugin instance matches a group's type.
+
+        As this is not the fallback controller we should return False.  If 
+        we were wanting to act as the fallback, we'd return True
+        """
+        return False                
+                
+    def form_to_db_schema(self):
+        """
+        Returns the schema for mapping group data from a form to a format
+        suitable for the database.
+        """
+        return group_form_schema()
+
+    def db_to_form_schema(self):
+        """
+        Returns the schema for mapping group data from the database into a
+        format suitable for the form (optional)
+        """
+        return {}
+        
+    def check_data_dict(self, data_dict):
+        """
+        Check if the return data is correct.
+
+        raise a DataError if not.
+        """
+
+    def setup_template_variables(self, context, data_dict):
+        """
+        Add variables to c just prior to the template being rendered.
+        """                
+                
+
+class ExampleDatasetForm(SingletonPlugin):
+    """This plugin demonstrates how a theme packaged as a CKAN
+    extension might extend CKAN behaviour.
+
+    In this case, we implement three extension interfaces:
+
+      - ``IConfigurer`` allows us to override configuration normally
+        found in the ``ini``-file.  Here we use it to specify where the
+        form templates can be found.
+      - ``IDatasetForm`` allows us to provide a custom form for a dataset
+        based on the type_name that may be set for a package.  Where the
+        type_name matches one of the values in package_types then this
+        class will be used.
+    """
+    implements(IDatasetForm, inherit=True)
+    implements(IConfigurer, inherit=True)    
+    implements(IGenshiStreamFilter, inherit=True)
+    
+    def update_config(self, config):
+        """
+        This IConfigurer implementation causes CKAN to look in the
+        ```templates``` directory when looking for the package_form()
+        """
+        here = os.path.dirname(__file__)
+        rootdir = os.path.dirname(os.path.dirname(here))
+        template_dir = os.path.join(rootdir, 'ckanext',
+                                    'example', 'theme', 'templates')
+        config['extra_template_paths'] = ','.join([template_dir,
+                config.get('extra_template_paths', '')])
+
+    def package_form(self):
+        """
+        Returns a string representing the location of the template to be
+        rendered.  e.g. "package/new_package_form.html".
+        """
+        return 'forms/dataset_form.html'
+
+    def is_fallback(self):
+        """
+        Returns true iff this provides the fallback behaviour, when no other
+        plugin instance matches a package's type.
+
+        As this is not the fallback controller we should return False.  If
+        we were wanting to act as the fallback, we'd return True
+        """
+        return True
+
+    def package_types(self):
+        """
+        Returns an iterable of package type strings.
+
+        If a request involving a package of one of those types is made, then
+        this plugin instance will be delegated to.
+
+        There must only be one plugin registered to each package type.  Any
+        attempts to register more than one plugin instance to a given package
+        type will raise an exception at startup.
+        """
+        return ["example_dataset_form"]
+
+    def setup_template_variables(self, context, data_dict=None):
+        """
+        Adds variables to c just prior to the template being rendered that can
+        then be used within the form
+        """
+        c.licences = [('', '')] + model.Package.get_license_options()
+        c.publishers = [('Example publisher', 'Example publisher 2')]
+        c.is_sysadmin = Authorizer().is_sysadmin(c.user)
+        c.resource_columns = model.Resource.get_columns()
+        try:
+            c.genre_tags = get_action('tag_list')(context, {'vocabulary_id': GENRE_VOCAB})
+            c.composer_tags = get_action('tag_list')(context, {'vocabulary_id': COMPOSER_VOCAB})
+        except NotFound:
+            c.vocab_tags = None
+            c.composer_tags = None
+
+        ## This is messy as auths take domain object not data_dict
+        pkg = context.get('package') or c.pkg
+        if pkg:
+            c.auth_for_change_state = Authorizer().am_authorized(
+                c, model.Action.CHANGE_STATE, pkg)
+
+    def form_to_db_schema(self):
+        """
+        Returns the schema for mapping package data from a form to a format
+        suitable for the database.
+        """
+        schema = package_form_schema()
+        schema.update({
+            'published_by': [ignore_missing, unicode, convert_to_extras],
+            'genre_tags': [ignore_missing, convert_to_tags(GENRE_VOCAB)],
+            'composer_tags': [ignore_missing, convert_to_tags(COMPOSER_VOCAB)]
+        })
+        return schema
+    
+    def db_to_form_schema(self):
+        """
+        Returns the schema for mapping package data from the database into a
+        format suitable for the form (optional)
+        """
+        schema = package_form_schema()
+        schema.update({
+            'tags': {
+                '__extras': [keep_extras, free_tags_only]
+            },
+            'genre_tags_selected': [
+                convert_from_tags(GENRE_VOCAB), ignore_missing
+            ],
+            'composer_tags_selected': [
+                convert_from_tags(COMPOSER_VOCAB), ignore_missing
+            ],
+            'published_by': [convert_from_extras, ignore_missing],
+        })
+        return schema
+
+    def check_data_dict(self, data_dict):
+        """
+        Check if the return data is correct and raises a DataError if not.
+        """
+        return
+
+    def filter(self, stream):
+        # Add vocab tags to the bottom of the sidebar.
+        from pylons import request
+        from genshi.filters import Transformer
+        from genshi.input import HTML
+        routes = request.environ.get('pylons.routes_dict')
+        context = {'model': model}
+        if routes.get('controller') == 'package' \
+            and routes.get('action') == 'read':
+                for vocab in (GENRE_VOCAB, COMPOSER_VOCAB):
+                    try:
+                        vocab = get_action('vocabulary_show')(context, {'id': vocab})
+                        vocab_tags = [t for t in c.pkg_dict.get('tags', [])
+                                      if t.get('vocabulary_id') == vocab['id']]
+                    except NotFound:
+                        vocab_tags = None
+
+                    if not vocab_tags:
+                        continue
+
+                    html = '<li class="sidebar-section">'
+                    html = html + '<h3>%s</h3>' % vocab['name']
+                    html = html + '<ul class="tags clearfix">'
+                    for tag in vocab_tags:
+                        html = html + '<li>%s</li>' % tag['name']
+                    html = html + "</ul></li>"
+                    stream = stream | Transformer(
+                        "//div[@id='sidebar']//ul[@class='widget-list']"
+                    ).append(HTML(html))
+        return stream
+

--- a/ckanext/example/plugin.py
+++ b/ckanext/example/plugin.py
@@ -1,6 +1,8 @@
 import os
 from logging import getLogger
 
+from pylons import request
+from genshi.input import HTML
 from genshi.filters.transform import Transformer
 
 from ckan.plugins import implements, SingletonPlugin
@@ -21,9 +23,11 @@
         found in the ``ini``-file.  Here we use it to specify the site
         title, and to tell CKAN to look in this package for templates
         and resources that customise the core look and feel.
+        
       - ``IGenshiStreamFilter`` allows us to filter and transform the
         HTML stream just before it is rendered.  In this case we use
         it to rename "frob" to "foobar"
+        
       - ``IRoutes`` allows us to add new URLs, or override existing
         URLs.  In this example we use it to override the default
         ``/register`` behaviour with a custom controller
@@ -68,9 +72,26 @@
         This example filter renames 'frob' to 'foobar' (this string is
         found in the custom ``home/index.html`` template provided as
         part of the package).
+
+        It also adds the chosen JQuery plugin to the page if viewing the
+        dataset edit page (provides a better UX for working with tags with vocabularies)
         """
         stream = stream | Transformer('//p[@id="examplething"]/text()')\
                  .substitute(r'frob', r'foobar')
+
+        routes = request.environ.get('pylons.routes_dict')
+        if routes.get('controller') == 'package' \
+            and routes.get('action') == 'edit':
+                stream = stream | Transformer('head').append(HTML(
+                    '<link rel="stylesheet" href="/css/chosen.css" />'
+                ))
+                stream = stream | Transformer('body').append(HTML(
+                    '''
+                    <script src="/scripts/chosen.jquery.min.js" type="text/javascript"></script>'
+                    <script type="text/javascript">$(".chzn-select").chosen();</script>
+                    '''
+                ))
+
         return stream
 
     def before_map(self, map):

 Binary files /dev/null and b/ckanext/example/theme/public/css/chosen-sprite.png differ
--- /dev/null
+++ b/ckanext/example/theme/public/css/chosen.css
@@ -1,1 +1,390 @@
-
+/* @group Base */
+.chzn-container {
+  font-size: 13px;
+  position: relative;
+  display: inline-block;
+  zoom: 1;
+  *display: inline;
+}
+.chzn-container .chzn-drop {
+  background: #fff;
+  border: 1px solid #aaa;
+  border-top: 0;
+  position: absolute;
+  top: 29px;
+  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;
+}
+/* @end */
+
+/* @group Single Chosen */
+.chzn-container-single .chzn-single {
+  background-color: #ffffff;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0 );   
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #ffffff), color-stop(50%, #f6f6f6), color-stop(52%, #eeeeee), color-stop(100%, #f4f4f4));
+  background-image: -webkit-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: -moz-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: -o-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: -ms-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-image: linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%); 
+  -webkit-border-radius: 5px;
+  -moz-border-radius   : 5px;
+  border-radius        : 5px;
+  -moz-background-clip   : padding;
+  -webkit-background-clip: padding-box;
+  background-clip        : padding-box;
+  border: 1px solid #aaaaaa;
+  -webkit-box-shadow: 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
+  -moz-box-shadow   : 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
+  box-shadow        : 0 0 3px #ffffff inset, 0 1px 1px rgba(0,0,0,0.1);
+  display: block;
+  overflow: hidden;
+  white-space: nowrap;
+  position: relative;
+  height: 23px;
+  line-height: 24px;
+  padding: 0 0 0 8px;
+  color: #444444;
+  text-decoration: none;
+}
+.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;
+}
+.chzn-container-single .chzn-single abbr {
+  display: block;
+  position: absolute;
+  right: 26px;
+  top: 6px;
+  width: 12px;
+  height: 13px;
+  font-size: 1px;
+  background: url(chosen-sprite.png) right top no-repeat;
+}
+.chzn-container-single .chzn-single abbr:hover {
+  background-position: right -11px;
+}
+.chzn-container-single .chzn-single div {
+  position: absolute;
+  right: 0;
+  top: 0;
+  display: block;
+  height: 100%;
+  width: 18px;
+}
+.chzn-container-single .chzn-single div b {
+  background: url('chosen-sprite.png') no-repeat 0 0;
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.chzn-container-single .chzn-search {
+  padding: 3px 4px;
+  position: relative;
+  margin: 0;
+  white-space: nowrap;
+  z-index: 1010;
+}
+.chzn-container-single .chzn-search input {
+  background: #fff url('chosen-sprite.png') no-repeat 100% -22px;
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background: url('chosen-sprite.png') no-repeat 100% -22px, linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  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 */
+
+.chzn-container-single-nosearch .chzn-search input {
+  position: absolute;
+  left: -9000px;
+}
+
+/* @group Multi Chosen */
+.chzn-container-multi .chzn-choices {
+  background-color: #fff;
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
+  background-image: -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  background-image: linear-gradient(top, #eeeeee 1%, #ffffff 15%);
+  border: 1px solid #aaa;
+  margin: 0;
+  padding: 0;
+  cursor: text;
+  overflow: hidden;
+  height: auto !important;
+  height: 1%;
+  position: relative;
+}
+.chzn-container-multi .chzn-choices li {
+  float: left;
+  list-style: none;
+}
+.chzn-container-multi .chzn-choices .search-field {
+  white-space: nowrap;
+  margin: 0;
+  padding: 0;
+}
+.chzn-container-multi .chzn-choices .search-field input {
+  color: #666;
+  background: transparent !important;
+  border: 0 !important;
+  font-family: sans-serif;
+  font-size: 100%;
+  height: 15px;
+  padding: 5px;
+  margin: 1px 0;
+  outline: 0;
+  -webkit-box-shadow: none;
+  -moz-box-shadow   : none;
+  -o-box-shadow     : none;
+  box-shadow        : none;
+}
+.chzn-container-multi .chzn-choices .search-field .default {
+  color: #999;
+}
+.chzn-container-multi .chzn-choices .search-choice {
+  -webkit-border-radius: 3px;
+  -moz-border-radius   : 3px;
+  border-radius        : 3px;
+  -moz-background-clip   : padding;
+  -webkit-background-clip: padding-box;
+  background-clip        : padding-box;
+  background-color: #e4e4e4;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#eeeeee', GradientType=0 ); 
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
+  background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: -ms-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); 
+  -webkit-box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+  -moz-box-shadow   : 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+  box-shadow        : 0 0 2px #ffffff inset, 0 1px 0 rgba(0,0,0,0.05);
+  color: #333;
+  border: 1px solid #aaaaaa;
+  line-height: 13px;
+  padding: 3px 20px 3px 5px;
+  margin: 3px 0 3px 5px;
+  position: relative;
+  cursor: default;
+}
+.chzn-container-multi .chzn-choices .search-choice-focus {
+  background: #d4d4d4;
+}
+.chzn-container-multi .chzn-choices .search-choice .search-choice-close {
+  display: block;
+  position: absolute;
+  right: 3px;
+  top: 4px;
+  width: 12px;
+  height: 13px;
+  font-size: 1px;
+  background: url(chosen-sprite.png) right top no-repeat;
+}
+.chzn-container-multi .chzn-choices .search-choice .search-choice-close:hover {
+  background-position: right -11px;
+}
+.chzn-container-multi .chzn-choices .search-choice-focus .search-choice-close {
+  background-position: right -11px;
+}
+/* @end */
+
+/* @group Results */
+.chzn-container .chzn-results {
+  margin: 0 4px 4px 0;
+  max-height: 240px;
+  padding: 0 0 0 4px;
+  position: relative;
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+.chzn-container-multi .chzn-results {
+  margin: -1px 0 0;
+  padding: 0;
+}
+.chzn-container .chzn-results li {
+  display: none;
+  line-height: 15px;
+  padding: 5px 6px;
+  margin: 0;
+  list-style: none;
+}
+.chzn-container .chzn-results .active-result {
+  cursor: pointer;
+  display: list-item;
+}
+.chzn-container .chzn-results .highlighted {
+  background-color: #3875d7;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3875d7', endColorstr='#2a62bc', GradientType=0 );  
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc));
+  background-image: -webkit-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: -moz-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: -o-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: -ms-linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  background-image: linear-gradient(top, #3875d7 20%, #2a62bc 90%);
+  color: #fff;
+}
+.chzn-container .chzn-results li em {
+  background: #feffde;
+  font-style: normal;
+}
+.chzn-container .chzn-results .highlighted em {
+  background: transparent;
+}
+.chzn-container .chzn-results .no-results {
+  background: #f4f4f4;
+  display: list-item;
+}
+.chzn-container .chzn-results .group-result {
+  cursor: default;
+  color: #999;
+  font-weight: bold;
+}
+.chzn-container .chzn-results .group-option {
+  padding-left: 15px;
+}
+.chzn-container-multi .chzn-drop .result-selected {
+  display: none;
+}
+.chzn-container .chzn-results-scroll {
+  background: white;
+  margin: 0 4px;
+  position: absolute;
+  text-align: center;
+  width: 321px; /* This should by dynamic with js */
+  z-index: 1;
+}
+.chzn-container .chzn-results-scroll span {
+  display: inline-block;
+  height: 17px;
+  text-indent: -5000px;
+  width: 9px;
+}
+.chzn-container .chzn-results-scroll-down {
+  bottom: 0;
+}
+.chzn-container .chzn-results-scroll-down span {
+  background: url('chosen-sprite.png') no-repeat -4px -3px;
+}
+.chzn-container .chzn-results-scroll-up span {
+  background: url('chosen-sprite.png') no-repeat -22px -3px;
+}
+/* @end */
+
+/* @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;
+}
+.chzn-container-active .chzn-single-with-drop {
+  border: 1px solid #aaa;
+  -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;
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0 );
+  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff));
+  background-image: -webkit-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: -moz-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: -o-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: -ms-linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  background-image: linear-gradient(top, #eeeeee 20%, #ffffff 80%);
+  -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;
+}
+.chzn-container-active .chzn-single-with-drop div {
+  background: transparent;
+  border-left: none;
+}
+.chzn-container-active .chzn-single-with-drop div b {
+  background-position: -18px 1px;
+}
+.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;
+}
+.chzn-container-active .chzn-choices .search-field input {
+  color: #111 !important;
+}
+/* @end */
+
+/* @group Disabled Support */
+.chzn-disabled {
+  cursor: default;
+  opacity:0.5 !important;
+}
+.chzn-disabled .chzn-single {
+  cursor: default;
+}
+.chzn-disabled .chzn-choices .search-choice .search-choice-close {
+  cursor: default;
+}
+
+/* @group Right to Left */
+.chzn-rtl { text-align: right; }
+.chzn-rtl .chzn-single { padding: 0 8px 0 0; overflow: visible; }
+.chzn-rtl .chzn-single span { margin-left: 26px; margin-right: 0; direction: rtl; }
+
+.chzn-rtl .chzn-single div { left: 3px; right: auto; }
+.chzn-rtl .chzn-single abbr {
+  left: 26px;
+  right: auto;
+}
+.chzn-rtl .chzn-choices .search-field input { direction: rtl; }
+.chzn-rtl .chzn-choices li { float: right; }
+.chzn-rtl .chzn-choices .search-choice { padding: 3px 5px 3px 19px; margin: 3px 5px 3px 0; }
+.chzn-rtl .chzn-choices .search-choice .search-choice-close { left: 4px; right: auto; background-position: right top;}
+.chzn-rtl.chzn-container-single .chzn-results { margin: 0 0 4px 4px; padding: 0 4px 0 0; }
+.chzn-rtl .chzn-results .group-option { padding-left: 0; padding-right: 15px; }
+.chzn-rtl.chzn-container-active .chzn-single-with-drop div { border-right: none; }
+.chzn-rtl .chzn-search input {
+  background: #fff url(&#