This commit is contained in:
63
app/views/books/publications/_publication.html.erb
Normal file
63
app/views/books/publications/_publication.html.erb
Normal file
@@ -0,0 +1,63 @@
|
||||
<div class="flex flex-column gap margin-block-start pad <%= book.published? ? "fill-selected" : "fill-shade" %> border-radius">
|
||||
<% if book.editable? %>
|
||||
<div class="flex align-center justify-center gap-half center">
|
||||
<%= image_tag "lock.svg", aria: { hidden: true }, size: 36, class: "colorize--black" %>
|
||||
<%= form_with model: book, url: book_publication_path(book), data: { controller: "form", action: "change->form#submit" }, html: { contents: true } do |form| %>
|
||||
<label class="switch txt-medium">
|
||||
<%= form.check_box :published, checked: book.published?, class: "switch__input" %>
|
||||
<span class="switch__btn round"></span>
|
||||
<span class="for-screen-reader">Publish this book</span>
|
||||
</label>
|
||||
<% end %>
|
||||
<%= image_tag "world.svg", aria: { hidden: true }, size: 36, class: "colorize--black" %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% if book.published? %>
|
||||
<div class="flex flex-column align-center gap txt-medium">
|
||||
<% public_url = book_slug_url(book) %>
|
||||
|
||||
<label class="flex flex-column gap full-width txt-align-center">
|
||||
<strong id="invite_label" class="invite-label for-screen-reader">Public link to this book</strong>
|
||||
<input type="text" class="input fill-white" id="invite_url" value="<%= public_url %>" aria-labelledby="invite_label" readonly>
|
||||
</label>
|
||||
|
||||
<div class="flex align-center gap">
|
||||
<div data-controller="dialog" class="flex-inline">
|
||||
<%= tag.button class: "btn", data: { action: "dialog#open" } do %>
|
||||
<%= image_tag "qr-code.svg", aria: { hidden: "true" }, size: 24, class: "colorize--black" %>
|
||||
<span class="for-screen-reader">Show public link QR code</span>
|
||||
<% end %>
|
||||
|
||||
<dialog class="dialog panel shadow" data-dialog-target="menu">
|
||||
<%= qr_code_image(public_url) %>
|
||||
|
||||
<form method="dialog" class="margin-block-start flex justify-center">
|
||||
<button class="btn">
|
||||
<%= image_tag "remove.svg", aria: { hidden: true }, size: 24 %>
|
||||
<span class="for-screen-reader">Close</span>
|
||||
</button>
|
||||
</form>
|
||||
</dialog>
|
||||
</div>
|
||||
|
||||
<%= button_to_copy_to_clipboard(public_url) do %>
|
||||
<%= image_tag "copy-paste.svg", aria: { hidden: "true" }, size: 24, class: "colorize--black" %>
|
||||
<span class="for-screen-reader">Copy public link</span>
|
||||
<% end %>
|
||||
|
||||
<%= web_share_button(public_url, "Link to join Writebook", "Hit this link to join me in Writebook and start writing.") do %>
|
||||
<%= image_tag "share.svg", aria: { hidden: "true" }, size: 24, class: "colorize--black" %>
|
||||
<span class="for-screen-reader">Share public link</span>
|
||||
<% end %>
|
||||
|
||||
<% if book.editable? %>
|
||||
<%= link_to edit_book_publication_path(book), class: "btn" do %>
|
||||
<%= image_tag "pencil.svg", aria: { hidden: "true" }, size: 24, class: "colorize--black" %>
|
||||
<span class="for-screen-reader">Edit link URL</span>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
38
app/views/books/publications/edit.html.erb
Normal file
38
app/views/books/publications/edit.html.erb
Normal file
@@ -0,0 +1,38 @@
|
||||
<%= turbo_frame_tag @book, :publication do %>
|
||||
<div class="flex flex-column gap margin-block-start pad fill-shade border-radius <%= "shake" if @book.errors[:slug].any? %>">
|
||||
<div class="flex flex-column align-center gap txt-medium">
|
||||
<% public_url = book_url(@book) %>
|
||||
|
||||
<%= form_with model: @book, url: book_publication_path(@book), class: "max-width", data: { turbo_frame: "_top" } do |form| %>
|
||||
<%= form.hidden_field :publication, value: true %>
|
||||
|
||||
<label class="flex flex-column gap full-width txt-align-center">
|
||||
<div id="public_link_label" class="flex align-center gap justify-center">
|
||||
<strong>Edit publication link</strong>
|
||||
</div>
|
||||
<span class="input input--actor flex align-center fill-white">
|
||||
<%= "#{request.host}/#{@book.id}/" %>
|
||||
<%= form.text_field :slug,
|
||||
autofocus: true,
|
||||
class: class_names("input"),
|
||||
required: true,
|
||||
pattern: "^[\\-A-Za-z0-9]+$",
|
||||
title: "Enter letters, numbers, or hyphens only" %>
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<div class="flex align-center gap margin-inline margin-block-start">
|
||||
<button type="submit" class="btn btn--positive flex-item-justify-end">
|
||||
<%= image_tag "check.svg", aria: { hidden: true }, size: 24 %>
|
||||
<span class="for-screen-reader">Save</span>
|
||||
</button>
|
||||
|
||||
<%= link_to book_slug_path(@book), class: "btn flex-item-justify-start" do %>
|
||||
<%= image_tag "remove.svg", aria: { hidden: true }, size: 24 %>
|
||||
<span class="for-screen-reader">Cancel</span>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
3
app/views/books/publications/show.html.erb
Normal file
3
app/views/books/publications/show.html.erb
Normal file
@@ -0,0 +1,3 @@
|
||||
<%= turbo_frame_tag @book, :publication do %>
|
||||
<%= render "publication", book: @book %>
|
||||
<% end %>
|
||||
Reference in New Issue
Block a user