livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2025-09-08 22:14:58 +08:00
Code Issues Projects Releases Packages Wiki Activity

Some cleanup

Browse source
This commit is contained in:
Jonatan Kłosko 2021-01-16 20:23:00 +01:00
parent 341d0a7ce6
commit 54274e795e
4 changed files with 48 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
lib/live_book_web/live/cell.ex
View file

@ -3,7 +3,9 @@ defmodule LiveBookWeb.Cell do
def render(assigns) do
~L"""
<div class="<%= cell_class(@focused) %>" phx-click="focus_cell" phx-value-cell_id="<%= @cell.id %>">
<div phx-click="focus_cell"
phx-value-cell_id="<%= @cell.id %>"
class="flex flex-col p-2 relative mr-10 border-2 border-gray-200 rounded border-opacity-0 <%= if @focused, do: "border-opacity-100"%>">
<div class="flex flex-col items-center space-y-2 absolute right-0 top-0 -mr-10">
<button class="text-gray-500 hover:text-current">
<%= Icons.svg(:play, class: "h-6") %>
@ -11,7 +13,6 @@ defmodule LiveBookWeb.Cell do
<button phx-click="delete_cell" phx-value-cell_id="<%= @cell.id %>" class="text-gray-500 hover:text-current">
<%= Icons.svg(:trash, class: "h-6") %>
</button>
<%= cell_type_icon(@cell.type) %>
</div>
<div
id="cell-<%= @cell.id %>"
@ -20,33 +21,11 @@ defmodule LiveBookWeb.Cell do
data-id="<%= @cell.id %>"
data-type="<%= @cell.type %>"
>
<div class="h-20 flex opacity-20">Editor placeholder</div>
</div>
<%= for output <- @cell.outputs do %>
<div class="p-2">
<%= render_output(output) %>
<div class="h-20 flex opacity-20">
<%= @cell.type |> Atom.to_string() |> String.capitalize() %> cell placeholder
</div>
<% end %>
</div>
</div>
"""
end
defp cell_class(focused) do
base = "flex flex-col p-2 border-2 border-gray-200 rounded border-opacity-0 relative mr-10"
if focused, do: base <> " border-opacity-100", else: base
end
defp render_output(_), do: nil
defp cell_type_icon(:elixir) do
~e"""
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32"><path fill="#8251A8" d="M16.457 27.304c-4.118 0-7.457-3.971-7.457-8.87 0-4.012 2.96-8.915 5.244-11.901C15.326 5.119 17.371 4 17.371 4s-1.048 5.714 1.794 7.984c2.523 2.014 4.38 4.635 4.38 6.94 0 4.618-2.97 8.38-7.088 8.38z"/></svg>
"""
end
defp cell_type_icon(:markdown) do
~e"""
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32"><path fill="#EE9D5C" fill-rule="evenodd" d="M17.74 21.419h-3.48v-5.416l-2.631 3.463-2.631-3.463v5.416h-3.48V10.586h3.48l2.63 3.625 2.632-3.625h3.48V21.42zm5.223.874L18.63 16h2.631v-5.416h3.48V16h2.632l-4.409 6.293h-.002zM27.99 7H4.01c-.541 0-1.012.206-1.411.617-.4.411-.599.895-.599 1.453v13.86c0 .585.2 1.076.599 1.474.4.397.87.596 1.41.596H27.99c.541 0 1.012-.199 1.411-.596.4-.398.599-.89.599-1.474V9.07c0-.558-.2-1.042-.599-1.453-.4-.411-.87-.617-1.41-.617z"/></svg>
"""
end
end

15
lib/live_book_web/live/section.ex
View file

