client/src/app/shared/forms/peertube-checkbox.component.ts

   1 import { AfterContentInit, ChangeDetectorRef, Component, ContentChildren, forwardRef, Input, QueryList, TemplateRef } from '@angular/core'
   2 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
   3 import { PeerTubeTemplateDirective } from '@app/shared/angular/peertube-template.directive'
   4
   5 @Component({
   6   selector: 'my-peertube-checkbox',
   7   styleUrls: [ './peertube-checkbox.component.scss' ],
   8   templateUrl: './peertube-checkbox.component.html',
   9   providers: [
  10     {
  11       provide: NG_VALUE_ACCESSOR,
  12       useExisting: forwardRef(() => PeertubeCheckboxComponent),
  13       multi: true
  14     }
  15   ]
  16 })
  17 export class PeertubeCheckboxComponent implements ControlValueAccessor, AfterContentInit {
  18   @Input() checked = false
  19   @Input() inputName: string
  20   @Input() labelText: string
  21   @Input() helpPlacement = 'top'
  22   @Input() disabled = false
  23
  24   @ContentChildren(PeerTubeTemplateDirective) templates: QueryList<PeerTubeTemplateDirective<'label' | 'help'>>
  25
  26   // FIXME: https://github.com/angular/angular/issues/10816#issuecomment-307567836
  27   @Input() onPushWorkaround = false
  28
  29   labelTemplate: TemplateRef<any>
  30   helpTemplate: TemplateRef<any>
  31
  32   constructor (private cdr: ChangeDetectorRef) { }
  33
  34   ngAfterContentInit () {
  35     {
  36       const t = this.templates.find(t => t.name === 'label')
  37       if (t) this.labelTemplate = t.template
  38     }
  39
  40     {
  41       const t = this.templates.find(t => t.name === 'help')
  42       if (t) this.helpTemplate = t.template
  43     }
  44   }
  45
  46   propagateChange = (_: any) => { /* empty */ }
  47
  48   writeValue (checked: boolean) {
  49     this.checked = checked
  50
  51     if (this.onPushWorkaround) {
  52       this.cdr.markForCheck()
  53     }
  54   }
  55
  56   registerOnChange (fn: (_: any) => void) {
  57     this.propagateChange = fn
  58   }
  59
  60   registerOnTouched () {
  61     // Unused
  62   }
  63
  64   onModelChange () {
  65     this.propagateChange(this.checked)
  66   }
  67
  68   setDisabledState (isDisabled: boolean) {
  69     this.disabled = isDisabled
  70   }
  71 }