Permalink
Browse files

added scrolling to keystrokes

  • Loading branch information...
1 parent 43d2dd2 commit 1ce8a212308c2d3e4b027196348aa6ca21ef1a03 @ctdocken ctdocken committed Nov 23, 2016
Showing with 22 additions and 2 deletions.
  1. +1 −0 .gitignore
  2. +1 −1 src/components/popover/popover.ts
  3. +1 −1 src/components/select/select.html
  4. +19 −0 src/components/select/select.ts
View
@@ -9,6 +9,7 @@
# IDEs and editors
/.idea
+/.vscode
# misc
/.sass-cache
@@ -26,7 +26,7 @@ export class MdlPopoverComponent implements AfterViewInit {
@HostBinding('class.is-visible') public isVisible = false;
@HostBinding('class.direction-up') public directionUp = false;
constructor(private changeDetectionRef: ChangeDetectorRef,
- private elementRef: ElementRef) {}
+ public elementRef: ElementRef) {}
public ngAfterViewInit() {
// Add a hide listener to native element
@@ -5,7 +5,7 @@
<span
tabindex="0"
(focus)="open($event)">
- <!-- don't want focus to also trigger click -->
+ <!-- don't want click to also trigger focus -->
</span>
<div
class="mdl-textfield__input"
@@ -175,6 +175,25 @@ export class MdlSelectComponent implements ControlValueAccessor {
if (this.multiple) {
// prevent popup close on click inside popover when selecting multiple
$event.stopPropagation();
+ } else {
+ let popover: any = this.popoverComponent.elementRef.nativeElement;
+ let list: any = popover.querySelector(".mdl-list");
+ let option: any = null;
+
+ this.optionComponents.forEach(o => {
+ // not great for long lists because break is not available
+ if (o.value == value) {
+ option = o.contentWrapper.nativeElement;
+ }
+ });
+
+ if (option) {
+ if (option.offsetTop > popover.clientHeight) {
+ list.scrollTop += option.parentElement.clientHeight;
+ } else if (option.offsetTop < list.scrollTop) {
+ list.scrollTop -= option.parentElement.clientHeight;
+ }
+ }
}
this.writeValue(value);
this.change.emit(this.ngModel);

0 comments on commit 1ce8a21

Please sign in to comment.