Added a couple of useful services to rconservice

This commit is contained in:
Garry Newman
2016-02-29 13:03:23 +00:00
parent a5a5e107fe
commit 1387e4cb3f
13 changed files with 400 additions and 273 deletions
+12 -13
View File
@@ -1,22 +1,21 @@
<div ng-controller="ConsoleController" flex layout="column" id="ConsoleController">
<md-content flex id="vertical-container" class="Output"><div ng-repeat="line in Output" ng-class="line.Class">{{line.Message}}</div></md-content>
<form ng-submit="SubmitCommand()" class="md-inline-form">
<md-toolbar class="Input">
<div class="md-toolbar-tools">
<form ng-submit="SubmitCommand()" class="md-inline-form">
<md-toolbar class="Input">
<div class="md-toolbar-tools">
<span flex>
<input ng-model="Command" style="width: 100%">
</span>
<span flex>
<input ng-model="Command" style="width: 100%">
</span>
<md-button class="md-icon-button" aria-label="Settings" ng-click="SubmitCommand()">
<md-icon md-menu-origin md-svg-icon="image/arrow-right-bold-hexagon-outline.svg"></md-icon>
</md-button>
<md-button class="md-icon-button" aria-label="Settings" ng-click="SubmitCommand()">
<md-icon md-menu-origin md-svg-icon="image/arrow-right-bold-hexagon-outline.svg"></md-icon>
</md-button>
</div>
</md-toolbar>
</form>
</div>
</md-toolbar>
</form>
</div>
+9
View File
@@ -0,0 +1,9 @@
<div ng-controller="PlayerInfoController" flex layout="column" id="PlayerInfoController">
Info about player {{userid}}
<p>View <a href="#/player/{{userid}}/xp">XP info for this player</a></p>
Show info about this player here
</div>
+6
View File
@@ -0,0 +1,6 @@
<div ng-controller="PlayerXpController" flex layout="column" id="PlayerXpController">
Show info about this player xp here
</div>
+2 -3
View File
@@ -1,5 +1,4 @@
<div ng-controller="PlayersController" flex layout="column" id="PlayersController">
<div ng-controller="PlayerListController" flex layout="column" id="PlayerListController">
<md-content flex id="vertical-container">
<md-list>
@@ -7,7 +6,7 @@
<md-list-item class="md-3-line" layout="row" style="min-height: auto;">
<div flex layout="row">
<div flex class="md-list-item-text">
<h3>{{line.DisplayName}}</h3>
<h3><a href="/#/player/{{line.SteamID}}/">{{line.DisplayName}}</a></h3>
</div>
</div>
+12 -9
View File
@@ -1,4 +1,4 @@
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en" ng-app="RconApp">
<head>
<meta charset="utf-8">
@@ -16,12 +16,11 @@
<div ng-include="'html/connect.html'" ng-show="!Connected" flex layout="row">
</div>
<md-sidenav md-component-id="left" md-is-locked-open="$mdMedia('gt-sm')" class="md-whiteframe-z2" ng-show="Connected">
<md-sidenav md-component-id="left" md-is-locked-open="$mdMedia('gt-sm')" class="md-whiteframe-6dp menu" ng-show="Connected">
<md-list>
<md-list-item ng-repeat="p in pages">
<md-button href="#/console/" flex ng-click="SwitchPage( p )" ng-class="{'selected' : CurrentPage.Name == p.Name }">
<md-list-item ng-repeat="p in pages | filter: { Nav: '' } ">
<md-button href="#{{p.originalPath}}" class="menu_button" ng-class="{'selected' : $route.current.Title == p.Title }">
{{p.Title}}
</md-button>
</md-list-item>
@@ -36,13 +35,12 @@
<md-button class="md-icon-button hide-gt-sm" aria-label="Settings" ng-click="OpenLeftMenu()">
<md-icon md-menu-origin md-svg-icon="image/menu.svg"></md-icon>
</md-button>
<div layout-row flex><h3 class="md-toolbar-item md-breadcrumb md-headline">Connected Server Name</h3></div>
<div layout-row flex><h3 class="md-toolbar-item md-breadcrumb md-headline">{{$route.current.Title}}</h3></div>
</div>
</md-toolbar>
<div flex layout="column">
<md-content flex class="Content AppBackground" ng-include="p.Page" layout="column" ng-repeat="p in pages" ng-show="p == CurrentPage">
<md-content flex class="Content AppBackground" layout="column" ng-view>
</md-content>
</div>
</div>
@@ -64,7 +62,12 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.8.2/nv.d3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-nvd3/1.0.5/angular-nvd3.min.js"></script>
<script src="rcon.js"></script>
<script src="js/rconService.js"></script>
<script src="js/app.js"></script>
<script src="js/console.js"></script>
<script src="js/playerlist.js"></script>
<script src="js/playerInfo.js"></script>
<script src="js/playerXp.js"></script>
</body>
</html>
+149
View File
@@ -0,0 +1,149 @@
var app = angular.module( 'RconApp', ['ngMaterial', 'ngRoute'] );
app.service( 'rconService', [RconService] );
app.config( function ( $mdThemingProvider, $routeProvider )
{
$mdThemingProvider.theme( 'default' ).primaryPalette( 'blue',
{
'default': '700'
}).accentPalette( 'blue' );
$routeProvider.when( "/console", { Title: "Console", templateUrl: "html/console.html", Nav: true } )
$routeProvider.when( "/playerlist", { Title: "Player List", templateUrl: "html/playerlist.html", Nav: true } )
$routeProvider.when( "/player/:userid", { Title: "Player Info", templateUrl: "html/playerInfo.html" } )
$routeProvider.when( "/player/:userid/xp", { Title: "Player Xp Stats", templateUrl: "html/playerXp.html" } )
.otherwise( { redirectTo: '/console' } );
} );
app.controller( 'RconController', RconController );
function RconController( $scope, $rootScope, rconService, $mdSidenav, $timeout, $mdDialog, $route )
{
$scope.$route = $route;
$scope.pages = $.map( $route.routes, function ( value, index )
{
return [value];
} );
console.log( $scope.pages );
$scope.OpenLeftMenu = function ()
{
$mdSidenav( 'left' ).toggle();
};
$scope.IsConnected = function ()
{
return rconService.IsConnected();
}
$rootScope.$on( '$stateChangeStart', function ( next, current )
{
console.log( next );
} );
rconService.OnOpen = function ()
{
$scope.Connected = true;
$scope.$broadcast( "OnConnected" );
$scope.$digest();
}
rconService.OnClose = function ( ev )
{
$scope.$broadcast( "OnDisconnected", ev );
$scope.$digest();
}
rconService.OnError = function ( ev )
{
$scope.$broadcast( "OnConnectionError", ev );
$scope.$digest();
}
rconService.OnMessage = function ( msg )
{
$scope.$apply( function ()
{
$scope.$broadcast( "OnMessage", msg );
} );
}
}
app.controller( 'ConnectionController', ConnectionController );
function ConnectionController( $scope, rconService )
{
$scope.Address = "";
$scope.Password = "";
$scope.SaveConnection = true;
if ( localStorage.previousConnections != null )
$scope.PreviousConnects = angular.fromJson( localStorage.previousConnections );
if ( $scope.PreviousConnects == null )
$scope.PreviousConnects = new Array();
console.log( $scope.PreviousConnects );
$scope.Connect = function ()
{
$scope.LastErrorMessage = null;
rconService.Connect( $scope.Address, $scope.Password );
}
$scope.ConnectTo = function ( c )
{
$scope.SaveConnection = false;
$scope.LastErrorMessage = null;
rconService.Connect( c.Address, c.Password );
}
$scope.$on( "OnDisconnected", function ( x, ev )
{
console.log( ev );
$scope.LastErrorMessage = "Connection was closed - Error " + ev.code;
$scope.$digest();
} );
$scope.$on( "OnConnected", function ( x, ev )
{
if ( $scope.SaveConnection )
{
$scope.PreviousConnects.push( { Address: $scope.Address, Password: $scope.Password } );
localStorage.previousConnections = angular.toJson( $scope.PreviousConnects );
}
} );
}
app.filter( 'SecondsToDuration', [SecondsToDuration] );
function SecondsToDuration()
{
return function ( input )
{
input = parseInt( input );
var out = "";
var hours = Math.floor( input / 3600 );
if ( input > 3600 ) out += hours + "h ";
var minutes = Math.floor( input / 60 ) % 60;
if ( input > 60 ) out += minutes + "m ";
var seconds = input % 60;
out += seconds + "s";
return out;
}
}
+28
View File
@@ -0,0 +1,28 @@
app.controller( 'ConsoleController', ['$scope', 'rconService', ConsoleController] );
function ConsoleController( $scope, rconService )
{
$scope.Output = rconService.Output;
$scope.SubmitCommand = function ()
{
rconService.Command( $scope.Command, 0 );
$scope.Command = "";
}
$scope.$on( "OnMessage", function ( event, msg )
{
if ( msg.Message.startsWith( "[CHAT] " ) )
msg.Class = "Chat";
if ( msg.Identifier == 1 )
msg.Class = "Requested";
if ( msg.Identifier > 1 )
return;
$( "#ConsoleController .Output" ).scrollTop( $( "#ConsoleController .Output" )[0].scrollHeight );
} );
}
+7
View File
@@ -0,0 +1,7 @@
app.controller( 'PlayerInfoController', PlayerInfoController );
function PlayerInfoController( $scope, rconService, $routeParams )
{
$scope.userid = $routeParams.userid;
}
+7
View File
@@ -0,0 +1,7 @@
app.controller( 'PlayerXpController', PlayerXpController );
function PlayerXpController( $scope, rconService, $routeParams )
{
$scope.userid = $routeParams.userid;
}
+17
View File
@@ -0,0 +1,17 @@
app.controller( 'PlayerListController', PlayerListController );
function PlayerListController( $scope, rconService )
{
$scope.Output = new Array();
$scope.Refresh = function ()
{
rconService.Request( "playerlist", $scope, function ( msg )
{
$scope.Players = JSON.parse( msg.Message );
});
}
rconService.InstallService( $scope, $scope.Refresh )
}
+112
View File
@@ -0,0 +1,112 @@
function RconService()
{
var s = {};
s.Callbacks = {};
// A list of untargetted ouput from the server
// ie - the console history
s.Output = new Array();
s.Connect = function ( addr, pass )
{
s.Socket = new WebSocket( "ws://" + addr + "/" + pass );
s.Socket.onmessage = function ( e )
{
var data = angular.fromJson( e.data );
//
// This is a targetted message, it has an identifier
// So feed it back to the right callback.
//
if ( data.Identifier != 0 )
{
var cb = s.Callbacks[data.Identifier];
if ( cb != null )
{
cb.scope.$apply( function ()
{
cb.callback( data );
} );
}
s.Callbacks[data.Identifier] = null;
return;
}
//
// Generic console message, let OnMessage catch it
//
if ( s.OnMessage != null )
{
s.Output.push( data );
s.OnMessage( data );
}
};
s.Socket.onopen = s.OnOpen;
s.Socket.onclose = s.OnClose;
s.Socket.onerror = s.OnError;
console.log( s.Socket );
}
s.Command = function ( msg, identifier )
{
if ( identifier == null )
identifier = -1;
var packet =
{
Identifier: identifier,
Message: msg,
Name: "WebRcon"
}
s.Socket.send( JSON.stringify( packet ) );
};
var LastIndex = 1001;
//
// Make a request, call this function when it returns
//
s.Request = function ( msg, scope, callback )
{
LastIndex++;
s.Callbacks[LastIndex] = { scope: scope, callback: callback };
s.Command( msg, LastIndex );
}
//
// Returns true if websocket is connected
//
s.IsConnected = function ()
{
if ( s.Socket == null ) return false;
return s.Socket.readyState == 1;
}
//
// Helper for installing connectivity logic
//
// Basically if not connected, call this function when we are
// And if we are - then call it right now.
//
s.InstallService = function( scope, func )
{
scope.$on( "OnConnected", function ()
{
func();
});
if ( s.IsConnected() )
{
func();
}
}
return s;
}
+39
View File
@@ -45,3 +45,42 @@ H3
{
color: #000;
}
a
{
color: #FF4081;
text-decoration: none;
}
.menu
{
background-color: #1976D2;
}
.menu_button
{
display: block;
padding: 0 16px 0 32px;
text-transform: none;
text-rendering: optimizeLegibility;
font-weight: 500;
border-radius: 0;
color: white;
cursor: pointer;
display: block;
align-items: inherit;
line-height: 40px;
margin: 0;
max-height: 40px;
overflow: hidden;
padding: 0px 16px;
text-align: left;
text-decoration: none;
white-space: normal;
width: 100%;
}
.menu_button.selected
{
background: #90A4AE;
}
-248
View File
@@ -1,248 +0,0 @@
var app = angular.module('RconApp', ['ngMaterial', 'ngRoute']);
app.config( function( $mdThemingProvider, $routeProvider )
{
$mdThemingProvider.theme('default').primaryPalette('blue').accentPalette('orange');
$routeProvider.when( "/console", { templateUrl: 'partials/phone-list.html'} )
$routeProvider.when( "/players", { templateUrl: 'partials/players.html'} )
.otherwise( {redirectTo: '/console'} );
});
app.controller('RconController', RconController);
function RconController( $scope, rconService, $mdSidenav, $timeout, $mdDialog )
{
$scope.pages =
[
{ Name: "console", Title: "Console", Page: "html/console.html" },
{ Name: "players", Title: "Players", Page: "html/players.html" },
]
$scope.SwitchPage = function( page )
{
$scope.CurrentPage = page;
}
$scope.OpenLeftMenu = function()
{
$mdSidenav('left').toggle();
};
$scope.SwitchPage( $scope.pages[0] );
$scope.IsConnected = function()
{
return rconService.IsConnected();
}
rconService.OnOpen = function()
{
$scope.Connected = true;
$scope.$broadcast( "OnConnected" );
$scope.$digest();
}
rconService.OnClose = function( ev )
{
$scope.$broadcast( "OnDisconnected", ev );
$scope.$digest();
}
rconService.OnError = function( ev )
{
$scope.$broadcast( "OnConnectionError", ev );
$scope.$digest();
}
rconService.OnMessage = function( msg )
{
$scope.$broadcast( "OnMessage", msg );
}
}
app.controller('ConnectionController', ConnectionController);
function ConnectionController( $scope, rconService )
{
$scope.Address = "";
$scope.Password = "";
$scope.SaveConnection = true;
if ( localStorage.previousConnections != null )
$scope.PreviousConnects = angular.fromJson( localStorage.previousConnections );
if ( $scope.PreviousConnects == null )
$scope.PreviousConnects = new Array();
console.log( $scope.PreviousConnects );
$scope.Connect = function()
{
$scope.LastErrorMessage = null;
rconService.Connect( $scope.Address, $scope.Password );
}
$scope.ConnectTo = function( c )
{
$scope.SaveConnection = false;
$scope.LastErrorMessage = null;
rconService.Connect( c.Address, c.Password );
}
$scope.$on( "OnDisconnected", function( x, ev )
{
console.log( ev );
$scope.LastErrorMessage = "Connection was closed - Error " + ev.code;
$scope.$digest();
});
$scope.$on( "OnConnected", function( x, ev )
{
if ( $scope.SaveConnection )
{
$scope.PreviousConnects.push( { Address: $scope.Address, Password: $scope.Password } );
localStorage.previousConnections = angular.toJson( $scope.PreviousConnects );
}
});
}
app.controller('ConsoleController', ['$scope', 'rconService', ConsoleController]);
function ConsoleController( $scope, rconService )
{
$scope.Output = new Array();
$scope.SubmitCommand = function()
{
rconService.Command( $scope.Command, 1 );
$scope.Output.push( { Class: "input", "Message": "> " + $scope.Command } );
$scope.Command = "";
}
$scope.$on( "OnMessage", function( event, msg )
{
if ( msg.Message.startsWith( "[CHAT] " ) )
msg.Class = "Chat";
if ( msg.Identifier == 1 )
msg.Class = "Requested";
if ( msg.Identifier > 1 )
return;
$scope.Output.push( msg );
$scope.$digest();
$("#ConsoleController .Output").scrollTop($("#ConsoleController .Output")[0].scrollHeight);
});
}
app.controller('PlayersController', ['$scope', 'rconService', PlayersController]);
function PlayersController( $scope, rconService )
{
$scope.Output = new Array();
$scope.Refresh = function()
{
rconService.Command( "playerlist", 2 );
}
$scope.$on( "OnConnected", function( event )
{
$scope.Refresh();
});
$scope.$on( "OnMessage", function( event, msg )
{
if ( msg.Identifier != 2 )
return;
$scope.Players = JSON.parse( msg.Message );
});
}
app.service('rconService', [RconService]);
function RconService()
{
var s = {};
s.Connect = function( addr, pass )
{
s.Socket = new WebSocket( "ws://" + addr + "/" + pass );
s.Socket.onmessage = function (e)
{
if (s.OnMessage != null)
{
s.OnMessage( JSON.parse( e.data ) );
}
};
s.Socket.onopen = s.OnOpen;
s.Socket.onclose = s.OnClose;
s.Socket.onerror = s.OnError;
console.log( s.Socket );
}
s.Command = function( msg, identifier )
{
if (identifier == null)
identifier = -1;
var packet =
{
Identifier: identifier,
Message: msg,
Name: "WebRcon"
}
s.Socket.send( JSON.stringify( packet ) );
};
s.IsConnected = function()
{
if ( s.Socket == null ) return false;
console.log( s.Socket );
return true;
}
return s;
}
app.filter('SecondsToDuration', [SecondsToDuration]);
function SecondsToDuration()
{
return function ( input )
{
input = parseInt( input );
var out = "";
var hours = Math.floor(input / 3600);
if ( input > 3600 ) out += hours + "h ";
var minutes = Math.floor(input / 60) % 60;
if ( input > 60 ) out += minutes + "m ";
var seconds = input % 60;
out += seconds + "s";
return out;
}
}