Skip to content

Commit

Permalink
greatly improved UI
Browse files Browse the repository at this point in the history
  • Loading branch information
troylelandshields committed Jan 20, 2017
1 parent b8ec699 commit ee6e584
Show file tree
Hide file tree
Showing 4 changed files with 80 additions and 48 deletions.
8 changes: 4 additions & 4 deletions app/index.html
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<html ng-app="app" ng-controller="AppController">
<head>
<meta charset="utf-8"/>
<title>omgrpc</title>
<title>omgRPC</title>
<meta name="description" content=""/>
<meta property="og:description" content=""/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
Expand All @@ -28,9 +28,9 @@
<div class="col-md-3">
<div class="nav well" ng-controller="NavController as vm">
<div class="btn-group-vertical" role="group">
<button type="button" class="btn btn-primary" ui-sref="new">New Client</button>
<button type="button" class="btn btn-primary" ui-sref="new">New Protofile</button>
<div ng-repeat="proto in vm.protos">
<div ng-repeat="svc in proto.services">
<div class="padding-top-sm" ng-repeat="svc in proto.services">
<button type="button" class="btn btn-default" ui-sref="client({protoID:proto.id, serviceID: svc.id})">{{svc.name}}</button>
</div>
</div>
Expand All @@ -39,7 +39,7 @@
</div>
<div class="container">
<div class="page-header">
<h1>omgrpc</h1>
<h1>omgRPC</h1>
</div>

<div ui-view="guest">
Expand Down
1 change: 0 additions & 1 deletion app/scripts/client.controller.js
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,6 @@ function ClientController (GrpcSvc, $stateParams, $scope) {
};

vm.closeStream = function(stream) {
debugger;
stream.end();
vm.stream.isConnected = false;
}
Expand Down
18 changes: 18 additions & 0 deletions app/styles/app.css
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,24 @@ footer {
.menu a {
margin: 0 10px 0 0; }

.padding-top {
margin-top: 10px;
}

.padding-top-sm {
margin-top: 3px;
}

.panel-body {
padding: 35px;
}

.grpc-input {
height: 175px;
width: 100%;
resize: vertical;
}


pre {outline: 1px solid #ccc; padding: 5px; margin: 5px; }
.string { color: green; }
Expand Down
101 changes: 58 additions & 43 deletions app/views/client.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,64 +5,79 @@
</div>

<div>
<span ng-repeat="method in vm.client.methods">
<button type="button" class="btn btn-warning" ng-click="vm.setMethod(method)">{{method.name}}</button>
</span>
<ul class="nav nav-tabs">
<li ng-repeat="method in vm.client.methods" role="presentation" ng-class="vm.selectedMethod.name === method.name ? 'active' : vm.selectedMethod" ng-click="vm.setMethod(method)"><a>{{method.name}}</a></li>
</ul>

<div ng-show="vm.selectedMethod" class="well">
<div>
<h4>Metadata</h4>
<div class="col-md-12">
<!--key, value, minus button-->
<div class="row" ng-repeat="metadata in vm.metadataArgs">
<div class="col-md-4">
<input type="text" ng-model="metadata.key">
</input>
</div>
<div ng-show="vm.selectedMethod" class="panel panel-default">
<div class="panel-body">
<div class="row">
<div>
<h5>Metadata</h5>
<div class="row">
<div class="col-md-12">
<!--key, value, minus button-->
<div class="row padding-top" ng-repeat="metadata in vm.metadataArgs">
<input type="text" ng-model="metadata.key" placeholder="key">
</input>

<input type="text" ng-model="metadata.value" placeholder="value">
</input>

<div class="col-md-4">
<input type="text" ng-model="metadata.value">
</input>
<button type="button" class="btn btn-danger btn-xs" ng-click="vm.removeMetadata(metadata)"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
</div>
</div>
</div>

<div class="col-md-1">
<button ng-click="vm.removeMetadata(metadata)">Remove</button>
<div class="row padding-top-sm">
<div class="col-md-1">
</div>
<div>
<button type="button" class="btn btn-success btn-xs" ng-click="vm.addMetadata()"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add Metadata</button>
</div>
</div>
</div>
<div>
</div>

<div class="row">
<button ng-click="vm.addMetadata()">Add</button>
<div class="row padding-top-sm" ng-if="vm.selectedMethod.isStream">
<div ng-if="!vm.stream.isConnected">
<button type="button" class="btn btn-info" ng-click="vm.connectStream(vm.selectedMethod)">Connect</button>
</div>
</div>
</div>

<div class="row" ng-if="!vm.selectedMethod.isStream">
<div>
<button type="button" class="btn btn-info" ng-click="vm.execute(vm.selectedMethod, vm.argStr)">Send</button>
<div class="row" ng-if="!vm.selectedMethod.isStream || vm.stream.isConnected">
<h4>Input</h4>
<div class="col-md-12">
<textarea class="grpc-input" placeholder="argument (JSON)" ng-model="vm.argStr">
</textarea>
</div>
</div>
</div>

<div class="row" ng-if="vm.selectedMethod.isStream">
<div ng-if="!vm.stream.isConnected">
<button type="button" class="btn btn-info" ng-click="vm.connectStream(vm.selectedMethod)">Connect</button>
</div>
<div ng-if="vm.stream.isConnected">
<button type="button" class="btn btn-info" ng-click="vm.sendStream(vm.stream, vm.argStr)">Send Message</button>
</div>
<div ng-if="vm.stream.isConnected">
<button type="button" class="btn btn-info" ng-click="vm.closeStream(vm.stream)">Close</button>
<div class="row padding-top pull-right" ng-if="!vm.selectedMethod.isStream">
<div>
<button type="button" class="btn btn-primary" ng-click="vm.execute(vm.selectedMethod, vm.argStr)">Send</button>
</div>
</div>
</div>

<div class="row" ng-if="!vm.selectedMethod.isStream || vm.stream.isConnected">
<div class="col-md-4">
<textarea placeholder="argument (JSON)" ng-model="vm.argStr">
</textarea>
<div class="row padding-top pull-right" ng-if="vm.selectedMethod.isStream">
<div>
<div ng-if="vm.stream.isConnected">
<button type="button" class="btn btn-info" ng-click="vm.sendStream(vm.stream, vm.argStr)">Send Message</button>
</div>
<div ng-if="vm.stream.isConnected" class="padding-top-sm">
<button type="button" class="btn btn-warning" ng-click="vm.closeStream(vm.stream)">Close</button>
</div>
</div>
</div>

<div>
<div ng-if="vm.result != null">
<pre ng-bind-html="vm.result | prettify"></pre>
<div class="row" ng-if="!vm.selectedMethod.isStream || vm.stream.isConnected">
<div class="col-md-10">
<h4 ng-if="vm.result != null">Response</h4>
<div>
<div ng-if="vm.result != null">
<pre ng-bind-html="vm.result | prettify"></pre>
</div>
</div>
</div>
</div>
</div>
Expand Down

0 comments on commit ee6e584

Please sign in to comment.