From a178e3e68a93ecfe9e04fbe20b08b0f54e5d2305 Mon Sep 17 00:00:00 2001
From: Ashok Fernandez <ashok.fernandez@gmail.com>
Date: Fri, 12 Jun 2015 17:33:49 +0200
Subject: [PATCH] Tweaked UI to show country too

---
 angular-timezone-selector.js       | 10 ++++++----
 build/angular-timezone-selector.js | 20 +++++++-------------
 2 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/angular-timezone-selector.js b/angular-timezone-selector.js
index 485f6bd..54bf822 100644
--- a/angular-timezone-selector.js
+++ b/angular-timezone-selector.js
@@ -41,8 +41,7 @@ angular.module('angular-timezone-selector', [])
       },
       link: function ($scope, elem, attrs) {
         var data = []
-        
-        
+
         // Group the timezones by their country code
         var timezonesGroupedByCC = {}
         _.forEach(timezones, function (timezone) {
@@ -56,7 +55,7 @@ angular.module('angular-timezone-selector', [])
         // Add the grouped countries to the data array with their country name as the group option
         _.forEach(timezonesGroupedByCC, function (zonesByCountry, CC) {
           var zonesForCountry = {
-            text: CCToCountryName[CC],
+            text: CCToCountryName[CC] + ': ',
             children: zonesByCountry
           }
 
@@ -75,7 +74,10 @@ angular.module('angular-timezone-selector', [])
 
         // Initialise the chosen box
         elem.chosen({
-          width: '300px'
+          width: '300px',
+          include_group_label_in_selected: true,
+          search_contains: true,
+          no_results_text: 'No results, try searching for the name of your country.'
         })
 
         // Update the box if ngModel changes
diff --git a/build/angular-timezone-selector.js b/build/angular-timezone-selector.js
index 036f2cf..54bca34 100644
--- a/build/angular-timezone-selector.js
+++ b/build/angular-timezone-selector.js
@@ -41,8 +41,7 @@ angular.module('angular-timezone-selector', [])
       },
       link: function ($scope, elem, attrs) {
         var data = []
-        
-        
+
         // Group the timezones by their country code
         var timezonesGroupedByCC = {}
         _.forEach(timezones, function (timezone) {
@@ -56,7 +55,7 @@ angular.module('angular-timezone-selector', [])
         // Add the grouped countries to the data array with their country name as the group option
         _.forEach(timezonesGroupedByCC, function (zonesByCountry, CC) {
           var zonesForCountry = {
-            text: CCToCountryName[CC],
+            text: CCToCountryName[CC] + ': ',
             children: zonesByCountry
           }
 
@@ -73,22 +72,17 @@ angular.module('angular-timezone-selector', [])
           elem.append($optgroup)
         })
 
-
         // Initialise the chosen box
-
-        elem.on('change', function () {
-            
-            console.log(this.value)
-          })
-        
         elem.chosen({
-          width: '300px'
+          width: '300px',
+          include_group_label_in_selected: true,
+          search_contains: true,
+          no_results_text: 'No results, try searching for the name of your country.'
         })
 
-        
+        // Update the box if ngModel changes
         $scope.$watch('ngModel', function () {
           elem.val($scope.ngModel)
-          // console.log($scope)
           elem.trigger('chosen:updated')
         })
       }