Details and user page updates, resolves #27
This commit is contained in:
parent
ddd30fc713
commit
c50b1da53b
@ -76,25 +76,25 @@
|
||||
<?php endif ?>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
|
||||
<?php if (count($characters) > 0): ?>
|
||||
<h2>Characters</h2>
|
||||
<div class="flex flex-wrap">
|
||||
<section class="media-wrap">
|
||||
<?php foreach($characters as $char): ?>
|
||||
<?php if ( ! empty($char['image']['original'])): ?>
|
||||
<div class="character">
|
||||
<article class="character">
|
||||
<?php $link = $url->generate('character', ['slug' => $char['slug']]) ?>
|
||||
<?= $helper->a($link, $char['name']); ?>
|
||||
<br />
|
||||
<div class="name">
|
||||
<?= $helper->a($link, $char['name']); ?>
|
||||
</div>
|
||||
<a href="<?= $link ?>">
|
||||
<?= $helper->img($char['image']['original'], [
|
||||
'width' => '225'
|
||||
]) ?>
|
||||
</a>
|
||||
</div>
|
||||
</article>
|
||||
<?php endif ?>
|
||||
<?php endforeach ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
</section>
|
||||
<?php endif ?>
|
||||
</main>
|
||||
@ -1,7 +1,7 @@
|
||||
<main class="details fixed">
|
||||
<section class="flex flex-no-wrap">
|
||||
<div>
|
||||
<img class="cover" width="402" height="284" src="<?= $data['image']['original'] ?>" alt="" />
|
||||
<img class="cover" width="284" src="<?= $data['image']['original'] ?>" alt="" />
|
||||
</div>
|
||||
<div>
|
||||
<h2><?= $data['name'] ?></h2>
|
||||
|
||||
@ -35,26 +35,25 @@
|
||||
<p><?= nl2br($data['synopsis']) ?></p>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
|
||||
<?php if (count($characters) > 0): ?>
|
||||
<h2>Characters</h2>
|
||||
<div class="flex flex-wrap">
|
||||
<section class="media-wrap">
|
||||
<?php foreach($characters as $char): ?>
|
||||
<?php if ( ! empty($char['image']['original'])): ?>
|
||||
<div class="character">
|
||||
<article class="character">
|
||||
<?php $link = $url->generate('character', ['slug' => $char['slug']]) ?>
|
||||
<?= $helper->a($link, $char['name']); ?>
|
||||
<br />
|
||||
<div class="name">
|
||||
<?= $helper->a($link, $char['name']); ?>
|
||||
</div>
|
||||
<a href="<?= $link ?>">
|
||||
<?= $helper->img($char['image']['original'], [
|
||||
'width' => '225'
|
||||
]) ?>
|
||||
</a>
|
||||
</div>
|
||||
</article>
|
||||
<?php endif ?>
|
||||
<?php endforeach ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
</section>
|
||||
|
||||
<?php endif ?>
|
||||
</main>
|
||||
@ -1,4 +1,5 @@
|
||||
<main class="details">
|
||||
<?php use Aviat\AnimeClient\API\Kitsu; ?>
|
||||
<main class="user-page details">
|
||||
<section class="flex flex-no-wrap">
|
||||
<div>
|
||||
<h2><?= $attributes['name'] ?></h2>
|
||||
@ -54,29 +55,73 @@
|
||||
<dd><?= $escape->html($attributes['bio']) ?></dd>
|
||||
</dl>
|
||||
<?php if ( ! empty($favorites)): ?>
|
||||
<h3>Favorites:</h3>
|
||||
<?php if ( ! empty($favorites['characters'])): ?>
|
||||
<section>
|
||||
<h4>Characters</h4>
|
||||
<div class="flex flex-wrap">
|
||||
<h4>Favorite Characters</h4>
|
||||
<section class="media-wrap">
|
||||
<?php foreach($favorites['characters'] as $char): ?>
|
||||
<?php if ( ! empty($char['image']['original'])): ?>
|
||||
<div class="small_character">
|
||||
<article class="small_character">
|
||||
<?php $link = $url->generate('character', ['slug' => $char['slug']]) ?>
|
||||
<?= $helper->a($link, $char['name']); ?>
|
||||
<br />
|
||||
<div class="name"><?= $helper->a($link, $char['name']); ?></div>
|
||||
<a href="<?= $link ?>">
|
||||
<?= $helper->img($char['image']['original'], [
|
||||
'width' => '225'
|
||||
]) ?>
|
||||
<?= $helper->img($char['image']['original']) ?>
|
||||
</a>
|
||||
</div>
|
||||
</article>
|
||||
<?php endif ?>
|
||||
<?php endforeach ?>
|
||||
</div>
|
||||
</section>
|
||||
<?php endif ?>
|
||||
<?php if ( ! empty($favorites['anime'])): ?>
|
||||
<h4>Favorite Anime</h4>
|
||||
<section class="media-wrap">
|
||||
<?php foreach($favorites['anime'] as $anime): ?>
|
||||
<article class="media">
|
||||
<?php
|
||||
$link = $url->generate('anime.details', ['id' => $anime['slug']]);
|
||||
$titles = Kitsu::filterTitles($anime);
|
||||
?>
|
||||
<a href="<?= $link ?>">
|
||||
<img src="<?= $anime['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>
|
||||
<?php endif ?>
|
||||
<?php if ( ! empty($favorites['manga'])): ?>
|
||||
<h4>Favorite Manga</h4>
|
||||
<section class="media-wrap">
|
||||
<?php foreach($favorites['manga'] as $manga): ?>
|
||||
<article class="media">
|
||||
<?php
|
||||
$link = $url->generate('manga.details', ['id' => $manga['slug']]);
|
||||
$titles = Kitsu::filterTitles($manga);
|
||||
?>
|
||||
<a href="<?= $link ?>">
|
||||
<img src="<?= $manga['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>
|
||||
<?php endif ?>
|
||||
<?php endif ?>
|
||||
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
@ -1025,7 +1025,7 @@ a:hover, a:active {
|
||||
Base list styles
|
||||
------------------------------------------------------------------------------*/
|
||||
|
||||
.media {
|
||||
.media, .character, .small_character {
|
||||
position:relative;
|
||||
vertical-align:top;
|
||||
display:inline-block;
|
||||
@ -1035,7 +1035,9 @@ a:hover, a:active {
|
||||
margin:0.25em 0.125em;
|
||||
}
|
||||
|
||||
.media > img {
|
||||
.media > img,
|
||||
.character > img,
|
||||
.small_character > img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -1076,7 +1078,9 @@ a:hover, a:active {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.media:hover > .name,
|
||||
.small_character:hover > .name,
|
||||
.character:hover > .name,
|
||||
.media:hover > .name,
|
||||
.media:hover > .media_metadata > div,
|
||||
.media:hover > .medium_metadata > div,
|
||||
.media:hover > .table .row
|
||||
@ -1094,7 +1098,11 @@ a:hover, a:active {
|
||||
display:block;
|
||||
}
|
||||
|
||||
.media > .name a,
|
||||
.small_character > .name a,
|
||||
.small_character > .name a small,
|
||||
.character > .name a,
|
||||
.character > .name a small,
|
||||
.media > .name a,
|
||||
.media > .name a small
|
||||
{
|
||||
background:none;
|
||||
@ -1263,7 +1271,7 @@ a:hover, a:active {
|
||||
.details .cover {
|
||||
display: block;
|
||||
width: 284px;
|
||||
height: 402px;
|
||||
/* height: 402px; */
|
||||
}
|
||||
|
||||
.details h2 {
|
||||
@ -1298,12 +1306,56 @@ a:hover, a:active {
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.character,
|
||||
.small_character {
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 225px;
|
||||
height: 350px;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.small_character a {
|
||||
display:inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.small_character .name,
|
||||
.character .name {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.small_character img,
|
||||
.character img {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
z-index: 5;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
User page styles
|
||||
-----------------------------------------------------------------------------*/
|
||||
|
||||
.small_character img {
|
||||
max-width: 300px;
|
||||
.small_character {
|
||||
width: 160px;
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.user-page .media-wrap {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.media a {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
|
||||
@ -297,7 +297,7 @@ a:hover, a:active {
|
||||
Base list styles
|
||||
------------------------------------------------------------------------------*/
|
||||
|
||||
.media {
|
||||
.media, .character, .small_character {
|
||||
position:relative;
|
||||
vertical-align:top;
|
||||
display:inline-block;
|
||||
@ -307,7 +307,9 @@ a:hover, a:active {
|
||||
margin: var(--normal-padding);
|
||||
}
|
||||
|
||||
.media > img {
|
||||
.media > img,
|
||||
.character > img,
|
||||
.small_character > img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -347,7 +349,8 @@ a:hover, a:active {
|
||||
position:absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.small_character:hover > .name,
|
||||
.character:hover > .name,
|
||||
.media:hover > .name,
|
||||
.media:hover > .media_metadata > div,
|
||||
.media:hover > .medium_metadata > div,
|
||||
@ -364,6 +367,10 @@ a:hover, a:active {
|
||||
display:block;
|
||||
}
|
||||
|
||||
.small_character > .name a,
|
||||
.small_character > .name a small,
|
||||
.character > .name a,
|
||||
.character > .name a small,
|
||||
.media > .name a,
|
||||
.media > .name a small
|
||||
{
|
||||
@ -521,7 +528,7 @@ a:hover, a:active {
|
||||
.details .cover {
|
||||
display: block;
|
||||
width: 284px;
|
||||
height: 402px;
|
||||
/* height: 402px; */
|
||||
}
|
||||
|
||||
.details h2 {
|
||||
@ -552,13 +559,54 @@ a:hover, a:active {
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.character,
|
||||
.small_character {
|
||||
background: rgba(0,0,0,0.5);
|
||||
width: 225px;
|
||||
height: 350px;
|
||||
vertical-align: middle;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.small_character a {
|
||||
display:inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.small_character .name,
|
||||
.character .name {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.small_character img,
|
||||
.character img {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 5;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
User page styles
|
||||
-----------------------------------------------------------------------------*/
|
||||
.small_character img {
|
||||
max-width: 300px;
|
||||
.small_character {
|
||||
width: 160px;
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.user-page .media-wrap {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.media a {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* ----------------------------------------------------------------------------
|
||||
Viewport-based styles
|
||||
|
||||
@ -433,6 +433,12 @@ class Model {
|
||||
]
|
||||
];
|
||||
$data = $this->getRequest("anime/{$kitsuAnimeId}", $options);
|
||||
|
||||
if ( ! array_key_exists('included', $data))
|
||||
{
|
||||
return NULL;
|
||||
}
|
||||
|
||||
$mappings = array_column($data['included'], 'attributes');
|
||||
|
||||
foreach($mappings as $map)
|
||||
|
||||
@ -284,6 +284,17 @@ class Controller {
|
||||
], NULL, $httpCode);
|
||||
}
|
||||
|
||||
/**
|
||||
* Redirect to the default controller/url from an empty path
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
public function redirectToDefaultRoute()
|
||||
{
|
||||
$defaultType = $this->config->get(['routes', 'route_config', 'default_list']) ?? 'anime';
|
||||
$this->redirect($this->urlGenerator->defaultUrl($defaultType), 303);
|
||||
}
|
||||
|
||||
/**
|
||||
* Set a session flash variable to display a message on
|
||||
* next page load
|
||||
|
||||
@ -113,17 +113,6 @@ class Index extends BaseController {
|
||||
]);
|
||||
}
|
||||
|
||||
/**
|
||||
* Redirect to the default controller/url from an empty path
|
||||
*
|
||||
* @return void
|
||||
*/
|
||||
public function redirectToDefaultRoute()
|
||||
{
|
||||
$defaultType = $this->config->get(['routes', 'route_config', 'default_list']);
|
||||
$this->redirect($this->urlGenerator->defaultUrl($defaultType), 303);
|
||||
}
|
||||
|
||||
private function organizeFavorites(array $rawfavorites): array
|
||||
{
|
||||
// return $rawfavorites;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user