From 6de72eec860704880c551aa11df9a2ae429e3994 Mon Sep 17 00:00:00 2001 From: Garry Newman Date: Tue, 12 Apr 2016 15:13:48 +0100 Subject: [PATCH] Switch to bootstrap --- html/connect.html | 95 +++++++++++---------- html/console.html | 20 ++--- html/playerlist.html | 103 +++++++++++----------- index.html | 63 ++++++-------- js/app.js | 13 ++- js/connection.js | 2 - js/playerlist.js | 19 +++++ rcon.css | 199 +++++++++++++++++++++++++------------------ 8 files changed, 276 insertions(+), 238 deletions(-) diff --git a/html/connect.html b/html/connect.html index 04d91b1..72e7ed3 100644 --- a/html/connect.html +++ b/html/connect.html @@ -1,56 +1,57 @@ - +
- +
- -
-

Connect

+

Connect

+ +
{{LastErrorMessage}}
+ +

Enter the address (including rcon port) and the rcon password below to connect.

+ +
+
+ + +
+ + +
+ +
+ + +
+ +
+ + Save Connection +
+ +

+ +
+ +
+ +
+ +
+ +
- -
- -
Enter the address (including rcon port) and the rcon password below to connect.
+
-
- {{c.Address}} +
+

Saved Connections

+
- -
{{LastErrorMessage}}
- -
-
- - - - - - - - - - - -
- - Save Connection -
- -

- -
- Connect -
- -
- - -
-
- - - - \ No newline at end of file + + +
+
\ No newline at end of file diff --git a/html/console.html b/html/console.html index 1285bde..89d066c 100644 --- a/html/console.html +++ b/html/console.html @@ -1,21 +1,11 @@ -
+
-
{{line.Message}}
 +
{{line.Message}}
- -
- - - - - - - - - -
- +
+ +
\ No newline at end of file diff --git a/html/playerlist.html b/html/playerlist.html index 3b4b404..83730a4 100644 --- a/html/playerlist.html +++ b/html/playerlist.html @@ -1,56 +1,63 @@
- - - - -
- {{line.SteamID}} {{line.OwnerSteamID}} -
- -
- {{line.VoiationLevel}} -
- -
- Level: {{line.CurrentLevel}} -
- - - -
- {{line.Address}} -
+
+
+ +
+
+ +
+
-
Ping {{line.Ping}}
- -
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + - -
- - - - - - - - + +
+
UsernameSteamidVoilationLevelXPAddressPingDuration
+ {{line.DisplayName}} + + {{line.SteamID}} + + {{line.VoiationLevel}} + + {{line.CurrentLevel}} + + {{line.UnspentXp}} + + {{line.Address}} + {{line.Ping}} {{line.ConnectedSeconds | SecondsToDuration}} - - - - - - +
-
- +
\ No newline at end of file diff --git a/index.html b/index.html index a8ce0b9..5a3f3d2 100644 --- a/index.html +++ b/index.html @@ -5,45 +5,36 @@ Websocket Rcon - - - + + - + -
-
- - - - - - - {{p.Title}} - - - - - - -
- - -
- - - -

{{$route.current.Title}}

-
- +
-
- - -
-
+
+
+ +
+ + + +
+ +
+ +

{{$route.current.Title}}

