Merge pull request #482 from iqb-berlin/feature/connected_origin

Feature/connected origin

projects/player/src/app/app.module.ts

@@ -10,6 +10,8 @@ import { KeyInputModule } from 'player/modules/key-input/key-input.module';
 import { UnitMenuModule } from 'player/modules/unit-menu/unit-menu.module';
 import { MetaDataService } from 'player/src/app/services/meta-data.service';
 import { ScrollingModule } from '@angular/cdk/scrolling';
+import { AsOverlayOriginPipe } from 'player/src/app/pipes/as-overlay-origin.pipe';
+import { HasReturnKeyPipe } from 'player/src/app/pipes/has-return-key.pipe';
 import { AppComponent } from './app.component';
 import { PageComponent } from './components/page/page.component';
 import { SectionComponent } from './components/section/section.component';
@@ -68,6 +70,8 @@ import { ExternalAppGroupElementComponent } from
     TextInputGroupElementComponent,
     CompoundGroupElementComponent,
     CastPipe,
+    AsOverlayOriginPipe,
+    HasReturnKeyPipe,
     TextGroupElementComponent,
     BaseGroupElementComponent,
     InteractiveGroupElementComponent,

projects/player/src/app/components/floating-keypad/floating-keypad.component.html

@@ -3,7 +3,7 @@
     cdkConnectedOverlay
     cdkConnectedOverlayPush
     [cdkConnectedOverlayScrollStrategy]="repositionScrollStrategy"
-    [cdkConnectedOverlayOrigin]="keypadService.elementComponent"
+    [cdkConnectedOverlayOrigin]="keypadService.elementComponent | asOverlayOrigin"
     [cdkConnectedOverlayPositions]="overlayPositions"
     [cdkConnectedOverlayOpen]="isKeypadOpen && keypadService.position === 'floating'">
   <aspect-keypad
@@ -15,7 +15,7 @@
       [customKeys]="keypadService.elementComponent.elementModel.inputAssistanceCustomKeys"
       [restrictToAllowedKeys]="keypadService.elementComponent.elementModel.restrictedToInputAssistanceChars"
       [hasArrowKeys]="keypadService.elementComponent.elementModel.hasArrowKeys"
-      [hasReturnKey]="!!keypadService.elementComponent.elementModel.hasReturnKey"
+      [hasReturnKey]="keypadService.elementComponent.elementModel | hasReturnKey"
       (backSpaceClicked)="keypadService.deleteCharacters(true)"
       (keyClicked)="keypadService.enterKey($event)">
   </aspect-keypad>

projects/player/src/app/components/floating-marking-bar/floating-marking-bar.component.html

@@ -3,7 +3,7 @@
       elementComponent.elementModel.highlightableTurquoise ||
       elementComponent.elementModel.highlightableOrange"
     cdkConnectedOverlay
-    [cdkConnectedOverlayOrigin]="elementComponent"
+    [cdkConnectedOverlayOrigin]="elementComponent | asOverlayOrigin"
     [cdkConnectedOverlayPositions]="overlayPositions"
     [cdkConnectedOverlayOpen]="isMarkingBarOpen">
   <div class="marking-bar-container"

projects/player/src/app/pipes/as-overlay-origin.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+import { ElementComponent } from 'common/directives/element-component.directive';
+import { CdkOverlayOrigin } from '@angular/cdk/overlay';
+
+@Pipe({
+  name: 'asOverlayOrigin'
+})
+export class AsOverlayOriginPipe implements PipeTransform {
+  transform(elementComponent: ElementComponent): CdkOverlayOrigin {
+    return elementComponent as CdkOverlayOrigin;
+  }
+}

projects/player/src/app/pipes/has-return-key.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+import { TextInputElement } from 'common/models/elements/element';
+import { TextAreaElement } from 'common/models/elements/input-elements/text-area';
+
+@Pipe({
+  name: 'hasReturnKey'
+})
+export class HasReturnKeyPipe implements PipeTransform {
+  transform(elementModel: TextInputElement): boolean {
+    if (elementModel.type === 'text-area') {
+      return (elementModel as TextAreaElement).hasReturnKey;
+    }
+    return false;
+  }
+}