Skip to content

Commit

Permalink
🐛 Resolve bugs
Browse files Browse the repository at this point in the history
  • Loading branch information
ayman-benammour committed Jun 24, 2022
1 parent 0c28f3a commit 520bdb2
Show file tree
Hide file tree
Showing 6 changed files with 118 additions and 101 deletions.
14 changes: 11 additions & 3 deletions about.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,18 +10,26 @@

<div class="content">

<!-- OTHERS -->
<h1>This website was create for mobile-first. It works on desktop but for better experience, use a mobile.</a></h1>
<br>

<!-- LEGAL MENTION -->
<h1>This website is the student work of <a target="_blank" href="https://www.esin-ecole.com">ESIN school</a>. It exists only for educational purposes and the contents remain the property of their respective authors.</h1>
<h1>This website exists only for educational purposes and the contents remain the property of their respective authors.</h1>
<br>

<!-- DEVELOPED BY -->
<h1>Developed by <a target="_blank" href="https://github.com/ayman-benammour">Ayman Benammour</a></h1>
<!-- API MENTION -->
<h1>API used : <a target="_blank" href="https://pokeapi.co/">PokéApi</a>.</h1>
<br>

<!-- DESIGN INSPIRATION -->
<h1>Design inspiration : <a target="_blank" href="https://dribbble.com/shots/16833947-Mobile-Pokedex-App-Design-Exploration">Mobile Pokedex App&NonBreakingSpace;- Design Exploration by Sulis Triyono</a></h1>
<br>

<!-- DEVELOPED BY -->
<h1>Developed by <a target="_blank" href="https://github.com/ayman-benammour">Ayman Benammour.</a></h1>
<br>

</div>

</div>
Expand Down
9 changes: 7 additions & 2 deletions assets/styles/stylePokemon.css
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@

.cardPokemon img
{
width: 80%;
height: auto;
height: 90%;
object-fit: cover;
}

.categoriesButtons
Expand All @@ -64,6 +64,11 @@
margin-top: 24px;
}

.categoriesButtons div
{
cursor: pointer;
}

