LupusNobilis/sogo
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

(js) Update sg-timepicker following md changes

Browse source
This commit is contained in:
Francis Lachapelle 2016-10-25 16:35:39 -04:00
parent 524a481340
commit 79a34f1e36
1 changed files with 14 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
UI/WebServerResources/js/Common/sgTimepicker.directive.js
View file

@ -437,8 +437,11 @@
'</md-button>', '</md-button>',
'<div class="md-default-theme sg-timepicker-input-container" ', '<div class="md-default-theme sg-timepicker-input-container" ',
' ng-class="{\'sg-timepicker-focused\': ctrl.isFocused}">', ' ng-class="{\'sg-timepicker-focused\': ctrl.isFocused}">',
' <input class="sg-timepicker-input" aria-haspopup="true" ', ' <input class="sg-timepicker-input" ',
(ariaLabelValue ? 'aria-label="' + ariaLabelValue + '" ' : ''), (ariaLabelValue ? 'aria-label="' + ariaLabelValue + '" ' : ''),
' aria-haspopup="true"',
' aria-expanded="{{ctrl.isTimeOpen}}" ',
' aria-owns="{{::ctrl.timePaneId}}"',
' ng-focus="ctrl.setFocused(true)" ng-blur="ctrl.setFocused(false)">', ' ng-focus="ctrl.setFocused(true)" ng-blur="ctrl.setFocused(false)">',
' <md-button type="button" md-no-ink ', ' <md-button type="button" md-no-ink ',
' class="sg-timepicker-triangle-button md-icon-button" ', ' class="sg-timepicker-triangle-button md-icon-button" ',
@ -448,7 +451,7 @@
' </md-button>', ' </md-button>',
'</div>', '</div>',
// This pane will be detached from here and re-attached to the document body. // This pane will be detached from here and re-attached to the document body.
'<div class="sg-timepicker-time-pane md-whiteframe-z1">', '<div class="sg-timepicker-time-pane md-whiteframe-z1" id="{{::ctrl.timePaneId}}">',
' <div class="sg-timepicker-input-mask">', ' <div class="sg-timepicker-input-mask">',
' <div class="sg-timepicker-input-mask-opaque"></div>', ' <div class="sg-timepicker-input-mask-opaque"></div>',
// ' md-colors="::{\'box-shadow\': \'default-background-hue-1\'}"></div>', // using mdColors // ' md-colors="::{\'box-shadow\': \'default-background-hue-1\'}"></div>', // using mdColors
@ -524,16 +527,19 @@
*/ */
var TIME_PANE_WIDTH = { GTXS: 510 + 20, XS: 274 + 20 }; var TIME_PANE_WIDTH = { GTXS: 510 + 20, XS: 274 + 20 };
/** Used for checking whether the current user agent is on iOS or Android. */
var IS_MOBILE_REGEX = /ipad|iphone|ipod|android/i;
/** /**
* Controller for sg-timepicker. * Controller for sg-timepicker.
* *
* ngInject @constructor * ngInject @constructor
*/ */
TimePickerCtrl.$inject = ['$scope', '$element', '$attrs', '$window', '$mdConstant', TimePickerCtrl.$inject = ['$scope', '$element', '$attrs', '$window', '$mdConstant',
'$mdTheming', '$mdUtil', '$mdDateLocale', '$$mdDateUtil', '$$rAF', '$mdGesture', '$mdTheming', '$mdUtil', '$mdDateLocale', '$$mdDateUtil', '$$rAF',
'$mdMedia']; '$mdMedia'];
function TimePickerCtrl($scope, $element, $attrs, $window, $mdConstant, function TimePickerCtrl($scope, $element, $attrs, $window, $mdConstant,
$mdTheming, $mdUtil, $mdDateLocale, $$mdDateUtil, $$rAF, $mdGesture, $mdTheming, $mdUtil, $mdDateLocale, $$mdDateUtil, $$rAF,
$mdMedia) { $mdMedia) {
/** @final */ /** @final */
this.$window = $window; this.$window = $window;
@ -625,7 +631,7 @@
this.timePaneOpenedFrom = null; this.timePaneOpenedFrom = null;
/** @type {String} Unique id for the time pane. */ /** @type {String} Unique id for the time pane. */
this.timePane.id = 'sg-time-pane' + $mdUtil.nextUid(); this.timePaneId = 'sg-time-pane' + $mdUtil.nextUid();
/** Pre-bound click handler is saved so that the event listener can be removed. */ /** Pre-bound click handler is saved so that the event listener can be removed. */
this.bodyClickHandler = angular.bind(this, this.handleBodyClick); this.bodyClickHandler = angular.bind(this, this.handleBodyClick);
@ -635,7 +641,9 @@
* the resize event doesn't make sense on mobile and can have a negative impact since it * the resize event doesn't make sense on mobile and can have a negative impact since it
* triggers whenever the browser zooms in on a focused input. * triggers whenever the browser zooms in on a focused input.
*/ */
this.windowEventName = ($mdGesture.isIos || $mdGesture.isAndroid) ? 'orientationchange' : 'resize'; this.windowEventName = IS_MOBILE_REGEX.test(
navigator.userAgent || navigator.vendor || window.opera
) ? 'orientationchange' : 'resize';
/** Pre-bound close handler so that the event listener can be removed. */ /** Pre-bound close handler so that the event listener can be removed. */
this.windowEventHandler = $mdUtil.debounce(angular.bind(this, this.closeTimePane), 100); this.windowEventHandler = $mdUtil.debounce(angular.bind(this, this.closeTimePane), 100);