mirror of
https://github.com/ClaperCo/Claper.git
synced 2025-12-15 19:37:53 +01:00
1334 lines
57 KiB
Plaintext
1334 lines
57 KiB
Plaintext
<div
|
|
id="manager"
|
|
x-data={"{date:
|
|
moment.utc('#{@event.expired_at}').local().format('lll')}"}
|
|
phx-hook="Manager"
|
|
data-max-page={@event.presentation_file.length}
|
|
data-current-page={@state.position}
|
|
>
|
|
<div
|
|
id="add-modal"
|
|
class={"#{if !@create, do: 'hidden' } fixed z-30 inset-0 overflow-y-auto p-4 sm:p-6 md:p-24
|
|
transform transition-all duration-150"}
|
|
role="dialog"
|
|
aria-modal="true"
|
|
>
|
|
<div
|
|
phx-click={toggle_add_modal()}
|
|
class="fixed inset-0 bg-gray-800 bg-opacity-75 transition-opacity w-full h-full"
|
|
aria-hidden="true"
|
|
>
|
|
</div>
|
|
<div class="mx-auto max-w-xl transform divide-y divide-gray-100 overflow-hidden rounded-xl bg-white shadow-2xl ring-1 ring-black ring-opacity-5 transition-all">
|
|
<button phx-click={toggle_add_modal()} class="absolute right-0 top-0">
|
|
<svg
|
|
class="text-gray-500 h-9 transform rotate-45"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 20 20"
|
|
fill="currentColor"
|
|
aria-hidden="true"
|
|
>
|
|
<path
|
|
fill-rule="evenodd"
|
|
d="M10 5a1 1 0 011 1v3h3a1 1 0 110 2h-3v3a1 1 0 11-2 0v-3H6a1 1 0 110-2h3V6a1 1 0 011-1z"
|
|
clip-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
</button>
|
|
|
|
<div id="modal-content" class="bg-gray-100">
|
|
<%= if @create==nil do %>
|
|
<ul class="scroll-py-3 overflow-y-auto p-3" id="options" role="listbox">
|
|
<li id="option-1" role="option" tabindex="-1">
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/add/poll"}
|
|
class="group flex select-none rounded-xl p-3 w-full hover:bg-gray-200 cursor-pointer"
|
|
>
|
|
<div class="flex h-12 w-12 flex-none text-white items-center justify-center rounded-lg bg-gradient-to-br from-primary-500 to-secondary-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-6 w-6"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="1.5"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M16 8v8m-4-5v5m-4-2v2m-2 4h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-4 flex-auto text-left">
|
|
<p class="font-medium text-gray-700">
|
|
<%= gettext("Poll") %>
|
|
</p>
|
|
<p class="text-gray-500">
|
|
<%= gettext("Add poll to know opinion of your public.") %>
|
|
</p>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li id="option-2" role="option" tabindex="-1">
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/add/form"}
|
|
class="group flex select-none rounded-xl p-3 w-full hover:bg-gray-200 cursor-pointer"
|
|
>
|
|
<div class="flex h-12 w-12 flex-none text-white items-center justify-center rounded-lg bg-gradient-to-br from-primary-500 to-secondary-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="icon icon-tabler icon-tabler-forms"
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
fill="none"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M12 3a3 3 0 0 0 -3 3v12a3 3 0 0 0 3 3"></path>
|
|
<path d="M6 3a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3"></path>
|
|
<path d="M13 7h7a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-7"></path>
|
|
<path d="M5 7h-1a1 1 0 0 0 -1 1v8a1 1 0 0 0 1 1h1"></path>
|
|
<path d="M17 12h.01"></path>
|
|
<path d="M13 12h.01"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-4 flex-auto text-left">
|
|
<p class="font-medium text-gray-700">
|
|
<%= gettext("Form") %>
|
|
</p>
|
|
<p class="text-gray-500">
|
|
<%= gettext("Add form to collect data from your public.") %>
|
|
</p>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
<li id="option-3" role="option" tabindex="-1">
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/add/embed"}
|
|
class="group flex select-none rounded-xl p-3 w-full hover:bg-gray-200 cursor-pointer"
|
|
>
|
|
<div class="flex h-12 w-12 flex-none text-white items-center justify-center rounded-lg bg-gradient-to-br from-primary-500 to-secondary-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
class="w-6 h-6"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M14.25 9.75L16.5 12l-2.25 2.25m-4.5 0L7.5 12l2.25-2.25M6 20.25h12A2.25 2.25 0 0020.25 18V6A2.25 2.25 0 0018 3.75H6A2.25 2.25 0 003.75 6v12A2.25 2.25 0 006 20.25z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="ml-4 flex-auto text-left">
|
|
<p class="font-medium text-gray-700"><%= gettext("Web content") %></p>
|
|
<p class="text-gray-500">
|
|
<%= gettext("Add a Youtube video or any web content.") %>
|
|
</p>
|
|
</div>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<%= if (length @polls)==0 && (length @forms)==0 && @event.presentation_file.length > 0 do %>
|
|
<div class="mt-10">
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/import"}
|
|
class="group flex gap-x-2 select-none rounded-xl p-3 w-full hover:bg-gray-200 cursor-pointer"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
width="24"
|
|
height="24"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3"
|
|
/>
|
|
</svg>
|
|
<p class="text-gray-700">
|
|
<%= gettext("Import all interactions from another presentation") %>
|
|
</p>
|
|
</a>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<%= if @create=="poll" do %>
|
|
<div class="scroll-py-3 overflow-y-auto bg-gray-100 p-3">
|
|
<p class="text-xl font-bold">
|
|
<%= case @create_action do
|
|
:new -> gettext("New poll")
|
|
:edit -> gettext("Edit poll")
|
|
end %>
|
|
</p>
|
|
<.live_component
|
|
module={ClaperWeb.PollLive.FormComponent}
|
|
id="poll-create"
|
|
event_uuid={@event.uuid}
|
|
presentation_file={@event.presentation_file}
|
|
poll={@poll}
|
|
live_action={@create_action}
|
|
position={@state.position}
|
|
return_to={~p"/e/#{@event.code}/manage"}
|
|
/>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%= if @create=="form" do %>
|
|
<div class="scroll-py-3 overflow-y-auto bg-gray-100 p-3">
|
|
<p class="text-xl font-bold">
|
|
<%= case @create_action do
|
|
:new -> gettext("New form")
|
|
:edit -> gettext("Edit form")
|
|
end %>
|
|
</p>
|
|
<.live_component
|
|
module={ClaperWeb.FormLive.FormComponent}
|
|
id="form-create"
|
|
event_uuid={@event.uuid}
|
|
presentation_file={@event.presentation_file}
|
|
form={@form}
|
|
live_action={@create_action}
|
|
position={@state.position}
|
|
return_to={~p"/e/#{@event.code}/manage"}
|
|
/>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%= if @create == "embed" do %>
|
|
<div class="scroll-py-3 overflow-y-auto bg-gray-100 p-3">
|
|
<p class="text-xl font-bold">
|
|
<%= case @create_action do
|
|
:new -> gettext("New web content")
|
|
:edit -> gettext("Edit web content")
|
|
end %>
|
|
</p>
|
|
<.live_component
|
|
module={ClaperWeb.EmbedLive.FormComponent}
|
|
id="embed-create"
|
|
event_uuid={@event.uuid}
|
|
presentation_file={@event.presentation_file}
|
|
embed={@embed}
|
|
live_action={@create_action}
|
|
position={@state.position}
|
|
return_to={~p"/e/#{@event.code}/manage"}
|
|
/>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%= if @create == "import" do %>
|
|
<div class="scroll-py-3 overflow-y-auto bg-gray-100 p-3">
|
|
<p class="text-xl font-bold">
|
|
<%= gettext("Select presentation") %>
|
|
</p>
|
|
<ul>
|
|
<%= for event <- @events do %>
|
|
<li class="my-3">
|
|
<button
|
|
phx-click="import"
|
|
phx-value-event={event.uuid}
|
|
class="bg-blue-500 text-white flex gap-x-2 items-center px-2 py-1 rounded-md"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
class="w-5 h-5"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5M16.5 12L12 16.5m0 0L7.5 12m4.5 4.5V3"
|
|
/>
|
|
</svg>
|
|
<span>
|
|
<%= event.name %>
|
|
</span>
|
|
</button>
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
id="wrapper"
|
|
class="grid grid-rows-[3.2em_1fr] h-screen max-h-screen overflow-hidden"
|
|
data-next-label={gettext("Next")}
|
|
data-prev-label={gettext("Back")}
|
|
data-finish-label={gettext("Finish")}
|
|
data-group="manage"
|
|
phx-hook="TourGuide"
|
|
>
|
|
<div class="flex items-center justify-between px-3 py-2 border-b-2 border-gray-200 w-full bg-white">
|
|
<div class="flex-1 flex gap-x-2">
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/events"}
|
|
class="md:px-3 rounded-md hover:bg-gray-200 flex items-center"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-4 w-4"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7" />
|
|
</svg>
|
|
</a>
|
|
<div class="flex items-center justify-start gap-x-2">
|
|
<h2 class="text-xl font-bold leading-7 text-gray-900 sm:text-2xl sm:truncate">
|
|
<%= @event.name %>
|
|
</h2>
|
|
<div class="flex gap-x-3 items-center">
|
|
<div class="flex items-center text-sm text-gray-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="flex-shrink-0 mr-1.5 h-5 w-5 text-gray-400"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M7 20l4-16m2 16l4-16M6 9h14M4 15h14"
|
|
/>
|
|
</svg>
|
|
<%= @event.code %>
|
|
</div>
|
|
<div class="flex items-center text-sm text-gray-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="flex-shrink-0 mr-1.5 h-5 w-5 text-gray-400"
|
|
viewBox="0 0 20 20"
|
|
fill="currentColor"
|
|
>
|
|
<path
|
|
fill-rule="evenodd"
|
|
d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z"
|
|
clip-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
<%= @attendees_nb %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="flex items-center gap-x-3 justify-end">
|
|
<span class="hidden lg:block italic text-gray-400 text-sm">
|
|
<%= raw(
|
|
gettext("Press <strong>F</strong> in the presentation window to enable fullscreen")
|
|
) %>
|
|
</span>
|
|
<button
|
|
phx-hook="OpenPresenter"
|
|
id={"openPresenter-#{@event.uuid}"}
|
|
data-url={~p"/e/#{@event.code}/presenter"}
|
|
type="button"
|
|
data-tg-title={"🙌 #{gettext("Time to launch your presentation!")}"}
|
|
data-tg-order="4"
|
|
data-tg-tour={"<p>#{gettext("Click here to open the presentation window.")}</p>"}
|
|
data-tg-group="manage"
|
|
class="inline-flex items-center px-5 py-1 border border-transparent rounded-md shadow-sm text-base font-medium text-white bg-gradient-to-tl from-primary-500 to-secondary-500 bg-size-200 bg-pos-0 hover:bg-pos-100 transition-all duration-500"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="2"
|
|
stroke="currentColor"
|
|
class="-ml-1 mr-2 h-5 w-5"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25"
|
|
/>
|
|
</svg>
|
|
<%= gettext("Open presentation") %>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
phx-hook="Split"
|
|
data-type="column"
|
|
data-gutter=".gutter-1"
|
|
id="layout"
|
|
class="grid grid-cols-[1fr_10px_1fr] overflow-y-auto"
|
|
>
|
|
<div
|
|
id="slides"
|
|
class="bg-gray-100 overflow-y-auto"
|
|
data-tg-order="1"
|
|
data-tg-title={"#{gettext("Your slides and/or interactions")}"}
|
|
data-tg-tour={"<p class='mb-3'>#{gettext("This section contains all your presentation slides (if you have upload one). You have the option to add interactions to each slide.")}</p><p class='opacity-50 text-xs'>#{gettext("If you have slides, you can navigate through the slides with ease using the arrow keys on your keyboard.")}</p>"}
|
|
data-tg-group="manage"
|
|
>
|
|
<div class="flex flex-col items-center text-center">
|
|
<%= for index <- 0..max(0, @event.presentation_file.length-1) do %>
|
|
<%= if @state.position==index && @state.position> 0 do %>
|
|
<button
|
|
phx-click="current-page"
|
|
phx-value-page={index - 1}
|
|
class="w-12 h-12 float-left ml-5 focus:outline-none"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-6 w-6"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M5 15l7-7 7 7" />
|
|
</svg>
|
|
</button>
|
|
<% end %>
|
|
|
|
<div
|
|
class={"#{if @state.position==index, do: 'shadow-xl bg-white' , else: 'opacity-50 bg-gray-100' }
|
|
transition-all pb-5"}
|
|
id={"slide-preview-#{index}"}
|
|
>
|
|
<button
|
|
phx-click="current-page"
|
|
phx-value-page={index}
|
|
class="py-4 focus:outline-none"
|
|
>
|
|
<%= if @event.presentation_file.length > 0 do %>
|
|
<%= if Application.get_env(:claper, :presentations) |> Keyword.get(:storage) == "local" do %>
|
|
<img
|
|
class="w-1/3 mx-auto"
|
|
src={"/uploads/#{@event.presentation_file.hash}/#{index+1}.jpg"}
|
|
/>
|
|
<% else %>
|
|
<img
|
|
class="w-1/3 mx-auto"
|
|
src={"https://#{Application.get_env(:claper, :presentations) |>
|
|
Keyword.get(:aws_bucket)}.s3.#{Application.get_env(:ex_aws,
|
|
:region)}.amazonaws.com/presentations/#{@event.presentation_file.hash}/#{index+1}.jpg"}
|
|
/>
|
|
<% end %>
|
|
<% else %>
|
|
<div class="w-screen bg-white h-4"></div>
|
|
<% end %>
|
|
</button>
|
|
|
|
<div class="flex flex-col space-y-3 w-full lg:w-1/2 mx-auto justify-start items-center">
|
|
<%= for poll <- Enum.filter(@polls, fn poll -> poll.position == index end) do %>
|
|
<div class="flex space-x-2 items-center">
|
|
<div class="flex h-8 w-8 flex-none text-white items-center justify-center rounded-lg bg-gradient-to-br from-primary-500 to-secondary-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M16 8v8m-4-5v5m-4-2v2m-2 4h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="flex space-x-2">
|
|
<span>
|
|
<span class="font-semibold">
|
|
<%= gettext "Poll" %>
|
|
</span>: <%= poll.title %>
|
|
</span>
|
|
<%= if @state.position==index do %>
|
|
<%= if poll.enabled do %>
|
|
<button
|
|
phx-click="poll-set-inactive"
|
|
phx-value-id={poll.id}
|
|
class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-supporting-green-100 text-supporting-green-800"
|
|
>
|
|
<svg
|
|
style="--animate-duration: 10s;"
|
|
class="mr-1.5 h-2 w-2 text-supporting-green-400 animate__animated animate__flash animate__infinite"
|
|
fill="currentColor"
|
|
viewBox="0 0 8 8"
|
|
>
|
|
<circle cx="4" cy="4" r="3" />
|
|
</svg>
|
|
<%= gettext("Active") %>
|
|
</button>
|
|
<% else %>
|
|
<button
|
|
phx-click="poll-set-active"
|
|
phx-value-id={poll.id}
|
|
class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-primary-100 text-primary-800"
|
|
>
|
|
<%= gettext("Set active") %>
|
|
</button>
|
|
<% end %>
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/edit/poll/#{poll.id}"}
|
|
class="text-xs text-primary-500"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
|
|
/>
|
|
</svg>
|
|
</a>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<div class="h-4 border border-gray-300"></div>
|
|
<% end %>
|
|
<%= for form <- Enum.filter(@forms, fn form -> form.position == index end) do %>
|
|
<div class="flex space-x-2 items-center">
|
|
<div class="flex h-8 w-8 flex-none text-white items-center justify-center rounded-lg bg-gradient-to-br from-primary-500 to-secondary-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="icon icon-tabler icon-tabler-forms"
|
|
width="20"
|
|
height="20"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
fill="none"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M12 3a3 3 0 0 0 -3 3v12a3 3 0 0 0 3 3"></path>
|
|
<path d="M6 3a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3"></path>
|
|
<path d="M13 7h7a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-7"></path>
|
|
<path d="M5 7h-1a1 1 0 0 0 -1 1v8a1 1 0 0 0 1 1h1"></path>
|
|
<path d="M17 12h.01"></path>
|
|
<path d="M13 12h.01"></path>
|
|
</svg>
|
|
</div>
|
|
<div class="flex space-x-2 items-center">
|
|
<span>
|
|
<span class="font-semibold">
|
|
<%= gettext "Form" %>
|
|
</span>: <%= form.title %>
|
|
</span>
|
|
<%= if @state.position==index do %>
|
|
<%= if form.enabled do %>
|
|
<button
|
|
phx-click="form-set-inactive"
|
|
phx-value-id={form.id}
|
|
class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-supporting-green-100 text-supporting-green-800"
|
|
>
|
|
<svg
|
|
style="--animate-duration: 10s;"
|
|
class="mr-1.5 h-2 w-2 text-supporting-green-400 animate__animated animate__flash animate__infinite"
|
|
fill="currentColor"
|
|
viewBox="0 0 8 8"
|
|
>
|
|
<circle cx="4" cy="4" r="3" />
|
|
</svg>
|
|
<%= gettext("Active") %>
|
|
</button>
|
|
<% else %>
|
|
<button
|
|
phx-click="form-set-active"
|
|
phx-value-id={form.id}
|
|
class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-primary-100 text-primary-800"
|
|
>
|
|
<%= gettext("Set active") %>
|
|
</button>
|
|
<% end %>
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/edit/form/#{form.id}"}
|
|
class="text-xs text-primary-500"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
|
|
/>
|
|
</svg>
|
|
</a>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<div class="h-4 border border-gray-300"></div>
|
|
<% end %>
|
|
<%= for embed<- Enum.filter(@embeds, fn embed -> embed.position == index end) do %>
|
|
<div class="flex space-x-2 items-center">
|
|
<div class="flex h-8 w-8 flex-none text-white items-center justify-center rounded-lg bg-gradient-to-br from-primary-500 to-secondary-500">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M14.25 9.75L16.5 12l-2.25 2.25m-4.5 0L7.5 12l2.25-2.25M6 20.25h12A2.25 2.25 0 0020.25 18V6A2.25 2.25 0 0018 3.75H6A2.25 2.25 0 003.75 6v12A2.25 2.25 0 006 20.25z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="flex space-x-2">
|
|
<span>
|
|
<span class="font-semibold"><%= gettext "Web content" %></span>: <%= embed.title %>
|
|
</span>
|
|
<%= if @state.position == index do %>
|
|
<%= if embed.enabled do %>
|
|
<button
|
|
phx-click="embed-set-inactive"
|
|
phx-value-id={embed.id}
|
|
class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-supporting-green-100 text-supporting-green-800"
|
|
>
|
|
<svg
|
|
style="--animate-duration: 10s;"
|
|
class="mr-1.5 h-2 w-2 text-supporting-green-400 animate__animated animate__flash animate__infinite"
|
|
fill="currentColor"
|
|
viewBox="0 0 8 8"
|
|
>
|
|
<circle cx="4" cy="4" r="3" />
|
|
</svg>
|
|
<%= gettext("Active") %>
|
|
</button>
|
|
<% else %>
|
|
<button
|
|
phx-click="embed-set-active"
|
|
phx-value-id={embed.id}
|
|
class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-primary-100 text-primary-800"
|
|
>
|
|
<%= gettext("Set active") %>
|
|
</button>
|
|
<% end %>
|
|
<a
|
|
data-phx-link="patch"
|
|
data-phx-link-state="push"
|
|
href={~p"/e/#{@event.code}/manage/edit/embed/#{embed.id}"}
|
|
class="text-xs text-primary-500"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-5 w-5"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
|
|
/>
|
|
</svg>
|
|
</a>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<div class="h-4 border border-gray-300"></div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= if @state.position==index do %>
|
|
<button
|
|
class="flex items-center justify-center px-3 py-2 text-white bg-primary-500 hover:bg-primary-600 rounded-md my-5 mx-auto text-xs"
|
|
phx-click={toggle_add_modal()}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 16 16"
|
|
fill="currentColor"
|
|
class="w-4 h-4"
|
|
>
|
|
<path d="M8.75 3.75a.75.75 0 0 0-1.5 0v3.5h-3.5a.75.75 0 0 0 0 1.5h3.5v3.5a.75.75 0 0 0 1.5 0v-3.5h3.5a.75.75 0 0 0 0-1.5h-3.5v-3.5Z" />
|
|
</svg>
|
|
<span><%= gettext("Add interaction") %></span>
|
|
</button>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%= if @state.position==index && @state.position < @event.presentation_file.length - 1 do %>
|
|
<button
|
|
phx-click="current-page"
|
|
phx-value-page={index + 1}
|
|
class="w-12 h-12 float-left ml-5 focus:outline-none"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-6 w-6"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" />
|
|
</svg>
|
|
</button>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
class="gutter-1 row-span-full cursor-col-resize col-[2] bg-gray-50 text-center text-gray-300 text-sm leading-3"
|
|
style="writing-mode: vertical-rl"
|
|
>
|
|
•••
|
|
</div>
|
|
|
|
<div
|
|
id="ugc"
|
|
phx-hook="Split"
|
|
data-gutter=".gutter-2"
|
|
data-type="row"
|
|
class="grid grid-rows-[1fr_10px_1fr] overflow-y-auto"
|
|
>
|
|
<div
|
|
class="bg-gray-200 border-2 overflow-y-auto relative"
|
|
data-tg-title={"#{gettext("Attendees interactions")}"}
|
|
data-tg-order="2"
|
|
data-tg-tour={"<p class='mb-3'>#{gettext("Here you'll find all interactions from your attendees. You can manage messages, pinned messages, and submitted forms.")}</p><p class='opacity-50 text-xs'>#{gettext("Identify users by their unique avatars.")}</p>"}
|
|
data-tg-group="manage"
|
|
>
|
|
<ul
|
|
id="menu"
|
|
phx-update="replace"
|
|
class="fixed z-10 flex items-center bg-gray-200 space-x-3 px-2 w-full py-3"
|
|
>
|
|
<li class={"rounded-md #{if @list_tab==:posts, do: 'bg-secondary-600 text-white' ,
|
|
else: 'bg-white text-gray-600' } px-2 py-0.5 text-sm shadow-sm"}>
|
|
<%= link(gettext("Messages") <> " (#{@post_count})",
|
|
to: "#",
|
|
phx_click: "list-tab",
|
|
phx_value_tab: :posts
|
|
) %>
|
|
</li>
|
|
<li class={"rounded-md #{if @list_tab==:pinned_posts, do: 'bg-secondary-600 text-white' ,
|
|
else: 'bg-white text-gray-600' } px-2 py-0.5 text-sm shadow-sm"}>
|
|
<%= link(gettext("Pinned messages") <> " (#{@pinned_post_count})",
|
|
to: "#",
|
|
phx_click: "list-tab",
|
|
phx_value_tab: :pinned_posts
|
|
) %>
|
|
</li>
|
|
<li class={"rounded-md #{if @list_tab==:forms, do: 'bg-secondary-600 text-white' ,
|
|
else: 'bg-white text-gray-600' } px-2 py-0.5 text-sm shadow-sm"}>
|
|
<%= link(gettext("Form submissions") <> " (#{@form_submit_count})",
|
|
to: "#",
|
|
phx_click: "list-tab",
|
|
phx_value_tab: :forms
|
|
) %>
|
|
</li>
|
|
</ul>
|
|
|
|
<%= if @list_tab == :posts do %>
|
|
<%= if @post_count == 0 && @pinned_post_count == 0 do %>
|
|
<div
|
|
class="text-center flex flex-col space-y-5 items-center justify-center text-gray-400"
|
|
style="height: 100%;"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-36 w-36"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke="currentColor"
|
|
stroke-width="2"
|
|
>
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M17 8h2a2 2 0 012 2v6a2 2 0 01-2 2h-2v4l-4-4H9a1.994 1.994 0 01-1.414-.586m0 0L11 14h4a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2v4l.586-.586z"
|
|
/>
|
|
</svg>
|
|
|
|
<p class="text-lg">
|
|
<%= gettext("Messages from attendees will appear here.") %>
|
|
</p>
|
|
</div>
|
|
<% end %>
|
|
<div id="x" class="overflow-y-auto max-h-full">
|
|
<div
|
|
id="post-list"
|
|
class="overflow-y-auto max-h-full pb-5 pt-8 px-5"
|
|
phx-update="stream"
|
|
phx-hook="ScrollIntoDiv"
|
|
>
|
|
<div :for={{id, post} <- @streams.posts} id={id}>
|
|
<div class="flex flex-col md:block px-4 pb-2 pt-3 rounded-b-lg rounded-tr-lg bg-white relative shadow-md text-black break-all mt-4">
|
|
<div class="float-right mr-1">
|
|
<%= if post.attendee_identifier do %>
|
|
<span class="text-yellow-500">
|
|
<%= link(
|
|
if post.pinned do
|
|
gettext("Unpin")
|
|
else
|
|
gettext("Pin")
|
|
end,
|
|
to: "#",
|
|
phx_click: "pin",
|
|
phx_value_id: post.uuid,
|
|
phx_value_event_id: @event.uuid
|
|
) %>
|
|
</span>
|
|
/
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Ban"),
|
|
to: "#",
|
|
phx_click: "ban",
|
|
phx_value_attendee_identifier: post.attendee_identifier,
|
|
data: [
|
|
confirm:
|
|
gettext(
|
|
"Blocking this user will delete all his messages and he will not be able to join again, confirm ?"
|
|
)
|
|
]
|
|
) %>
|
|
</span>
|
|
/
|
|
<% else %>
|
|
<span class="text-yellow-500">
|
|
<%= link(
|
|
if post.pinned do
|
|
gettext("Unpin")
|
|
else
|
|
gettext("Pin")
|
|
end,
|
|
to: "#",
|
|
phx_click: "pin",
|
|
phx_value_id: post.uuid,
|
|
phx_value_event_id: @event.uuid
|
|
) %>
|
|
</span>
|
|
/
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Ban"),
|
|
to: "#",
|
|
phx_click: "ban",
|
|
phx_value_user_id: post.user_id,
|
|
data: [
|
|
confirm:
|
|
gettext(
|
|
"Blocking this user will delete all his messages and he will not be able to join again, confirm ?"
|
|
)
|
|
]
|
|
) %>
|
|
</span>
|
|
/
|
|
<% end %>
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Delete"),
|
|
to: "#",
|
|
phx_click: "delete",
|
|
phx_value_id: post.uuid,
|
|
phx_value_event_id: @event.uuid
|
|
) %>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-3 items-center">
|
|
<%= if post.attendee_identifier do %>
|
|
<img
|
|
class="h-8 w-8"
|
|
src={"https://api.dicebear.com/7.x/personas/svg?seed=#{post.attendee_identifier}"}
|
|
/>
|
|
<% else %>
|
|
<img
|
|
class="h-8 w-8"
|
|
src={"https://api.dicebear.com/7.x/personas/svg?seed=#{post.user_id}"}
|
|
/>
|
|
<% end %>
|
|
|
|
<div class="flex flex-col">
|
|
<%= if post.name do %>
|
|
<p class="text-black text-sm font-semibold mr-2">
|
|
<%= post.name %>
|
|
</p>
|
|
<% end %>
|
|
|
|
<p class="text-xl">
|
|
<%= post.body %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<%= if post.like_count> 0 || post.love_count > 0 || post.lol_count > 0 do %>
|
|
<div class="flex h-6 space-x-2 text-base text-gray-500 pb-3 items-center mt-5">
|
|
<div class="flex items-center">
|
|
<%= if post.like_count> 0 do %>
|
|
<img src="/images/icons/thumb.svg" class="h-4" />
|
|
<span class="ml-1">
|
|
<%= post.like_count %>
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<%= if post.love_count> 0 do %>
|
|
<img src="/images/icons/heart.svg" class="h-4" />
|
|
<span class="ml-1">
|
|
<%= post.love_count %>
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<%= if post.lol_count> 0 do %>
|
|
<img src="/images/icons/laugh.svg" class="h-4" />
|
|
<span class="ml-1">
|
|
<%= post.lol_count %>
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- The div below encompasses the 2 post lists -->
|
|
</div>
|
|
<% end %>
|
|
<%= if @list_tab == :pinned_posts do %>
|
|
<%= if @pinned_post_count == 0 do %>
|
|
<div
|
|
class="text-center flex flex-col space-y-5 items-center justify-center text-gray-400"
|
|
style="height: 100%;"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-36 w-36"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="2"
|
|
stroke="currentColor"
|
|
fill="none"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M15 4.5l-4 4l-4 1.5l-1.5 1.5l7 7l1.5 -1.5l1.5 -4l4 -4" /><path d="M9 15l-4.5 4.5" /><path d="M14.5 4l5.5 5.5" />
|
|
</svg>
|
|
|
|
<p class="text-lg">
|
|
<%= gettext("Pinned messages will appear here.") %>
|
|
</p>
|
|
</div>
|
|
<% end %>
|
|
|
|
<div id="x-pinned" class="overflow-y-auto max-h-full">
|
|
<%= if @pinned_post_count > 0 do %>
|
|
<div
|
|
id="pinned-post-list"
|
|
class="overflow-y-auto pb-5 pt-8 px-5"
|
|
phx-update="stream"
|
|
phx-hook="ScrollIntoDiv"
|
|
>
|
|
<div :for={{id, post} <- @streams.pinned_posts} id={id}>
|
|
<div class="px-4 pb-2 pt-3 rounded-b-lg rounded-tr-lg bg-white relative shadow-md text-black break-all mt-4">
|
|
<div class="float-right mr-1">
|
|
<%= if post.attendee_identifier do %>
|
|
<span class="text-yellow-500">
|
|
<%= link(
|
|
if post.pinned do
|
|
gettext("Unpin")
|
|
else
|
|
gettext("Pin")
|
|
end,
|
|
to: "#",
|
|
phx_click: "pin",
|
|
phx_value_id: post.uuid,
|
|
phx_value_event_id: @event.uuid
|
|
) %>
|
|
</span>
|
|
/
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Ban"),
|
|
to: "#",
|
|
phx_click: "ban",
|
|
phx_value_attendee_identifier: post.attendee_identifier,
|
|
data: [
|
|
confirm:
|
|
gettext(
|
|
"Blocking this user will delete all his messages and he will not be able to join again, confirm ?"
|
|
)
|
|
]
|
|
) %>
|
|
</span>
|
|
/
|
|
<% else %>
|
|
<span class="text-yellow-500">
|
|
<%= link(
|
|
if post.pinned do
|
|
gettext("Unpin")
|
|
else
|
|
gettext("Pin")
|
|
end,
|
|
to: "#",
|
|
phx_click: "pin",
|
|
phx_value_id: post.uuid,
|
|
phx_value_event_id: @event.uuid
|
|
) %>
|
|
</span>
|
|
/
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Ban"),
|
|
to: "#",
|
|
phx_click: "ban",
|
|
phx_value_user_id: post.user_id,
|
|
data: [
|
|
confirm:
|
|
gettext(
|
|
"Blocking this user will delete all his messages and he will not be able to join again, confirm ?"
|
|
)
|
|
]
|
|
) %>
|
|
</span>
|
|
/
|
|
<% end %>
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Delete"),
|
|
to: "#",
|
|
phx_click: "delete",
|
|
phx_value_id: post.uuid,
|
|
phx_value_event_id: @event.uuid
|
|
) %>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-3 items-center">
|
|
<%= if post.attendee_identifier do %>
|
|
<img
|
|
class="h-8 w-8"
|
|
src={"https://api.dicebear.com/7.x/personas/svg?seed=#{post.attendee_identifier}"}
|
|
/>
|
|
<% else %>
|
|
<img
|
|
class="h-8 w-8"
|
|
src={"https://api.dicebear.com/7.x/personas/svg?seed=#{post.user_id}"}
|
|
/>
|
|
<% end %>
|
|
|
|
<div class="flex flex-col">
|
|
<%= if post.name do %>
|
|
<p class="text-black text-sm font-semibold mr-2">
|
|
<%= post.name %>
|
|
</p>
|
|
<% end %>
|
|
|
|
<p class="text-xl">
|
|
<%= post.body %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<%= if post.like_count> 0 || post.love_count > 0 || post.lol_count > 0 do %>
|
|
<div class="flex h-6 space-x-2 text-base text-gray-500 pb-3 items-center mt-5">
|
|
<div class="flex items-center">
|
|
<%= if post.like_count> 0 do %>
|
|
<img src="/images/icons/thumb.svg" class="h-4" />
|
|
<span class="ml-1">
|
|
<%= post.like_count %>
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<%= if post.love_count> 0 do %>
|
|
<img src="/images/icons/heart.svg" class="h-4" />
|
|
<span class="ml-1">
|
|
<%= post.love_count %>
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<%= if post.lol_count> 0 do %>
|
|
<img src="/images/icons/laugh.svg" class="h-4" />
|
|
<span class="ml-1">
|
|
<%= post.lol_count %>
|
|
</span>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<%= if @list_tab == :forms do %>
|
|
<%= if @form_submit_count == 0 do %>
|
|
<div class="text-center h-full flex flex-col space-y-5 items-center justify-center text-gray-400">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="h-36 w-36"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
fill="none"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
|
|
<path d="M12 3a3 3 0 0 0 -3 3v12a3 3 0 0 0 3 3"></path>
|
|
<path d="M6 3a3 3 0 0 1 3 3v12a3 3 0 0 1 -3 3"></path>
|
|
<path d="M13 7h7a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-7"></path>
|
|
<path d="M5 7h-1a1 1 0 0 0 -1 1v8a1 1 0 0 0 1 1h1"></path>
|
|
<path d="M17 12h.01"></path>
|
|
<path d="M13 12h.01"></path>
|
|
</svg>
|
|
|
|
<p class="text-lg">
|
|
<%= gettext("Form submissions from attendees will appear here.") %>
|
|
</p>
|
|
</div>
|
|
<% end %>
|
|
<div
|
|
id="form-list"
|
|
class="overflow-y-auto max-h-full pb-5 pt-8 px-5"
|
|
phx-update="stream"
|
|
data-forms-nb={@form_submit_count}
|
|
phx-hook="ScrollIntoDiv"
|
|
>
|
|
<div :for={{id, submission} <- @streams.form_submits} id={id}>
|
|
<div class="px-4 pb-2 pt-3 rounded-b-lg rounded-tr-lg bg-white relative shadow-md text-black break-all mt-4">
|
|
<div class="float-right mr-1">
|
|
<span class="text-red-500">
|
|
<%= link(gettext("Delete"),
|
|
to: "#",
|
|
phx_click: "delete-form-submit",
|
|
phx_value_id: submission.id,
|
|
phx_value_event_id: @event.uuid,
|
|
data: [confirm: gettext("This cannot be undone, confirm ?")]
|
|
) %>
|
|
</span>
|
|
</div>
|
|
|
|
<p>
|
|
<span class="font-semibold text-lg">
|
|
<%= gettext("Form") %>
|
|
</span>: <%= submission.form.title %>
|
|
</p>
|
|
|
|
<div class="flex space-x-3 items-center">
|
|
<%= if submission.attendee_identifier do %>
|
|
<img
|
|
class="h-8 w-8"
|
|
src={"https://api.dicebear.com/7.x/personas/svg?seed=#{submission.attendee_identifier}"}
|
|
/>
|
|
<% else %>
|
|
<img
|
|
class="h-8 w-8"
|
|
src={"https://api.dicebear.com/7.x/personas/svg?seed=#{submission.user_id}"}
|
|
/>
|
|
<% end %>
|
|
|
|
<div>
|
|
<%= for res <- submission.response do %>
|
|
<p>
|
|
<strong>
|
|
<%= elem(res, 0) %>:
|
|
</strong>
|
|
<%= elem(res, 1) %>
|
|
</p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="gutter-2 col-span-full cursor-row-resize z-20 row-[2] bg-gray-50 text-center text-gray-300 text-sm leading-3">
|
|
•••
|
|
</div>
|
|
|
|
<div
|
|
class="px-5 py-3 grid grid-cols-1 lg:grid-cols-2 z-20 bg-white"
|
|
data-tg-title={"#{gettext("Settings")}"}
|
|
data-tg-order="3"
|
|
data-tg-tour={"<p class='mb-3'>#{gettext("You can control each setting for the presentation (showing on the big screen) and on the attendee's room.")}</p><p class='opacity-50 text-xs'>#{gettext("Use the associated keyboard shortcuts for quick toggling of these settings.")}</p>"}
|
|
data-tg-group="manage"
|
|
>
|
|
<div>
|
|
<span class="font-semibold text-lg">
|
|
<%= gettext("Presentation settings") %>
|
|
</span>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:join_screen_visible}
|
|
checked={@state.join_screen_visible}
|
|
shortcut={if @create == nil, do: "Q", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Show instructions") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
q
|
|
</code>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:chat_visible}
|
|
checked={@state.chat_visible}
|
|
shortcut={if @create == nil, do: "W", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Show messages") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
w
|
|
</code>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:show_only_pinned}
|
|
checked={@state.show_only_pinned}
|
|
shortcut={if @create == nil, do: "E", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Show only pinned messages") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
e
|
|
</code>
|
|
</span>
|
|
</div>
|
|
|
|
<div class={"#{if !@current_poll, do: 'opacity-50' } flex space-x-2 items-center mt-3"}>
|
|
<ClaperWeb.Component.Input.check
|
|
key={:poll_visible}
|
|
disabled={!@current_poll}
|
|
checked={@state.poll_visible}
|
|
shortcut={if @create == nil, do: "R", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Show poll results") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
r
|
|
</code>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<span class="font-semibold text-lg">
|
|
<%= gettext("Attendees settings") %>
|
|
</span>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:chat_enabled}
|
|
checked={@state.chat_enabled}
|
|
shortcut={if @create == nil, do: "A", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Enable messages") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
a
|
|
</code>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:anonymous_chat_enabled}
|
|
checked={@state.anonymous_chat_enabled}
|
|
shortcut={if @create == nil, do: "S", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Enable anonymous messages") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
s
|
|
</code>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:message_reaction_enabled}
|
|
checked={@state.message_reaction_enabled}
|
|
shortcut={if @create == nil, do: "D", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Enable message reactions") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
d
|
|
</code>
|
|
</span>
|
|
</div>
|
|
|
|
<div class="flex space-x-2 items-center mt-3">
|
|
<ClaperWeb.Component.Input.check
|
|
key={:show_poll_results_enabled}
|
|
checked={@state.show_poll_results_enabled}
|
|
shortcut={if @create == nil, do: "F", else: nil}
|
|
/>
|
|
<span>
|
|
<%= gettext("Show poll results") %>
|
|
<code class="px-2 py-1.5 text-xs font-semibold text-gray-800 bg-gray-100 border border-gray-200 rounded-lg">
|
|
f
|
|
</code>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|