1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64
|
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bienvenue</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<style src="mouvement.css"></style>
</head>
<body ng-app="myapp">
<div ng-controller="Puissance4Controller">
<div class="container">
<div class="jumbotron" ng-show="etat">
<h1>{{greeting}}</h2>
<div class="container">
</div>
<center><h2>Play Power4 Game</h2><center>
<br/>
<button id="btn" class="btn btn-default" ng-click="clickMe($event)">Play Game </button>
</div>
</div>
<div class="container" >
<div class="jumbotron" ng-show="etat1">
<table width="100%" border="1">
<tr ng-repeat="row in matrix">
<td ng-repeat="col in row">{{col.value}}</td>
</tr>
</table>
</div>
</div>
<div class="container">
<div class="jumbotron" ng-show="etat2">
<button id="btn1" class="btn btn-default" ng-click="ClickToRestart($event)">Restart Game<button>
</div>
</div>
<script type="text/javascript">
angular.module("myapp",[])
.controller("Puissance4Controller",function($scope){
$scope.etat=true;
$scope.greeting = 'Welcome';
$scope.clickMe = function() {
$scope.etat=false;
}
$scope.etat1=true; //debut de la partie
if($scope.etat==false){
$scope.matrice= function draw(){
}
/*function animate()*/
//scope.etat1="false" fin de la partie
}
//$scope.etat2=true; Gameover // fonction restart ClickToRestart($event)
}
);
</script>
</body>
</html> |
Partager