webapp/src/app/config/config.component.html

   1 <div class="panel panel-default">
   2     <div class="panel-heading">
   3         <h2 class="panel-title" (click)="gConfigIsCollapsed = !gConfigIsCollapsed">
   4             Global Configuration
   5             <div class="pull-right">
   6                 <span class="fa fa-fw fa-exchange fa-size-x2" [style.color]="((agentStatus$ | async)?.WS_connected)?'green':'red'"></span>
   7
   8                 <button class="btn btn-link" (click)="gConfigIsCollapsed = !gConfigIsCollapsed; $event.stopPropagation()">
   9                     <span class="fa fa-big" [ngClass]="{'fa-angle-double-down': gConfigIsCollapsed, 'fa-angle-double-right': !gConfigIsCollapsed}"></span>
  10                 </button>
  11             </div>
  12         </h2>
  13     </div>
  14     <div class="panel-body" [collapse]="gConfigIsCollapsed && xdsServerConnected">
  15         <div class="row">
  16             <div class="col-xs-12">
  17                 <table class="table table-condensed">
  18                     <tbody>
  19                         <tr [ngClass]="{'info': xdsServerConnected, 'danger': !xdsServerConnected}">
  20                             <th><label>XDS Server URL</label></th>
  21                             <td> <input type="text" [(ngModel)]="xdsServerUrl"></td>
  22                             <td style="white-space: nowrap">
  23                                 <div class="btn-group">
  24                                     <button class="btn btn-link" (click)="xdsAgentRestartConn()"><span class="fa fa-refresh fa-size-x2"></span></button>
  25                                     <dl-xds-agent class="button"></dl-xds-agent>
  26                                 </div>
  27                             </td>
  28                         </tr>
  29                         <tr class="info">
  30                             <th><label>XDS Server connection retry</label></th>
  31                             <td> <input type="text" [(ngModel)]="xdsServerRetry" (ngModelChange)="showApplyBtn['retry'] = true"></td>
  32                             <td>
  33                                 <button *ngIf="showApplyBtn['retry']" class="btn btn-primary btn-xs" (click)="submitGlobConf('retry')">APPLY</button>
  34                             </td>
  35                         </tr>
  36                         <tr class="info">
  37                             <th><label>Local Projects root directory</label></th>
  38                             <td> <input type="text" [(ngModel)]="projectsRootDir" (ngModelChange)="showApplyBtn['rootDir'] = true"></td>
  39                             <td>
  40                                 <button *ngIf="showApplyBtn['rootDir']" class="btn btn-primary btn-xs" (click)="submitGlobConf('rootDir')">APPLY</button>
  41                             </td>
  42                         </tr>
  43                     </tbody>
  44                 </table>
  45             </div>
  46         </div>
  47     </div>
  48 </div>
  49
  50 <div class="panel panel-default">
  51     <div class="panel-heading">
  52         <h2 class="panel-title" (click)="sdksIsCollapsed = !sdksIsCollapsed">
  53             Cross SDKs
  54             <div class="pull-right">
  55                 <button class="btn btn-link" (click)="childSdkModal.show(); $event.stopPropagation()"><span class="fa fa-plus fa-size-x2"></span></button>
  56
  57                 <button class="btn btn-link" (click)="sdksIsCollapsed = !sdksIsCollapsed; $event.stopPropagation()">
  58                     <span class="fa fa-big" [ngClass]="{'fa-angle-double-down': sdksIsCollapsed, 'fa-angle-double-right': !sdksIsCollapsed}"></span>
  59                 </button>
  60             </div>
  61         </h2>
  62     </div>
  63     <div class="panel-body" [collapse]="sdksIsCollapsed">
  64         <div class="row col-xs-12">
  65             <sdks-list-accordion [sdks]="(sdks$ | async)"></sdks-list-accordion>
  66         </div>
  67     </div>
  68 </div>
  69
  70 <div class="panel panel-default">
  71     <div class="panel-heading">
  72         <h2 class="panel-title" (click)="projectsIsCollapsed = !projectsIsCollapsed; $event.stopPropagation()">
  73             Projects
  74             <div class="pull-right">
  75                 <button class="btn btn-link" (click)="childProjectModal.show(); $event.stopPropagation()"><span class="fa fa-plus fa-size-x2"></span></button>
  76
  77                 <button class="btn btn-link" (click)="projectsIsCollapsed = !projectsIsCollapsed; $event.stopPropagation()">
  78                        <span class="fa fa-big" [ngClass]="{'fa-angle-double-down': projectsIsCollapsed, 'fa-angle-double-right': !projectsIsCollapsed}"></span>
  79                 </button>
  80             </div>
  81         </h2>
  82     </div>
  83     <div class="panel-body" [collapse]="projectsIsCollapsed">
  84         <div class="row col-xs-12">
  85             <projects-list-accordion [projects]="(projects$ | async)"></projects-list-accordion>
  86         </div>
  87     </div>
  88 </div>
  89
  90 <!-- Modals -->
  91 <project-add-modal #childProjectModal [title]="'Add a new project'" [server-id]=curServerID>
  92 </project-add-modal>
  93 <sdk-add-modal  #childSdkModal [title]="'Add a new SDK'">
  94 </sdk-add-modal>
  95
  96 <!-- only for debug -->
  97 <div *ngIf="false" class="row">
  98     <pre>Config: {{config$ | async | json}}</pre>
  99     <br>
 100     <pre>Projects: {{projects$ | async | json}} </pre>
 101 </div>