app/views/anime/details.php

@@ -39,6 +39,9 @@
 					</td>
 				</tr>
 			</table>
+
+			<br />
+
 		</aside>
 		<article class="text">
 			<h2 class="toph"><a rel="external" href="<?= $data['url'] ?>"><?= $data['title'] ?></a></h2>
@@ -141,7 +144,6 @@
 	<?php endif ?>
 
 	<?php if (count($data['staff']) > 0): ?>
-	<?php //dump($data['staff']); ?>
 	<section>
 		<h2>Staff</h2>
 

app/views/manga/details.php

@@ -25,6 +25,8 @@
 					</td>
 				</tr>
 			</table>
+
+			<br />
 		</aside>
 		<article class="text">
 			<h2 class="toph"><a rel="external" href="<?= $data['url'] ?>"><?= $data['title'] ?></a></h2>
@@ -37,11 +39,12 @@
 		</article>
 	</section>
 
-	<?php if (count($characters) > 0): ?>
+	<?php if (count($data['characters']) > 0): ?>
 		<h2>Characters</h2>
+
 		<div class="tabs">
 			<?php $i = 0 ?>
-			<?php foreach ($characters as $role => $list): ?>
+			<?php foreach ($data['characters'] as $role => $list): ?>
 				<input
 					type="radio" name="character-role-tabs"
 					id="character-tabs<?= $i ?>" <?= $i === 0 ? 'checked' : '' ?> />
@@ -66,12 +69,12 @@
 		</div>
 	<?php endif ?>
 
-	<?php if (count($staff) > 0): ?>
+	<?php if (count($data['staff']) > 0): ?>
 		<h2>Staff</h2>
 
 		<div class="vertical-tabs">
 			<?php $i = 0 ?>
-			<?php foreach ($staff as $role => $people): ?>
+			<?php foreach ($data['staff'] as $role => $people): ?>
 				<div class="tab">
 					<input
 						type="radio" name="staff-roles" id="staff-role<?= $i ?>" <?= $i === 0 ? 'checked' : '' ?> />

public/css/responsive.css

@@ -39,23 +39,26 @@
 	table .align-right,
 	table.align-center {
 		border: 0;
-		display: block;
-		margin: 0 auto;
+		/* display: block; */
+		margin-left: auto;
+		margin-right: auto;
 		text-align: left;
 		width: 100%;
 	}
 
-	table tbody {
-		width: 100%;
-	}
-
 	table td {
 		display: inline-block;
 	}
 
