Skip to content

Instantly share code, notes, and snippets.

@darrenjrobinson

darrenjrobinson/console.html

Created January 16, 2017 02:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save darrenjrobinson/aa6ac7a431650f7a99b5da36fb5939bc to your computer and use it in GitHub Desktop.
Save darrenjrobinson/aa6ac7a431650f7a99b5da36fb5939bc to your computer and use it in GitHub Desktop.
Download ZIP
PowerShell-UI-HTML
Raw
console.html
<!doctype html>
<html ng-app="consoleApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular-resource.min.js"></script>
<script src="javascripts/ui-bootstrap-tpls-2.4.0.min.js"></script>
<script src="javascripts/console.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<style type="text/css">
.nav, .uib-pagination, .uib-carousel, .panel-title a { cursor: pointer; }
body {
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
background-color: #a2a2a2;
}
td, th {
border: 1px solid #999;
padding: 0.5rem;
text-align:left;
}
table {
border-spacing: 0.5rem;
border-collapse: collapse;
}
.commandBlock {
border: 2px solid;
border-radius: 25px;
padding-left: 2em;
padding-top: 1em;
padding-right: 2em;
padding-bottom: 1em;
float: left;
clear: both;
}
.cmdTitle {
padding-top: 0.2em;
padding-bottom: 0.2em;
color: #85794D;
font-size: 16px;
font-weight: bold;
}
.cmdCommand {
padding-top: 0.2em;
padding-bottom: 0.5em;
font-size: 14px;
font-style: italic;
}
.cmdReturn {
padding-top: 0.2em;
padding-bottom: 0.5em;
font-size: 14px;
font-style: normal;
}
#topBar {
background-color: #01b9f0;
width: 100%;
color: #FFFFFF;
height: 40px;
line-height: 40px;
text-align: left;
}
#title {
font-size: 25px;
font-weight: bold;
font-style: normal;
padding-left: 0.5em;
display: inline-block;
vertical-align: middle;
line-height: normal;
}
#cmdSelectorPanel {
float:left;
clear:left;
background-color: #90e6ff;
border: 1px solid;
display: inline-block;
padding-top: 0.5em;
padding-left: 0.5em;
padding-right: 0.5em;
padding-bottom: 0.5em;
}
#activeCmdPanel {
float:left;
clear:left;
border: 1px solid;
display: inline-block;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-top: 0.5em;
padding-left: 0.5em;
padding-right: 0.5em;
padding-bottom: 0.5em;
}
#logodiv{
float:left;
/* height:45px; */
}
#logodiv img{
max-height:50%;
}
.commandPanel {
display: inline-block;
width: 700px;
font-weight: bold;
background-color: #90e6ff;
}
.commandInfoPanel {
display: inline-block;
width: 700px;
font-weight: bold;
font-
margin-top: 0.5em;
margin-bottom: 0.5em;
background-color: #90e6ff;
}
.resultInfoPanel {
display: inline-block;
width: 700px;
font-weight: bold;
font-
margin-top: 0.5em;
margin-bottom: 0.5em;
background-color: #90e6ff;
}
#panelLeft {
margin-top: 0.5em;
margin-bottom: 0.5em;
float:left;
}
#panelRight {
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: 1em;
float:left;
}
</style>
</head>
<body>
<div ng-controller="ConsoleController" ng-init="getCommandConfigs()">
<div id="topBar">
<span id="title">Microsoft Identity Manager Admin Toolbox</span>
<div id="logodiv">
<img src="kloud.png" />
</div>
</div>
<div id="panelLeft">
<uib-accordion close-others="oneAtATime" class="commandPanel">
<div uib-accordion-group heading="COMMAND SELECTOR" is-open="true">
<div id="cmdSelectorPanel">
<strong>Action: </strong>
<select ng-change="onCommandSelected()"
ng-model="selectedCommand"
ng-options="cmd.commandName for cmd in commandConfigs track by cmd.commandName">
<option value="">Select a Command
</select>
</div>
<div id="activeCmdPanel" ng-show="!isEmpty(selectedCommand)">
<div ng-repeat="commandConfig in commandConfigs">
<form ng-show="selectedCommand.commandName == commandConfig.commandName"
name="{{command.commandName}}">
<div class="cmdTitle">{{commandConfig.commandName}}</div>
<div class="cmdCommand">{{commandConfig.command}}</div>
<div class="cmdReturns">Returns: {{commandConfig.return}}</div>
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>argument</th>
<th>value</th>
<th>options</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="(argument,options) in commandConfig.arguments">
<td>{{argument}}</td>
<td>
<input ng-if="(options.valued == false ? false : true)"
type="text" ng-model="commandForms[commandConfig.commandName][argument]"
size="35"/>
<span ng-if="(options.valued == false)">is flag argument</span>
</td>
<td>
<span ng-if="isEmpty(options)">none</span>
<span ng-if="!isEmpty(options)">{{options}}</span>
</td>
</tr>
</tbody>
</table>
<input type="button" class="btn btn-info btn-sm" value="generate command sample below" ng-click="generate(commandConfig.commandName)"/>
<input type="button" class="btn btn-info btn-sm" value="execute this command!" ng-click="execute(commandConfig.commandName)"/>
<p/>
</form>
</div>
</div>
</div>
<div uib-accordion-group heading="GENERATED COMMAND" is-open="true" class="commandInfo">
<pre>{{generateInfo.command | json}}</pre>
</div>
</uib-accordion>
</div>
<div id="panelRight">
<uib-accordion close-others="oneAtATime" class="resultInfoPanel">
<div uib-accordion-group heading="EXECUTION INFO" is-open="true" class="commandInfo">
<table class="table table-striped table-bordered">
<thead>
<tr>
<th>Command Name</th>
<th>Started</th>
<th>Finished</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{executeInfo.commandName}}</td>
<td>{{executeInfo.startedAt | date:'yyyy-MM-dd HH:mm:ss Z'}}</td>
<td>{{executeInfo.finishedAt | date:'yyyy-MM-dd HH:mm:ss Z'}}</td>
</tr>
</tbody>
</table>
</div>
<div uib-accordion-group heading="ARGUMENT INFO" is-open="false" class="commandInfo">
<pre>{{executeInfo.arguments | json}}</pre>
</div>
<div uib-accordion-group heading="COMMAND CmdResult OBJECT" is-open="false" class="commandInfo">
<pre>{{executeInfo.cmdResult | json}}</pre>
</div>
<div uib-accordion-group heading="STDOUT JSON RESULT OBJECT" is-open="false" class="commandInfo">
<pre>{{executeInfo.cmdResult.resultObject | json}}</pre>
</div>
<div uib-accordion-group heading="COMMAND SERVICE INFO" is-open="false" class="commandInfo">
<input type="button" class="btn btn-info btn-sm" value="get latest command-service status" ng-click="getCommandServiceStatus()"/>
<pre>{{commandService.status | json}}</pre>
</div>
</uib-accordion>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment