Lots of visual updates

This commit is contained in:
Timothy Warren 2018-11-01 22:01:09 -04:00
parent 3244db3438
commit 067c9b4035
31 changed files with 1639 additions and 1068 deletions

View File

@ -15,6 +15,9 @@
*/ */
use const Aviat\AnimeClient\{ use const Aviat\AnimeClient\{
ALPHA_SLUG_PATTERN,
NUM_PATTERN,
SLUG_PATTERN,
DEFAULT_CONTROLLER_METHOD, DEFAULT_CONTROLLER_METHOD,
DEFAULT_CONTROLLER DEFAULT_CONTROLLER
}; };
@ -24,14 +27,13 @@ use const Aviat\AnimeClient\{
// //
// Maps paths to controllers and methods // Maps paths to controllers and methods
// ------------------------------------------------------------------------- // -------------------------------------------------------------------------
return [ $routes = [
// --------------------------------------------------------------------- // ---------------------------------------------------------------------
// Anime List Routes // Anime List Routes
// --------------------------------------------------------------------- // ---------------------------------------------------------------------
'anime.add.get' => [ 'anime.add.get' => [
'path' => '/anime/add', 'path' => '/anime/add',
'action' => 'addForm', 'action' => 'addForm',
'verb' => 'get',
], ],
'anime.add.post' => [ 'anime.add.post' => [
'path' => '/anime/add', 'path' => '/anime/add',
@ -42,7 +44,7 @@ return [
'path' => '/anime/details/{id}', 'path' => '/anime/details/{id}',
'action' => 'details', 'action' => 'details',
'tokens' => [ 'tokens' => [
'id' => '[a-z0-9\-]+', 'id' => SLUG_PATTERN,
], ],
], ],
'anime.delete' => [ 'anime.delete' => [
@ -60,7 +62,6 @@ return [
'manga.add.get' => [ 'manga.add.get' => [
'path' => '/manga/add', 'path' => '/manga/add',
'action' => 'addForm', 'action' => 'addForm',
'verb' => 'get',
], ],
'manga.add.post' => [ 'manga.add.post' => [
'path' => '/manga/add', 'path' => '/manga/add',
@ -76,7 +77,7 @@ return [
'path' => '/manga/details/{id}', 'path' => '/manga/details/{id}',
'action' => 'details', 'action' => 'details',
'tokens' => [ 'tokens' => [
'id' => '[a-z0-9\-]+', 'id' => SLUG_PATTERN,
], ],
], ],
// --------------------------------------------------------------------- // ---------------------------------------------------------------------
@ -89,13 +90,12 @@ return [
'anime.collection.add.get' => [ 'anime.collection.add.get' => [
'path' => '/anime-collection/add', 'path' => '/anime-collection/add',
'action' => 'form', 'action' => 'form',
'params' => [],
], ],
'anime.collection.edit.get' => [ 'anime.collection.edit.get' => [
'path' => '/anime-collection/edit/{id}', 'path' => '/anime-collection/edit/{id}',
'action' => 'form', 'action' => 'form',
'tokens' => [ 'tokens' => [
'id' => '[0-9]+', 'id' => NUM_PATTERN,
], ],
], ],
'anime.collection.add.post' => [ 'anime.collection.add.post' => [
@ -110,10 +110,8 @@ return [
], ],
'anime.collection.view' => [ 'anime.collection.view' => [
'path' => '/anime-collection/view{/view}', 'path' => '/anime-collection/view{/view}',
'action' => 'index',
'params' => [],
'tokens' => [ 'tokens' => [
'view' => '[a-z_]+', 'view' => ALPHA_SLUG_PATTERN,
], ],
], ],
'anime.collection.delete' => [ 'anime.collection.delete' => [
@ -131,13 +129,12 @@ return [
'manga.collection.add.get' => [ 'manga.collection.add.get' => [
'path' => '/manga-collection/add', 'path' => '/manga-collection/add',
'action' => 'form', 'action' => 'form',
'params' => [],
], ],
'manga.collection.edit.get' => [ 'manga.collection.edit.get' => [
'path' => '/manga-collection/edit/{id}', 'path' => '/manga-collection/edit/{id}',
'action' => 'form', 'action' => 'form',
'tokens' => [ 'tokens' => [
'id' => '[0-9]+', 'id' => NUM_PATTERN,
], ],
], ],
'manga.collection.add.post' => [ 'manga.collection.add.post' => [
@ -152,10 +149,8 @@ return [
], ],
'manga.collection.view' => [ 'manga.collection.view' => [
'path' => '/manga-collection/view{/view}', 'path' => '/manga-collection/view{/view}',
'action' => 'index',
'params' => [],
'tokens' => [ 'tokens' => [
'view' => '[a-z_]+', 'view' => ALPHA_SLUG_PATTERN,
], ],
], ],
'manga.collection.delete' => [ 'manga.collection.delete' => [
@ -168,27 +163,26 @@ return [
// --------------------------------------------------------------------- // ---------------------------------------------------------------------
'character' => [ 'character' => [
'path' => '/character/{slug}', 'path' => '/character/{slug}',
'action' => 'index',
'params' => [],
'tokens' => [ 'tokens' => [
'slug' => '[a-z0-9\-]+' 'slug' => SLUG_PATTERN
] ]
], ],
'person' => [ 'person' => [
'path' => '/people/{id}', 'path' => '/people/{id}',
'action' => 'index',
'params' => [],
'tokens' => [ 'tokens' => [
'id' => '[a-z0-9\-]+' 'id' => SLUG_PATTERN
] ]
], ],
'default_user_info' => [
'path' => '/me',
'action' => 'me',
'controller' => 'user',
],
'user_info' => [ 'user_info' => [
'path' => '/about/{user}', 'path' => '/user/{username}',
'action' => 'about', 'controller' => 'user',
'controller' => DEFAULT_CONTROLLER,
'verb' => 'get',
'tokens' => [ 'tokens' => [
'user' => '.*?' 'username' => '.*?'
] ]
], ],
// --------------------------------------------------------------------- // ---------------------------------------------------------------------
@ -197,66 +191,53 @@ return [
'anilist-redirect' => [ 'anilist-redirect' => [
'path' => '/anilist-redirect', 'path' => '/anilist-redirect',
'action' => 'anilistRedirect', 'action' => 'anilistRedirect',
'controller' => DEFAULT_CONTROLLER, 'controller' => 'user',
'verb' => 'get',
], ],
'anilist-callback' => [ 'anilist-callback' => [
'path' => '/anilist-oauth', 'path' => '/anilist-oauth',
'action' => 'anilistCallback', 'action' => 'anilistCallback',
'controller' => DEFAULT_CONTROLLER, 'controller' => 'user',
'verb' => 'get',
], ],
'image_proxy' => [ 'image_proxy' => [
'path' => '/public/images/{type}/{file}', 'path' => '/public/images/{type}/{file}',
'action' => 'images', 'action' => 'cache',
'controller' => DEFAULT_CONTROLLER, 'controller' => 'images',
'verb' => 'get',
'tokens' => [ 'tokens' => [
'type' => '[a-z0-9\-]+', 'type' => SLUG_PATTERN,
'file' => '[a-z0-9\-]+\.[a-z]{3,4}' 'file' => '[a-z0-9\-]+\.[a-z]{3,4}'
] ]
], ],
'cache_purge' => [ 'cache_purge' => [
'path' => '/cache_purge', 'path' => '/cache_purge',
'action' => 'clearCache', 'action' => 'clearCache',
'controller' => DEFAULT_CONTROLLER,
'verb' => 'get',
], ],
'settings' => [ 'settings' => [
'path' => '/settings', 'path' => '/settings',
'action' => 'settings',
'controller' => DEFAULT_CONTROLLER,
'verb' => 'get',
], ],
'settings-post' => [ 'settings-post' => [
'path' => '/settings-save', 'path' => '/settings/update',
'action' => 'settings_post', 'action' => 'update',
'controller' => DEFAULT_CONTROLLER,
'verb' => 'post', 'verb' => 'post',
], ],
'login' => [ 'login' => [
'path' => '/login', 'path' => '/login',
'action' => 'login', 'action' => 'login',
'controller' => DEFAULT_CONTROLLER,
'verb' => 'get',
], ],
'login.post' => [ 'login.post' => [
'path' => '/login', 'path' => '/login',
'action' => 'loginAction', 'action' => 'loginAction',
'controller' => DEFAULT_CONTROLLER,
'verb' => 'post', 'verb' => 'post',
], ],
'logout' => [ 'logout' => [
'path' => '/logout', 'path' => '/logout',
'action' => 'logout', 'action' => 'logout',
'controller' => DEFAULT_CONTROLLER,
], ],
'increment' => [ 'increment' => [
'path' => '/{controller}/increment', 'path' => '/{controller}/increment',
'action' => 'increment', 'action' => 'increment',
'verb' => 'post', 'verb' => 'post',
'tokens' => [ 'tokens' => [
'controller' => '[a-z_]+', 'controller' => ALPHA_SLUG_PATTERN,
], ],
], ],
'update' => [ 'update' => [
@ -264,7 +245,7 @@ return [
'action' => 'update', 'action' => 'update',
'verb' => 'post', 'verb' => 'post',
'tokens' => [ 'tokens' => [
'controller' => '[a-z_]+', 'controller' => ALPHA_SLUG_PATTERN,
], ],
], ],
'update.post' => [ 'update.post' => [
@ -272,28 +253,46 @@ return [
'action' => 'formUpdate', 'action' => 'formUpdate',
'verb' => 'post', 'verb' => 'post',
'tokens' => [ 'tokens' => [
'controller' => '[a-z_]+', 'controller' => ALPHA_SLUG_PATTERN,
], ],
], ],
'edit' => [ 'edit' => [
'path' => '/{controller}/edit/{id}/{status}', 'path' => '/{controller}/edit/{id}/{status}',
'action' => 'edit', 'action' => 'edit',
'tokens' => [ 'tokens' => [
'id' => '[0-9a-z_]+', 'id' => SLUG_PATTERN,
'status' => '([a-zA-Z\-_]|%20)+', 'status' => '([a-zA-Z\-_]|%20)+',
], ],
], ],
'list' => [ 'list' => [
'path' => '/{controller}/{type}{/view}', 'path' => '/{controller}/{type}{/view}',
'action' => DEFAULT_CONTROLLER_METHOD,
'tokens' => [ 'tokens' => [
'type' => '[a-z_]+', 'type' => ALPHA_SLUG_PATTERN,
'view' => '[a-z_]+', 'view' => ALPHA_SLUG_PATTERN,
], ],
], ],
'index_redirect' => [ 'index_redirect' => [
'path' => '/', 'path' => '/',
'controller' => DEFAULT_CONTROLLER,
'action' => 'redirectToDefaultRoute', 'action' => 'redirectToDefaultRoute',
], ],
]; ];
$defaultMap = [
'action' => DEFAULT_CONTROLLER_METHOD,
'controller' => DEFAULT_CONTROLLER,
'params' => [],
'verb' => 'get',
];
foreach ($routes as &$route)
{
foreach($defaultMap as $key => $val)
{
if ( ! array_key_exists($key, $route))
{
$route[$key] = $val;
}
}
}
return $routes;

View File

@ -86,6 +86,11 @@ return function ($configArray = []) {
$formHelper->setContainer($container); $formHelper->setContainer($container);
return $formHelper; return $formHelper;
}); });
$htmlHelper->set('picture', function() use ($container) {
$pictureHelper = new Helper\Picture();
$pictureHelper->setContainer($container);
return $pictureHelper;
});
return $htmlHelper; return $htmlHelper;
}); });

View File

@ -6,11 +6,7 @@
<?php if ($auth->isAuthenticated()): ?> <?php if ($auth->isAuthenticated()): ?>
<button title="Increment episode count" class="plus_one" hidden>+1 Episode</button> <button title="Increment episode count" class="plus_one" hidden>+1 Episode</button>
<?php endif ?> <?php endif ?>
<picture> <?= $helper->picture("images/anime/{$item['anime']['id']}.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$item['anime']['id']}.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$item['anime']['id']}.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/anime/{$item['anime']['id']}.jpg") ?>" alt="" />
</picture>
<div class="name"> <div class="name">
<a href="<?= $url->generate('anime.details', ['id' => $item['anime']['slug']]); ?>"> <a href="<?= $url->generate('anime.details', ['id' => $item['anime']['slug']]); ?>">

View File

@ -1,13 +1,11 @@
<?php use function Aviat\AnimeClient\getLocalImg; ?>
<main class="details fixed"> <main class="details fixed">
<section class="flex"> <section class="flex">
<aside class="info"> <aside class="info">
<picture class="cover"> <?= $helper->picture("images/anime/{$show_data['id']}-original.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$show_data['id']}-original.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$show_data['id']}-original.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/anime/{$show_data['id']}-original.jpg") ?>" alt="" />
</picture>
<br />
<br /> <br />
<table class="media_details"> <table class="media_details">
<tr> <tr>
<td class="align_right">Airing Status</td> <td class="align_right">Airing Status</td>
@ -22,16 +20,17 @@
<td><?= $show_data['episode_count'] ?? '-' ?></td> <td><?= $show_data['episode_count'] ?? '-' ?></td>
</tr> </tr>
<?php if ( ! empty($show_data['episode_length'])): ?> <?php if ( ! empty($show_data['episode_length'])): ?>
<tr> <tr>
<td>Episode Length</td> <td>Episode Length</td>
<td><?= $show_data['episode_length'] ?> minutes</td> <td><?= $show_data['episode_length'] ?> minutes</td>
</tr> </tr>
<?php endif ?> <?php endif ?>
<?php if ( ! empty($show_data['age_rating'])): ?> <?php if ( ! empty($show_data['age_rating'])): ?>
<tr> <tr>
<td>Age Rating</td> <td>Age Rating</td>
<td><abbr title="<?= $show_data['age_rating_guide'] ?>"><?= $show_data['age_rating'] ?></abbr></td> <td><abbr title="<?= $show_data['age_rating_guide'] ?>"><?= $show_data['age_rating'] ?></abbr>
</tr> </td>
</tr>
<?php endif ?> <?php endif ?>
<tr> <tr>
<td>Genres</td> <td>Genres</td>
@ -42,118 +41,128 @@
</table> </table>
</aside> </aside>
<article class="text"> <article class="text">
<h2><a rel="external" href="<?= $show_data['url'] ?>"><?= $show_data['title'] ?></a></h2> <h2 class="toph"><a rel="external" href="<?= $show_data['url'] ?>"><?= $show_data['title'] ?></a></h2>
<?php foreach ($show_data['titles'] as $title): ?> <?php foreach ($show_data['titles'] as $title): ?>
<h3><?= $title ?></h3> <h3><?= $title ?></h3>
<?php endforeach ?> <?php endforeach ?>
<br /> <br />
<p><?= nl2br($show_data['synopsis']) ?></p> <p><?= nl2br($show_data['synopsis']) ?></p>
<?php if (count($show_data['streaming_links']) > 0): ?> <?php if (count($show_data['streaming_links']) > 0): ?>
<hr /> <hr />
<h4>Streaming on:</h4> <h4>Streaming on:</h4>
<table class="full_width invisible"> <table class="full_width invisible">
<thead> <thead>
<tr> <tr>
<th class="align_left">Service</th> <th class="align_left">Service</th>
<th>Subtitles</th> <th>Subtitles</th>
<th>Dubs</th> <th>Dubs</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<?php foreach($show_data['streaming_links'] as $link): ?> <?php foreach ($show_data['streaming_links'] as $link): ?>
<tr> <tr>
<td class="align_left"> <td class="align_left">
<?php if ($link['meta']['link'] !== FALSE): ?> <?php if ($link['meta']['link'] !== FALSE): ?>
<a href="<?= $link['link'] ?>" title="Stream '<?= $show_data['title'] ?>' on <?= $link['meta']['name'] ?>"> <a
<img class="streaming-logo" width="50" height="50" src="<?= $urlGenerator->assetUrl('images', $link['meta']['image']) ?>" alt="<?= $link['meta']['name'] ?> logo" /> href="<?= $link['link'] ?>"
&nbsp;&nbsp;<?= $link['meta']['name'] ?> title="Stream '<?= $show_data['title'] ?>' on <?= $link['meta']['name'] ?>"
</a> >
<?php else: ?> <img
<img class="streaming-logo" width="50" height="50" src="<?= $urlGenerator->assetUrl('images', $link['meta']['image']) ?>" alt="<?= $link['meta']['name'] ?> logo" /> class="streaming-logo" width="50" height="50"
&nbsp;&nbsp;<?= $link['meta']['name'] ?> src="<?= $urlGenerator->assetUrl('images', $link['meta']['image']) ?>"
<?php endif ?> alt="<?= $link['meta']['name'] ?> logo"
</td> />
<td><?= implode(', ', $link['subs']) ?></td> &nbsp;&nbsp;<?= $link['meta']['name'] ?>
<td><?= implode(', ', $link['dubs']) ?></td> </a>
</tr> <?php else: ?>
<?php endforeach ?> <img
</tbody> class="streaming-logo" width="50" height="50"
</table> src="<?= $urlGenerator->assetUrl('images', $link['meta']['image']) ?>"
alt="<?= $link['meta']['name'] ?> logo"
/>
&nbsp;&nbsp;<?= $link['meta']['name'] ?>
<?php endif ?>
</td>
<td><?= implode(', ', $link['subs']) ?></td>
<td><?= implode(', ', $link['dubs']) ?></td>
</tr>
<?php endforeach ?>
</tbody>
</table>
<?php endif ?> <?php endif ?>
<?php if ( ! empty($show_data['trailer_id'])): ?> <?php if ( ! empty($show_data['trailer_id'])): ?>
<hr /> <hr />
<h4>Trailer</h4> <h4>Trailer</h4>
<iframe width="560" height="315" src="https://www.youtube.com/embed/<?= $show_data['trailer_id'] ?>" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe> <iframe
width="560" height="315" src="https://www.youtube.com/embed/<?= $show_data['trailer_id'] ?>"
frameborder="0" allow="autoplay; encrypted-media" allowfullscreen
></iframe>
<?php endif ?> <?php endif ?>
</article> </article>
</section> </section>
<?php /* if(count($characters) > 0 && count($staff) > 0): ?>
<div class="tabs">
<?php $i = 0; ?>
</div>
<?php endif */ ?>
<?php if (count($characters) > 0): ?> <?php if (count($characters) > 0): ?>
<br /> <section>
<hr /> <h2>Characters</h2>
<h2>Characters</h2>
<?php foreach($characters as $role => $list): ?> <div class="tabs">
<h3><?= ucfirst($role) ?></h3> <?php $i = 0 ?>
<section class="media-wrap flex flex-wrap flex-justify-start"> <?php foreach ($characters as $role => $list): ?>
<?php foreach($list as $id => $char): ?> <input
<?php if ( ! empty($char['image']['original'])): ?> type="radio" name="character-types"
<article class="character"> id="character-types-<?= $i ?>" <?= ($i === 0) ? 'checked' : '' ?> />
<?php $link = $url->generate('character', ['slug' => $char['slug']]) ?> <label for="character-types-<?= $i ?>"><?= ucfirst($role) ?></label>
<div class="name"> <section class="content media-wrap flex flex-wrap flex-justify-start">
<?= $helper->a($link, $char['name']); ?> <?php foreach ($list as $id => $char): ?>
</div> <?php if ( ! empty($char['image']['original'])): ?>
<a href="<?= $link ?>"> <article class="<?= $role === 'supporting' ? 'small_' : '' ?>character">
<picture> <?php $link = $url->generate('character', ['slug' => $char['slug']]) ?>
<source srcset="<?= $urlGenerator->assetUrl("images/characters/{$id}.webp") ?>" type="image/webp"> <div class="name">
<source srcset="<?= $urlGenerator->assetUrl("images/characters/{$id}.jpg") ?>" type="image/jpeg"> <?= $helper->a($link, $char['name']); ?>
<img src="<?= $urlGenerator->assetUrl("images/characters/{$id}.jpg") ?>" alt="" /> </div>
</picture> <a href="<?= $link ?>">
</a> <?= $helper->picture("images/characters/{$id}.webp") ?>
</article> </a>
<?php endif ?> </article>
<?php endforeach ?> <?php endif ?>
<?php endforeach ?>
</section>
<?php $i++; ?>
<?php endforeach ?>
</div>
</section> </section>
<?php endforeach ?>
<?php endif ?> <?php endif ?>
<?php if (count($staff) > 0): ?> <?php if (count($staff) > 0): ?>
<br /> <?php //dump($staff); ?>
<hr /> <section>
<h2>Staff</h2> <h2>Staff</h2>
<?php foreach($staff as $role => $people): ?> <div class="vertical-tabs">
<h3><?= $role ?></h3> <?php $i = 0; ?>
<section class='media-wrap flex flex-wrap flex-justify-start'> <?php foreach ($staff as $role => $people): ?>
<?php foreach($people as $pid => $person): ?> <div class="tab">
<article class='character person'> <input type="radio" name="staff-roles" id="staff-role<?= $i ?>" <?= $i === 0 ? 'checked' : '' ?> />
<?php $link = $url->generate('person', ['id' => $pid]) ?> <label for="staff-role<?= $i ?>"><?= $role ?></label>
<div class="name"> <section class='content media-wrap flex flex-wrap flex-justify-start'>
<a href="<?= $link ?>"> <?php foreach ($people as $pid => $person): ?>
<?= $person['name'] ?> <article class='character small_person'>
</a> <?php $link = $url->generate('person', ['id' => $person['id']]) ?>
<div class="name">
<a href="<?= $link ?>">
<?= $person['name'] ?>
</a>
</div>
<a href="<?= $link ?>">
<?= $helper->picture(getLocalImg($person['image']['original'] ?? NULL)) ?>
</a>
</article>
<?php endforeach ?>
</section>
</div> </div>
<a href="<?= $link ?>"> <?php $i++; ?>
<picture> <?php endforeach ?>
<source </div>
srcset="<?= $urlGenerator->assetUrl("images/people/{$pid}.webp") ?>" </section>
type="image/webp"
>
<source
srcset="<?= $urlGenerator->assetUrl("images/people/{$pid}.jpg") ?>"
type="image/jpeg"
>
<img src="<?= $urlGenerator->assetUrl("images/people/{$pid}.jpg") ?>" alt="" />
</picture>
</a>
</article>
<?php endforeach ?>
</section>
<?php endforeach ?>
<?php endif ?> <?php endif ?>
</main> </main>

View File

@ -17,7 +17,7 @@
<tr> <tr>
<td rowspan="9"> <td rowspan="9">
<article class="media"> <article class="media">
<?= $helper->img($urlGenerator->assetUrl('images/anime', "{$item['anime']['id']}.jpg")) ?> <?= $helper->picture("images/anime/{$item['anime']['id']}.webp") ?>
</article> </article>
</td> </td>
</tr> </tr>
@ -89,11 +89,9 @@
</tbody> </tbody>
</table> </table>
</form> </form>
<br /> <form class="js-delete" action="<?= $url->generate('anime.delete') ?>" method="post">
<br /> <fieldset>
<fieldset> <legend>Danger Zone</legend>
<legend>Danger Zone</legend>
<form class="js-delete" action="<?= $url->generate('anime.delete') ?>" method="post">
<table class="form invisible"> <table class="form invisible">
<tbody> <tbody>
<tr> <tr>
@ -110,7 +108,7 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
</form> </fieldset>
</fieldset> </form>
</main> </main>
<?php endif ?> <?php endif ?>

View File

@ -1,240 +0,0 @@
<?php
use function Aviat\AnimeClient\getLocalImg;
use Aviat\AnimeClient\API\Kitsu;
?>
<main class="details fixed">
<section class="flex flex-no-wrap">
<div>
<picture>
<source srcset="<?= $urlGenerator->assetUrl("images/characters/{$data[0]['id']}-original.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/characters/{$data[0]['id']}-original.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/characters/{$data[0]['id']}-original.jpg") ?>" alt="" />
</picture>
<?php if ( ! empty($data[0]['attributes']['otherNames'])): ?>
<h3>Nicknames / Other names</h3>
<?php foreach ($data[0]['attributes']['otherNames'] as $name): ?>
<h4><?= $name ?></h4>
<?php endforeach ?>
<?php endif ?>
</div>
<div>
<h2><?= $data['name'] ?></h2>
<?php foreach ($data['names'] as $name): ?>
<h3><?= $name ?></h3>
<?php endforeach ?>
<hr />
<p class="description"><?= $data[0]['attributes']['description'] ?></p>
</div>
</section>
<?php if (array_key_exists('anime', $data['included']) || array_key_exists('manga', $data['included'])): ?>
<h3>Media</h3>
<div class="tabs">
<?php if (array_key_exists('anime', $data['included'])): ?>
<input checked="checked" type="radio" id="media-anime" name="media-tabs" />
<label for="media-anime"><h4> Anime </h4></label>
<section class="align_left media-wrap content">
<?php foreach($data['included']['anime'] as $id => $anime): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $anime['attributes']['slug']]);
$titles = Kitsu::filterTitles($anime['attributes']);
?>
<a href="<?= $link ?>">
<picture>
<source
srcset="<?= $urlGenerator->assetUrl("images/anime/{$id}.webp") ?>"
type="image/webp"
>
<source
srcset="<?= $urlGenerator->assetUrl("images/anime/{$id}.jpg") ?>"
type="image/jpeg"
>
<img
src="<?= $urlGenerator->assetUrl("images/anime/{$id}.jpg") ?>"
alt=""
/>
</picture>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br /><small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
<?php endif ?>
<?php if (array_key_exists('manga', $data['included'])): ?>
<input type="radio" id="media-manga" name="media-tabs" />
<label for="media-manga"><h4>Manga</h4></label>
<section class="align_left media-wrap content">
<?php foreach($data['included']['manga'] as $id => $manga): ?>
<article class="media">
<?php
$link = $url->generate('manga.details', ['id' => $manga['attributes']['slug']]);
$titles = Kitsu::filterTitles($manga['attributes']);
?>
<a href="<?= $link ?>">
<img src="<?= $urlGenerator->assetUrl("images/manga/{$id}.jpg") ?>" width="220" alt="" />
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br /><small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
<?php endif ?>
</div>
<?php endif ?>
<section>
<?php if ($castCount > 0): ?>
<h3>Castings</h3>
<?php
$vas = $castings['Voice Actor'];
unset($castings['Voice Actor']);
ksort($vas)
?>
<?php if ( ! empty($vas)): ?>
<h4>Voice Actors</h4>
<div class="tabs">
<?php $i = 0; ?>
<?php foreach($vas as $language => $casting): ?>
<input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="character-va<?= $i ?>"
name="character-vas"
/>
<label for="character-va<?= $i ?>"><h5><?= $language ?></h5></label>
<section class="content">
<table style='width:100%'>
<tr>
<th>Cast Member</th>
<th>Series</th>
</tr>
<?php foreach($casting as $cid => $c): ?>
<tr>
<td style="width:229px">
<article class="character">
<?php
$link = $url->generate('person', ['id' => $c['person']['id']]);
?>
<a href="<?= $link ?>">
<img
src="<?= $urlGenerator->assetUrl(getLocalImg($c['person']['image'])) ?>"
alt=""
/>
<div class="name">
<?= $c['person']['name'] ?>
</div>
</a>
</article>
</td>
<td>
<section class="align_left media-wrap-flex">
<?php foreach ($c['series'] as $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['attributes']['slug']]);
$titles = Kitsu::filterTitles($series['attributes']);
?>
<a href="<?= $link ?>">
<img
src="<?= $urlGenerator->assetUrl(getLocalImg($series['attributes']['posterImage']['small'])) ?>"
width="220" alt=""
/>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
</td>
</tr>
<?php endforeach ?>
</table>
</section>
<?php $i++ ?>
<?php endforeach ?>
</div>
<?php endif ?>
<?php foreach($castings as $role => $entries): ?>
<h4><?= $role ?></h4>
<?php foreach($entries as $language => $casting): ?>
<h5><?= $language ?></h5>
<table class="min-table">
<tr>
<th>Cast Member</th>
<th>Series</th>
</tr>
<?php foreach($casting as $cid => $c):?>
<tr>
<td style="width:229px">
<article class="character">
<?php
$link = $url->generate('person', ['id' => $c['person']['id']]);
?>
<a href="<?= $link ?>">
<img src="<?= $urlGenerator->assetUrl(getLocalImg($c['person']['image'])) ?>" alt="" />
<div class="name">
<?= $c['person']['name'] ?>
</div>
</a>
</article>
</td>
<td>
<section class="align_left media-wrap">
<?php foreach($c['series'] as $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['attributes']['slug']]);
$titles = Kitsu::filterTitles($series['attributes']);
?>
<a href="<?= $link ?>">
<img src="<?= $urlGenerator->assetUrl(getLocalImg($series['attributes']['posterImage']['small'])) ?>" width="220" alt="" />
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br /><small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
</td>
</tr>
<?php endforeach; ?>
</table>
<?php endforeach ?>
<?php endforeach ?>
<?php endif ?>
</section>
</main>

View File

@ -0,0 +1,221 @@
<?php
use function Aviat\AnimeClient\getLocalImg;
use Aviat\AnimeClient\API\Kitsu;
?>
<main class="details fixed">
<section class="flex flex-no-wrap">
<div>
<?= $helper->picture("images/characters/{$data[0]['id']}-original.webp") ?>
<?php if ( ! empty($data[0]['attributes']['otherNames'])): ?>
<h3>Nicknames / Other names</h3>
<?php foreach ($data[0]['attributes']['otherNames'] as $name): ?>
<h4><?= $name ?></h4>
<?php endforeach ?>
<?php endif ?>
</div>
<div>
<h2 class="toph"><?= $data['name'] ?></h2>
<?php foreach ($data['names'] as $name): ?>
<h3><?= $name ?></h3>
<?php endforeach ?>
<hr />
<p class="description"><?= $data[0]['attributes']['description'] ?></p>
</div>
</section>
<?php if (array_key_exists('anime', $data['included']) || array_key_exists('manga', $data['included'])): ?>
<h3>Media</h3>
<div class="tabs">
<?php if (array_key_exists('anime', $data['included'])): ?>
<input checked="checked" type="radio" id="media-anime" name="media-tabs" />
<label for="media-anime">Anime</label>
<section class="media-wrap content">
<?php foreach ($data['included']['anime'] as $id => $anime): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $anime['attributes']['slug']]);
$titles = Kitsu::filterTitles($anime['attributes']);
?>
<a href="<?= $link ?>">
<?= $helper->picture("images/anime/{$id}.webp") ?>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
<?php endif ?>
<?php if (array_key_exists('manga', $data['included'])): ?>
<input type="radio" id="media-manga" name="media-tabs" />
<label for="media-manga">Manga</label>
<section class="media-wrap content">
<?php foreach ($data['included']['manga'] as $id => $manga): ?>
<article class="media">
<?php
$link = $url->generate('manga.details', ['id' => $manga['attributes']['slug']]);
$titles = Kitsu::filterTitles($manga['attributes']);
?>
<a href="<?= $link ?>">
<?= $helper->picture("images/manga/{$id}.webp") ?>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
<?php endif ?>
</div>
<?php endif ?>
<section>
<?php if ($castCount > 0): ?>
<h3>Castings</h3>
<?php
$vas = $castings['Voice Actor'];
unset($castings['Voice Actor']);
ksort($vas)
?>
<?php if ( ! empty($vas)): ?>
<h4>Voice Actors</h4>
<div class="tabs">
<?php $i = 0; ?>
<?php foreach ($vas as $language => $casting): ?>
<input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="character-va<?= $i ?>"
name="character-vas"
/>
<label for="character-va<?= $i ?>"><?= $language ?></label>
<section class="content">
<table class="borderless max-table">
<tr>
<th>Cast Member</th>
<th>Series</th>
</tr>
<?php foreach ($casting as $cid => $c): ?>
<tr>
<td>
<article class="character">
<?php
$link = $url->generate('person', ['id' => $c['person']['id']]);
?>
<a href="<?= $link ?>">
<?= $helper->picture(getLocalImg($c['person']['image'])) ?>
<div class="name">
<?= $c['person']['name'] ?>
</div>
</a>
</article>
</td>
<td width="75%">
<section class="align_left media-wrap-flex">
<?php foreach ($c['series'] as $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['attributes']['slug']]);
$titles = Kitsu::filterTitles($series['attributes']);
?>
<a href="<?= $link ?>">
<?= $helper->picture(getLocalImg($series['attributes']['posterImage']['small'], TRUE)) ?>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
</td>
</tr>
<?php endforeach ?>
</table>
</section>
<?php $i++ ?>
<?php endforeach ?>
</div>
<?php endif ?>
<?php foreach ($castings as $role => $entries): ?>
<h4><?= $role ?></h4>
<?php foreach ($entries as $language => $casting): ?>
<h5><?= $language ?></h5>
<table class="min-table">
<tr>
<th>Cast Member</th>
<th>Series</th>
</tr>
<?php foreach ($casting as $cid => $c): ?>
<tr>
<td style="width:229px">
<article class="character">
<?php
$link = $url->generate('person', ['id' => $c['person']['id']]);
?>
<a href="<?= $link ?>">
<?= $helper->picture(getLocalImg($c['person']['image'], TRUE)) ?>
<div class="name">
<?= $c['person']['name'] ?>
</div>
</a>
</article>
</td>
<td>
<section class="align_left media-wrap">
<?php foreach ($c['series'] as $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['attributes']['slug']]);
$titles = Kitsu::filterTitles($series['attributes']);
?>
<a href="<?= $link ?>">
<?= $helper->picture(getLocalImg($series['attributes']['posterImage']['small'], TRUE)) ?>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
</td>
</tr>
<?php endforeach; ?>
</table>
<?php endforeach ?>
<?php endforeach ?>
<?php endif ?>
</section>
</main>

View File

@ -1,10 +1,5 @@
<article class="media" id="a-<?= $item['hummingbird_id'] ?>"> <article class="media" id="a-<?= $item['hummingbird_id'] ?>">
<picture> <?= $helper->picture("images/anime/{$item['hummingbird_id']}.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$item['hummingbird_id']}.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$item['hummingbird_id']}.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/anime/{$item['hummingbird_id']}.jpg") ?>" alt="<?= $item['title'] ?> cover image" />
</picture>
<div class="name"> <div class="name">
<a href="<?= $url->generate('anime.details', ['id' => $item['slug']]) ?>"> <a href="<?= $url->generate('anime.details', ['id' => $item['slug']]) ?>">
<?= $item['title'] ?> <?= $item['title'] ?>

View File

@ -10,7 +10,7 @@
<?php foreach ($sections as $name => $items): ?> <?php foreach ($sections as $name => $items): ?>
<input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="collection-tab-<?= $i ?>" name="collection-tabs" /> <input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="collection-tab-<?= $i ?>" name="collection-tabs" />
<label for="collection-tab-<?= $i ?>"><h2><?= $name ?></h2></label> <label for="collection-tab-<?= $i ?>"><h2><?= $name ?></h2></label>
<div class="content"> <div class="content full-height">
<section class="media-wrap"> <section class="media-wrap">
<?php foreach ($items as $item): ?> <?php foreach ($items as $item): ?>
<?php include __DIR__ . '/cover-item.php'; ?> <?php include __DIR__ . '/cover-item.php'; ?>

View File

@ -11,8 +11,8 @@
<input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="collection-tab-<?= $i ?>" <input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" id="collection-tab-<?= $i ?>"
name="collection-tabs"/> name="collection-tabs"/>
<label for="collection-tab-<?= $i ?>"><h2><?= $name ?></h2></label> <label for="collection-tab-<?= $i ?>"><h2><?= $name ?></h2></label>
<div class="content"> <div class="content full-height">
<table> <table class="full_width">
<thead> <thead>
<tr> <tr>
<?php if ($auth->isAuthenticated()): ?> <?php if ($auth->isAuthenticated()): ?>

View File

@ -51,7 +51,7 @@ $hasManga = stripos($_SERVER['REQUEST_URI'], 'manga') !== FALSE;
</span> </span>
<span class="flex-no-wrap small-font">[<?= $helper->a( <span class="flex-no-wrap small-font">[<?= $helper->a(
$url->generate('user_info', ['user' => 'me']), $url->generate('default_user_info'),
'About '. $config->get('whose_list') 'About '. $config->get('whose_list')
) ?>]</span> ) ?>]</span>

View File

@ -23,17 +23,13 @@
<?php /* <button class="plus_one_volume">+1 Volume</button> */ ?> <?php /* <button class="plus_one_volume">+1 Volume</button> */ ?>
</div> </div>
<?php endif ?> <?php endif ?>
<picture> <?= $helper->picture("images/manga/{$item['manga']['id']}.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/manga/{$item['manga']['id']}.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/manga/{$item['manga']['id']}.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/manga/{$item['manga']['id']}.jpg") ?>" alt="" />
</picture>
<div class="name"> <div class="name">
<a href="<?= $url->generate('manga.details', ['id' => $item['manga']['slug']]) ?>"> <a href="<?= $url->generate('manga.details', ['id' => $item['manga']['slug']]) ?>">
<?= $escape->html($item['manga']['title']) ?> <?= $escape->html($item['manga']['title']) ?>
<?php foreach($item['manga']['titles'] as $title): ?> <?php foreach($item['manga']['titles'] as $title): ?>
<br /><small><?= $title ?></small> <br /><small><?= $title ?></small>
<?php endforeach ?> <?php endforeach ?>
</a> </a>
</div> </div>
<div class="table"> <div class="table">

View File

@ -1,14 +1,11 @@
<main class="details fixed"> <main class="details fixed">
<section class="flex flex-no-wrap"> <section class="flex flex-no-wrap">
<aside class="info"> <aside class="info">
<picture class="cover"> <?= $helper->picture("images/manga/{$data['id']}-original.webp", 'jpg', ['class' => 'cover']) ?>
<source srcset="<?= $urlGenerator->assetUrl("images/manga/{$data['id']}-original.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/manga/{$data['id']}-original.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/manga/{$data['id']}-original.jpg") ?>" alt="" />
</picture>
<br /> <br />
<br />
<table> <table class="media_details">
<tr> <tr>
<td>Manga Type</td> <td>Manga Type</td>
<td><?= ucfirst($data['manga_type']) ?></td> <td><?= ucfirst($data['manga_type']) ?></td>
@ -30,8 +27,8 @@
</table> </table>
</aside> </aside>
<article class="text"> <article class="text">
<h2><a rel="external" href="<?= $data['url'] ?>"><?= $data['title'] ?></a></h2> <h2 class="toph"><a rel="external" href="<?= $data['url'] ?>"><?= $data['title'] ?></a></h2>
<?php foreach($data['titles'] as $title): ?> <?php foreach ($data['titles'] as $title): ?>
<h3><?= $title ?></h3> <h3><?= $title ?></h3>
<?php endforeach ?> <?php endforeach ?>
@ -41,71 +38,62 @@
</section> </section>
<?php if (count($characters) > 0): ?> <?php if (count($characters) > 0): ?>
<br />
<hr />
<h2>Characters</h2> <h2>Characters</h2>
<?php foreach ($characters as $role => $list): ?> <div class="tabs">
<h3><?= ucfirst($role) ?></h3> <?php $i = 0 ?>
<section class="media-wrap flex flex-wrap flex-justify-start"> <?php foreach ($characters as $role => $list): ?>
<?php foreach ($list as $id => $char): ?> <input
<?php if ( ! empty($char['image']['original'])): ?> type="radio" name="character-role-tabs"
<article class="character"> id="character-tabs<?= $i ?>" <?= $i === 0 ? 'checked' : '' ?> />
<?php $link = $url->generate('character', ['slug' => $char['slug']]) ?> <label for="character-tabs<?= $i ?>"><?= ucfirst($role) ?></label>
<div class="name"> <section class="content media-wrap flex flex-wrap flex-justify-start">
<?= $helper->a($link, $char['name']); ?> <?php foreach ($list as $id => $char): ?>
</div> <?php if ( ! empty($char['image']['original'])): ?>
<a href="<?= $link ?>"> <article class="<?= $role === 'supporting' ? 'small_' : '' ?>character">
<picture> <?php $link = $url->generate('character', ['slug' => $char['slug']]) ?>
<source <div class="name">
srcset="<?= $urlGenerator->assetUrl("images/characters/{$id}.webp") ?>" <?= $helper->a($link, $char['name']); ?>
type="image/webp" </div>
> <a href="<?= $link ?>">
<source <?= $helper->picture("images/characters/{$id}.webp") ?>
srcset="<?= $urlGenerator->assetUrl("images/characters/{$id}.jpg") ?>" </a>
type="image/jpeg" </article>
> <?php endif ?>
<img src="<?= $urlGenerator->assetUrl("images/characters/{$id}.jpg") ?>" alt="" /> <?php endforeach ?>
</picture> </section>
</a> <?php $i++ ?>
</article> <?php endforeach ?>
<?php endif ?> </div>
<?php endforeach ?>
</section>
<?php endforeach ?>
<?php endif ?> <?php endif ?>
<?php if (count($staff) > 0): ?> <?php if (count($staff) > 0): ?>
<br />
<hr />
<h2>Staff</h2> <h2>Staff</h2>
<?php foreach ($staff as $role => $people): ?> <div class="vertical-tabs">
<h3><?= $role ?></h3> <?php $i = 0 ?>
<section class='media-wrap flex flex-wrap flex-justify-start'> <?php foreach ($staff as $role => $people): ?>
<?php foreach ($people as $pid => $person): ?> <div class="tab">
<article class='character person'> <input
<?php $link = $url->generate('person', ['id' => $pid]) ?> type="radio" name="staff-roles" id="staff-role<?= $i ?>" <?= $i === 0 ? 'checked' : '' ?> />
<div class="name"> <label for="staff-role<?= $i ?>"><?= $role ?></label>
<a href="<?= $link ?>"> <section class='content media-wrap flex flex-wrap flex-justify-start'>
<?= $person['name'] ?> <?php foreach ($people as $pid => $person): ?>
</a> <article class='character person'>
</div> <?php $link = $url->generate('person', ['id' => $pid]) ?>
<a href="<?= $link ?>"> <div class="name">
<picture> <a href="<?= $link ?>">
<source <?= $person['name'] ?>
srcset="<?= $urlGenerator->assetUrl("images/people/{$pid}.webp") ?>" </a>
type="image/webp" </div>
> <a href="<?= $link ?>">
<source <?= $helper->picture("images/people/{$pid}.webp") ?>
srcset="<?= $urlGenerator->assetUrl("images/people/{$pid}.jpg") ?>" </a>
type="image/jpeg" </article>
> <?php endforeach ?>
<img src="<?= $urlGenerator->assetUrl("images/people/{$pid}.jpg") ?>" alt="" /> </section>
</picture> </div>
</a> <?php $i++ ?>
</article> <?php endforeach ?>
<?php endforeach ?> </div>
</section>
<?php endforeach ?>
<?php endif ?> <?php endif ?>
</main> </main>

View File

@ -2,61 +2,66 @@
use function Aviat\AnimeClient\getLocalImg; use function Aviat\AnimeClient\getLocalImg;
use Aviat\AnimeClient\API\Kitsu; use Aviat\AnimeClient\API\Kitsu;
?> ?>
<?php foreach ($entries as $type => $casting): ?> <h3>Voice Acting Roles</h3>
<?php if($type === 'characters'): ?> <div class="tabs">
<table class="min-table"> <?php $i = 0; ?>
<tr> <?php foreach($characters as $role => $characterList): ?>
<th>Character</th> <input <?= $i === 0 ? 'checked="checked"' : '' ?> type="radio" name="character-type-tabs" id="character-type-<?= $i ?>" />
<th>Series</th> <label for="character-type-<?= $i ?>"><h5><?= ucfirst($role) ?></h5></label>
</tr> <section class="content">
<?php foreach ($casting as $cid => $character): ?> <table class="borderless max-table">
<tr> <tr>
<td style="width:229px"> <th>Character</th>
<article class="character"> <th>Series</th>
<?php
$link = $url->generate('character', ['slug' => $character['character']['slug']]);
?>
<a href="<?= $link ?>">
<?php $imgPath = ($character['character']['image'] === NULL)
? $urlGenerator->assetUrl('images/characters/empty.png')
: $urlGenerator->assetUrl(getLocalImg($character['character']['image']['original']));
?>
<img src="<?= $imgPath ?>" alt="" />
<div class="name">
<?= $character['character']['canonicalName'] ?>
</div>
</a>
</article>
</td>
<td>
<section class="align_left media-wrap">
<?php foreach ($character['media'] as $sid => $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['slug']]);
$titles = Kitsu::filterTitles($series);
?>
<a href="<?= $link ?>">
<img
src="<?= $urlGenerator->assetUrl("images/anime/{$sid}.jpg") ?>"
width="220" alt=""
/>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
</td>
</tr> </tr>
<?php endforeach; ?> <?php foreach ($characterList as $cid => $character): ?>
</table> <tr>
<?php endif ?> <td style="width:229px">
<article class="character">
<?php
$link = $url->generate('character', ['slug' => $character['character']['slug']]);
?>
<a href="<?= $link ?>">
<?php $imgPath = ($character['character']['image'] === NULL)
? 'images/characters/empty.png'
: getLocalImg($character['character']['image']['original']);
echo $helper->picture($imgPath);
?>
<div class="name">
<?= $character['character']['canonicalName'] ?>
</div>
</a>
</article>
</td>
<td>
<section class="align_left media-wrap">
<?php foreach ($character['media'] as $sid => $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['slug']]);
$titles = Kitsu::filterTitles($series);
?>
<a href="<?= $link ?>">
<?= $helper->picture("images/anime/{$sid}.webp") ?>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach ?>
</section>
</td>
</tr>
<?php endforeach; ?>
</table>
</section>
<?php $i++ ?>
<?php endforeach ?> <?php endforeach ?>
</div>

View File

@ -0,0 +1,67 @@
<?php
use Aviat\AnimeClient\API\Kitsu;
?>
<main class="details fixed">
<section class="flex flex-no-wrap">
<div>
<?= $helper->picture("images/people/{$data['id']}-original.webp", 'jpg', ['class' => 'cover' ]) ?>
</div>
<div>
<h2 class="toph"><?= $data['attributes']['name'] ?></h2>
</div>
</section>
<?php if ( ! empty($staff)): ?>
<section>
<h3>Castings</h3>
<div class="vertical-tabs">
<?php $i = 0 ?>
<?php foreach ($staff as $role => $entries): ?>
<div class="tab">
<input
type="radio" name="staff-roles" id="staff-role<?= $i ?>" <?= $i === 0 ? 'checked' : '' ?> />
<label for="staff-role<?= $i ?>"><?= $role ?></label>
<?php foreach ($entries as $type => $casting): ?>
<?php if ($type === 'characters') continue; ?>
<?php if ( ! (empty($entries['manga']) || empty($entries['anime']))): ?>
<h4><?= ucfirst($type) ?></h4>
<?php endif ?>
<section class="content">
<?php foreach ($casting as $sid => $series): ?>
<article class="media">
<?php
$mediaType = (in_array($type, ['anime', 'manga'])) ? $type : 'anime';
$link = $url->generate("{$mediaType}.details", ['id' => $series['slug']]);
$titles = Kitsu::filterTitles($series);
?>
<a href="<?= $link ?>">
<?= $helper->picture("images/{$type}/{$sid}.webp") ?>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach; ?>
</section>
<?php endforeach ?>
</div>
<?php $i++ ?>
<?php endforeach ?>
</div>
</section>
<?php endif ?>
<?php if ( ! (empty($characters['main']) || empty($characters['supporting']))): ?>
<section>
<?php include 'character-mapping.php' ?>
</section>
<?php endif ?>
</main>

View File

@ -1,78 +0,0 @@
<?php
use Aviat\AnimeClient\API\Kitsu;
?>
<main class="details fixed">
<section class="flex flex-no-wrap">
<div>
<picture class="cover">
<source
srcset="<?= $urlGenerator->assetUrl("images/people/{$data['id']}-original.webp") ?>"
type="image/webp"
>
<source
srcset="<?= $urlGenerator->assetUrl("images/people/{$data['id']}-original.jpg") ?>"
type="image/jpeg"
>
<img src="<?= $urlGenerator->assetUrl("images/people/{$data['id']}-original.jpg") ?>" alt="" />
</picture>
</div>
<div>
<h2><?= $data['attributes']['name'] ?></h2>
</div>
</section>
<section>
<?php if ($castCount > 0): ?>
<h3>Castings</h3>
<?php foreach ($castings as $role => $entries): ?>
<h4><?= $role ?></h4>
<?php if($role === 'Voice Actor'): ?>
<?php include 'character-mapping.php' ?>
<?php else: ?>
<?php foreach ($entries as $type => $casting): ?>
<?php if ($type === 'characters') continue; ?>
<?php if ( ! empty($entries['manga'])): ?>
<h5><?= ucfirst($type) ?></h5>
<?php endif ?>
<section class="align_left media-wrap">
<?php foreach ($casting as $sid => $series): ?>
<article class="media">
<?php
$link = $url->generate('anime.details', ['id' => $series['attributes']['slug']]);
$titles = Kitsu::filterTitles($series['attributes']);
?>
<a href="<?= $link ?>">
<picture>
<source
srcset="<?= $urlGenerator->assetUrl("images/{$type}/{$sid}.webp") ?>"
type="image/webp"
/>
<source
srcset="<?= $urlGenerator->assetUrl("images/{$type}/{$sid}.jpg") ?>"
type="image/jpeg"
/>
<img
src="<?= $urlGenerator->assetUrl("images/{$type}/{$sid}.jpg") ?>"
width="220" alt=""
/>
</picture>
</a>
<div class="name">
<a href="<?= $link ?>">
<?= array_shift($titles) ?>
<?php foreach ($titles as $title): ?>
<br />
<small><?= $title ?></small>
<?php endforeach ?>
</a>
</div>
</article>
<?php endforeach; ?>
</section>
<br />
<?php endforeach ?>
<?php endif ?>
<?php endforeach ?>
<?php endif ?>
</section>
</main>

View File

@ -48,7 +48,6 @@ $nestedPrefix = 'config';
'Update Access Token' 'Update Access Token'
) ?> ) ?>
<?php endif ?> <?php endif ?>
<?php endif ?> <?php endif ?>
</section> </section>
<?php $i++; ?> <?php $i++; ?>

