Raataar/pokedex
3
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Detailsseite angepasst, Liste angepasst, Liste klickbar gemacht

Browse Source
This commit is contained in:
Hilmer, Carsten 2016-09-09 13:37:20 +02:00
parent 4ac611f7f3
commit 4f254274ef
9 changed files with 70 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
www/css/custom_style.css
View File

@ -6,6 +6,10 @@ md-input-container {
width: 50%; width: 50%;
} }
.Width95 {
width: 95%;
}
.itemfontsize{ .itemfontsize{
font-size: 14px; font-size: 14px;
} }
@ -118,7 +122,7 @@ md-input-container {
background-color: #705848; background-color: #705848;
} }
/* Typ Stahl */ /* Typ Stahl */
.pokemontyp18{ .pokemontyp17{
background-color: #B8B8D0; background-color: #B8B8D0;
} }
/* Typ Flug */ /* Typ Flug */

3
www/js/app.js
View File

@ -341,7 +341,7 @@ angular.module('starter', ['ionic','ngIOS9UIWebViewPatch','starter.controllers',
}) })
.state('app.pokemonlist', { .state('app.pokemonlist', {
url: "/pokemonlist", url: "/pokemonlist",
cache: false, cache: true,
params:{ params:{
isAnimated:(ionic.Platform.isAndroid()==false) isAnimated:(ionic.Platform.isAndroid()==false)
}, },
@ -354,6 +354,7 @@ angular.module('starter', ['ionic','ngIOS9UIWebViewPatch','starter.controllers',
}) })
.state('app.pokemondetail', { .state('app.pokemondetail', {
url: "/pokemondetail", url: "/pokemondetail",
cache: false,
params: { params: {
pokemondetail: null pokemondetail: null
}, },

BIN
www/pokedex.db
View File

Binary file not shown.

2
www/templates/imagedownload/html/imagedownload.html
View File

@ -16,7 +16,7 @@
<button class="button button-full" ng-click="downloadabbrechen()" ng-show="AbbrechenisVisible"> <button class="button button-full" ng-click="downloadabbrechen()" ng-show="AbbrechenisVisible">
Download abbrechen Download abbrechen
</button> </button>
<progress id="progressbar" max="721" value="{{ progressval }}"> </progress> <progress id="progressbar" max="152" value="{{ progressval }}"> </progress>
<div id="progressbarlabel">{{ progressprozent }} %</div> <div id="progressbarlabel">{{ progressprozent }} %</div>
<div id="currentfile">Aktuelle Datei: {{ currentfile }}</div> <div id="currentfile">Aktuelle Datei: {{ currentfile }}</div>
<p> <p>

2
www/templates/imagedownload/js/controllers.js
View File

@ -15,7 +15,7 @@
// Controller of Contract List Page. // Controller of Contract List Page.
appControllers.controller('imageDownloadCtrl', function ($scope, $stateParams, $mdBottomSheet, $timeout, $mdDialog, $cordovaFileTransfer, $cordovaFile, $state, pokedexDB) { appControllers.controller('imageDownloadCtrl', function ($scope, $stateParams, $mdBottomSheet, $timeout, $mdDialog, $cordovaFileTransfer, $cordovaFile, $state, pokedexDB) {
$scope.progressval = 0; $scope.progressval = 0;
$scope.currentfile = ''; $scope.currentfile = '';
$scope.progressprozent = 0; $scope.progressprozent = 0;
$scope.DownloadisVisible=true; $scope.DownloadisVisible=true;

21
www/templates/pokemonliste/html/pokemon-detail.html
View File

@ -48,20 +48,20 @@
<div class="col-100 itemfontsize">Entw. ab:</div> <div class="col-100 itemfontsize">Entw. ab:</div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-100 itemfontsize">{{pokemon.pokemonentwicklungtext}} {{pokemon.pokemonname}}-Bonbons</div> <div class="col-100 itemfontsize">{{pokemon.pokemonentwicklungtext}} Bonbons</div>
</div> </div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-50"> <div class="col-50">
<div ng-if="pokemon.pokemontypa > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypa }} full-image"> <div ng-if="pokemon.pokemontypa > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypa }} full-image">
<img src="img/typbilder/{{ pokemon.pokemontypa }}.png" alt="PokemonTyp" width="32" height="32"> <img src="img/typbilder/{{ pokemon.pokemontypa }}.png" alt="PokemonTyp" width="32" height="32">
{{ pokemon.pokemontypaString }} {{ pokemon.pokemontypaString }}
</div> </div>
</div> </div>
<div class="col-50"> <div class="col-50">
<div nv class="pokemontypnor pokemontyp{{ pokemon.pokemontypb }} full-image"> <div ng-if="pokemon.pokemontypb > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypb }} full-image">
<img src="img/typbilder/{{ pokemon.pokemontypb }}.png" alt="PokemonTyp" width="32" height="32"> <img src="img/typbilder/{{ pokemon.pokemontypb }}.png" alt="PokemonTyp" width="32" height="32">
{{ pokemon.pokemontypbString }} {{ pokemon.pokemontypbString }}
</div> </div>
@ -80,23 +80,21 @@
<div class="item item-divider"> <div class="item item-divider">
Entwicklung Entwicklung
</div> </div>
<div class="item item-text-wrap">
<md-list> <md-list>
<div class="row" ng-repeat="pokemonentwicklung in pokemonentwicklungliste" style="font-size: 10px;"> <div class="row" ng-repeat="pokemonentwicklung in pokemonentwicklungliste" style="font-size: 10px;">
<div class="col-100 col-center mycenter" > <div class="col-33 col-center"></div>
<div class="col-33 col-center">
<div style="margin: 0 auto; width:100%"> <div>
<p ng-if="pokemonentwicklung.pokemonlistentyp == 2">{{ pokemonentwicklung.pokemonpokedexid }} Bonbons</p> <p ng-if="pokemonentwicklung.pokemonlistentyp == 2">{{ pokemonentwicklung.pokemonpokedexid }} Bonbons</p>
<img ng-if="pokemonentwicklung.pokemonlistentyp == 1" src="{{pokemonentwicklung.pokemonimage}}" width="64" height="64"> <img ng-if="pokemonentwicklung.pokemonlistentyp == 1" src="{{pokemonentwicklung.pokemonimage}}" width="64" height="64">
<p ng-if="pokemonentwicklung.pokemonlistentyp == 1">Pokedex-ID: {{ pokemonentwicklung.pokemonpokedexid }} </p> <p ng-if="pokemonentwicklung.pokemonlistentyp == 1">Pokedex-ID: {{ pokemonentwicklung.pokemonpokedexid }} </p>
</div> </div>
</div> </div>
<div class="col-33 col-center"></div>
</div> </div>
</md-list> </md-list>
</div>
</div> </div>
@ -154,6 +152,7 @@
Hinweis: Angriffe durch Starke Attacken (<div style="height:5px;width:5px;display: inline-block;" class="typstark"></div>) sollten vermieden werden. Hinweis: Angriffe durch Starke Attacken (<div style="height:5px;width:5px;display: inline-block;" class="typstark"></div>) sollten vermieden werden.
</div> </div>
</div> </div>
</md-list-item>
</md-list> </md-list>
</div> </div>

21
www/templates/pokemonliste/html/pokemon-list.html
View File

@ -19,7 +19,7 @@
<div> <div>
<md-list-item> <md-list-item>
<md-input-container md-no-float="" class="md-list-item-full-width"> <md-input-container md-no-float="" class="md-list-item-full-width">
<input ng-model="filterText" placeholder="Finde Pokemon..." ng-minlength="3"> <input ng-model="filterText" placeholder="Finde Pokemon..." ng-minlength="3" ng-change="scrollTop()">
</md-input-container> </md-input-container>
</md-list-item> </md-list-item>
</div> </div>
@ -29,9 +29,8 @@
<ion-content id="pokemon-list-content" class="fade-in"> <ion-content id="pokemon-list-content" class="fade-in">
<!--list section--> <!--list section-->
<md-list> <md-list>
<!--Below code it will disable animation to better performance--> <!--Below code it will disable animation to better performance-->
<div ng-if="!isAnimated" class="row pokemon-list-item" <div ng-if="!isAnimated" class="row pokemon-list-item md-list-item-default"
ng-repeat="pokemon in pokemons | filter: filterText | orderBy: 'pokemonname' | limitTo: numberOfItemsToDisplay"> ng-repeat="pokemon in pokemons | filter: filterText | orderBy: 'pokemonname' | limitTo: numberOfItemsToDisplay">
<div class="col-25 icon-user"> <div class="col-25 icon-user">
<img ng-src="{{ pokemon.pokemonimage }}" class="image-list-thumb"/> <img ng-src="{{ pokemon.pokemonimage }}" class="image-list-thumb"/>
@ -98,17 +97,29 @@
</div> </div>
<div class="col-75"> <div class="col-75">
<div class="row" ng-click="navigateTo('app.pokemondetail',pokemon)">
<div class="col-100">
<h4>{{ pokemon.pokemonname }}</h4> <h4>{{ pokemon.pokemonname }}</h4>
<h5>Pokedex-Id: {{ pokemon.pokedexidString }}</h5> <h5>Pokedex-Id: {{ pokemon.pokedexidString }}</h5>
<div ng-if="pokemon.pokemontypa > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypa }}"> </div>
</div>
<div class="row">
<div class="col-50">
<div ng-if="pokemon.pokemontypa > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypa }} Width95">
<img src="img/typbilder/{{ pokemon.pokemontypa }}.png" alt="PokemonTyp" width="32" height="32"> <img src="img/typbilder/{{ pokemon.pokemontypa }}.png" alt="PokemonTyp" width="32" height="32">
{{ pokemon.pokemontypaString }} {{ pokemon.pokemontypaString }}
</div> </div>
<div ng-if="pokemon.pokemontypb > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypb }}"> </div>
<div class="col-50">
<div ng-if="pokemon.pokemontypb > 0" class="pokemontypnor pokemontyp{{ pokemon.pokemontypb }} Width95">
<img src="img/typbilder/{{ pokemon.pokemontypb }}.png" alt="PokemonTyp" width="32" height="32"> <img src="img/typbilder/{{ pokemon.pokemontypb }}.png" alt="PokemonTyp" width="32" height="32">
{{ pokemon.pokemontypbString }} {{ pokemon.pokemontypbString }}
</div> </div>
</div> </div>
</div>
</div>
</div> </div>
<!--Below code it will show animation when selecting row.--> <!--Below code it will show animation when selecting row.-->

51
www/templates/pokemonliste/js/controllers.js
View File

@ -13,7 +13,7 @@
// http://ngcordova.com/docs/plugins/sqlite/ // http://ngcordova.com/docs/plugins/sqlite/
// //
// Controller of Pokemon List Page. // Controller of Pokemon List Page.
appControllers.controller('pokemonListCtrl', function ($scope, $stateParams,$filter, $mdDialog, $timeout, $ionicModal, $state, $mdBottomSheet, pokedexDB) { appControllers.controller('pokemonListCtrl', function ($scope, $stateParams,$ionicScrollDelegate, $filter, $mdDialog, $timeout, $ionicModal, $state, $mdBottomSheet, pokedexDB) {
// initialForm is the first activity in the controller. // initialForm is the first activity in the controller.
// It will initial all variable data and let the function works when page load. // It will initial all variable data and let the function works when page load.
@ -50,7 +50,7 @@ appControllers.controller('pokemonListCtrl', function ($scope, $stateParams,$fil
jQuery('#pokemon-list-loading-progress').hide(); jQuery('#pokemon-list-loading-progress').hide();
jQuery('#pokemon-list-content').fadeIn(); jQuery('#pokemon-list-content').fadeIn();
$scope.isLoading = false; $scope.isLoading = false;
}, 3000);// End loading progress. }, 1000);// End loading progress.
};// End initialForm. };// End initialForm.
@ -67,6 +67,16 @@ appControllers.controller('pokemonListCtrl', function ($scope, $stateParams,$fil
$scope.pokemons = pokedexDB.all(); $scope.pokemons = pokedexDB.all();
};//End getPokemonList. };//End getPokemonList.
//Scroll Trefferliste nach oben
//Wenn filtereingaben getätigt werden
$scope.scrollTop = function() {
if ($scope.filterText.length > 2){
$ionicScrollDelegate.scrollTop();
}
};
// navigateTo is for navigate to other page // navigateTo is for navigate to other page
// by using targetPage to be the destination page // by using targetPage to be the destination page
// and sending objectData to the destination page. // and sending objectData to the destination page.
@ -81,7 +91,10 @@ appControllers.controller('pokemonListCtrl', function ($scope, $stateParams,$fil
},400); },400);
};// End navigateTo. };// End navigateTo.
$scope.initialForm(); $scope.$on('$ionicView.loaded', function(viewInfo, state){
console.log('CTRL - $ionicView.loaded', viewInfo, state);
$scope.initialForm();
});
});// End of Pokemon List Page Controller. });// End of Pokemon List Page Controller.
@ -99,29 +112,31 @@ appControllers.controller('pokemonDetailCtrl', function ($mdBottomSheet, $mdToas
// Parameter : // Parameter :
// $stateParams.pokemondetail(object) = pokemon that user select from pokemon list page. // $stateParams.pokemondetail(object) = pokemon that user select from pokemon list page.
$scope.pokemon = $scope.getPokemonData($stateParams.pokemondetail); $scope.pokemon = $scope.getPokemonData($stateParams.pokemondetail);
console.debug($scope.pokemon);
var entwarr = $scope.pokemon.pokemonentwicklung.split("|"); var entwarr = $scope.pokemon.pokemonentwicklung.split("|");
var entwkostenarr=$scope.pokemon.pokemonentwicklungkosten.split("|"); var entwkostenarr=$scope.pokemon.pokemonentwicklungkosten.split("|");
var index; if (entwarr!=''){
for (index = 0; index < entwarr.length; ++index) { var index;
for (index = 0; index < entwarr.length; ++index) {
var dataItemEntwicklung = {
pokemonpokedexid : entwarr[index] ,
pokemonimage : $scope.getPokemonImage(entwarr[index]),
pokemonlistentyp : 1
};
$scope.pokemonentwicklungliste.push(dataItemEntwicklung);
if (entwkostenarr[index]>0){
var dataItemEntwicklung = { var dataItemEntwicklung = {
pokemonpokedexid : entwkostenarr[index] , pokemonpokedexid : entwarr[index] ,
pokemonlistentyp : 2 pokemonimage : $scope.getPokemonImage(entwarr[index]),
pokemonlistentyp : 1
}; };
$scope.pokemonentwicklungliste.push(dataItemEntwicklung); $scope.pokemonentwicklungliste.push(dataItemEntwicklung);
}
}
if (entwkostenarr[index]>0){
var dataItemEntwicklung = {
pokemonpokedexid : entwkostenarr[index] ,
pokemonlistentyp : 2
};
$scope.pokemonentwicklungliste.push(dataItemEntwicklung);
}
}
}
//$scope.actionDelete is the variable for allow or not allow to delete data. //$scope.actionDelete is the variable for allow or not allow to delete data.
// It will allow to delete data when have data in the database. // It will allow to delete data when have data in the database.
$timeout(function () { $timeout(function () {

3
www/templates/pokemonliste/js/services.js
View File

@ -50,7 +50,8 @@ appServices.factory('pokedexDB', function ($cordovaSQLite)
pokemonList = []; pokemonList = [];
pokemontypen = []; pokemontypen = [];
pokemonfundorte = []; pokemonfundorte = [];
pokemonimages = [];
//Typen einlesen //Typen einlesen
var query = "SELECT * FROM tblPokemonTyp order by ID ASC"; var query = "SELECT * FROM tblPokemonTyp order by ID ASC";
$cordovaSQLite.execute(db, query).then(function (res) $cordovaSQLite.execute(db, query).then(function (res)