github.com/fanux/shipyard@v0.0.0-20161009071005-6515ce223235/controller/static/app/containers/inspect.html (about)

     1  <div class="ui small destroy modal transition">
     2  <i class="close icon"></i>
     3  <div class="header">
     4      Destroy Container: {{ vm.selectedContainerId | limitTo:12 }}
     5  </div>
     6  <div class="content">
     7      <p>Are you sure you want to destroy this container?</p>
     8  </div>
     9  <div class="actions">
    10      <div class="ui negative button">
    11          No
    12      </div>
    13      <div ng-click="vm.destroyContainer()" class="ui positive right labeled icon button">
    14          Yes
    15          <i class="checkmark icon"></i>
    16      </div>
    17  </div>
    18  </div>
    19  
    20  <div class="ui small restart modal transition" style="margin-top: -98px;">
    21      <i class="close icon"></i>
    22      <div class="header">
    23          Restart Container: {{ vm.selectedContainerId | limitTo:12 }}
    24      </div>
    25      <div class="content">
    26          <p>Are you sure you want to restart this container?</p>
    27      </div>
    28      <div class="actions">
    29          <div class="ui negative button">
    30              No
    31          </div>
    32          <div ng-click="vm.restartContainer()" class="ui positive right labeled icon button">
    33              Yes
    34              <i class="checkmark icon"></i>
    35          </div>
    36      </div>
    37  </div>
    38  
    39  <div class="ui small stop modal transition" style="margin-top: -98px;">
    40      <i class="close icon"></i>
    41      <div class="header">
    42          Stop Container: {{ vm.selectedContainerId | limitTo:12 }}
    43      </div>
    44      <div class="content">
    45          <p>Are you sure you want to stop this container?</p>
    46      </div>
    47      <div class="actions">
    48          <div class="ui negative button">
    49              No
    50          </div>
    51          <div ng-click="vm.stopContainer()" class="ui positive right labeled icon button">
    52              Yes
    53              <i class="checkmark icon"></i>
    54          </div>
    55      </div>
    56  </div>
    57  
    58  <div class="ui small pause modal transition" style="margin-top: -98px;">
    59      <i class="close icon"></i>
    60      <div class="header">
    61          Pause Container: {{ vm.selectedContainerId | limitTo:12 }}
    62      </div>
    63      <div class="content">
    64          <p>Are you sure you want to pause this container?</p>
    65      </div>
    66      <div class="actions">
    67          <div class="ui negative button">
    68              No
    69          </div>
    70          <div ng-click="vm.pauseContainer()" class="ui positive right labeled icon button">
    71              Yes
    72              <i class="checkmark icon"></i>
    73          </div>
    74      </div>
    75  </div>
    76  
    77  <div class="ui padded grid">
    78      <div class="row">
    79          <div class="column">
    80              <div class="ui segment page" ng-class="{'yellow': (vm.container.State.Running && vm.container.State.Paused), 'green': (vm.container.State.Running && !vm.container.State.Paused), 'red': !vm.container.State.Running}">
    81                  <div class= "ui grid">
    82                      <div class="two column row">
    83                          <div class="column">
    84                              <h3 class="ui header">
    85                                  <div class="content">
    86                                      <i class="ui circle icon" ng-class="{'yellow': (vm.container.State.Running && vm.container.State.Paused), 'green': (vm.container.State.Running && !vm.container.State.Paused), 'red': !vm.container.State.Running}"></i>
    87                                      {{ vm.container.Name.split("/")[1] }}
    88                                      <div class="sub header">{{ vm.container.Config.Image }}</div>
    89                                  </div>
    90                              </h3>
    91                          </div>
    92                          <div class="floated right aligned right column">
    93                              <h3 class="ui header">
    94                                  <div class="content">
    95                                      <div class="header" ng-show="vm.container.State.Running">Started {{ vm.container.State.StartedAt | fromCalendar }}</div>
    96                                      <div class="header" ng-hide="vm.container.State.Running">Finished {{ vm.container.State.FinishedAt | fromCalendar }}</div>
    97                                  </div>
    98                              </h3>
    99                          </div>
   100                      </div>
   101  
   102                      <div class="row">
   103                          <div class="column">
   104                              <div ng-click="vm.showPauseContainerDialog()" class="ui yellow small labeled icon button" ng-show="vm.container.State.Running && !vm.container.State.Paused">
   105                                  <i class="pause icon"></i> Pause 
   106                              </div>
   107                              <div ng-click="vm.unpauseContainer(vm.container)" class="ui green small labeled icon button" ng-show="vm.container.State.Paused">
   108                                  <i class="play icon"></i> Unpause 
   109                              </div>
   110                              <div ng-click="vm.showStopContainerDialog()" class="ui small labeled icon button">
   111                                  <i class="stop icon"></i> Stop 
   112                              </div>
   113                              <div ng-click="vm.showRestartContainerDialog()" class="ui small green labeled icon button">
   114                                  <i class="refresh icon"></i> Restart 
   115                              </div>
   116                              <div ng-click="vm.showDestroyContainerDialog()" class="ui small red labeled icon button">
   117                                  <i class="delete icon"></i> Destroy 
   118                              </div>
   119                              <div ui-sref="dashboard.stats({id: vm.container.Id})" class="ui small orange labeled icon button">
   120                                  <i class="bar chart icon"></i> Stats
   121                              </div>
   122                              <div ui-sref="dashboard.logs({id: vm.container.Id})" class="ui small purple labeled icon button">
   123                                  <i class="file icon"></i> Logs 
   124                              </div>
   125                              <div ui-sref="dashboard.exec({id: vm.container.Id})" class="ui small labeled icon button">
   126                                  <i class="terminal icon"></i> Console
   127                              </div>
   128                          </div>
   129                      </div>
   130                      <div class="three column row">
   131                          <div class="column">
   132                              <h4 class="ui dividing header">Container Configuration</h4>
   133                              <div class="ui two column grid">
   134                                  <div class="column">
   135                                      <div class="content">
   136                                          <span class="header"><b>Container ID</b></span>
   137                                          <div class="description">{{ vm.container.Id | limitTo:12 }}</div>
   138                                      </div>
   139                                  </div>
   140                                  <div class="column">
   141                                      <div class="content">
   142                                          <span class="header"><b>Command</b></span>
   143                                          <pre class="logs">{{ vm.container.Config.Cmd.join(" ") }}</pre>
   144                                      </div>
   145                                  </div>
   146                                  <div class="column">
   147                                      <div class="content">
   148                                          <span class="header"><b>Hostname</b></span>
   149                                          <div class="description">{{ vm.container.Config.Hostname }}</div>
   150                                      </div>
   151                                  </div>
   152                                  <div class="column">
   153                                      <div class="content">
   154                                          <span class="header"><b>Domain Name</b></span>
   155                                          <div class="description">{{ vm.container.Config.Domainname || "N/A" }}</div>
   156                                      </div>
   157                                  </div>
   158                              </div>
   159                              <h4 class="ui dividing header">Port Configuration</h4>
   160                              <div class="ui divided list" ng-show="vm.container.NetworkSettings.Ports"> 
   161                                  <div class="item" ng-repeat="(k, values) in vm.container.NetworkSettings.Ports">
   162                                      <div ng-show="values.length === 0 || values == null"><div class="ui horizontal label">Internal</div> {{ k }}</div>
   163                                      <div class="content" ng-repeat="v in values">
   164                                          <div><div class="ui blue horizontal label">Exposed</div> {{ v.HostIp }}:{{ v.HostPort }} &#8594; {{ k }}</div>
   165                                      </div>
   166                                  </div>
   167                              </div>
   168                          </div>
   169                          <div class="column">
   170                              <h4 class="ui dividing header">Swarm Node</h4>
   171                              <div class="ui two column grid">
   172                                  <div class="column">
   173                                      <div class="ui compact">
   174                                          <span class="header"><b>Name</b></span>
   175                                          <div class="description">{{ vm.container.Node.Name }}</div>
   176                                      </div>
   177                                  </div>
   178                                  <div class="column">
   179                                      <div class="ui compact">
   180                                          <span class="header"><b>Host</b></span>
   181                                          <div class="description">{{ vm.container.Node.Addr }}</div>
   182                                      </div>
   183                                  </div>
   184                                  <div class="column">
   185                                      <div class="ui compact">
   186                                          <span class="header"><b>CPUs</b></span>
   187                                          <div class="description">{{ vm.container.Node.Cpus || "&infin;" }}</div>
   188                                      </div>
   189                                  </div>
   190                                  <div class="column">
   191                                      <div class="ui compact">
   192                                          <span class="header"><b>Memory</b></span>
   193                                          <div class="description">{{ (vm.container.Node.Memory / 1024 / 1024 | number:0) || "&infin;" }} MB</div>
   194                                      </div>
   195                                  </div>
   196                              </div>
   197                              <h4 class="ui dividing header" ng-show="vm.container.HostConfig.Dns">User Defined Container DNS</h4>
   198                              <div class="ui divided list" ng-show="vm.container.HostConfig.Dns">
   199                                  <div class="item">
   200                                          <pre ng-repeat="d in vm.container.HostConfig.Dns">{{ d }}</pre>
   201                                  </div>
   202                              </div>
   203                          </div>
   204                          <div class="column">
   205                              <h4 class="ui dividing header">Environment</h4>
   206                              <div ng-show="vm.container.Config.Env.length === 0">
   207                                  <div>No environment variables configured</div>
   208                              </div>
   209                              <div class="item" ng-repeat="e in vm.container.Config.Env">
   210                                  <pre class="logs">{{ e }}</pre>
   211                              </div>
   212                          </div>
   213                      </div>
   214                      <div class="row" ng-show="vm.links.length>0">
   215                          <div class="column">
   216                              <h4 class="ui dividing header">Container Links</h4>
   217                              <table class="ui sortable celled table">
   218                                  <thead>
   219                                      <tr>
   220                                          <th>Container Name</th>
   221                                          <th>Link Name</th>
   222                                      </tr>
   223                                  </thead>
   224                                  <tbody>
   225                                      <tr ng-repeat="v in vm.links">
   226                                          <td>{{v.container}}</td>
   227                                          <td>{{v.link}}</td>
   228                                      </tr>
   229                              </table>
   230                          </div>
   231                      </div>
   232                      <div class="row" ng-hide="vm.isEmptyObject(vm.container.Volumes)">
   233                          <div class="column">
   234                              <h4 class="ui dividing header">Volume</h4>
   235                              <table class="ui sortable celled table">
   236                                  <thead>
   237                                      <tr>
   238                                          <th>Volume</th>
   239                                          <th>Host Path</th>
   240                                      </tr>
   241                                  </thead>
   242                                  <tbody>
   243                                      <tr ng-repeat="(k, v) in vm.container.Volumes">
   244                                          <td>{{k}}</td>
   245                                          <td>{{v}}</td>
   246                                      </tr>
   247                                  </tbody>
   248                              </table>
   249                          </div>
   250                      </div>
   251                      <div class="row" ng-show="vm.top">
   252                          <div class="column">
   253                              <h4 class="ui dividing header">Processes</h4>
   254                              <table id="toptable" class="ui sortable celled table">
   255                                  <thead>
   256                                      <tr>
   257                                          <th ng-repeat="t in vm.top.Titles">{{ t }}</th>
   258                                      </tr>
   259                                  </thead>
   260                                  <tbody>
   261                                      <tr ng-repeat="r in vm.top.Processes">
   262                                          <td ng-repeat="c in r">
   263                                              {{ c }}
   264                                              <script>
   265  $('.ui.sortable.celled.table').tablesort();
   266                                              </script>
   267                                          </td>
   268                                      </tr>
   269                              </table>
   270                          </div>
   271                      </div>
   272                  </div>
   273              </div>
   274          </div>
   275      </div>
   276  </div>