Skip to content

Waterpolo: Added a shot clock. #99

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
benjaminkay93 wants to merge 8 commits into
base: master
Choose a base branch
from
Open

Waterpolo: Added a shot clock. #99

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
a183e2f
Added a shot clock.
benjaminkay93 Apr 12, 2018
fc804f9
Merge remote-tracking branch 'origin/master' into waterpolo
benjaminkay93 Apr 15, 2018
5bcf359
Add toggling play button to the clock and shot clock.
benjaminkay93 Apr 15, 2018
3bc3607
Update UI to allow easier control.
benjaminkay93 Apr 15, 2018
870c124
Add SPACE keypress to pause shotclock
benjaminkay93 Apr 15, 2018
9c32a59
Add ENTER as a shotclock reset to 00:30
benjaminkay93 Apr 15, 2018
c63e415
Merge remote-tracking branch 'origin/master' into waterpolo
benjaminkay93 Apr 16, 2018
aed26e3
Add clock to pause on the spacebar.
benjaminkay93 Apr 16, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
94 changes: 75 additions & 19 deletions public/admin/templates/waterpolo.tmpl.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,40 +2,96 @@
<h2>Waterpolo</h2>

<div class="ui grid center aligned">
<div class="ten wide column">
<div class="inline field">
<checkbox ng-model="waterpolo.show" size="large" type="toggle">Show Score Bar</checkbox>
<checkbox ng-model="waterpolo.showquarter" size="large" type="toggle">Show Quarter</checkbox>
</div>
<div class="four wide column">
<dropdown title="Current Quarter" ng-model="waterpolo.currentQuarter" on-change="quarterChanged()">
<dropdown-group>1st</dropdown-group>
<dropdown-group>2nd</dropdown-group>
<dropdown-group>3rd</dropdown-group>
<dropdown-group>4th</dropdown-group>
</dropdown>
</div>
<div class="twelve wide column">
<div class="inline field">
<checkbox ng-model="waterpolo.show" size="large" type="toggle">Show Score Bar</checkbox>
<checkbox ng-model="waterpolo.showquarter" size="large" type="toggle">Show Quarter</checkbox>
<checkbox ng-model="waterpolo.showshotcountdown" size="large" type="toggle">Show Shot Countdown</checkbox>
<checkbox ng-model="waterpolo.enableKeyboard" size="large" type="toggle">Enable Keyboard Controls</checkbox>
</div>
</div>
</div>

<div class="ui divider"></div>

<div class="ui grid">
<div class="five wide column center aligned">
<h2 class="ui header">{{clock}}</h2>
<dropdown title="Current Quarter" ng-model="waterpolo.currentQuarter" on-change="quarterChanged()">
<dropdown-group>1st</dropdown-group>
<dropdown-group>2nd</dropdown-group>
<dropdown-group>3rd</dropdown-group>
<dropdown-group>4th</dropdown-group>
</dropdown>
<div class="four wide column center aligned">
<h3 class="ui header">Game clock:</h3>
</div>

<div class="five wide column">
<div class="ui action input">
<div class="four wide column">
<div class="ui action input" style="max-width: 70%">
<input type="text" placeholder="mm:ss" ng-model="time" size="10">
<div class="ui button" ng-click="setClock(time)">Set</div>
</div>
</div>

<div class="five wide column">
<div class="eight wide column">
<div class="ui">
<div class="ui icon blue button" ng-click="waterpoloClock()">
<i class="pause icon"></i>
<div class="content" ng-if="clockState">
<div class="ui icon blue button" ng-click="waterpoloClock()">
<i class="pause icon"></i>
</div>
<div class="ui button" ng-click="resetClock()">Reset</div>
<div class="ui label">
<h3 class="ui text">{{clock}}</h3>
</div>
</div>
<div class="content" ng-if="!clockState">
<div class="ui icon green button" ng-click="waterpoloClock()">
<i class="play icon"></i>
</div>
<div class="ui button" ng-click="resetClock()">Reset</div>
<div class="ui label">
<h3 class="ui text">{{clock}}</h3>
</div>
</div>
</div>
</div>
</div>

