gerrit.onap Code Review - usecase-ui.git/blob

   1 <nz-spin nzTip='Loading...' [nzSpinning]="isSpinning">
   2   <nz-modal [(nzVisible)]="showModel" nzTitle="Communication Service Message" (nzOnCancel)="handleCancel()"
   3     (nzOnOk)="handleOk()" nzWidth="450px" nzHeight="600px">
   4     <div class="subnet_params_container">
   5       <nz-radio-group [(ngModel)]="radioValue">
   6         <label nz-radio nzValue="text">Text Input</label>
   7         <label nz-radio nzValue="audio">Audio Input</label>
   8       </nz-radio-group>
   9       <form nz-form *ngIf='radioValue === "text"' class='text-form-class'>
  10         <nz-form-item>
  11           <nz-form-control [nzSpan]="24">
  12             <textarea [id]="communicationMessage" nz-tooltip
  13               [ngClass]="{'error-input-border':validateRulesShow[0] === true}" nz-input
  14               placeholder="Please input communicationMessage" [nzAutosize]="{ minRows: 6, maxRows: 6 }"
  15               [(ngModel)]="communicationMessage" name="communicationMessage"
  16               (blur)="this.Util.validator('communicationMessage','communicationMessage',communicationMessage,0,rulesText,validateRulesShow)">
  17             </textarea>
  18             <nz-form-explain *ngIf="validateRulesShow[0]" class="validateRules">{{rulesText[0]}}
  19             </nz-form-explain>
  20           </nz-form-control>
  21         </nz-form-item>
  22       </form>
  23       <div *ngIf='radioValue === "audio"' class="audio_class">
  24         <div class="recode_class">
  25           <span>Sound Recording: </span>
  26           <i *ngIf='!isPlay' class="anticon anticon-play-circle-o audioBtn" (click)="startAudio()"></i>
  27           <i *ngIf='isPlay' class="anticon anticon-pause-circle-o audioBtn" (click)="stopAudio()"></i>
  28
  29         </div>
  30         <div class="play_class">
  31           <span>Audition: </span>
  32           <button (click)="playAudio()">Click To Play</button>
  33           <audio class="audio-node" id="audio_id" autoplay></audio>
  34         </div>
  35       </div>
  36     </div>
  37   </nz-modal>
  38 </nz-spin>