epiquery2
Version:
run templated queries from the http's using learnings from 1
78 lines (73 loc) • 2.73 kB
HTML
<meta charset="UTF-8">
<html lang="en" ng-app='theApp'>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title></title>
<script src="/static/js/epiclient_v3.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.js"></script>
<link rel="stylesheet" href="app.css"></link>
<style>
#queryOutput {
overflow: scroll;
}
</style>
<script type="text/javascript">
var EpiBufferingClient = require('epi-client').EpiBufferingClient;
function show(message){
console.log(message);
var container = document.createElement('p');
if (typeof(message) === 'object'){
message = JSON.stringify(message);
}
container.innerHTML = message;
output = document.getElementById('queryOutput');
output.appendChild(container);
}
var client = new EpiBufferingClient("ws://localhost:8080/sockjs/websocket?API_KEY=1", "ws://localhost:8081/sockjs/websocket?API_KEY=1", "sqlreplica", "glglive_r");
client.on('row', function(r) { show(r); });
client.on('close', show);
client.on('beginquery', show);
client.on('endquery', show);
client.on('data', show);
client.on('beginrowset', show);
angular.module('theApp', []).controller(
'QueryController',
function($http, $scope){
$http({method:'GET', url:'/diagnostic'}).
success(function(data, status, headers, config){
diagInfo = data;
$scope.connectionNames = data.connections;
$scope.connections = data.connections;
$scope.connection = "sqlreplica";
}).
error(function(data, status, headers, config){
show("there was an error connection to diagnostic, " + data);
});
$scope.template = "replica_test.mustache";
$scope.data = "{}";
$scope.runQuery = function(){
document.getElementById('queryOutput').innerHTML = "";
client.query($scope.connection, $scope.template, $scope.data);
};
});
</script>
</head>
<body>
<div id="connections" ng-controller="QueryController">
<form class="simple-form">
<label for="connection">Connection</label>
<select ng-model="connection" ng-options="connection for connection in connections">
<option value="">Available Connections</option>
</select>
<p>
<label for="template">Template</label><input id="template" type="text" ng-model="template"/>
<p>
<label for="data">Data</label><TextArea id="data" ng-model="data"></TextArea>
<button ng-click="runQuery()">Run Query</button>
</form>
</div>
<div id="queryOutput">
</div>
</body>
</html>