<div class="ui divider"></div>

<div class="ui grid">
<div class="four wide column center aligned">
<h3 class="ui header">Shot clock:</h3>
</div>

<div class="four wide column">
<div class="ui action input" style="max-width: 70%">
<input type="text" placeholder="mm:ss" ng-model="shotTime" size="10">
<div class="ui button" ng-click="setShotClock(shotTime)">Set</div>
</div>
</div>

<div class="eight wide column">
<div class="ui">
<div class="content" ng-if="shotClockState">
<div class="ui icon blue button" ng-click="waterpoloShotClock()">
<i class="pause icon"></i>
</div>
<div class="ui button" ng-click="resetShotClock()">Reset</div>
<div class="ui label">
<h3 class="ui text">{{shotclock}}</h3>
</div>
</div>
<div class="content" ng-if="!shotClockState">
<div class="ui icon green button" ng-click="waterpoloShotClock()">
<i class="play icon"></i>
</div>
<div class="ui button" ng-click="resetShotClock()">Reset</div>
<div class="ui label">
<h3 class="ui text">{{shotclock}}</h3>
</div>
</div>
<div class="ui button" ng-click="resetClock()">Reset</div>
</div>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions public/css/theme.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -747,10 +747,10 @@ h1, h2, h3, h4 {
}

.tennisScore .server {
width: 0;
height: 0;
width: 0;
height: 0;
border-top: 12px solid transparent;
border-bottom: 12px solid transparent;
border-bottom: 12px solid transparent;
border-right: 12px solid #fff;
float: right;
margin-top: 6px;
Expand Down Expand Up @@ -1208,7 +1208,7 @@ h1, h2, h3, h4 {
.waterpolo .score.york {
width: 32%;
text-align: left;
padding-left: 30px;
padding-left: 20px;
color: #000;
background-color: #efbb39;
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
Expand Down
28 changes: 16 additions & 12 deletions public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -380,7 +380,7 @@ <h1 style="background-color: {{grid.headingcolor}} !important;">{{ grid.header }
<div class="info">Best of {{tennisOptions.maxSets}} sets</div>
</div>
</div>

<div class="tennis tennisStats center scale-fade" ng-show="tennisOptions.showStats">
<div class="header">
<h1>Match Statistics</h1>
Expand All @@ -394,43 +394,43 @@ <h1>Match Statistics</h1>
<span class="float-right">{{tennisOptions.player2}}</span>
</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.ace1}}</div>
<div class="statsright york">{{tennisScore.ace2}}</div>
<div class="stats">Aces</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.doubleFault1}}</div>
<div class="statsright york">{{tennisScore.doubleFault2}}</div>
<div class="stats">Double Faults</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.firstServeWon1 + " / " + (tennisScore.pointsServed1 - tennisScore.singleFault1 - tennisScore.doubleFault1)}}</div>
<div class="statsright york">{{tennisScore.firstServeWon2 + " / " + (tennisScore.pointsServed2 - tennisScore.singleFault2 - tennisScore.doubleFault2)}}</div>
<div class="stats">First Serves Won</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.secondServeWon1 + " / " + (tennisScore.singleFault1 + tennisScore.doubleFault1)}}</div>
<div class="statsright york">{{tennisScore.secondServeWon2 + " / " + (tennisScore.singleFault2 + tennisScore.doubleFault2)}}</div>
<div class="stats">Second Serves Won</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.breaksWon1 + " / " + tennisScore.breakPoint1}}</div>
<div class="statsright york">{{tennisScore.breaksWon2 + " / " + tennisScore.breakPoint2}}</div>
<div class="stats">Break Points Won</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.servicesWon1}}</div>
<div class="statsright york">{{tennisScore.servicesWon2}}</div>
<div class="stats">Service Games Won</div>
</div>