+
+ +
+ +
@@ -54,8 +45,8 @@ - - + + diff --git a/js/app.js b/js/app.js index abe6c79..3e0f872 100644 --- a/js/app.js +++ b/js/app.js @@ -1,16 +1,11 @@ -var app = angular.module( 'RconApp', ['ngMaterial', 'ngRoute', 'nvd3'] ); +var app = angular.module( 'RconApp', ['ngRoute', 'nvd3'] ); app.service( 'rconService', [RconService] ); -app.config( function ( $mdThemingProvider, $routeProvider ) +app.config( function ( $routeProvider ) { - $mdThemingProvider.theme( 'default' ).primaryPalette( 'blue', - { - 'default': '700' - }).accentPalette( 'blue' ); - $routeProvider.when( "/home", { Title: "Home" } ) $routeProvider.when( "/:address/console", { Title: "Console", templateUrl: "html/console.html", Nav: true } ) $routeProvider.when( "/:address/playerlist", { Title: "Player List", templateUrl: "html/playerlist.html", Nav: true } ) @@ -22,7 +17,7 @@ app.config( function ( $mdThemingProvider, $routeProvider ) app.controller( 'RconController', RconController ); -function RconController( $scope, $rootScope, rconService, $mdSidenav, $timeout, $mdDialog, $route ) +function RconController( $scope, $rootScope, rconService, $timeout, $route ) { $scope.$route = $route; @@ -97,6 +92,8 @@ function SecondsToDuration() if ( input > 60 ) out += minutes + "m "; var seconds = input % 60; + + if ( input < 3600 ) out += seconds + "s"; return out; diff --git a/js/connection.js b/js/connection.js index 4dce60f..2585378 100644 --- a/js/connection.js +++ b/js/connection.js @@ -7,8 +7,6 @@ function ConnectionController( $scope, rconService, $routeParams, $timeout, $loc $scope.Password = ""; $scope.SaveConnection = true; - console.log( $location.search ); - if ( localStorage.previousConnections != null ) $scope.PreviousConnects = angular.fromJson( localStorage.previousConnections ); diff --git a/js/playerlist.js b/js/playerlist.js index 8b0df54..f2f8588 100644 --- a/js/playerlist.js +++ b/js/playerlist.js @@ -4,6 +4,7 @@ app.controller( 'PlayerListController', PlayerListController ); function PlayerListController( $scope, rconService, $interval ) { $scope.Output = new Array(); + $scope.OrderBy = '-ConnectedSeconds'; $scope.Refresh = function () { @@ -13,6 +14,24 @@ function PlayerListController( $scope, rconService, $interval ) }); } + $scope.Order = function( o ) + { + if ( $scope.OrderBy == o ) + { + o = '-' + o; + } + + $scope.OrderBy = o; + } + + $scope.SortClass = function( o ) + { + if ( $scope.OrderBy == o ) return "active"; + if ( $scope.OrderBy == "-" + o ) return "active descending"; + + return null; + } + rconService.InstallService( $scope, $scope.Refresh ) var timer = $interval( function () diff --git a/rcon.css b/rcon.css index 3cbab4e..82d544e 100644 --- a/rcon.css +++ b/rcon.css @@ -1,100 +1,135 @@ -H3 +@import url(https://fonts.googleapis.com/css?family=Roboto:400,700); + +body { - + font-family: "Roboto", sans-serif; + font-size: 14px; + font-weight: 300; + line-height: 1.5; + color: #cfd2da; + background-color: #252830; } -.AppBackground +a { - background-color: #ccc; + color: #1ca8dd; } -.DropShadow +a:hover { - box-shadow: 0 1px 8px 0 rgba(0,0,0,.2),0 3px 4px 0 rgba(0,0,0,.14),0 3px 3px -2px rgba(0,0,0,.12); -} - -#ConsoleController md-input-container .md-errors-spacer -{ - min-height: 0; -} - -#ConsoleController md-input-container -{ - margin: 0; -} - -#ConsoleController .Output -{ - - font-size: 16px; - white-space: pre-wrap; - padding: 8px; -} - -#ConsoleController .Output div -{ - padding: 2px 4px; - color: #888; -} - -#ConsoleController .Output .Command -{ - color: #009688; - background-color: rgba(137, 255, 0, 0.44); -} - -#ConsoleController .Output .Warning -{ - color: #c79621; - background-color: rgba(255, 128, 0, 0.1); -} - -#ConsoleController .Output .Assert, #ConsoleController .Output .Error -{ - color: #b42626; - background-color: rgba(255,0,0,.1); -} - -#ConsoleController .Input input -{ - color: #000; -} - -a -{ - color: #FF4081; + color: #fff; text-decoration: none; } -.menu +.right { - background-color: #1976D2; + text-align: right; } -.menu_button +.center { - 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%; + text-align: center; } -.menu_button.selected + +.float-left { float: left; } + +#ConsoleController .Output { - background: #90A4AE; + font-family: monospace; + font-size: 12px; + white-space: pre-wrap; +} + +.scrollable +{ + overflow: auto; +} + + +.nav-sidebar +{ + margin-top: 64px; + margin-right: 16px; +} + +.nav-sidebar > li > a +{ + padding-right: 20px; + padding-left: 20px; + border-radius: 5px; +} + +.nav-sidebar > .active > a, +.nav-sidebar > .active > a:hover, +.nav-sidebar > .active > a:focus +{ + color: #fff; + background-color: #428bca; +} + +table +{ + border-collapse: collapse; + border-spacing: 0; + width: 100%; +} + +.fade +{ + opacity: 0.5; +} + +th, td +{ + padding: 5px 8px; + border-bottom: 1px solid #414758; +} + +th.active +{ + color: #1bc98e; + border-color: #1bc98e; +} + +th +{ + border-bottom: 2px solid #414758; + border-radius: 10px; +} + +th:first-child +{ + border-radius: 6px; +} + +th:last-child +{ + border-radius: 0 6px 0 0; +} + +th:only-child +{ + border-radius: 6px 6px 0 0; +} + + + +.btn-default, .btn-default:active, .form-control +{ + background: rgba( 255, 255, 255, 0.3 ); + border: none; + color: #cfd2da; + text-shadow: none; +} + +.btn-default:hover +{ + background: #1ca8dd; + color: #fff; +} + +.panel +{ + background-color: #434857; } \ No newline at end of file