+	table tbody,
+	table.media-details {
+		width: 100%;
+	}
+
 	table.media-details td {
 		display: block;
 		text-align: left !important;
+		width: 100%;
 	}
 
 	table thead {

src/API/Kitsu/Transformer/CharacterTransformer.php

@@ -22,7 +22,7 @@ use Aviat\AnimeClient\Types\Character;
 use Aviat\Ion\Transformer\AbstractTransformer;
 
 /**
- * Data transformation class for zippered Hummingbird manga
+ * Data transformation class for character pages
  */
 final class CharacterTransformer extends AbstractTransformer {
 

src/API/Kitsu/Transformer/MangaTransformer.php

@@ -51,13 +51,77 @@ final class MangaTransformer extends AbstractTransformer {
 		$rawTitles = array_values($item['titles']);
 		$titles = array_unique(array_diff($rawTitles, [$title]));
 
+		$characters = [];
+		$staff = [];
+
+		if (array_key_exists('mediaCharacters', $item['included']))
+		{
+			$mediaCharacters = $item['included']['mediaCharacters'];
+
+			foreach ($mediaCharacters as $rel)
+			{
+				// dd($rel);
+				// $charId = $rel['relationships']['character']['data']['id'];
+				$role = $rel['attributes']['role'];
+
+				foreach ($rel['relationships']['character']['characters'] as $charId => $char)
+				{
+					if (array_key_exists($charId, $item['included']['characters']))
+					{
+						$characters[$role][$charId] = $char['attributes'];
+					}
+				}
+			}
+		}
+
+		if (array_key_exists('mediaStaff', $item['included']))
+		{
+			foreach ($item['included']['mediaStaff'] as $id => $staffing)
+			{
+				$role = $staffing['attributes']['role'];
+
+				foreach ($staffing['relationships']['person']['people'] as $personId => $personDetails)
+				{
+					if ( ! array_key_exists($role, $staff))
+					{
+						$staff[$role] = [];
+					}
+
+					$staff[$role][$personId] = [
+						'id' => $personId,
+						'name' => $personDetails['attributes']['name'] ?? '??',
+						'image' => $personDetails['attributes']['image'],
+					];
+				}
+			}
+		}
+
+		if ( ! empty($characters['main']))
+		{
+			uasort($characters['main'], function ($a, $b) {
+				return $a['name'] <=> $b['name'];
+			});
+		}
+
+		if ( ! empty($characters['supporting']))
+		{
+			uasort($characters['supporting'], function ($a, $b) {
+				return $a['name'] <=> $b['name'];
+			});
+		}
+
+		ksort($characters);
+		ksort($staff);
+
 		return new MangaPage([
+			'characters' => $characters,
 			'chapter_count' => $this->count($item['chapterCount']),
 			'cover_image' => $item['posterImage']['small'],
 			'genres' => $genres,
 			'id' => $item['id'],
 			'included' => $item['included'],
 			'manga_type' => $item['mangaType'],
+			'staff' => $staff,
 			'synopsis' => $item['synopsis'],
 			'title' => $title,
 			'titles' => $titles,

src/API/Kitsu/Transformer/PersonTransformer.php

@@ -21,7 +21,7 @@ use Aviat\AnimeClient\Types\Person;
 use Aviat\Ion\Transformer\AbstractTransformer;
 
 /**
- * Data transformation class for zippered Hummingbird manga
+ * Data transformation class for people pages
  */
 final class PersonTransformer extends AbstractTransformer {
 

src/Controller/Manga.php

@@ -294,65 +294,6 @@ final class Manga extends Controller {
 			return;
 		}
 
-		if (array_key_exists('mediaCharacters', $data['included']))
-		{
-			$mediaCharacters = $data['included']['mediaCharacters'];
-
-			foreach ($mediaCharacters as $rel)
-			{
-				// dd($rel);
-				// $charId = $rel['relationships']['character']['data']['id'];
-				$role = $rel['attributes']['role'];
-
-				foreach($rel['relationships']['character']['characters'] as $charId => $char)
-				{
-					if (array_key_exists($charId, $data['included']['characters']))
-					{
-						$characters[$role][$charId] = $char['attributes'];
-					}
-				}
-			}
-		}
-
-		if (array_key_exists('mediaStaff', $data['included']))
-		{
-			foreach ($data['included']['mediaStaff'] as $id => $staffing)
-			{
-				$role = $staffing['attributes']['role'];
-
-				foreach($staffing['relationships']['person']['people'] as $personId => $personDetails)
-				{
-					if ( ! array_key_exists($role, $staff))
-					{
-						$staff[$role] = [];
-					}
-
-					$staff[$role][$personId] = [
-						'id' => $personId,
-						'name' => $personDetails['attributes']['name'] ?? '??',
-						'image' => $personDetails['attributes']['image'],
-					];
-				}
-			}
-		}
-
-		if ( ! empty($characters['main']))
-		{
-			uasort($characters['main'], function ($a, $b) {
-				return $a['name'] <=> $b['name'];
-			});
-		}
-
-		if ( ! empty($characters['supporting']))
-		{
-			uasort($characters['supporting'], function ($a, $b) {
-				return $a['name'] <=> $b['name'];
-			});
-		}
-
-		ksort($characters);
-		ksort($staff);
-
 		$this->outputHTML('manga/details', [
 			'title' => $this->formatTitle(
 				$this->config->get('whose_list') . "'s Manga List",

src/Types/MangaPage.php

@@ -20,12 +20,14 @@ namespace Aviat\AnimeClient\Types;
  * Type representing an Anime object for display
  */
 final class MangaPage extends AbstractType {
+	public $characters;
 	public $chapter_count;
 	public $cover_image;
 	public $genres;
 	public $id;
 	public $included;
 	public $manga_type;
+	public $staff;
 	public $synopsis;
 	public $title;
 	public $titles;

tests/API/Kitsu/Transformer/AnimeTransformerTest.php

@@ -18,7 +18,6 @@ namespace Aviat\AnimeClient\Tests\API\Kitsu\Transformer;
 
 use Aviat\AnimeClient\API\Kitsu\Transformer\AnimeTransformer;
 use Aviat\AnimeClient\Tests\AnimeClientTestCase;
-use Aviat\Ion\Friend;
 use Aviat\Ion\Json;
 
 class AnimeTransformerTest extends AnimeClientTestCase {

tests/API/Kitsu/Transformer/__snapshots__/MangaTransformerTest__testTransform__1.php

@@ -1,4 +1,7 @@
 <?php return Aviat\AnimeClient\Types\MangaPage::__set_state(array(
+   'characters' => 
+  array (
+  ),
    'chapter_count' => '-',
    'cover_image' => 'https://media.kitsu.io/manga/poster_images/20286/small.jpg?1434293999',
    'genres' => 
@@ -68,6 +71,9 @@
     ),
   ),
    'manga_type' => 'manga',
+   'staff' => 
+  array (
+  ),
    'synopsis' => 'Usa, a high-school student aspiring to begin a bachelor lifestyle, moves into a new apartment only to discover that he not only shares a room with a perverted roommate that has an obsession for underaged girls, but also that another girl, Ritsu, a love-at-first-sight, is living in the same building as well!
 (Source: Kirei Cake)',
    'title' => 'Bokura wa Minna Kawaisou',