aggregation-platform/plugins/kubernetes/html/apps.html

367 lines
16 KiB
HTML

<div ng-controller="Kubernetes.Apps">
<script type="text/ng-template" id="appIconTemplate.html">
<div class="ngCellText" title="{{row.entity.$info.description}}">
<a ng-href="row.entity.$appUrl">
<img ng-show="row.entity.$iconUrl" class="app-icon-small" ng-src="{{row.entity.$iconUrl}}">
</a>
<span class="app-name">
<a ng-click="row.entity.$select()">
{{row.entity.$info.name}}
</a>
</span>
</div>
</script>
<script type="text/ng-template" id="appServicesTemplate.html">
<div class="ngCellText">
<span ng-repeat="service in row.entity.services">
<a ng-href="{{service | kubernetesPageLink}}"
title="View service details">
<span>{{service.metadata.name ||service.name || service.id}}</span>
</a>
</span>
</div>
</script>
<script type="text/ng-template" id="appDeployedTemplate.html">
<div class="ngCellText" title="deployed at: {{row.entity.$creationDate | date:'yyyy-MMM-dd HH:mm:ss Z'}}">
{{row.entity.$creationDate.relative()}}
</div>
</script>
<script type="text/ng-template" id="appReplicationControllerTemplate.html">
<div class="ngCellText">
<span ng-repeat="controller in row.entity.replicationControllers">
<a ng-href="{{controller | kubernetesPageLink}}"
title="View controller details">
<span>{{controller.metadata.name || controller.id}}</span>
</a>
&nbsp;
<span class="pull-right">
<a class="badge badge-info" href="" ng-click="$emit('do-resize', controller)"
title="Resize the number of replicas of this controller">
{{controller.spec.replicas || 0}}</a>
</span>
</span>
</div>
</script>
<script type="text/ng-template" id="appPodCountsAndLinkTemplate.html">
<div class="ngCellText" title="Number of running pods for this controller">
<div ng-repeat="podCounters in row.entity.$podCounters track by $index">
<a ng-show="podCounters.podsLink" href="{{podCounters.podsLink}}" title="{{podCounters.labelText}}">
<span ng-show="podCounters.valid" class="badge badge-success">{{podCounters.valid}}</span>
<span ng-show="podCounters.waiting" class="badge">{{podCounters.waiting}}</span>
<span ng-show="podCounters.error" class="badge badge-warning">{{podCounters.error}}</span>
</a>
</div>
</div>
</script>
<script type="text/ng-template" id="appDetailTemplate.html">
<div class="service-view-rectangle" ng-repeat="view in item.$serviceViews">
<div class="service-view-header">
<span class="service-view-icon">
<a ng-href="{{view.service | kubernetesPageLink}}" title="View the service detail page">
<img ng-show="item.$iconUrl" ng-src="{{item.$iconUrl}}">
</a>
</span>
<span class="service-view-name" title="{{view.name}}">
<a ng-href="{{view.service | kubernetesPageLink}}" title="View the service detail page">
{{view.appName}}
</a>
</span>
<span class="service-view-address" title="The service address">
<a ng-show="view.service.$connectUrl" target="_blank" ng-href="{{view.service.$connectUrl}}" title="Connect to the service">
{{view.service.$host}}
</a>
<span ng-hide="view.service.$connectUrl">{{view.service.$host}}</span>
</span>
<span class="pull-right">
<a class="service-view-header-delete" href="" ng-click="deleteSingleApp(item)" title="Delete this app"><i
class="fa fa-remove red"></i></a>
</span>
</div>
<div class="service-view-detail-rectangle">
<div class="service-view-detail-header">
<div class="col-md-4">
<div class="service-view-detail-deployed" ng-show="view.createdDate"
title="deployed at: {{view.createdDate | date:'yyyy-MMM-dd HH:mm:ss Z'}}">
deployed:
<span class="value">{{view.createdDate.relative()}}</span>
</div>
<div class="service-view-detail-deployed" ng-hide="view.createdDate">
not deployed
</div>
</div>
<div class="col-md-4">
<div class="service-view-detail-pod-template" ng-show="view.controllerId">
pod template:
<span class="value" title="Go to the replication controller detail page"><a
ng-href="{{view.replicationController | kubernetesPageLink}}">{{view.controllerId}}</a></span>
</div>
<div class="service-view-detail-pod-template" ng-hide="view.controllerId">
no pod template
</div>
</div>
<div class="col-md-4 service-view-detail-pod-counts">
<span class="pull-right">
pods:
<a href="" ng-show="view.replicationController" class="badge badge-info"
ng-click="resizeDialog.open(view.replicationController)"
title="Resize the number of pods">
{{view.podCount}}
</a>
<span ng-hide="view.replicationController" class="badge badge-success">
{{view.podCount}}
</span>
</span>
</div>
</div>
<div class="service-view-detail-pod-box" ng-repeat="pod in item.pods track by $index">
<div ng-show="podExpanded(pod)" class="service-view-detail-pod-summary-expand">
<table>
<tr>
<td class="service-view-detail-pod-status">
<i ng-class="pod.statusClass"></i>
</td>
<td class="service-view-detail-pod-connect" ng-show="pod.$jolokiaUrl"
ng-controller="Kubernetes.ConnectController">
<a class="clickable"
ng-click="doConnect(pod)"
title="Open a new window and connect to this container">
<i class="fa fa-sign-in"></i>
</a>
</td>
<td>
<div class="service-view-detail-pod-id" title="{{pod.id}}">
<span class="value">Pod <a title="Go to the pod detail page" ng-href="{{pod | kubernetesPageLink}}">{{pod.idAbbrev}}</a></span>
</div>
<div class="service-view-detail-pod-ip">
IP:
<span class="value">{{pod.status.podIP}}</span>
</div>
</td>
<td>
<div class="service-view-detail-pod-ports">
ports: <span class="value">{{pod.$containerPorts.join(", ")}}</span>
</div>
<div class="service-view-detail-pod-minion">
minion:
<span class="value">
<a ng-show="pod.$host" ng-href="{{baseUri}}/kubernetes/hosts/{{pod.$host}}">{{pod.$host}}</a>
</span>
</div>
</td>
<td class="service-view-detail-pod-expand" ng-click="collapsePod(pod)">
<i class="fa fa-chevron-left"></i>
</td>
</tr>
</table>
<!--
<div class="service-view-detail-pod-status">
status:
<span class="value">{{pod.status}}</span>
</div>
-->
</div>
<div ng-hide="podExpanded(pod)" class="service-view-detail-pod-summary">
<table>
<tr>
<td class="service-view-detail-pod-status">
<i ng-class="pod.statusClass"></i>
</td>
<td class="service-view-detail-pod-connect" ng-show="pod.$jolokiaUrl"
ng-controller="Kubernetes.ConnectController">
<a class="clickable"
ng-click="doConnect(pod)"
title="Open a new window and connect to this container">
<i class="fa fa-sign-in"></i>
</a>
</td>
<td>
<div class="service-view-detail-pod-id" title="{{pod.id}}">
<span class="value">Pod <a title="Go to the pod detail page" ng-href="{{pod | kubernetesPageLink}}">{{pod.idAbbrev}}</a></span>
</div>
<div class="service-view-detail-pod-ip">
IP:
<span class="value">{{pod.status.podIP}}</span>
</div>
</td>
<td class="service-view-detail-pod-expand" ng-click="expandPod(pod)">
<i class="fa fa-chevron-right"></i>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</script>
<div ng-hide="appSelectorShow">
<div class="row filter-header">
<div class="col-md-12">
<span ng-include="'namespaceSelector.html'"></span>
<span ng-show="model.apps.length && !id">
<hawtio-filter ng-model="tableConfig.filterOptions.filterText"
css-class="input-xxlarge"
placeholder="Filter apps..."></hawtio-filter>
</span>
<span ng-hide="id" class="pull-right">
<div class="btn-group">
<a class="btn" ng-disabled="mode == 'list'" href="" ng-click="mode = 'list'">
<i class="fa fa-list"></i></a>
<a class="btn" ng-disabled="mode == 'detail'" href="" ng-click="mode = 'detail'">
<i class="fa fa-table"></i></a>
</div>
</span>
<span class="pull-right">&nbsp;</span>
<button ng-show="model.apps.length && mode == 'list'"
class="btn btn-danger pull-right"
ng-disabled="!id && tableConfig.selectedItems.length == 0"
ng-click="deletePrompt(id || tableConfig.selectedItems)">
<i class="fa fa-remove"></i> Delete
</button>
<span class="pull-right">&nbsp;</span>
<!--
<button ng-show="model.showRunButton"
class="btn btn-success pull-right"
ng-click="appSelectorShow = true"
title="Run an application">
<i class="fa fa-play-circle"></i> Run ...
</button>
-->
<span class="pull-right">&nbsp;</span>
<span ng-include="'runButton.html'"></span>
<span class="pull-right">&nbsp;</span>
<button ng-show="id"
class="btn btn-primary pull-right"
ng-click="id = undefined"><i class="fa fa-list"></i></button>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div ng-hide="model.fetched">
<div class="align-center">
<i class="fa fa-spinner fa-spin"></i>
</div>
</div>
<div ng-show="model.fetched && !id">
<div ng-hide="model.apps.length" class="align-center">
<p class="alert alert-info">There are no apps currently available.</p>
</div>
<div ng-show="model.apps.length">
<div ng-show="mode == 'list'">
<table class="table table-condensed table-striped" hawtio-simple-table="tableConfig"></table>
</div>
<div ng-show="mode == 'detail'">
<div class="app-detail" ng-repeat="item in model.apps | filter:tableConfig.filterOptions.filterText | orderBy:'$name' track by $index">
<ng-include src="'appDetailTemplate.html'"/>
</div>
</div>
</div>
</div>
<div ng-show="model.fetched && id">
<div class="app-detail">
<ng-include src="'appDetailTemplate.html'"/>
</div>
</div>
</div>
</div>
</div>
<div ng-show="appSelectorShow">
<div class="col-md-7">
<div class="row">
<hawtio-filter ng-model="appSelector.filterText"
css-class="input-xxlarge"
placeholder="Filter apps..."></hawtio-filter>
</div>
<div class="row">
<ul>
<li class="no-list profile-selector-folder" ng-repeat="folder in model.appFolders"
ng-show="appSelector.showFolder(folder)">
<div class="expandable" ng-class="appSelector.isOpen(folder)">
<div title="{{folder.path}}" class="title">
<i class="expandable-indicator folder"></i> <span class="folder-title" ng-show="folder.path">{{folder.path.capitalize(true)}}</span><span
class="folder-title" ng-hide="folder.path">Uncategorized</span>
</div>
<div class="expandable-body">
<ul>
<li class="no-list profile" ng-repeat="profile in folder.apps" ng-show="appSelector.showApp(profile)">
<div class="profile-selector-item">
<div class="inline-block profile-selector-checkbox">
<input type="checkbox" ng-model="profile.selected"
ng-change="appSelector.updateSelected()">
</div>
<div class="inline-block profile-selector-name" ng-class="appSelector.getSelectedClass(profile)">
<span class="contained c-max">
<a href="" ng-click="appSelector.select(profile, !profile.selected)"
title="Details for {{profile.id}}">
<img ng-show="profile.$iconUrl" class="icon-small-app" ng-src="{{profile.$iconUrl}}">
<span class="app-name">{{profile.name}}</span>
</a>
</span>
</div>
</div>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="col-md-5">
<div class="row">
<button class="btn btn-primary pull-right"
ng-click="appSelectorShow = undefined"><i class="fa fa-circle-arrow-left"></i> Back
</button>
<span class="pull-right">&nbsp;</span>
<button class="btn pull-right"
ng-disabled="!appSelector.selectedApps.length"
title="Clears the selected Apps"
ng-click="appSelector.clearSelected()"><i class="fa fa-check-empty"></i> Clear
</button>
<span class="pull-right">&nbsp;</span>
<button class="btn btn-success pull-right"
ng-disabled="!appSelector.selectedApps.length"
ng-click="appSelector.runSelectedApps()"
title="Run the selected apps">
<i class="fa fa-play-circle"></i>
<ng-pluralize count="appSelector.selectedApps.length"
when="{'0': 'No App Selected',
'1': 'Run App',
'other': 'Run {} Apps'}"></ng-pluralize>
</button>
</div>
<div class="row">
<!--
<div ng-hide="appSelector.selectedApps.length">
<p class="alert pull-right">
Please select an App
</p>
</div>
-->
<div ng-show="appSelector.selectedApps.length">
<ul class="zebra-list pull-right">
<li ng-repeat="app in appSelector.selectedApps">
<img ng-show="app.$iconUrl" class="icon-selected-app" ng-src="{{app.$iconUrl}}">
<strong class="green selected-app-name">{{app.name}}</strong>
&nbsp;
<i class="red clickable fa fa-remove"
title="Remove appp"
ng-click="appSelector.select(app, false)"></i>
</li>
</ul>
</div>
</div>
</div>
</div>
<ng-include src="'resizeDialog.html'"/>
</div>