<div class="row">
<div class="statsleft lanc">{{tennisScore.pointsWon1}}</div>
<div class="statsright york">{{tennisScore.pointsWon2}}</div>
Expand All @@ -450,10 +450,14 @@ <h1>Match Statistics</h1>

<div ng-controller="waterpoloCtrl" class="waterpolo left top scale-fade" ng-show="waterpolo.show">
<div class="row">
<div class="score lanc"><span ng-show="waterpolo.showcurrent"><span ng-show="showcurrentlancs">&diams;</span></span>LANCS {{waterpolo.lancScore}}</div>
<div class="score york">{{waterpolo.yorkScore}} YORK<span ng-show="waterpolo.showcurrent"><span ng-show="showcurrentyork">&diams;</span></span></div>
<div class="clock">{{clock}}</div>
<div class="waterpoloquarter fade" ng-show="waterpolo.showquarter"><h1>{{waterpolo.currentQuarter}}</h1></div>
<div class="score lanc"><span ng-show="waterpolo.showcurrent"><span ng-show="showcurrentlancs">&diams;</span></span>LANCS {{waterpolo.lancScore}}</div>
<div class="score york">{{waterpolo.yorkScore}} YORK<span ng-show="waterpolo.showcurrent"><span ng-show="showcurrentyork">&diams;</span></span></div>
</div>
<div class="row">
<div class="waterpoloquarter fade" ng-show="waterpolo.showquarter"><h1>{{waterpolo.currentQuarter}}</h1></div>
<div class="clock">{{clock}}</div>
<div class="waterpoloquarter fade" ng-show="waterpolo.showshotcountdown"><h1>Shot Clock:</h1></div>
<div class="clock" ng-show="waterpolo.showshotcountdown"><h1>{{shotclock}}</h1></div>
</div>
</div>

Expand Down
5 changes: 5 additions & 0 deletions public/js/cg.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -408,6 +408,10 @@ app.controller('waterpoloCtrl', ['$scope', 'socket',
$scope.clock = msg.slice(0, msg.indexOf("."));
});

socket.on("shotclock:tick", function (msg) {
$scope.shotclock = msg.slice(0, msg.indexOf("."));
});