@ -24,10 +24,19 @@ defmodule LiveBookWeb.Section do
</div>
<div class="container py-4">
<div class="flex flex-col space-y-2">
<%= live_component @socket, LiveBookWeb.InsertCellActions, section_id: @section.id, index: 0, id: "insert-#{@section.id}-0" %>
<%= live_component @socket, LiveBookWeb.InsertCellActions,
id: "insert-#{@section.id}-0",
section_id: @section.id,
index: 0 %>
<%= for {cell, index} <- Enum.with_index(@section.cells) do %>
<%= live_component @socket, LiveBookWeb.Cell, cell: cell, id: "cell-#{cell.id}", focused: cell.id == @focused_cell_id %>
<%= live_component @socket, LiveBookWeb.InsertCellActions, section_id: @section.id, index: index + 1, id: "insert-#{@section.id}-#{index + 1}" %>
<%= live_component @socket, LiveBookWeb.Cell,
id: "cell-#{cell.id}",
cell: cell,
focused: cell.id == @focused_cell_id %>
<%= live_component @socket, LiveBookWeb.InsertCellActions,
id: "insert-#{@section.id}-#{index + 1}",
section_id: @section.id,
index: index + 1 %>
<% end %>
</div>
</div>

27
lib/live_book_web/live/session_live.ex
View file

@ -13,18 +13,27 @@ defmodule LiveBookWeb.SessionLive do
data = Session.get_data(session_id)
{:ok,
assign(socket,
session_id: session_id,
data: data,
selected_section_id: nil,
focused_cell_id: nil
)}
{:ok, assign(socket, initial_assigns(session_id, data))}
else
{:ok, redirect(socket, to: Routes.live_path(socket, LiveBookWeb.SessionsLive))}
end
end
defp initial_assigns(session_id, data) do
first_section_id =
case data.notebook.sections do
[section | _] -> section.id
[] -> nil
end
%{
session_id: session_id,
data: data,
selected_section_id: first_section_id,
focused_cell_id: nil
}
end
@impl true
def render(assigns) do
~L"""
@ -39,7 +48,9 @@ defmodule LiveBookWeb.SessionLive do
class="p-8 text-2xl"><%= @data.notebook.name %></h1>
<div class="flex flex-col space-y-2 pl-4">
<%= for section <- @data.notebook.sections do %>
<div phx-click="select_section" phx-value-section_id="<%= section.id %>" class="py-2 px-4 rounded-l-md cursor-pointer text-gray-500 hover:text-current">
<div phx-click="select_section"
phx-value-section_id="<%= section.id %>"
class="py-2 px-4 rounded-l-md cursor-pointer text-gray-500 hover:text-current">
<span>
<%= section.name %>
</span>

35
lib/live_book_web/templates/layout/live.html.leex
View file

@ -1,26 +1,13 @@
<%# <div class="flex flex-col min-h-screen"> %>
<!--
<nav class="flex items-center justify-between px-8 py-3 bg-purple-600">
<div class="w-full">
<%= live_redirect "LiveBook", to: "/", class: "font-bold inline-block mr-4 py-2 text-white" %>
</div>
<ul class="flex flex-row">
<li class="flex items-center">
<%= live_redirect "Sessions", to: "/sessions", class: "px-3 text-xs uppercase font-bold text-white hover:opacity-75" %>
</li>
</ul>
</nav> -->
<main role="main" class="flex-grow flex flex-col align-center h-screen">
<div>
<p class="alert alert-info" role="alert"
phx-click="lv:clear-flash"
phx-value-key="info"><%= live_flash(@flash, :info) %></p>
<main role="main" class="flex-grow flex flex-col align-center h-screen">
<div>
<p class="alert alert-info" role="alert"
phx-click="lv:clear-flash"
phx-value-key="info"><%= live_flash(@flash, :info) %></p>
<p class="alert alert-danger" role="alert"
phx-click="lv:clear-flash"
phx-value-key="error"><%= live_flash(@flash, :error) %></p>
</div>
<p class="alert alert-danger" role="alert"
phx-click="lv:clear-flash"
phx-value-key="error"><%= live_flash(@flash, :error) %></p>
</div>
<%= @inner_content %>
</main>
<%# </div> %>
<%= @inner_content %>
</main>