[Autocomplete] Minor refactoring

This commit is contained in:
Dhrubomoy Das Gupta
2017-06-07 23:01:14 -04:00
parent 3870266131
commit e3bd22de8c
3 changed files with 14 additions and 15 deletions

View File

@ -48,7 +48,7 @@ define([
function update() { function update() {
var m = zoneName ? var m = zoneName ?
moment.utc(lastTimestamp).tz(zoneName) : moment.utc(lastTimestamp); moment.utc(lastTimestamp).tz(zoneName) : moment.utc(lastTimestamp);
self.zoneAbbr = zoneName ? m.zoneAbbr() : "UTC"; self.zoneAbbr = m.zoneAbbr();
self.textValue = timeFormat && m.format(timeFormat); self.textValue = timeFormat && m.format(timeFormat);
self.ampmValue = m.format("A"); // Just the AM or PM part self.ampmValue = m.format("A"); // Just the AM or PM part
} }
@ -69,8 +69,8 @@ define([
// If wrong timezone is provided, the UTC will be used // If wrong timezone is provided, the UTC will be used
zoneName = momentTimezone.tz.names().includes(model.timezone) ? zoneName = momentTimezone.tz.names().includes(model.timezone) ?
model.timezone : "UTC"; model.timezone : "UTC";
update();
} }
update();
} }
// Pull in the model (clockFormat and timezone) from the domain object model // Pull in the model (clockFormat and timezone) from the domain object model

View File

@ -26,12 +26,12 @@
type="text" type="text"
ng-model="ngModel[field]" ng-model="ngModel[field]"
ng-change="filterOptions(ngModel[field])" ng-change="filterOptions(ngModel[field])"
ng-click="inputClicked($event)" ng-click="inputClicked()"
ng-keydown="keyDown($event)"/> ng-keydown="keyDown($event)"/>
<span class="icon-arrow-down" <span class="icon-arrow-down"
ng-click="arrowClicked()"></span> ng-click="arrowClicked()"></span>
<div class="autocompleteOptions" <div class="autocompleteOptions"
onload="hideOptions = false" ng-init="hideOptions = true"
ng-hide="hideOptions" ng-hide="hideOptions"
mct-click-elsewhere="hideOptions = true"> mct-click-elsewhere="hideOptions = true">
<ul> <ul>

View File

@ -33,10 +33,11 @@ define(
function AutocompleteController($scope, $element) { function AutocompleteController($scope, $element) {
var key = { var key = {
down: 40, down: 40,
up: 38, up: 38,
enter: 13 enter: 13
} },
autocompleteInputElement = $element[0].getElementsByClassName('autocompleteInput')[0];
if($scope.options[0].name) { if($scope.options[0].name) {
// If "options" include name, value pair // If "options" include name, value pair
@ -53,6 +54,7 @@ define(
$scope.optionIndex = $scope.filteredOptions.length; $scope.optionIndex = $scope.filteredOptions.length;
} }
$scope.optionIndex--; $scope.optionIndex--;
fillInputWithIndexedOption();
} }
function incrementOptionIndex() { function incrementOptionIndex() {
@ -60,6 +62,7 @@ define(
$scope.optionIndex = -1; $scope.optionIndex = -1;
} }
$scope.optionIndex++; $scope.optionIndex++;
fillInputWithIndexedOption();
} }
function fillInputWithString(string) { function fillInputWithString(string) {
@ -85,12 +88,10 @@ define(
switch(keyCode) { switch(keyCode) {
case key.down: case key.down:
incrementOptionIndex(); incrementOptionIndex();
fillInputWithIndexedOption();
break; break;
case key.up: case key.up:
$event.preventDefault(); // Prevents cursor jumping back and forth $event.preventDefault(); // Prevents cursor jumping back and forth
decrementOptionIndex(); decrementOptionIndex();
fillInputWithIndexedOption();
break; break;
case key.enter: case key.enter:
if($scope.filteredOptions[$scope.optionIndex]) { if($scope.filteredOptions[$scope.optionIndex]) {
@ -112,14 +113,12 @@ define(
}); });
} }
$scope.inputClicked = function($event) { $scope.inputClicked = function() {
var target = $event.target; autocompleteInputElement.select();
target.select(); showOptions(autocompleteInputElement.value);
showOptions(target.value);
} }
$scope.arrowClicked = function() { $scope.arrowClicked = function() {
var autocompleteInputElement = $element[0].getElementsByClassName('autocompleteInput')[0];
autocompleteInputElement.select(); autocompleteInputElement.select();
showOptions(''); showOptions('');
} }