mirror of
https://github.com/hkalexling/Mango.git
synced 2025-08-03 11:25:29 -04:00
Onboarding for new libraries and new users
This commit is contained in:
Jared Turner
parent
aaf0a3c6af
commit
fa85d9834f
@ -69,6 +69,13 @@ class MainRouter < Router
|
|||||||
continue_reading = @context.library.get_continue_reading_entries username
|
continue_reading = @context.library.get_continue_reading_entries username
|
||||||
recently_added = @context.library.get_recently_added_entries username
|
recently_added = @context.library.get_recently_added_entries username
|
||||||
|
|
||||||
|
new_user = true
|
||||||
|
titles = @context.library.titles
|
||||||
|
titles.each { |t| new_user = false if t.load_percentage(username) > 0 }
|
||||||
|
|
||||||
|
empty_library = true
|
||||||
|
empty_library = false if titles.size > 0
|
||||||
|
|
||||||
layout "home"
|
layout "home"
|
||||||
rescue e
|
rescue e
|
||||||
@context.error e
|
@context.error e
|
||||||
|
|||||||
@ -1,89 +1,127 @@
|
|||||||
<%- unless continue_reading.empty? -%>
|
<%- if new_user && empty_library -%>
|
||||||
<h2 class="uk-title home-headings">Continue Reading</h2>
|
|
||||||
<div id="item-container-continue" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
|
|
||||||
<%- continue_reading.each do |cr| -%>
|
|
||||||
<div class="item" data-mtime="<%= cr[:entry].mtime.to_unix %>" data-progress="<%= cr[:percentage] %>" id="<%= cr[:entry].id %>">
|
|
||||||
<a class="acard">
|
|
||||||
<div class="uk-card uk-card-default" onclick="showModal("<%= cr[:entry].encoded_path %>", '<%= cr[:entry].pages %>', <%= (cr[:percentage] * 100).round(1) %>, "<%= cr[:entry].book.encoded_display_name %>", "<%= cr[:entry].encoded_display_name %>", '<%= cr[:entry].title_id %>', '<%= cr[:entry].id %>')">
|
|
||||||
<div class="uk-card-media-top">
|
|
||||||
<img data-src="<%= cr[:entry].cover_url %>" alt="" data-width data-height uk-img>
|
|
||||||
</div>
|
|
||||||
<div class="uk-card-body">
|
|
||||||
<div class="uk-card-badge uk-label"><%= (cr[:percentage] * 100).round(1) %>%</div>
|
|
||||||
<h3 class="uk-card-title break-word" data-title="<%= cr[:entry].display_name.gsub("\"", """) %>"><%= cr[:entry].display_name %></h3>
|
|
||||||
<p><%= cr[:entry].pages %> pages</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<%- end -%>
|
|
||||||
</div>
|
|
||||||
<%- end -%>
|
|
||||||
|
|
||||||
<%- unless recently_added.empty? -%>
|
<div class="uk-container uk-text-center">
|
||||||
<h2 class="uk-title home-headings">Recently Added</h2>
|
<i class="fas fa-plus" style="font-size: 80px;"></i>
|
||||||
<div id="item-container-continue" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
|
<h2>Add your first manga</h2>
|
||||||
<%- recently_added.each do |ra| -%>
|
<p style="margin-bottom: 40px;">We can't find any files yet. Add some to your library and they'll appear here.</p>
|
||||||
<%- if ra[:grouped_count] == 1 -%>
|
<dl class="uk-description-list">
|
||||||
<div class="item" data-progress="<%= ra[:percentage] %>" id="<%= ra[:entry].id %>">
|
<dt style="font-weight: 500;">Current library path</dt>
|
||||||
<a class="acard">
|
<dd><code><%= @context.config.library_path %></code></dd>
|
||||||
<div class="uk-card uk-card-default" onclick="showModal("<%= ra[:entry].encoded_path %>", '<%= ra[:entry].pages %>', <%= (ra[:percentage] * 100).round(1) %>, "<%= ra[:entry].book.encoded_display_name %>", "<%= ra[:entry].encoded_display_name %>", '<%= ra[:entry].title_id %>', '<%= ra[:entry].id %>')">
|
<dt style="font-weight: 500;">Want to change your library path?</dt>
|
||||||
<div class="uk-card-media-top">
|
<dd>Update <code>config.yml</code> located at: <code>/can/I/access/config_path/from/view?</code></dd>
|
||||||
<img data-src="<%= ra[:entry].cover_url %>" alt="" data-width data-height uk-img>
|
<dt style="font-weight: 500;">Can't see your files yet?</dt>
|
||||||
</div>
|
<dd>You must wait <%= @context.config.scan_interval %> minutes for the library scan to complete, or restart Mango.</dd>
|
||||||
<div class="uk-card-body">
|
</dl>
|
||||||
<div class="uk-card-badge uk-label"><%= (ra[:percentage] * 100).round(1) %>%</div>
|
</div>
|
||||||
<h3 class="uk-card-title break-word" data-title="<%= ra[:entry].display_name.gsub("\"", """) %>"><%= ra[:entry].display_name %></h3>
|
|
||||||
<p><%= ra[:entry].pages %> pages</p>
|
<%- elsif new_user && empty_library == false -%>
|
||||||
</div>
|
|
||||||
|
<div class="uk-container uk-text-center">
|
||||||
|
<i class="fas fa-book-open" style="font-size: 80px;"></i>
|
||||||
|
<h2>Read your first manga</h2>
|
||||||
|
<p>Once you start reading, Mango will remember where you left off
|
||||||
|
and show your entries here.</p>
|
||||||
|
<a href="/library" class="uk-button uk-button-default">View library</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<%- elsif new_user == false && empty_library == false -%>
|
||||||
|
|
||||||
|
<%- if continue_reading.empty? && recently_added.empty? -%>
|
||||||
|
<div class="uk-container uk-text-center">
|
||||||
|
<img src="/img/banner.png" style="max-width: 400px; padding: 0 20px;">
|
||||||
|
<p>A self-hosted manga server and reader</p>
|
||||||
|
<a href="/library" class="uk-button uk-button-default">View library</a>
|
||||||
|
</div>
|
||||||
|
<%- end -%>
|
||||||
|
|
||||||
|
<%- unless continue_reading.empty? -%>
|
||||||
|
<h2 class="uk-title home-headings">Continue Reading</h2>
|
||||||
|
<div id="item-container-continue" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
|
||||||
|
<%- continue_reading.each do |cr| -%>
|
||||||
|
<div class="item" data-mtime="<%= cr[:entry].mtime.to_unix %>" data-progress="<%= cr[:percentage] %>" id="<%= cr[:entry].id %>">
|
||||||
|
<a class="acard">
|
||||||
|
<div class="uk-card uk-card-default" onclick="showModal("<%= cr[:entry].encoded_path %>", '<%= cr[:entry].pages %>', <%= (cr[:percentage] * 100).round(1) %>, "<%= cr[:entry].book.encoded_display_name %>", "<%= cr[:entry].encoded_display_name %>", '<%= cr[:entry].title_id %>', '<%= cr[:entry].id %>')">
|
||||||
|
<div class="uk-card-media-top">
|
||||||
|
<img data-src="<%= cr[:entry].cover_url %>" alt="" data-width data-height uk-img>
|
||||||
|
</div>
|
||||||
|
<div class="uk-card-body">
|
||||||
|
<div class="uk-card-badge uk-label"><%= (cr[:percentage] * 100).round(1) %>%</div>
|
||||||
|
<h3 class="uk-card-title break-word" data-title="<%= cr[:entry].display_name.gsub("\"", """) %>"><%= cr[:entry].display_name %></h3>
|
||||||
|
<p><%= cr[:entry].pages %> pages</p>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<%- else -%>
|
|
||||||
<div class="item">
|
|
||||||
<a class="acard" href="/book/<%= ra[:entry].book.id %>">
|
|
||||||
<div class="uk-card uk-card-default">
|
|
||||||
<div class="uk-card-media-top">
|
|
||||||
<img data-src="<%= ra[:entry].cover_url %>" data-width data-height alt="" uk-img>
|
|
||||||
</div>
|
|
||||||
<div class="uk-card-body">
|
|
||||||
<h3 class="uk-card-title break-word" data-title="<%= ra[:entry].book.display_name.gsub("\"", """) %>"><%= ra[:entry].book.display_name %></h3>
|
|
||||||
<p><%= ra[:grouped_count] %> new entries</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<%- end -%>
|
<%- end -%>
|
||||||
|
</div>
|
||||||
<%- end -%>
|
<%- end -%>
|
||||||
</div>
|
|
||||||
<%- end -%>
|
|
||||||
|
|
||||||
<!-- TODO: DRY this code with calls in other ecr files? eg. title.ecr -->
|
<%- unless recently_added.empty? -%>
|
||||||
<div id="modal" class="uk-flex-top" uk-modal>
|
<h2 class="uk-title home-headings">Recently Added</h2>
|
||||||
<div class="uk-modal-dialog uk-margin-auto-vertical">
|
<div id="item-container-continue" class="uk-child-width-1-4@m uk-child-width-1-2" uk-grid>
|
||||||
<button class="uk-modal-close-default" type="button" uk-close></button>
|
<%- recently_added.each do |ra| -%>
|
||||||
<div class="uk-modal-header">
|
<%- if ra[:grouped_count] == 1 -%>
|
||||||
<div>
|
<div class="item" data-progress="<%= ra[:percentage] %>" id="<%= ra[:entry].id %>">
|
||||||
<h4 class="uk-margin-remove-bottom"><a id="modal-title-link"></a></h4>
|
<a class="acard">
|
||||||
<h3 class="uk-modal-title break-word uk-margin-remove-top" id="modal-entry-title"><span></span></h3>
|
<div class="uk-card uk-card-default" onclick="showModal("<%= ra[:entry].encoded_path %>", '<%= ra[:entry].pages %>', <%= (ra[:percentage] * 100).round(1) %>, "<%= ra[:entry].book.encoded_display_name %>", "<%= ra[:entry].encoded_display_name %>", '<%= ra[:entry].title_id %>', '<%= ra[:entry].id %>')">
|
||||||
|
<div class="uk-card-media-top">
|
||||||
|
<img data-src="<%= ra[:entry].cover_url %>" alt="" data-width data-height uk-img>
|
||||||
|
</div>
|
||||||
|
<div class="uk-card-body">
|
||||||
|
<div class="uk-card-badge uk-label"><%= (ra[:percentage] * 100).round(1) %>%</div>
|
||||||
|
<h3 class="uk-card-title break-word" data-title="<%= ra[:entry].display_name.gsub("\"", """) %>"><%= ra[:entry].display_name %></h3>
|
||||||
|
<p><%= ra[:entry].pages %> pages</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<%- else -%>
|
||||||
|
<div class="item">
|
||||||
|
<a class="acard" href="/book/<%= ra[:entry].book.id %>">
|
||||||
|
<div class="uk-card uk-card-default">
|
||||||
|
<div class="uk-card-media-top">
|
||||||
|
<img data-src="<%= ra[:entry].cover_url %>" data-width data-height alt="" uk-img>
|
||||||
|
</div>
|
||||||
|
<div class="uk-card-body">
|
||||||
|
<h3 class="uk-card-title break-word" data-title="<%= ra[:entry].book.display_name.gsub("\"", """) %>"><%= ra[:entry].book.display_name %></h3>
|
||||||
|
<p><%= ra[:grouped_count] %> new entries</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<%- end -%>
|
||||||
|
<%- end -%>
|
||||||
|
</div>
|
||||||
|
<%- end -%>
|
||||||
|
|
||||||
|
<!-- TODO: DRY this code with calls in other ecr files? eg. title.ecr -->
|
||||||
|
<div id="modal" class="uk-flex-top" uk-modal>
|
||||||
|
<div class="uk-modal-dialog uk-margin-auto-vertical">
|
||||||
|
<button class="uk-modal-close-default" type="button" uk-close></button>
|
||||||
|
<div class="uk-modal-header">
|
||||||
|
<div>
|
||||||
|
<h4 class="uk-margin-remove-bottom"><a id="modal-title-link"></a></h4>
|
||||||
|
<h3 class="uk-modal-title break-word uk-margin-remove-top" id="modal-entry-title"><span></span></h3>
|
||||||
|
</div>
|
||||||
|
<p class="uk-text-meta uk-margin-remove-bottom break-word" id="path-text"></p>
|
||||||
|
<p class="uk-text-meta uk-margin-remove-top" id="pages-text"></p>
|
||||||
|
</div>
|
||||||
|
<div class="uk-modal-body">
|
||||||
|
<p>Read</p>
|
||||||
|
<p uk-margin>
|
||||||
|
<a id="beginning-btn" class="uk-button uk-button-default">From beginning</a>
|
||||||
|
<a id="continue-btn" class="uk-button uk-button-primary"></a>
|
||||||
|
</p>
|
||||||
|
<p>Progress</p>
|
||||||
|
<p uk-margin>
|
||||||
|
<button id="read-btn" class="uk-button uk-button-default">Mark as read (100%)</button>
|
||||||
|
<button id="unread-btn" class="uk-button uk-button-default">Mark as unread (0%)</button>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<p class="uk-text-meta uk-margin-remove-bottom break-word" id="path-text"></p>
|
|
||||||
<p class="uk-text-meta uk-margin-remove-top" id="pages-text"></p>
|
|
||||||
</div>
|
|
||||||
<div class="uk-modal-body">
|
|
||||||
<p>Read</p>
|
|
||||||
<p uk-margin>
|
|
||||||
<a id="beginning-btn" class="uk-button uk-button-default">From beginning</a>
|
|
||||||
<a id="continue-btn" class="uk-button uk-button-primary"></a>
|
|
||||||
</p>
|
|
||||||
<p>Progress</p>
|
|
||||||
<p uk-margin>
|
|
||||||
<button id="read-btn" class="uk-button uk-button-default">Mark as read (100%)</button>
|
|
||||||
<button id="unread-btn" class="uk-button uk-button-default">Mark as unread (0%)</button>
|
|
||||||
</p>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
<%- end -%>
|
||||||
|
|
||||||
<% content_for "script" do %>
|
<% content_for "script" do %>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.dotdotdot/4.0.11/dotdotdot.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery.dotdotdot/4.0.11/dotdotdot.js"></script>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user