$scope.$watch('waterpolo', function() {
if (!$scope.waterpolo) {
getWaterpoloData();
Expand All @@ -417,6 +421,7 @@ app.controller('waterpoloCtrl', ['$scope', 'socket',
function getWaterpoloData() {
socket.emit("waterpolo:get");
socket.emit("clock:get");
socket.emit("shotclock:get");
}
}
]);
74 changes: 62 additions & 12 deletions public/js/dashboard.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1016,7 +1016,7 @@ app.controller('tennisCGController', ['$scope', 'socket',
$scope.tennisOptions.player1 = "Lancaster";
$scope.tennisOptions.player2 = "York";
}

socket.emit("tennisOptions", $scope.tennisOptions);
} else {
getTennisData();
Expand Down Expand Up @@ -1124,7 +1124,7 @@ app.controller('tennisCGController', ['$scope', 'socket',
function winGame(player) {
// given the scoring player, get their opponent
var opponent = (player == 1 ? 2 : 1);

if ($scope.tennisScore.tiebreak == false) {
if (player == $scope.tennisScore.server) {
// player was serving, and not in a tiebreak, count this as service game win
Expand All @@ -1137,7 +1137,7 @@ app.controller('tennisCGController', ['$scope', 'socket',
// increment service games for server
$scope.tennisScore['serviceGame' + $scope.tennisScore.server] ++;
}

// update the sets array
$scope.tennisScore['sets' + player].splice(-1,1,($scope.tennisScore['game' + player] + 1));

Expand All @@ -1161,7 +1161,7 @@ app.controller('tennisCGController', ['$scope', 'socket',

$scope.tennisScore['set' + player] ++;
resetGames();

if ($scope.tennisScore['set' + player] > ($scope.tennisOptions.maxSets - 1)/2) {
// player already won (max - 1) sets, so wins match
$scope.tennisOptions.disableInput = true;
Expand Down Expand Up @@ -1253,12 +1253,12 @@ app.controller('tennisCGController', ['$scope', 'socket',
} else {
$scope.tennisScore.gamePoint = "Set Point";
}

// check if this is also break point and increment
if ($scope.tennisScore.server != opponent) {
$scope.tennisScore['breakPoint' + opponent] ++;
}

} else if ($scope.tennisScore.server != player && $scope.tennisScore['point' + player] >= 3 && ($scope.tennisScore['point' + player] - $scope.tennisScore['point' + opponent]) >= 1) {
// normal game, not a set/match point, so player needs be against the serve, have at least 40, with a 1 point advantage

Expand Down Expand Up @@ -1292,7 +1292,7 @@ app.controller('tennisCGController', ['$scope', 'socket',
socket.emit("tennis:reset");
$("input[type='checkbox']").attr("checked", false);
}

}
]);

Expand Down Expand Up @@ -1389,8 +1389,8 @@ app.controller('netballCGController', ['$scope', 'localStorageService', 'socket'
}
]);

app.controller('waterpoloCGController', ['$scope', 'localStorageService', 'socket',
function($scope, localStorageService, socket){
app.controller('waterpoloCGController', ['$scope', 'localStorageService', 'socket', '$rootScope', '$document',
function($scope, localStorageService, socket, $rootScope, $document){
var storedLancs = localStorageService.get('lancs_waterpolo');
var storedYork = localStorageService.get('york_waterpolo');
var clockIcon = 'pause icon'
Expand All @@ -1417,7 +1417,12 @@ app.controller('waterpoloCGController', ['$scope', 'localStorageService', 'socke
}

$scope.pauseClock = function() {
socket.emit("clock:pause");
if($scope.clockState) {
$scope.clockState = false
} else {
$scope.clockState = true
}
socket.emit("clock:pause");
};

$scope.resetClock = function() {
Expand All @@ -1432,6 +1437,36 @@ app.controller('waterpoloCGController', ['$scope', 'localStorageService', 'socke
socket.emit("clock:down");
};

socket.on("shotclock:tick", function (msg) {
$scope.shotclock = msg.slice(0, msg.indexOf("."));
});

$scope.waterpoloShotClock = function() {
$scope.downShotClock()
$scope.pauseShotClock()
}

$scope.pauseShotClock = function() {
if($scope.shotClockState) {
$scope.shotClockState = false
} else {
$scope.shotClockState = true
}
socket.emit("shotclock:pause");
};

$scope.resetShotClock = function() {
socket.emit("shotclock:reset");
};

$scope.setShotClock = function(val) {
socket.emit("shotclock:set", val);
};

$scope.downShotClock = function() {
socket.emit("shotclock:down");
};

$scope.addLancsPlayer = function() {
$scope.lancsPlayers.push($scope.lancs);
$scope.lancs = {};
Expand Down Expand Up @@ -1474,8 +1509,23 @@ app.controller('waterpoloCGController', ['$scope', 'localStorageService', 'socke
});

function getWaterpoloData() {
socket.emit("waterpolo:get");
socket.emit("clock:get");
socket.emit("waterpolo:get");
socket.emit("clock:get");
socket.emit("shotclock:get");
}

$document.bind('keypress', function (e) {
$rootScope.$emit('keypress', e, String.fromCharCode(e.which));
});

$rootScope.$on('keypress', function (event, object, key) {
if(object.which === 32 && $scope.waterpolo.enableKeyboard) {
$scope.waterpoloShotClock()
$scope.waterpoloClock()
}
if(object.which === 13 && $scope.waterpolo.enableKeyboard) {
$scope.setShotClock("00:30")
}
})
}
]);
Loading