github-mirrors/pf2015
1
0
Fork 0
mirror of https://github.com/ysoftdevs/pf2015.git synced 2026-03-28 03:52:07 +01:00
Code Issues 1 Packages Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
Juraj Michalek
2014-12-23 21:36:31 +00:00
commit 4dd6fa8c36
3 changed files with 281 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
css/pexeso.css Normal file
View File

@@ -0,0 +1,58 @@
#mainContent {
font-family: Arial, Helvetica, sans-serif;
font-size: xx-large;
font-weight: bold;
background-color: #E3F0FB;
border-radius: 4px;
padding: 10px;
text-align: center;
}
.buttonStyle {
border-radius: 4px;
border: thin solid #F0E020;
padding: 5px;
background-color: #F8F094;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
font-weight: bold;
color: #663300;
width: 75px;
}
.buttonStyle:hover {
border: thin solid #FFCC00;
background-color: #FCF9D6;
color: #996633;
cursor: pointer;
}
.buttonStyle:active {
border: thin solid #99CC00;
background-color: #F5FFD2;
color: #669900;
cursor: pointer;
}
.card {
width: 10em;
height: 10em;
}
.solved {
background: green;
}
.selected1 {
background: yellow;
}
.selected2 {
background: orange;
}
.selected3 {
background: white;
}
.mystery {
background: blue;
color: blue;
}

21
index.html Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html lang="en-us" ng-app="app">
<head>
<meta charset="utf-8">
<title>PF2015</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.7/angular.min.js"></script>
<script type="text/javascript" src="js/pexeso-controller.js"></script>
<link rel="stylesheet" href="css/pexeso.css" type="text/css" />
</head>
<body ng-controller="PexesoController" data-ng-init="init()">
<div id="mainContent">
<div ng-repeat="card in board"
class="card"
ng-class="card.state"
ng-click="selectCard(card)"
>{{card.cardId}}</div>
</body>
</html>

202
js/pexeso-controller.js Normal file
View File

@@ -0,0 +1,202 @@
angular.module('app', [])
.controller('PexesoController', ['$scope', function($scope) {
$scope.languages = {
'cs-CZ': {
title: 'Čeština'
},
'en-US': {
title: 'English'
},
'sk-SK': {
title: 'Slovenčina'
}
};
$scope.basicCards = {
'printer' : {
'cs-CZ': 'tiskárna',
'en-US': 'house',
'sk-SK': 'tlačiareň'
},
'toner' : {
'cs-CZ': 'toner',
'en-US': 'toner',
'sk-SK': 'toner'
},
'finisher': {
'cs-CZ': 'finisher',
'en-US': 'finisher',
'sk-SK': 'finisher'
},
'paper': {
'cs-CZ': 'papír',
'en-US': 'paper',
'sk-SK': 'papier'
},
'black': {
'cs-CZ': 'černá',
'en-US': 'black',
'sk-SK': 'čierna'
},
'white': {
'cs-CZ': 'bílá',
'en-US': 'white',
'sk-SK': 'biela'
},
'color': {
'cs-CZ': 'barva',
'en-US': 'color',
'sk-SK': 'farba'
},
'duplexPrint': {
'cs-CZ': 'oboustranný tisk',
'en-US': 'duplex print',
'sk-SK': 'obostranná tlač'
},
'stapler': {
'cs-CZ': 'sešívačka',
'en-US': 'stapler',
'sk-SK': 'zošívačka'
}
};
$scope.cards = $scope.basicCards;
$scope.maxSelected = 2;
$scope.board = [
{
cardId:'house',
index:1,
state: 'solved'
}, {
cardId: 'dog',
index:1,
state: 'mystery'
}, {
cardId:'house',
index:2,
state: 'solved'
}, {
cardId:'printer',
index:1,
state: 'mystery'
}, {
cardId: 'dog',
index:2,
state: 'mystery'
},{
cardId:'printer',
index:2,
state: 'mystery'
}
];
/**
* Generate playing card object.
*/
$scope.getCard = function(card, cardId, index) {
return {
cardId: cardId,
card: card,
index: index,
state: 'mystery'
};
};
/**
* Generate playing board.
*/
$scope.generateBoard = function(totalCount) {
$scope.board = [];
var stack = [];
angular.forEach($scope.basicCards, function(card, cardId) {
stack.push($scope.getCard(card, cardId, 1));
stack.push($scope.getCard(card, cardId, 2));
});
for (var index = 0; index < totalCount; index++) {
var coordinate = Math.floor((Math.random()* stack.length));
$scope.board.push(stack[coordinate]);
stack.splice(coordinate, 1);
}
};
$scope.selectionCounter = 0;
$scope.selectedCards = [];
/**
* Set state of all selected cards to defined state.
*/
$scope.setSelectionState = function(state) {
$scope.selectionCounter = 0;
angular.forEach($scope.selectedCards, function(card) {
card.state = state;
});
$scope.selectedCards = [];
};
/**
* Check whether all cards were selected.
*/
$scope.areAllSelectedSame = function() {
var previous = null;
// At least two cards must match
if ($scope.selectedCards.length < 2) {
return false;
}
for (var index=0; index<$scope.selectedCards.length; index++) {
var card = $scope.selectedCards[index];
if (previous === null) {
previous = card;
} else {
if (previous.cardId != card.cardId) {
return false;
}
}
}
return true;
};
/**
* Click handler to select card.
*/
$scope.selectCard = function(card) {
// only mystery cards are processed
if (card.state != 'mystery') {
return;
}
$scope.selectionCounter += 1;
if ($scope.selectionCounter == $scope.maxSelected + 1) {
$scope.setSelectionState('mystery');
return;
} else {
$scope.selectedCards.push(card);
}
if (card.state == 'mystery') {
card.state = 'selected' + $scope.selectionCounter;
}
if ($scope.areAllSelectedSame()) {
$scope.setSelectionState('solved');
}
};
/**
* Initialize game.
*/
$scope.init = function() {
$scope.generateBoard(4*4);
};
}]);