.buttonActive
{
color: #2e3056;
Expand Down
2 changes: 1 addition & 1 deletion chunks/footer.php
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<div class="footer">
<a href="../index.php?page=1" class="pokedex">
<a href="../pokedex.php?page=1" class="pokedex">
<img src="../assets/images/pokeball.svg" alt="Pokédex button">
<h2>Pokédex</h2>
</a>
Expand Down
2 changes: 1 addition & 1 deletion includes/config.php
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

// Show errors
error_reporting(E_ALL);
ini_set('display_errors', true);
ini_set('display_errors', false);

// Function curl and create cache
function apiCall($url)
Expand Down
97 changes: 3 additions & 94 deletions index.php
Original file line number Diff line number Diff line change
@@ -1,97 +1,6 @@
<?php
header('test.com', true, 1);

// Includes
include './includes/config.php';
include_once './includes/config.php';


$page = empty($_GET['page']) ? header('location:404.php') : $_GET['page'];
$startAt = ($page - 1) * 30;

$urlPokemonsList = 'https://pokeapi.co/api/v2/pokemon/?offset=' . $startAt . '&limit=30';

$resultJsonPokemonsList = apiCall($urlPokemonsList);

$pokemonsList = $resultJsonPokemonsList->results;

$key = 0;

$urlPokemon = 'https://pokeapi.co/api/v2/pokemon/' . strtolower($key + 1);
$urlSpecies = 'https://pokeapi.co/api/v2/pokemon-species/' . strtolower($key + 1);

$resultJsonPokemon = apiCall($urlPokemon);
$resultJsonSpecies = apiCall($urlSpecies);

?>

<!-- HEADER -->
<?php include './chunks/header.php' ?>
<!-- CSS -->
<link rel="stylesheet" href="../assets/styles/style.css">
<link rel="stylesheet" href="../assets/styles/stylePokedex.css">
</head>
<body>

<main class="grid">
<header class="header">
<h1 class="mainTitle">Pokédex</h1>
<h3 class="descTitle">Search for a Pokémon by using its National Pokédex number</h3>
<!-- FORM -->
<form class="form" action="./pokemon.php?pokemon=<?= $pokemon ?>" method="GET">
<!-- Search bar -->
<input class="inputSubmit" type="submit" value="">
<input class="inputText" type="number" placeholder="Number" name="pokemon" value="<?= $pokemon ?>">
</form>
</header>

<section class="listPokemon">
<?php foreach ($pokemonsList as $key => $pokemonList)
{
$nameOfPokemon = $pokemonList->name;

$urlSpecies = 'https://pokeapi.co/api/v2/pokemon-species/' . $nameOfPokemon;
$urlPokemon = 'https://pokeapi.co/api/v2/pokemon/' . $nameOfPokemon;

include './includes/pokemonConfig.php';
?>
<a href="./pokemon.php?pokemon=<?= $resultJsonPokemon->id ?>" class="pokemonCard" style="background-color:<?= $colorBackground ?>">
<img class="spritePokemonCard" src="<?= $resultJsonPokemon->sprites->other->{'official-artwork'}->front_default ?>" alt="Image of Pokemon">
<h2 class="namePokemonCard"><?= ucfirst($nameOfPokemon) ?></h2>
<h3 class="idPokemonCard"><?= $resultJsonPokemon->id ?></h3>
</a>
<?php } ?>
</section>

<div class="paging">

<a class="previousIcon" href="./index.php?page=<?= $page - 1?>">
<img src="./assets/images/previous-icon.svg">
</a>

<form action="./index.php?page=<?= $page ?>" method="GET">
<select name="page">
<?php
for($id = 1; $id <= 30; $id++)
{
?>
<option value="<?= $id ?>">Page <?= $id ?></option>
<?php
}
$id = $page;
?>
</select>
<input type="submit" value="Go">
</form>

<a class="nextIcon" href="./index.php?page=<?= $page + 1?>">
<img src="./assets/images/next-icon.svg">
</a>

</div>

</main>



<!-- FOOTER -->
<?php include './chunks/footer.php' ?>
header('Location: pokedex.php?page=1');
exit;
95 changes: 95 additions & 0 deletions pokedex.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,95 @@
<?php

// Includes
include './includes/config.php';

$page = $_GET['page'];
$startAt = ($page - 1) * 30;

$urlPokemonsList = 'https://pokeapi.co/api/v2/pokemon/?offset=' . $startAt . '&limit=30';

$resultJsonPokemonsList = apiCall($urlPokemonsList);

$pokemonsList = $resultJsonPokemonsList->results;

$key = 0;

$urlPokemon = 'https://pokeapi.co/api/v2/pokemon/' . strtolower($key + 1);
$urlSpecies = 'https://pokeapi.co/api/v2/pokemon-species/' . strtolower($key + 1);

$resultJsonPokemon = apiCall($urlPokemon);
$resultJsonSpecies = apiCall($urlSpecies);

?>

<!-- HEADER -->
<?php include './chunks/header.php' ?>
<!-- CSS -->
<link rel="stylesheet" href="../assets/styles/style.css">
<link rel="stylesheet" href="../assets/styles/stylePokedex.css">
</head>
<body>

<main class="grid">
<header class="header">
<h1 class="mainTitle">Pokédex</h1>
<h3 class="descTitle">Search for a Pokémon by using its National Pokédex number</h3>
<!-- FORM -->
<form class="form" action="./pokemon.php?pokemon=<?= $pokemon ?>" method="GET">
<!-- Search bar -->
<input class="inputSubmit" type="submit" value="">
<input class="inputText" type="number" placeholder="Number" name="pokemon" value="<?= $pokemon ?>">
</form>
</header>

<section class="listPokemon">
<?php foreach ($pokemonsList as $key => $pokemonList)
{
$nameOfPokemon = $pokemonList->name;

$urlSpecies = 'https://pokeapi.co/api/v2/pokemon-species/' . $nameOfPokemon;
$urlPokemon = 'https://pokeapi.co/api/v2/pokemon/' . $nameOfPokemon;

include './includes/pokemonConfig.php';
?>
<a href="./pokemon.php?pokemon=<?= $resultJsonPokemon->id ?>" class="pokemonCard" style="background-color:<?= $colorBackground ?>">
<img class="spritePokemonCard" src="<?= $resultJsonPokemon->sprites->other->{'official-artwork'}->front_default ?>" alt="Image of Pokemon">
<h2 class="namePokemonCard"><?= ucfirst($nameOfPokemon) ?></h2>
<h3 class="idPokemonCard"><?= $resultJsonPokemon->id ?></h3>
</a>
<?php } ?>
</section>

<div class="paging">

<a class="previousIcon" href="./pokedex.php?page=<?= $page - 1?>">
<img src="./assets/images/previous-icon.svg">
</a>

<form action="./pokedex.php?page=<?= $page ?>" method="GET">
<select name="page">
<?php
for($id = 1; $id <= 30; $id++)
{
?>
<option value="<?= $id ?>">Page <?= $id ?></option>
<?php
}
$id = $page;
?>
</select>
<input type="submit" value="Go">
</form>

<a class="nextIcon" href="./pokedex.php?page=<?= $page + 1?>">
<img src="./assets/images/next-icon.svg">
</a>

</div>

</main>



<!-- FOOTER -->
<?php include './chunks/footer.php' ?>

0 comments on commit 520bdb2

Please sign in to comment.