Update views to show streaming links

This commit is contained in:
Timothy Warren 2017-01-13 16:49:46 -05:00
parent 9e30783ecb
commit c1724397d3
6 changed files with 92 additions and 19 deletions

View File

@ -11,7 +11,7 @@
<section class="media-wrap">
<?php foreach($items as $item): ?>
<?php if ($item['private'] && ! $auth->is_authenticated()) continue; ?>
<article class="media" id="<?= $item['id'] ?>" data-kitsu-id="<?= $item['id'] ?>" data-mal-id="<?= $item['mal_id'] ?>">
<article class="media" data-kitsu-id="<?= $item['id'] ?>" data-mal-id="<?= $item['mal_id'] ?>">
<?php if ($auth->is_authenticated()): ?>
<button title="Increment episode count" class="plus_one" hidden>+1 Episode</button>
<?php endif ?>
@ -32,6 +32,7 @@
</span>
</div>
<?php endif ?>
<?php if ($item['private'] || $item['rewatching']): ?>
<div class="row">
<?php foreach(['private', 'rewatching'] as $attr): ?>
@ -41,11 +42,29 @@
<?php endforeach ?>
</div>
<?php endif ?>
<?php if ($item['rewatched'] > 0): ?>
<div class="row">
<div>Rewatched <?= $item['rewatched'] ?> time(s)</div>
</div>
<?php endif ?>
<?php if (count($item['anime']['streaming_links']) > 0): ?>
<div class="row">
<?php foreach($item['anime']['streaming_links'] as $link): ?>
<div class="cover_streaming_link">
<?php if($link['meta']['link']): ?>
<a href="<?= $link['link']?>">
<?= $link['meta']['logo'] ?>
</a>
<?php else: ?>
<?= $link['meta']['logo'] ?>
<?php endif ?>
</div>
<?php endforeach ?>
</div>
<?php endif ?>
<div class="row">
<div class="user_rating">Rating: <?= $item['user_rating'] ?> / 10</div>
<div class="completion">Episodes:

View File

@ -1,10 +1,10 @@
<main class="details">
<section class="flex flex-no-wrap">
<div>
<img class="cover" src="<?= $data['cover_image'] ?>" alt="<?= $data['title'] ?> cover image" />
<img class="cover" src="<?= $data['cover_image'] ?>" alt="" />
<br />
<br />
<table>
<table class="media_details">
<tr>
<td class="align_right">Airing Status</td>
<td><?= $data['status'] ?></td>
@ -42,7 +42,39 @@
<?php endforeach ?>
<br />
<p><?= nl2br($data['synopsis']) ?></p>
<?php /*<pre><?= json_encode($data['included'], \JSON_PRETTY_PRINT) ?></pre> */ ?>
<?php if (count($data['streaming_links']) > 0): ?>
<hr />
<h4>Streaming on:</h4>
<table class="full_width invisible">
<thead>
<tr>
<th class="align_left">Service</th>
<th>Subtitles</th>
<th>Dubs</th>
</tr>
</thead>
<tbody>
<?php foreach($data['streaming_links'] as $streaming_link): ?>
<tr>
<td class="align_left">
<?php if ($streaming_link['meta']['link'] !== FALSE): ?>
<a href="<?= $streaming_link['link'] ?>">
<?= $streaming_link['meta']['logo'] ?>
&nbsp;&nbsp;<?= $streaming_link['meta']['name'] ?>
</a>
<?php else: ?>
<?= $streaming_link['meta']['logo'] ?>
&nbsp;&nbsp;<?= $streaming_link['meta']['name'] ?>
<?php endif ?>
</td>
<td><?= implode(', ', $streaming_link['subs']) ?></td>
<td><?= implode(', ', $streaming_link['dubs']) ?></td>
</tr>
<?php endforeach ?>
</tbody>
</table>
<?php endif ?>
<?php /*<pre><?= print_r($data, TRUE) ?></pre> */ ?>
</div>
</section>
</main>

View File

@ -1,4 +1,5 @@
<?php if ($auth->is_authenticated()): ?>
<?php /* <pre><?= json_encode($item, \JSON_PRETTY_PRINT); ?></pre> */ ?>
<main>
<h2>Edit Anime List Item</h2>
<form action="<?= $action ?>" method="post">

View File

@ -19,7 +19,7 @@
<th>Type</th>
<th>Progress</th>
<th>Rated</th>
<th>Attributes</th>
<th colspan="2">Attributes</th>
<th>Notes</th>
<th>Genres</th>
</tr>
@ -61,6 +61,17 @@
<?php endforeach ?>
</ul>
</td>
<td>
<?php foreach($item['anime']['streaming_links'] as $link): ?>
<?php if ($link['meta']['link'] !== FALSE): ?>
<a href="<?= $link['link'] ?>">
<?= $link['meta']['logo'] ?>
</a>
<?php else: ?>
<?= $link['meta']['logo'] ?>
<?php endif ?>
<?php endforeach ?>
</td>
<td>
<p><?= $escape->html($item['notes']) ?></p>
</td>

View File

@ -794,6 +794,10 @@ a:hover, a:active {
background-color:#db7d12;
}
.full_width {
width: 100%;
}
/* -----------------------------------------------------------------------------
CSS loading icon
------------------------------------------------------------------------------*/
@ -1208,7 +1212,7 @@ a:hover, a:active {
text-align:center;
color: greenyellow;
position:absolute;
top:5px;
top:147px;
left:0;
height:100%;
width:100%;
@ -1248,8 +1252,9 @@ a:hover, a:active {
}
.details .cover {
max-width: 300px;
max-height: 435px;
display: block;
width: 284px;
height: 402px;
}
.details h2 {
@ -1261,11 +1266,11 @@ a:hover, a:active {
margin: 1rem;
}
.details table {
.details .media_details {
max-width:300px;
}
.details td {
.details .media_details td {
padding:0 15px;
padding:0 1.5rem;
}
@ -1274,13 +1279,13 @@ a:hover, a:active {
text-align:justify;
}
.details td:nth-child(odd) {
.details .media_details td:nth-child(odd) {
width:1%;
white-space:nowrap;
text-align:right;
}
.details td:nth-child(even) {
.details .media_details td:nth-child(even) {
text-align:left;
}

View File

@ -115,6 +115,10 @@ a:hover, a:active {
background-color: var(--edit-link-hover-color);
}
.full_width {
width: 100%;
}
/* -----------------------------------------------------------------------------
CSS loading icon
------------------------------------------------------------------------------*/
@ -471,7 +475,7 @@ a:hover, a:active {
text-align:center;
color: greenyellow;
position:absolute;
top:5px;
top:147px;
left:0;
height:100%;
width:100%;
@ -505,8 +509,9 @@ a:hover, a:active {
}
.details .cover {
max-width: 300px;
max-height: 435px;
display: block;
width: 284px;
height: 402px;
}
.details h2 {
@ -517,10 +522,10 @@ a:hover, a:active {
margin: 1rem;
}
.details table {
.details .media_details {
max-width:300px;
}
.details td {
.details .media_details td {
padding:0 1.5rem;
}
@ -528,12 +533,12 @@ a:hover, a:active {
text-align:justify;
}
.details td:nth-child(odd) {
.details .media_details td:nth-child(odd) {
width:1%;
white-space:nowrap;
text-align:right;
}
.details td:nth-child(even) {
.details .media_details td:nth-child(even) {
text-align:left;
}