livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2025-10-30 15:27:24 +08:00
Code Issues Projects Releases Packages Wiki Activity

Feature cell link (#239)

Browse source 
* #99: Add anchor links to sections and cells

* Restores some css classes removed by error

* Focus cell based on anchor link

Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>
This commit is contained in:
Javier Goday 2021-04-26 14:22:33 +02:00 • committed by GitHub
parent a2eb269cec
commit 790b9e764b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 36 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
assets/js/session/index.js
View file

@ -59,6 +59,14 @@ const Session = {
handleCellIndicatorsClick(this, event);
});
window.addEventListener(
"phx:page-loading-stop",
() => {
focusCellFromUrl(this);
},
{ once: true }
);
// DOM setup
updateSectionListHighlight();
@ -282,6 +290,20 @@ function handleCellIndicatorsClick(hook, event) {
}
}
/**
* Focuses cell based on the given URL.
*/
function focusCellFromUrl(hook) {
const hash = window.location.hash;
if (hash.startsWith("#cell-")) {
const cellId = hash.replace(/^#cell-/, "");
if (getCellById(cellId)) {
setFocusedCell(hook, cellId);
}
}
}
/**
* Handles the main notebook area being scrolled.
*/

14
lib/livebook_web/live/session_live/cell_component.ex
View file

@ -19,6 +19,7 @@ defmodule LivebookWeb.SessionLive.CellComponent do
~L"""
<div class="mb-1 flex items-center justify-end">
<div class="relative z-10 flex items-center justify-end space-x-2" data-element="actions">
<%= render_cell_anchor_link(@cell_view) %>
<span class="tooltip top" aria-label="Edit content" data-element="enable-insert-mode-button">
<button class="icon-button">
<%= remix_icon("pencil-line", class: "text-xl") %>
@ -97,6 +98,7 @@ defmodule LivebookWeb.SessionLive.CellComponent do
<% end %>
</div>
<div class="relative z-10 flex items-center justify-end space-x-2" data-element="actions">
<%= render_cell_anchor_link(@cell_view) %>
<span class="tooltip top" aria-label="Cell settings">
<%= live_patch to: Routes.session_path(@socket, :cell_settings, @session_id, @cell_view.id), class: "icon-button" do %>
<%= remix_icon("list-settings-line", class: "text-xl") %>
@ -163,6 +165,18 @@ defmodule LivebookWeb.SessionLive.CellComponent do
"""
end
defp render_cell_anchor_link(cell_view) do
assigns = %{cell_view: cell_view}
~L"""
<span class="tooltip top" aria-label="Link">
<a href="#cell-<%= @cell_view.id %>" class="icon-button">
<%= remix_icon("link", class: "text-xl") %>
</a>
</span>
"""
end
# The whole page has to load and then hooks are mounded.
# There may be a tiny delay before the markdown is rendered
# or editors are mounted, so show neat placeholders immediately.