View File

@ -7,9 +7,11 @@ use Aviat\AnimeClient\API\Kitsu;
<div> <div>
<center> <center>
<?php <?php
$avatar = getLocalImg($attributes['avatar']['original']); $avatar = $urlGenerator->assetUrl(
getLocalImg($attributes['avatar']['original'], FALSE)
);
echo $helper->img($avatar, ['alt' => '']);
?> ?>
<img src="<?= $urlGenerator->assetUrl($avatar) ?>" alt="" />
</center> </center>
<br /> <br />
<br /> <br />
@ -46,6 +48,14 @@ use Aviat\AnimeClient\API\Kitsu;
<td>Time spent watching anime:</td> <td>Time spent watching anime:</td>
<td><?= $timeOnAnime ?></td> <td><?= $timeOnAnime ?></td>
</tr> </tr>
<tr>
<td># of Anime episodes watched</td>
<td><?= $stats['anime-amount-consumed']['units'] ?></td>
</tr>
<tr>
<td># of Manga chapters read</td>
<td><?= $stats['manga-amount-consumed']['units'] ?></td>
</tr>
<tr> <tr>
<td># of Posts</td> <td># of Posts</td>
<td><?= $attributes['postsCount'] ?></td> <td><?= $attributes['postsCount'] ?></td>
@ -62,12 +72,12 @@ use Aviat\AnimeClient\API\Kitsu;
</div> </div>
<div> <div>
<h2> <h2>
<a <?= $helper->a(
title='View profile on Kisu' "https://kitsu.io/users/{$attributes['slug']}",
href="https://kitsu.io/users/<?= $attributes['slug'] ?>" $attributes['name'], [
> 'title' => 'View profile on Kitsu'
<?= $attributes['name'] ?> ])
</a> ?>
</h2> </h2>
<dl> <dl>
@ -86,11 +96,7 @@ use Aviat\AnimeClient\API\Kitsu;
<?php $link = $url->generate('character', ['slug' => $char['slug']]) ?> <?php $link = $url->generate('character', ['slug' => $char['slug']]) ?>
<div class="name"><?= $helper->a($link, $char['canonicalName']); ?></div> <div class="name"><?= $helper->a($link, $char['canonicalName']); ?></div>
<a href="<?= $link ?>"> <a href="<?= $link ?>">
<picture> <?= $helper->picture("images/characters/{$char['id']}.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/characters/{$char['id']}.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/characters/{$char['id']}.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/characters/{$char['id']}.jpg") ?>" alt="" />
</picture>
</a> </a>
</article> </article>
<?php endif ?> <?php endif ?>
@ -107,11 +113,7 @@ use Aviat\AnimeClient\API\Kitsu;
$titles = Kitsu::filterTitles($anime); $titles = Kitsu::filterTitles($anime);
?> ?>
<a href="<?= $link ?>"> <a href="<?= $link ?>">
<picture width="220"> <?= $helper->picture("images/anime/{$anime['id']}.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$anime['id']}.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/anime/{$anime['id']}.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/anime/{$anime['id']}.jpg") ?>" width="220" alt="" />
</picture>
</a> </a>
<div class="name"> <div class="name">
<a href="<?= $link ?>"> <a href="<?= $link ?>">
@ -135,11 +137,7 @@ use Aviat\AnimeClient\API\Kitsu;
$titles = Kitsu::filterTitles($manga); $titles = Kitsu::filterTitles($manga);
?> ?>
<a href="<?= $link ?>"> <a href="<?= $link ?>">
<picture width="220"> <?= $helper->picture("images/manga/{$manga['id']}.webp") ?>
<source srcset="<?= $urlGenerator->assetUrl("images/manga/{$manga['id']}.webp") ?>" type="image/webp">
<source srcset="<?= $urlGenerator->assetUrl("images/manga/{$manga['id']}.jpg") ?>" type="image/jpeg">
<img src="<?= $urlGenerator->assetUrl("images/manga/{$manga['id']}.jpg") ?>" width="220" alt="" />
</picture>
</a> </a>
<div class="name"> <div class="name">
<a href="<?= $link ?>"> <a href="<?= $link ?>">

