Animationen angepasst
This commit is contained in:
Carsten Hilmer
parent
c4f9b3671b
commit
0d0c883e94
@ -60,7 +60,16 @@ to {background-position: -2000px 0;}
|
||||
border-radius: 6px;
|
||||
color: black;
|
||||
border-style: solid;
|
||||
border-color:black;
|
||||
border-color: black;
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.redborder{
|
||||
display: inline-block;
|
||||
border-radius: 6px;
|
||||
color: black;
|
||||
border-style: solid;
|
||||
border-color: red;
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
|
||||
@ -45,3 +45,13 @@ angular.module('kinderspiel.services', [])
|
||||
}
|
||||
};
|
||||
})
|
||||
|
||||
.factory("kcSleep", function($timeout) {
|
||||
return function(ms) {
|
||||
return function(value) {
|
||||
return $timeout(function() {
|
||||
return value;
|
||||
}, ms);
|
||||
};
|
||||
};
|
||||
});
|
||||
@ -1,4 +1,4 @@
|
||||
appControllers.controller('Suchspiel', function($scope, $ionicPlatform, $cordovaMedia, $state, $timeout) {
|
||||
appControllers.controller('Suchspiel', function($scope, $ionicPlatform, $cordovaMedia, $state, $timeout,$q) {
|
||||
|
||||
|
||||
$scope.showmentor=false;
|
||||
@ -8,6 +8,13 @@ $scope.spieleview=[];
|
||||
$scope.tierfinden='';
|
||||
$scope.randomid=0;
|
||||
$scope.error = false;
|
||||
$scope.spielrunden=0
|
||||
$scope.falscheantwort=0
|
||||
$scope.errorcode=99;
|
||||
$scope.tierindex=99;
|
||||
$scope.spielfertig=-1;
|
||||
$scope.spielneu=-1;
|
||||
|
||||
|
||||
|
||||
$ionicPlatform.ready(function() {
|
||||
@ -16,7 +23,8 @@ $ionicPlatform.ready(function() {
|
||||
* Sounds definieren
|
||||
*/
|
||||
$scope.sounds=[];
|
||||
$scope.sounds.push('');
|
||||
//$scope.sounds.push('');
|
||||
|
||||
|
||||
var tiersound1 = new Media('/android_asset/www/sounds/finde_elefant.mp3', mentorausblenden,null);
|
||||
var tiersound2 = new Media('/android_asset/www/sounds/finde_esel.mp3', mentorausblenden,null);
|
||||
@ -27,7 +35,7 @@ $ionicPlatform.ready(function() {
|
||||
var tiersound7 = new Media('/android_asset/www/sounds/finde_maus.mp3', mentorausblenden,null);
|
||||
var tiersound8 = new Media('/android_asset/www/sounds/finde_schaf.mp3', mentorausblenden,null);
|
||||
|
||||
var bravosound = new Media('/android_asset/www/sounds/bravo.mp3', goto_newspiel,null);
|
||||
var bravosound = new Media('/android_asset/www/sounds/bravo.mp3', animateoldgame,null);
|
||||
var falschsound = new Media('/android_asset/www/sounds/falsch.mp3', null,null);
|
||||
|
||||
$scope.bravosound=bravosound;
|
||||
@ -49,73 +57,81 @@ $ionicPlatform.ready(function() {
|
||||
* Tiere definieren
|
||||
*/
|
||||
var tier = {
|
||||
id: 1,
|
||||
id: 0,
|
||||
bild: 'elefant.jpg',
|
||||
sound1: 'sound_elefant.mp3',
|
||||
antwort: ''
|
||||
antwort: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier);
|
||||
|
||||
|
||||
var tier1 = {
|
||||
id: 2,
|
||||
id: 1,
|
||||
bild: 'esel.jpg',
|
||||
sound1: 'sound_esel.mp3',
|
||||
antwort: ''
|
||||
antwort: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier1);
|
||||
|
||||
|
||||
var tier2 = {
|
||||
id: 3,
|
||||
id: 2,
|
||||
bild: 'hahn.jpg',
|
||||
sound1: 'sound_hahn.mp3',
|
||||
antwort: ''
|
||||
antwort: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier2);
|
||||
|
||||
|
||||
var tier3 = {
|
||||
id: 4,
|
||||
id: 3,
|
||||
bild: 'hund.jpg',
|
||||
sound1: 'sound_hund.mp3',
|
||||
sound2: ''
|
||||
sound2: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier3);
|
||||
|
||||
|
||||
var tier4 = {
|
||||
id: 5,
|
||||
id: 4,
|
||||
bild: 'katze.jpg',
|
||||
sound1: 'sound_katze.mp3',
|
||||
sound2: ''
|
||||
sound2: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier4);
|
||||
|
||||
|
||||
var tier5 = {
|
||||
id: 6,
|
||||
id: 5,
|
||||
bild: 'kuh.jpg',
|
||||
sound1: 'sound_kuh.mp3',
|
||||
sound2: ''
|
||||
sound2: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier5);
|
||||
|
||||
|
||||
var tier6 = {
|
||||
id: 7,
|
||||
id: 6,
|
||||
bild: 'maus.jpg',
|
||||
sound1: 'sound_maus.mp3',
|
||||
sound2: ''
|
||||
sound2: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier6);
|
||||
|
||||
|
||||
var tier7 = {
|
||||
id: 8,
|
||||
id: 7,
|
||||
bild: 'schaf.jpg',
|
||||
sound1: 'sound_schaf.mp3',
|
||||
sound2: ''
|
||||
sound2: '',
|
||||
display: false
|
||||
};
|
||||
$scope.spiele.push(tier7);
|
||||
|
||||
@ -142,8 +158,210 @@ function mentorausblenden(){
|
||||
$scope.answer = function(src) {
|
||||
|
||||
if (src==$scope.randomid){
|
||||
$timeout(function () { $scope.showmentorbravo=true; }, 0);
|
||||
$scope.bravosound.play();
|
||||
}
|
||||
else{
|
||||
|
||||
$timeout(function () {
|
||||
//$scope.spiele[$scope.randomid].errorcode=true;
|
||||
if ($scope.falscheantwort==2){
|
||||
$scope.errorcode=$scope.randomid;
|
||||
$scope.error = false;
|
||||
$timeout(function () {
|
||||
$scope.errorcode=99;
|
||||
$timeout(function () {
|
||||
$scope.errorcode=$scope.randomid;
|
||||
|
||||
animateoldgame();
|
||||
|
||||
}, 500);
|
||||
}, 500);
|
||||
|
||||
}
|
||||
else {
|
||||
|
||||
$scope.falschsound.play();
|
||||
$scope.error = true;
|
||||
$timeout(function () {
|
||||
$scope.error = false;
|
||||
$scope.falscheantwort=$scope.falscheantwort + 1
|
||||
}, 1000);
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
//$timeout(pushA, 5000).then(pushB());
|
||||
|
||||
function showTier0() {
|
||||
$scope.spielneu=0;
|
||||
$scope.spiele[0].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier1() {
|
||||
$scope.spielneu=1;
|
||||
$scope.spiele[1].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier2() {
|
||||
$scope.spielneu=2;
|
||||
$scope.spiele[2].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier3() {
|
||||
$scope.spielneu=3;
|
||||
$scope.spiele[3].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier4() {
|
||||
$scope.spielneu=4;
|
||||
$scope.spiele[4].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier5() {
|
||||
$scope.spielneu=5;
|
||||
$scope.spiele[5].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier6() {
|
||||
$scope.spielneu=6;
|
||||
$scope.spiele[6].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function showTier7() {
|
||||
$scope.spielneu=7;
|
||||
$scope.spiele[7].display=true;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier0() {
|
||||
$scope.spielfertig=0;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier1() {
|
||||
$scope.spielfertig=1;
|
||||
$scope.spiele[0].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier2() {
|
||||
$scope.spielfertig=2;
|
||||
$scope.spiele[1].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier3() {
|
||||
$scope.spielfertig=3;
|
||||
$scope.spiele[2].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier4() {
|
||||
$scope.spielfertig=4;
|
||||
$scope.spiele[3].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier5() {
|
||||
$scope.spielfertig=5;
|
||||
$scope.spiele[4].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier6() {
|
||||
$scope.spielfertig=6;
|
||||
$scope.spiele[5].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function hideTier7() {
|
||||
$scope.spielfertig=7;
|
||||
$scope.spiele[6].display=false;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
}
|
||||
|
||||
function ResetGame() {
|
||||
$scope.spiele[7].display=false;
|
||||
$scope.spielfertig=-1;
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
kartenmischen();
|
||||
$timeout(goto_newspiel, 2000);
|
||||
}
|
||||
|
||||
|
||||
function SetNewGame() {
|
||||
$scope.spielrunden=$scope.spielrunden + 1;
|
||||
$scope.randomid = getRandomInt(0, 7);
|
||||
$scope.tierindex = $scope.randomid;
|
||||
$scope.sounds[$scope.randomid].play();
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Neues Spiel
|
||||
*/
|
||||
function goto_newspiel(){
|
||||
|
||||
|
||||
$scope.errorcode=99;
|
||||
$scope.falscheantwort=0;
|
||||
animatenewgame();
|
||||
}
|
||||
|
||||
|
||||
function animatenewgame(){
|
||||
$timeout(showTier0, 700).then($timeout(showTier1, 1400));
|
||||
$timeout(showTier2, 2100).then($timeout(showTier3, 2800));
|
||||
$timeout(showTier4, 3500).then($timeout(showTier5, 4200));
|
||||
$timeout(showTier6, 4900).then($timeout(showTier7, 5600));
|
||||
$timeout(SetNewGame, 6300);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
//$scope.spielfertig=99;
|
||||
//$scope.spielneu=99;
|
||||
|
||||
function animateoldgame(){
|
||||
|
||||
$timeout(function () {
|
||||
$scope.showmentor=true;
|
||||
$scope.showmentorbravo=false;
|
||||
},0);
|
||||
|
||||
$timeout(hideTier0, 600).then($timeout(hideTier1, 1200));
|
||||
$timeout(hideTier2, 1800).then($timeout(hideTier3, 2400));
|
||||
$timeout(hideTier4, 3000).then($timeout(hideTier5, 3600));
|
||||
$timeout(hideTier6, 4200).then($timeout(hideTier7, 4800));
|
||||
$timeout(ResetGame, 5400);
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
*
|
||||
*/
|
||||
function kartenmischen(){
|
||||
$scope.spiele=shuffleArray($scope.spiele);
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
/*
|
||||
$timeout(function () {
|
||||
$scope.spiele=shuffleArray($scope.spiele);
|
||||
$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
$timeout(function () {
|
||||
@ -155,35 +373,10 @@ $scope.answer = function(src) {
|
||||
}, 500);
|
||||
}, 500);
|
||||
}, 500);
|
||||
$timeout(function () { $scope.showmentorbravo=true; }, 0);
|
||||
$scope.bravosound.play();
|
||||
}
|
||||
else{
|
||||
$scope.falschsound.play();
|
||||
$scope.error = true;
|
||||
$timeout(function () {
|
||||
$scope.error = false;
|
||||
}, 1000);
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Neues Spiel
|
||||
*/
|
||||
function goto_newspiel(){
|
||||
|
||||
$timeout(function () {
|
||||
$scope.showmentor=true;
|
||||
$scope.showmentorbravo=false;
|
||||
},0);
|
||||
$scope.randomid = getRandomInt(1, 8);
|
||||
$scope.sounds[$scope.randomid].play();
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Per Zufall neue Aufgabe definieren
|
||||
*/
|
||||
|
||||
@ -4,12 +4,13 @@
|
||||
|
||||
<div class="row" style="font-size: 12px;" ng-repeat="rows in chunkedData">
|
||||
<div style="width: 100%; text-align: center;" class="col" ng-repeat="item in rows">
|
||||
<img ng-class="{'shake':error}" class="myborder animated" src="img/{{ item.bild }}"width="96" height="96" alig="center" ng-click="answer(item.id)">
|
||||
<img ng-class="{'shake':error, 'rubberBand': errorcode == '{{item.id}}', 'fadeOut': spielfertig == '{{item.id}}', 'fadeIn': spielneu == '{{item.id}}'}" class="myborder animated" src="img/{{ item.bild }}"width="96" height="96" alig="center" ng-click="answer(item.id)" ng-show="item.display">
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="statusbar">
|
||||
{{ tierindex }}
|
||||
<div class="mentorhilfe" ng-click="hilfe()">
|
||||
<div class="mentorborder" ng-show="showmentor">
|
||||
<div class="mentor"></div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user