client/src/app/+signup/shared/signup-mascot.component.ts

   1 import { Component, Input } from '@angular/core'
   2 import { DomSanitizer } from '@angular/platform-browser'
   3
   4 const images = {
   5   about: require('!!raw-loader?!../../../assets/images/mascot/register/about.svg').default,
   6   terms: require('!!raw-loader?!../../../assets/images/mascot/register/terms.svg').default,
   7   success: require('!!raw-loader?!../../../assets/images/mascot/register/success.svg').default,
   8   channel: require('!!raw-loader?!../../../assets/images/mascot/register/channel.svg').default,
   9   account: require('!!raw-loader?!../../../assets/images/mascot/register/account.svg').default
  10 }
  11
  12 export type MascotImageName = keyof typeof images
  13
  14 @Component({
  15   selector: 'my-signup-mascot',
  16   styleUrls: [ './signup-mascot.component.scss' ],
  17   template: `<div class="root" [innerHTML]="html"></div>`
  18 })
  19 export class SignupMascotComponent {
  20   @Input() imageName: MascotImageName
  21
  22   constructor (private sanitize: DomSanitizer) {
  23
  24   }
  25
  26   get html () {
  27     return this.sanitize.bypassSecurityTrustHtml(images[this.imageName])
  28   }
  29 }