File diff suppressed because one or more lines are too long

View File

@ -30,6 +30,7 @@ button {
table { table {
/* min-width: 85%; */ /* min-width: 85%; */
box-shadow: 0 48px 80px -32px rgba(0, 0, 0, 0.3);
margin: 0 auto; margin: 0 auto;
} }
@ -124,6 +125,7 @@ a:hover, a:active {
} }
.flex { .flex {
display: inline-block;
display: flex display: flex
} }
@ -156,12 +158,13 @@ a:hover, a:active {
} }
.media-wrap { .media-wrap {
text-align: left; text-align: center;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
} }
.media-wrap-flex { .media-wrap-flex {
display: inline-block;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-content: space-evenly; align-content: space-evenly;
@ -202,6 +205,14 @@ td .media-wrap-flex {
width: 100%; width: 100%;
} }
.full-height {
max-height: none;
}
.toph {
margin-top: 0;
}
/* ----------------------------------------------------------------------------- /* -----------------------------------------------------------------------------
Main Nav Main Nav
------------------------------------------------------------------------------*/ ------------------------------------------------------------------------------*/
@ -330,10 +341,19 @@ td .media-wrap-flex {
background: inherit; background: inherit;
} }
.invisible tr, .invisible td, .invisible th { .borderless,
.borderless tr,
.borderless td,
.borderless th,
.invisible tr,
.invisible td,
.invisible th {
box-shadow: none;
border: 0; border: 0;
} }
/* ----------------------------------------------------------------------------- /* -----------------------------------------------------------------------------
Message boxes Message boxes
------------------------------------------------------------------------------*/ ------------------------------------------------------------------------------*/
@ -410,10 +430,7 @@ td .media-wrap-flex {
height: 311px; height: 311px;
margin: var(--normal-padding); margin: var(--normal-padding);
z-index: 0; z-index: 0;
} background: rgba(0,0,0,0.15);
.small_character {
} }
.details picture.cover, .details picture.cover,
@ -428,10 +445,6 @@ picture.cover {
width: 100%; width: 100%;
} }
.small_character {
}
.media .edit_buttons > button { .media .edit_buttons > button {
margin: 0.5em auto; margin: 0.5em auto;
} }
@ -561,6 +574,7 @@ picture.cover {
.anime .row, .manga .row { .anime .row, .manga .row {
width: 100%; width: 100%;
display: inline-block;
display: flex; display: flex;
align-content: space-around; align-content: space-around;
justify-content: space-around; justify-content: space-around;
@ -575,6 +589,7 @@ picture.cover {
.anime .row > div, .manga .row > div { .anime .row > div, .manga .row > div {
font-size: 0.8em; font-size: 0.8em;
display: inline-block;
display: flex-item; display: flex-item;
align-self: center; align-self: center;
text-align: center; text-align: center;
@ -719,12 +734,6 @@ picture.cover {
.details .cover { .details .cover {
display: block; display: block;
width: 284px;
/* height: 402px; */
}
.details h2 {
margin-top: 0;
} }
.details .flex > * { .details .flex > * {
@ -749,6 +758,11 @@ picture.cover {
text-align: left; text-align: left;
} }
.details a h1,
.details a h2 {
margin-top: 0;
}
.character, .character,
.small_character, .small_character,
.person { .person {
@ -765,6 +779,11 @@ picture.cover {
height: 338px; height: 338px;
} }
.small_person {
width: 200px;
height: 300px;
}
.character a { .character a {
height: 350px; height: 350px;
} }
@ -808,11 +827,22 @@ picture.cover {
max-height: 338px; max-height: 338px;
} }
.small_person img,
.small_person picture {
max-height: 300px;
max-width: 200px;
}
.min-table { .min-table {
min-width: 0; min-width: 0;
margin-left: 0; margin-left: 0;
} }
.max-table {
min-width:100%;
margin: 0;
}
aside.info { aside.info {
max-width: 390px; max-width: 390px;
} }
@ -930,6 +960,7 @@ aside.info picture, aside.info img {
CSS Tabs CSS Tabs
-----------------------------------------------------------------------------*/ -----------------------------------------------------------------------------*/
.tabs { .tabs {
display: inline-block;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
background: #efefef; background: #efefef;
@ -978,13 +1009,22 @@ CSS Tabs
border: 1px solid #e5e5e5; border: 1px solid #e5e5e5;
border-top: 0; border-top: 0;
display: block; display: block;
padding: 20px 30px 30px; padding: 15px;
background: #fff; background: #fff;
width: 100%; width: 100%;
margin: 0 auto;
overflow: auto;
/* text-align: center; */
} }
.tabs .content { .tabs .content {
display: none; display: none;
max-height: 950px;
}
.tabs .content.full-height {
max-height: none;
} }
@media (min-width: 600px) { @media (min-width: 600px) {
@ -997,6 +1037,78 @@ CSS Tabs
} }
} }
/* ---------------------------------------------------------------------------
Vertical Tabs
----------------------------------------------------------------------------*/
.vertical-tabs {
border: 1px solid #e5e5e5;
box-shadow: 0 48px 80px -32px rgba(0, 0, 0, 0.3);
margin: 0 auto;
position: relative;
width: 100%;
}
.vertical-tabs input[type="radio"] {
display: none;
}
.vertical-tabs .tab {
align-items: center;
display: inline-block;
display: flex;
flex-wrap: nowrap;
}
.vertical-tabs .tab label {
align-items: center;
background: #e5e5e5;
border: 1px solid #e5e5e5;
color: #7f7f7f;
cursor: pointer;
font-size: 18px;
font-weight: bold;
padding: 0 20px;
width: 28%;
}
.vertical-tabs .tab label:hover {
background: #d8d8d8;
}
.vertical-tabs .tab label:active {
background: #ccc;
}
.vertical-tabs .tab .content {
display: none;
border: 1px solid #e5e5e5;
border-left: 0;
border-right: 0;
max-height: 950px;
overflow: auto;
}
.vertical-tabs .tab .content.full-height {
max-height: none;
}
.vertical-tabs [type=radio]:checked + label {
border: 0;
background: #fff;
color: #000;
width: 38%;
}
.vertical-tabs [type=radio]:focus + label {
box-shadow: inset 0px 0px 0px 3px #2aa1c0;
z-index: 1;
}
.vertical-tabs [type=radio]:checked ~ .content {
display: block;
}
/* ---------------------------------------------------------------------------- /* ----------------------------------------------------------------------------
Settings Form Settings Form
-----------------------------------------------------------------------------*/ -----------------------------------------------------------------------------*/

Binary file not shown.

Before

Width:  |  Height:  |  Size: 242 B

After

Width:  |  Height:  |  Size: 807 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -6,11 +6,11 @@ evt,listener)});sel.addEventListener(event,listener,false)}function delegateEven
listener)})};function ajaxSerialize(data){var pairs=[];Object.keys(data).forEach(function(name){var value=data[name].toString();name=encodeURIComponent(name);value=encodeURIComponent(value);pairs.push(name+"\x3d"+value)});return pairs.join("\x26")}AnimeClient.ajax=function(url,config){var defaultConfig={data:{},type:"GET",dataType:"",success:AnimeClient.noop,mimeType:"application/x-www-form-urlencoded",error:AnimeClient.noop};config=Object.assign({},defaultConfig,config);var request=new XMLHttpRequest; listener)})};function ajaxSerialize(data){var pairs=[];Object.keys(data).forEach(function(name){var value=data[name].toString();name=encodeURIComponent(name);value=encodeURIComponent(value);pairs.push(name+"\x3d"+value)});return pairs.join("\x26")}AnimeClient.ajax=function(url,config){var defaultConfig={data:{},type:"GET",dataType:"",success:AnimeClient.noop,mimeType:"application/x-www-form-urlencoded",error:AnimeClient.noop};config=Object.assign({},defaultConfig,config);var request=new XMLHttpRequest;
var method=String(config.type).toUpperCase();if(method==="GET")url+=url.match(/\?/)?ajaxSerialize(config.data):"?"+ajaxSerialize(config.data);request.open(method,url);request.onreadystatechange=function(){if(request.readyState===4){var responseText="";if(request.responseType==="json")responseText=JSON.parse(request.responseText);else responseText=request.responseText;if(request.status>299)config.error.call(null,request.status,responseText,request.response);else config.success.call(null,responseText, var method=String(config.type).toUpperCase();if(method==="GET")url+=url.match(/\?/)?ajaxSerialize(config.data):"?"+ajaxSerialize(config.data);request.open(method,url);request.onreadystatechange=function(){if(request.readyState===4){var responseText="";if(request.responseType==="json")responseText=JSON.parse(request.responseText);else responseText=request.responseText;if(request.status>299)config.error.call(null,request.status,responseText,request.response);else config.success.call(null,responseText,
request.status)}};if(config.dataType==="json"){config.data=JSON.stringify(config.data);config.mimeType="application/json"}else config.data=ajaxSerialize(config.data);request.setRequestHeader("Content-Type",config.mimeType);switch(method){case "GET":request.send(null);break;default:request.send(config.data);break}};AnimeClient.get=function(url,data,callback){callback=callback===undefined?null:callback;if(callback===null){callback=data;data={}}return AnimeClient.ajax(url,{data:data,success:callback})}; request.status)}};if(config.dataType==="json"){config.data=JSON.stringify(config.data);config.mimeType="application/json"}else config.data=ajaxSerialize(config.data);request.setRequestHeader("Content-Type",config.mimeType);switch(method){case "GET":request.send(null);break;default:request.send(config.data);break}};AnimeClient.get=function(url,data,callback){callback=callback===undefined?null:callback;if(callback===null){callback=data;data={}}return AnimeClient.ajax(url,{data:data,success:callback})};
AnimeClient.on("header","click",".message",function(e){AnimeClient.hide(e.target)});AnimeClient.on("form.js-delete","submit",function(event){var proceed=confirm("Are you ABSOLUTELY SURE you want to delete this item?");if(proceed===false){event.preventDefault();event.stopPropagation()}});AnimeClient.on(".js-clear-cache","click",function(){AnimeClient.get("/cache_purge",function(){AnimeClient.showMessage("success","Successfully purged api cache")})});if("serviceWorker"in navigator)navigator.serviceWorker.register("/sw.js").then(function(reg){console.log("Service worker registered", AnimeClient.on("header","click",".message",function(e){AnimeClient.hide(e.target)});AnimeClient.on("form.js-delete","submit",function(event){var proceed=confirm("Are you ABSOLUTELY SURE you want to delete this item?");if(proceed===false){event.preventDefault();event.stopPropagation()}});AnimeClient.on(".js-clear-cache","click",function(){AnimeClient.get("/cache_purge",function(){AnimeClient.showMessage("success","Successfully purged api cache")})});AnimeClient.on(".vertical-tabs input","change",function(event){var el=
reg.scope)})["catch"](function(error){console.error("Failed to register service worker",error)});AnimeClient.on("main","change",".big-check",function(e){var id=e.target.id;document.getElementById("mal_"+id).checked=true});function renderAnimeSearchResults(data){var results=[];data.forEach(function(x){var item=x.attributes;var titles=item.titles.reduce(function(prev,current){return prev+(current+"\x3cbr /\x3e")},[]);results.push('\n\t\t\t\x3carticle class\x3d"media search"\x3e\n\t\t\t\t\x3cdiv class\x3d"name"\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" class\x3d"mal-check" id\x3d"mal_'+ event.currentTarget.parentElement;var rect=el.getBoundingClientRect();var top=rect.top+window.pageYOffset;var bottom=rect.bottom+window.pageYOffset;window.scrollTo({bottom:bottom,behavior:"smooth"})});AnimeClient.on("main","change",".big-check",function(e){var id=e.target.id;document.getElementById("mal_"+id).checked=true});function renderAnimeSearchResults(data){var results=[];data.forEach(function(x){var item=x.attributes;var titles=item.titles.reduce(function(prev,current){return prev+(current+
item.slug+'" name\x3d"mal_id" value\x3d"'+x.mal_id+'" /\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" class\x3d"big-check" id\x3d"'+item.slug+'" name\x3d"id" value\x3d"'+x.id+'" /\x3e\n\t\t\t\t\t\x3clabel for\x3d"'+item.slug+'"\x3e\n\t\t\t\t\t\t\x3cpicture width\x3d"220"\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/anime/'+x.id+'.webp" type\x3d"image/webp" /\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/anime/'+x.id+'.jpg" type\x3d"image/jpeg" /\x3e\n\t\t\t\t\t\t\t\x3cimg src\x3d"/public/images/anime/'+ "\x3cbr /\x3e")},[]);results.push('\n\t\t\t\x3carticle class\x3d"media search"\x3e\n\t\t\t\t\x3cdiv class\x3d"name"\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" class\x3d"mal-check" id\x3d"mal_'+item.slug+'" name\x3d"mal_id" value\x3d"'+x.mal_id+'" /\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" class\x3d"big-check" id\x3d"'+item.slug+'" name\x3d"id" value\x3d"'+x.id+'" /\x3e\n\t\t\t\t\t\x3clabel for\x3d"'+item.slug+'"\x3e\n\t\t\t\t\t\t\x3cpicture width\x3d"220"\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/anime/'+
x.id+'.jpg" alt\x3d"" width\x3d"220" /\x3e\n\t\t\t\t\t\t\x3c/picture\x3e\n\t\t\t\t\t\t\n\t\t\t\t\t\t\x3cspan class\x3d"name"\x3e\n\t\t\t\t\t\t\t'+item.canonicalTitle+"\x3cbr /\x3e\n\t\t\t\t\t\t\t\x3csmall\x3e"+titles+'\x3c/small\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/label\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3cdiv class\x3d"table"\x3e\n\t\t\t\t\t\x3cdiv class\x3d"row"\x3e\n\t\t\t\t\t\t\x3cspan class\x3d"edit"\x3e\n\t\t\t\t\t\t\t\x3ca class\x3d"bracketed" href\x3d"/anime/details/'+item.slug+ x.id+'.webp" type\x3d"image/webp" /\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/anime/'+x.id+'.jpg" type\x3d"image/jpeg" /\x3e\n\t\t\t\t\t\t\t\x3cimg src\x3d"/public/images/anime/'+x.id+'.jpg" alt\x3d"" width\x3d"220" /\x3e\n\t\t\t\t\t\t\x3c/picture\x3e\n\t\t\t\t\t\t\n\t\t\t\t\t\t\x3cspan class\x3d"name"\x3e\n\t\t\t\t\t\t\t'+item.canonicalTitle+"\x3cbr /\x3e\n\t\t\t\t\t\t\t\x3csmall\x3e"+titles+'\x3c/small\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/label\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3cdiv class\x3d"table"\x3e\n\t\t\t\t\t\x3cdiv class\x3d"row"\x3e\n\t\t\t\t\t\t\x3cspan class\x3d"edit"\x3e\n\t\t\t\t\t\t\t\x3ca class\x3d"bracketed" href\x3d"/anime/details/'+
'"\x3eInfo Page\x3c/a\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\x3c/article\x3e\n\t\t')});return results.join("")}function renderMangaSearchResults(data){var results=[];data.forEach(function(x){var item=x.attributes;var titles=item.titles.reduce(function(prev,current){return prev+(current+"\x3cbr /\x3e")},[]);results.push('\n\t\t\t\x3carticle class\x3d"media search"\x3e\n\t\t\t\t\x3cdiv class\x3d"name"\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" id\x3d"mal_'+ item.slug+'"\x3eInfo Page\x3c/a\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\x3c/article\x3e\n\t\t')});return results.join("")}function renderMangaSearchResults(data){var results=[];data.forEach(function(x){var item=x.attributes;var titles=item.titles.reduce(function(prev,current){return prev+(current+"\x3cbr /\x3e")},[]);results.push('\n\t\t\t\x3carticle class\x3d"media search"\x3e\n\t\t\t\t\x3cdiv class\x3d"name"\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" id\x3d"mal_'+
item.slug+'" name\x3d"mal_id" value\x3d"'+x.mal_id+'" /\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" class\x3d"big-check" id\x3d"'+item.slug+'" name\x3d"id" value\x3d"'+x.id+'" /\x3e\n\t\t\t\t\t\x3clabel for\x3d"'+item.slug+'"\x3e\n\t\t\t\t\t\t\x3cpicture width\x3d"220"\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/manga/'+x.id+'.webp" type\x3d"image/webp" /\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/manga/'+x.id+'.jpg" type\x3d"image/jpeg" /\x3e\n\t\t\t\t\t\t\t\x3cimg src\x3d"/public/images/manga/'+ item.slug+'" name\x3d"mal_id" value\x3d"'+x.mal_id+'" /\x3e\n\t\t\t\t\t\x3cinput type\x3d"radio" class\x3d"big-check" id\x3d"'+item.slug+'" name\x3d"id" value\x3d"'+x.id+'" /\x3e\n\t\t\t\t\t\x3clabel for\x3d"'+item.slug+'"\x3e\n\t\t\t\t\t\t\x3cpicture width\x3d"220"\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/manga/'+x.id+'.webp" type\x3d"image/webp" /\x3e\n\t\t\t\t\t\t\t\x3csource srcset\x3d"/public/images/manga/'+x.id+'.jpg" type\x3d"image/jpeg" /\x3e\n\t\t\t\t\t\t\t\x3cimg src\x3d"/public/images/manga/'+
x.id+'.jpg" alt\x3d"" width\x3d"220" /\x3e\n\t\t\t\t\t\t\x3c/picture\x3e\n\t\t\t\t\t\t\x3cspan class\x3d"name"\x3e\n\t\t\t\t\t\t\t'+item.canonicalTitle+"\x3cbr /\x3e\n\t\t\t\t\t\t\t\x3csmall\x3e"+titles+'\x3c/small\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/label\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3cdiv class\x3d"table"\x3e\n\t\t\t\t\t\x3cdiv class\x3d"row"\x3e\n\t\t\t\t\t\t\x3cspan class\x3d"edit"\x3e\n\t\t\t\t\t\t\t\x3ca class\x3d"bracketed" href\x3d"/manga/details/'+item.slug+'"\x3eInfo Page\x3c/a\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\x3c/article\x3e\n\t\t')}); x.id+'.jpg" alt\x3d"" width\x3d"220" /\x3e\n\t\t\t\t\t\t\x3c/picture\x3e\n\t\t\t\t\t\t\x3cspan class\x3d"name"\x3e\n\t\t\t\t\t\t\t'+item.canonicalTitle+"\x3cbr /\x3e\n\t\t\t\t\t\t\t\x3csmall\x3e"+titles+'\x3c/small\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/label\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3cdiv class\x3d"table"\x3e\n\t\t\t\t\t\x3cdiv class\x3d"row"\x3e\n\t\t\t\t\t\t\x3cspan class\x3d"edit"\x3e\n\t\t\t\t\t\t\t\x3ca class\x3d"bracketed" href\x3d"/manga/details/'+item.slug+'"\x3eInfo Page\x3c/a\x3e\n\t\t\t\t\t\t\x3c/span\x3e\n\t\t\t\t\t\x3c/div\x3e\n\t\t\t\t\x3c/div\x3e\n\t\t\t\x3c/article\x3e\n\t\t')});
return results.join("")}var search=function(query){AnimeClient.$(".cssload-loader")[0].removeAttribute("hidden");AnimeClient.get(AnimeClient.url("/anime-collection/search"),{query:query},function(searchResults,status){searchResults=JSON.parse(searchResults);AnimeClient.$(".cssload-loader")[0].setAttribute("hidden","hidden");AnimeClient.$("#series_list")[0].innerHTML=renderAnimeSearchResults(searchResults.data)})};if(AnimeClient.hasElement(".anime #search"))AnimeClient.on("#search","keyup",AnimeClient.throttle(250, return results.join("")}var search=function(query){AnimeClient.$(".cssload-loader")[0].removeAttribute("hidden");AnimeClient.get(AnimeClient.url("/anime-collection/search"),{query:query},function(searchResults,status){searchResults=JSON.parse(searchResults);AnimeClient.$(".cssload-loader")[0].setAttribute("hidden","hidden");AnimeClient.$("#series_list")[0].innerHTML=renderAnimeSearchResults(searchResults.data)})};if(AnimeClient.hasElement(".anime #search"))AnimeClient.on("#search","keyup",AnimeClient.throttle(250,

File diff suppressed because one or more lines are too long

View File

@ -6,6 +6,6 @@ evt,listener)});sel.addEventListener(event,listener,false)}function delegateEven
listener)})};function ajaxSerialize(data){var pairs=[];Object.keys(data).forEach(function(name){var value=data[name].toString();name=encodeURIComponent(name);value=encodeURIComponent(value);pairs.push(name+"\x3d"+value)});return pairs.join("\x26")}AnimeClient.ajax=function(url,config){var defaultConfig={data:{},type:"GET",dataType:"",success:AnimeClient.noop,mimeType:"application/x-www-form-urlencoded",error:AnimeClient.noop};config=Object.assign({},defaultConfig,config);var request=new XMLHttpRequest; listener)})};function ajaxSerialize(data){var pairs=[];Object.keys(data).forEach(function(name){var value=data[name].toString();name=encodeURIComponent(name);value=encodeURIComponent(value);pairs.push(name+"\x3d"+value)});return pairs.join("\x26")}AnimeClient.ajax=function(url,config){var defaultConfig={data:{},type:"GET",dataType:"",success:AnimeClient.noop,mimeType:"application/x-www-form-urlencoded",error:AnimeClient.noop};config=Object.assign({},defaultConfig,config);var request=new XMLHttpRequest;
var method=String(config.type).toUpperCase();if(method==="GET")url+=url.match(/\?/)?ajaxSerialize(config.data):"?"+ajaxSerialize(config.data);request.open(method,url);request.onreadystatechange=function(){if(request.readyState===4){var responseText="";if(request.responseType==="json")responseText=JSON.parse(request.responseText);else responseText=request.responseText;if(request.status>299)config.error.call(null,request.status,responseText,request.response);else config.success.call(null,responseText, var method=String(config.type).toUpperCase();if(method==="GET")url+=url.match(/\?/)?ajaxSerialize(config.data):"?"+ajaxSerialize(config.data);request.open(method,url);request.onreadystatechange=function(){if(request.readyState===4){var responseText="";if(request.responseType==="json")responseText=JSON.parse(request.responseText);else responseText=request.responseText;if(request.status>299)config.error.call(null,request.status,responseText,request.response);else config.success.call(null,responseText,
request.status)}};if(config.dataType==="json"){config.data=JSON.stringify(config.data);config.mimeType="application/json"}else config.data=ajaxSerialize(config.data);request.setRequestHeader("Content-Type",config.mimeType);switch(method){case "GET":request.send(null);break;default:request.send(config.data);break}};AnimeClient.get=function(url,data,callback){callback=callback===undefined?null:callback;if(callback===null){callback=data;data={}}return AnimeClient.ajax(url,{data:data,success:callback})}; request.status)}};if(config.dataType==="json"){config.data=JSON.stringify(config.data);config.mimeType="application/json"}else config.data=ajaxSerialize(config.data);request.setRequestHeader("Content-Type",config.mimeType);switch(method){case "GET":request.send(null);break;default:request.send(config.data);break}};AnimeClient.get=function(url,data,callback){callback=callback===undefined?null:callback;if(callback===null){callback=data;data={}}return AnimeClient.ajax(url,{data:data,success:callback})};
AnimeClient.on("header","click",".message",function(e){AnimeClient.hide(e.target)});AnimeClient.on("form.js-delete","submit",function(event){var proceed=confirm("Are you ABSOLUTELY SURE you want to delete this item?");if(proceed===false){event.preventDefault();event.stopPropagation()}});AnimeClient.on(".js-clear-cache","click",function(){AnimeClient.get("/cache_purge",function(){AnimeClient.showMessage("success","Successfully purged api cache")})});if("serviceWorker"in navigator)navigator.serviceWorker.register("/sw.js").then(function(reg){console.log("Service worker registered", AnimeClient.on("header","click",".message",function(e){AnimeClient.hide(e.target)});AnimeClient.on("form.js-delete","submit",function(event){var proceed=confirm("Are you ABSOLUTELY SURE you want to delete this item?");if(proceed===false){event.preventDefault();event.stopPropagation()}});AnimeClient.on(".js-clear-cache","click",function(){AnimeClient.get("/cache_purge",function(){AnimeClient.showMessage("success","Successfully purged api cache")})});AnimeClient.on(".vertical-tabs input","change",function(event){var el=
reg.scope)})["catch"](function(error){console.error("Failed to register service worker",error)})})(); event.currentTarget.parentElement;var rect=el.getBoundingClientRect();var top=rect.top+window.pageYOffset;var bottom=rect.bottom+window.pageYOffset;window.scrollTo({bottom:bottom,behavior:"smooth"})})})();
//# sourceMappingURL=scripts.min.js.map //# sourceMappingURL=scripts.min.js.map

