- implement reader

This commit is contained in:
Alex Ling
2020-02-12 20:17:45 +00:00
parent 0b2ec2d002
commit f126dfb430
4 changed files with 83 additions and 1 deletions

39
src/views/reader.ecr Normal file
View File

@@ -0,0 +1,39 @@
<!DOCTYPE html>
<html style="background-color:black;">
<head>
<meta charset="utf-8">
<meta name="X-UA-Compatible" content="IE=edge">
<title>Mango</title>
<meta name="description" content="Mango Manga Server">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/css/uikit.min.css" />
<link rel="stylesheet" href="/css/mango.css" />
</head>
<body>
<div class="uk-section uk-section-default uk-section-small" style="background-color:black;">
<div class="uk-container uk-container-small">
<%- urls.each do |url| -%>
<img class="uk-align-center" data-src="<%= url %>" data-width data-height uk-img>
<%- end -%>
<%- if next_url -%>
<a class="next-url" href="<%= next_url %>"></a>
<%- end -%>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit@3.3.1/dist/js/uikit-icons.min.js"></script>
<script src="https://unpkg.com/infinite-scroll@3/dist/infinite-scroll.pkgd.min.js"></script>
<script>
$(function() {
$('.uk-container').infiniteScroll({
path: '.next-url',
append: '.uk-container',
history: 'replace'
});
});
</script>
</body>
</html>

View File

@@ -2,6 +2,7 @@
<div class="uk-child-width-1-4@m" uk-grid>
<%- title.entries.each do |e| -%>
<div>
<a class="acard" href="/reader/<%= title.title %>/<%= e.title %>">
<div class="uk-card uk-card-default">
<div class="uk-card-media-top">
<img src="<%= e.cover_url %>" alt="">
@@ -11,6 +12,7 @@
<h3 class="uk-card-title"><%= e.title %></h3>
</div>
</div>
</a>
</div>
<%- end -%>
</div>