Refactoring and Code CleanUp, CSS added
This commit is contained in:
Hilmer, Carsten
parent
685c34cff8
commit
4e5f686332
@ -19,6 +19,8 @@
|
||||
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
|
||||
<link href="css/style.css" rel="stylesheet">
|
||||
<link href="css/animate.css" rel="stylesheet">
|
||||
<link href="css/animations.css" rel="stylesheet">
|
||||
<link href="css/magic.css" rel="stylesheet">
|
||||
|
||||
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
|
||||
<link href="css/ionic.app.css" rel="stylesheet">
|
||||
|
||||
@ -6,7 +6,9 @@
|
||||
angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable', 'kinderspiel.controllers', 'kinderspiel.services'])
|
||||
|
||||
.run(function($ionicPlatform, $state, backgroundsounds_mediahandler) {
|
||||
|
||||
$ionicPlatform.ready(function() {
|
||||
|
||||
if(window.cordova && window.cordova.plugins.Keyboard) {
|
||||
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
|
||||
// for form inputs)
|
||||
@ -17,6 +19,7 @@ angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable',
|
||||
// a much nicer keyboard experience.
|
||||
cordova.plugins.Keyboard.disableScroll(true);
|
||||
}
|
||||
|
||||
if(window.StatusBar) {
|
||||
StatusBar.styleDefault();
|
||||
}
|
||||
@ -27,7 +30,7 @@ angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable',
|
||||
screen.lockOrientation('landscape');
|
||||
|
||||
/*
|
||||
* Bildschirm aktiv halten
|
||||
* Bildschirm aktiv halten einschalten
|
||||
*/
|
||||
window.plugins.insomnia.keepAwake();
|
||||
/*
|
||||
@ -43,7 +46,7 @@ angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable',
|
||||
setTimeout(function() {
|
||||
backgroundsounds_mediahandler.setbackgroundstate(false);
|
||||
backgroundsounds_mediahandler.playbackgroundmusic();
|
||||
console.log("The application is resuming from the background" + backgroundsounds_mediahandler.getbackgroundstate());
|
||||
//console.log("The application is resuming from the background" + backgroundsounds_mediahandler.getbackgroundstate());
|
||||
}, 0);
|
||||
}
|
||||
|
||||
@ -52,19 +55,26 @@ angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable',
|
||||
setTimeout(function() {
|
||||
backgroundsounds_mediahandler.setbackgroundstate(true);
|
||||
backgroundsounds_mediahandler.stopbackgroundmusic();
|
||||
console.log("The application is going to the background" + backgroundsounds_mediahandler.getbackgroundstate());
|
||||
//console.log("The application is going to the background" + backgroundsounds_mediahandler.getbackgroundstate());
|
||||
}, 0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Backbutton Handling
|
||||
*/
|
||||
$ionicPlatform.registerBackButtonAction(function (event) {
|
||||
/*
|
||||
* Startseite
|
||||
*/
|
||||
if($state.current.name=="home"){
|
||||
backgroundsounds_mediahandler.stopbackgroundmusic();
|
||||
navigator.app.exitApp(); //<-- remove this line to disable the exit
|
||||
/*
|
||||
* App-Beenden
|
||||
*/
|
||||
navigator.app.exitApp();
|
||||
}
|
||||
else {
|
||||
navigator.app.backHistory();
|
||||
navigator.app.backHistory();
|
||||
}
|
||||
}, 100);
|
||||
|
||||
@ -80,8 +90,10 @@ angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable',
|
||||
// Each state's controller can be found in controllers.js
|
||||
$stateProvider
|
||||
|
||||
// setup an abstract state for the tabs directive
|
||||
.state('home', {
|
||||
/*
|
||||
* Routen setzen
|
||||
*/
|
||||
.state('home', {
|
||||
url: '/home',
|
||||
abstract: false,
|
||||
templateUrl: 'templates/home.html',
|
||||
@ -94,7 +106,9 @@ angular.module('kinderspiel', ['ionic', 'ngCordova','ngAnimate', 'ngDraggable',
|
||||
})
|
||||
|
||||
|
||||
// if none of the above states are matched, use this as the fallback
|
||||
/*
|
||||
* Standard-Route setzen
|
||||
*/
|
||||
$urlRouterProvider.otherwise('/home');
|
||||
|
||||
});
|
||||
@ -1,19 +1,31 @@
|
||||
appControllers.controller('home', function($scope, $ionicPlatform, $cordovaMedia, $state, backgroundsounds_mediahandler ) {
|
||||
|
||||
$scope.showmentor=false;
|
||||
/*
|
||||
* Mentor-Anitmation ausschalten
|
||||
*/
|
||||
$scope.showmentor=false;
|
||||
|
||||
$ionicPlatform.ready(function() {
|
||||
var mediastartesuchspiel = new Media('/android_asset/www/sounds/suchspiel.mp3', suchspiel_intro_finish,null);
|
||||
$scope.mediastartesuchspiel=mediastartesuchspiel;
|
||||
backgroundsounds_mediahandler.playbackgroundmusic();
|
||||
});
|
||||
/*
|
||||
* Hintergrundmusik laden und starten
|
||||
*/
|
||||
$ionicPlatform.ready(function() {
|
||||
var mediastartesuchspiel = new Media('/android_asset/www/sounds/suchspiel.mp3', suchspiel_intro_finish,null);
|
||||
$scope.mediastartesuchspiel=mediastartesuchspiel;
|
||||
backgroundsounds_mediahandler.playbackgroundmusic();
|
||||
});
|
||||
|
||||
/*
|
||||
* Suchspiel wurde angeklickt, Sound abspielen, Mentor-Animation starten
|
||||
*/
|
||||
$scope.suchspiel_intro = function(){
|
||||
$scope.showmentor=true;
|
||||
$scope.mediastartesuchspiel.play();
|
||||
$scope.mediastartesuchspiel.setVolume('1.0');
|
||||
}
|
||||
|
||||
/*
|
||||
* Suchspiel Sound ist beendet, Mentor-Animation ausschalten, Suchspiel starten
|
||||
*/
|
||||
function suchspiel_intro_finish() {
|
||||
$scope.mediastartesuchspiel.release();
|
||||
$scope.showmentor=false;
|
||||
|
||||
@ -44,14 +44,4 @@ angular.module('kinderspiel.services', [])
|
||||
return inbackground;
|
||||
}
|
||||
};
|
||||
})
|
||||
|
||||
.factory("kcSleep", function($timeout) {
|
||||
return function(ms) {
|
||||
return function(value) {
|
||||
return $timeout(function() {
|
||||
return value;
|
||||
}, ms);
|
||||
};
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
@ -1,24 +1,31 @@
|
||||
appControllers.controller('Suchspiel', function($scope, $ionicPlatform, $cordovaMedia, $state, $timeout,$q) {
|
||||
|
||||
|
||||
/*
|
||||
* Initialisierung
|
||||
*/
|
||||
|
||||
//Mentor-Animation ausschalten
|
||||
$scope.showmentor=false;
|
||||
$scope.showmentorbravo=false;
|
||||
|
||||
//Kartenarray + ListenAnsichtArray
|
||||
$scope.spiele=[];
|
||||
$scope.spielelistensort=[];
|
||||
|
||||
$scope.spieleview=[];
|
||||
$scope.tierfinden='';
|
||||
//Zufallsgenerator ID = TierindexID
|
||||
$scope.randomid=0;
|
||||
$scope.error = false;
|
||||
$scope.spielrunden=0;
|
||||
$scope.falscheantwort=0;
|
||||
|
||||
//Karten-Index zum geben / nehmen
|
||||
$scope.cardindex=0;
|
||||
|
||||
$scope.errorcode=99;
|
||||
$scope.tierindex=99;
|
||||
$scope.spielfertig=-1;
|
||||
$scope.spielneu=-1;
|
||||
|
||||
//CSS-Steuerung (alias für addClass)
|
||||
$scope.CSSErrorCode=99;
|
||||
$scope.CSSAusblendung=-1;
|
||||
$scope.CSSEinblendung=-1;
|
||||
$scope.CSSFalscheAntwort = false;
|
||||
|
||||
$ionicPlatform.ready(function() {
|
||||
|
||||
@ -26,9 +33,10 @@ $ionicPlatform.ready(function() {
|
||||
* Sounds definieren
|
||||
*/
|
||||
$scope.sounds=[];
|
||||
//$scope.sounds.push('');
|
||||
|
||||
|
||||
/*
|
||||
* Sounds laden
|
||||
*/
|
||||
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);
|
||||
var tiersound3 = new Media('/android_asset/www/sounds/finde_hahn.mp3', mentorausblenden,null);
|
||||
@ -43,6 +51,10 @@ $ionicPlatform.ready(function() {
|
||||
|
||||
var kartegebensound = new Media('/android_asset/www/sounds/karte.mp3', kartegeben,null);
|
||||
|
||||
|
||||
/*
|
||||
* Sounds in $Scope referenzieren
|
||||
*/
|
||||
$scope.bravosound=bravosound;
|
||||
$scope.falschsound=falschsound;
|
||||
$scope.kartegebensound=kartegebensound;
|
||||
@ -175,7 +187,7 @@ $scope.hilfe = function() {
|
||||
|
||||
|
||||
/*
|
||||
* Mentor ausblenden
|
||||
* Mentor ausblenden, nach Soundausgabe
|
||||
*/
|
||||
function mentorausblenden(){
|
||||
$timeout(function () { $scope.showmentor=false; $scope.cardindex=-1}, 10);
|
||||
@ -186,51 +198,54 @@ function mentorausblenden(){
|
||||
/*
|
||||
* Antwort prüfen
|
||||
*/
|
||||
$scope.answer = function(src) {
|
||||
$scope.PlayerAnswer = function(src) {
|
||||
|
||||
/*
|
||||
* Antwort ist richtig
|
||||
*/
|
||||
if (src==$scope.randomid){
|
||||
$timeout(function () { $scope.showmentorbravo=true;$scope.cardindex=0; }, 0);
|
||||
$scope.bravosound.play();
|
||||
}
|
||||
else{
|
||||
|
||||
//$scope.spiele[$scope.randomid].errorcode=true;
|
||||
/*
|
||||
* Antwort war dreimal falsch
|
||||
*/
|
||||
if ($scope.falscheantwort==2){
|
||||
$scope.errorcode=$scope.randomid;
|
||||
$scope.error = false;
|
||||
$scope.CSSErrorCode=$scope.randomid;
|
||||
$scope.CSSFalscheAntwort= false;
|
||||
$timeout(function () {
|
||||
$scope.errorcode=99;
|
||||
$scope.CSSErrorCode=99;
|
||||
$timeout(function () {
|
||||
$scope.errorcode=$scope.randomid;
|
||||
$scope.CSSErrorCode=$scope.randomid;
|
||||
$timeout(function () { $scope.cardindex=0;karteausblenden(); }, 2400);
|
||||
}, 1400);
|
||||
}, 700);
|
||||
|
||||
}
|
||||
else {
|
||||
/*
|
||||
* Antwort ist falsch
|
||||
*/
|
||||
$scope.falschsound.play();
|
||||
$scope.error = true;
|
||||
$scope.CSSFalscheAntwort = true;
|
||||
$timeout(function () {
|
||||
$scope.error = false;
|
||||
$scope.CSSFalscheAntwort = false;
|
||||
$scope.falscheantwort=$scope.falscheantwort + 1
|
||||
}, 1000);
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Neues Spiel
|
||||
* Neues Spiel starten
|
||||
*/
|
||||
function goto_newspiel(){
|
||||
$scope.errorcode=99;
|
||||
$scope.CSSErrorCode=99;
|
||||
$scope.falscheantwort=0;
|
||||
$scope.spielneu=0;
|
||||
$scope.CSSEinblendung=0;
|
||||
$scope.cardindex=-1;
|
||||
|
||||
kartenmischen();
|
||||
@ -239,9 +254,10 @@ function goto_newspiel(){
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Karten austeilen
|
||||
*/
|
||||
function kartegeben(){
|
||||
|
||||
|
||||
$timeout(function () {
|
||||
$scope.cardindex=$scope.cardindex + 1;
|
||||
$scope.spielelistensort[$scope.cardindex].display=true;
|
||||
@ -249,28 +265,30 @@ function kartegeben(){
|
||||
for(var i = 0; i < $scope.spiele.length; i++) {
|
||||
var data= $scope.spiele[i];
|
||||
if (data.id==$scope.spielelistensort[$scope.cardindex].id){
|
||||
$scope.spielneu=data.einblendecssid;
|
||||
$scope.CSSEinblendung=data.einblendecssid;
|
||||
}
|
||||
}
|
||||
|
||||
}, 0);
|
||||
|
||||
|
||||
/*
|
||||
* Interner Zähler bis alle Karten gegeben wurden
|
||||
*/
|
||||
if ($scope.cardindex < 6 ){
|
||||
$scope.kartegebensound.play();
|
||||
}
|
||||
else{
|
||||
$scope.spielneu='';
|
||||
$scope.CSSEinblendung='';
|
||||
$scope.randomid=getRandomInt(0, 7);
|
||||
$scope.showmentor=true;
|
||||
$scope.sounds[$scope.randomid].play();
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Karten wieder einsammeln, runde beendet
|
||||
*/
|
||||
function karteausblenden(){
|
||||
$timeout(function () { $scope.showmentorbravo=false; }, 0);
|
||||
|
||||
@ -279,7 +297,7 @@ function karteausblenden(){
|
||||
for(var i = 0; i < $scope.spiele.length; i++) {
|
||||
var data= $scope.spiele[i];
|
||||
if (data.id==$scope.spielelistensort[$scope.cardindex].id){
|
||||
$scope.spielfertig=data.ausblendecssid;
|
||||
$scope.CSSAusblendung=data.ausblendecssid;
|
||||
}
|
||||
}
|
||||
$timeout(function () {
|
||||
@ -290,7 +308,7 @@ function karteausblenden(){
|
||||
}, 500);
|
||||
}
|
||||
else{
|
||||
$scope.spielfertig='';
|
||||
$scope.CSSAusblendung='';
|
||||
goto_newspiel();
|
||||
}
|
||||
|
||||
@ -312,15 +330,12 @@ function kartenmischen(){
|
||||
data.sortid=i;
|
||||
$scope.spielelistensort.push(data);
|
||||
}
|
||||
$scope.tierindex=$scope.spiele.length + " - " + $scope.spielelistensort.length;
|
||||
$scope.chunkedData = chunk($scope.spielelistensort, 4);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*
|
||||
* Per Zufall neue Aufgabe definieren
|
||||
* Zufallsgenerator um per Zufall neue Aufgabe definieren
|
||||
*/
|
||||
function getRandomInt(min, max) {
|
||||
var tmpInt=0;
|
||||
@ -335,12 +350,11 @@ function getRandomInt(min, max) {
|
||||
if (tmpInt < min){
|
||||
tmpInt=min;
|
||||
}
|
||||
|
||||
return tmpInt;
|
||||
}
|
||||
|
||||
/*
|
||||
* TierArray per Zufall mischen
|
||||
* Karten per Zufall mischen
|
||||
*/
|
||||
var shuffleArray = function(array) {
|
||||
var m = array.length, t, i;
|
||||
@ -371,15 +385,15 @@ function chunk(arr, size) {
|
||||
}
|
||||
//$scope.chunkedData = chunk($scope.spiele, 4);
|
||||
|
||||
|
||||
/*
|
||||
* Initial - Neues Spiel starten
|
||||
* Initial - Neues Spiel starten (erste runde) von 3 runter zählen
|
||||
*/
|
||||
$scope.inittimercounter=3;
|
||||
$scope.showinittimer=true;
|
||||
$timeout(function () { inittimer(); }, 1000);
|
||||
|
||||
function inittimer(){
|
||||
|
||||
function inittimer(){
|
||||
if ($scope.inittimercounter > 0){
|
||||
|
||||
$timeout(function () {
|
||||
|
||||
@ -9,13 +9,12 @@
|
||||
|
||||
<div class="row" style="font-size: 12px;padding-top:35px;" ng-repeat="rows in chunkedData">
|
||||
<div style="width: 100%; text-align: center;" class="col" ng-repeat="item in rows">
|
||||
<img ng-class="{'shake':error, 'rubberBand': errorcode == '{{item.id}}', 'bounceOut': spielfertig == '{{item.ausblendecssid}}', 'tada': spielneu == '{{item.einblendecssid}}'}" class="myborder animated" src="img/{{ item.bild }}"width="96" height="96" alig="center" ng-click="answer(item.id)" ng-show="item.display">{{item.sortid}}
|
||||
<img ng-class="{'shake': CSSFalscheAntwort, 'rubberBand': CSSErrorCode == '{{item.id}}', 'bounceOut': CSSAusblendung == '{{item.ausblendecssid}}', 'tada': CSSEinblendung == '{{item.einblendecssid}}'}" class="myborder animated" src="img/{{ item.bild }}"width="96" height="96" alig="center" ng-click="PlayerAnswer(item.id)" ng-show="item.display">
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="statusbar">
|
||||
{{ tierindex }} - {{cardindex}}
|
||||
<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