File diff suppressed because one or more lines are too long

View File

@ -23,3 +23,16 @@ _.on('.js-clear-cache', 'click', () => {
_.showMessage('success', 'Successfully purged api cache'); _.showMessage('success', 'Successfully purged api cache');
}); });
}); });
// Alleviate some page jumping
_.on('.vertical-tabs input', 'change', (event) => {
const el = event.currentTarget.parentElement;
const rect = el.getBoundingClientRect();
const top = rect.top + window.pageYOffset;
window.scrollTo({
top,
behavior: 'smooth',
});
});

View File

@ -1,10 +1,10 @@
import './base/events.js'; import './base/events.js';
if ('serviceWorker' in navigator) { /* if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').then(reg => { navigator.serviceWorker.register('/sw.js').then(reg => {
console.log('Service worker registered', reg.scope); console.log('Service worker registered', reg.scope);
}).catch(error => { }).catch(error => {
console.error('Failed to register service worker', error); console.error('Failed to register service worker', error);
}); });
} } */

View File

@ -1,4 +1,5 @@
{ {
"license": "MIT",
"scripts": { "scripts": {
"build": "npm run build:css && npm run build:js", "build": "npm run build:css && npm run build:js",
"build:css": "node ./tools/css.js", "build:css": "node ./tools/css.js",
@ -8,15 +9,13 @@
"watch": "concurrently \"npm:watch:css\" \"npm:watch:js\" --kill-others" "watch": "concurrently \"npm:watch:css\" \"npm:watch:js\" --kill-others"
}, },
"devDependencies": { "devDependencies": {
"concurrently": "^3.6.1", "concurrently": "^4.0.1",
"cssnano": "^4.0.5", "cssnano": "^4.0.5",
"postcss-cachify": "^1.3.1", "postcss-cachify": "^1.3.1",
"postcss-cssnext": "^3.0.0", "postcss-cssnext": "^3.0.0",
"postcss-import": "^12.0.0", "postcss-import": "^12.0.0",
"rollup": "^0.64.1", "rollup": "^0.66.6",
"rollup-plugin-closure-compiler-js": "^1.0.6",
"watch": "^1.0.2" "watch": "^1.0.2"
},
"dependencies": {
"rollup-plugin-closure-compiler-js": "^1.0.6"
} }
} }

File diff suppressed because it is too large Load Diff