hooks:renderTopWidgets

[Marco10x15 (Marco)]

In Silverbullet 0.94 this template:

tags: 
  - template
pageDecoration:
  prefix: "🟩 "
hooks.top:
  where: 'name =~ /^luoghi\//'
  order: 502
---

${widgets.breadcrumb()}

let me put the “breadcrumb” content on the top part of the rendered page.

In Silverbullet V2 I seemed to understand that the same function was possible with the following code, but the widgets.breadcrumb() is not used.
Where am I going wrong?

widgets = widgets or {}

function widgets.breadcrumb()
  local path = editor.getCurrentPage()

  -- Funzione per suddividere la stringa in parti basate su "/"
  local function split(str, sep)
    local result = {}
    for part in string.gmatch(str, "[^" .. sep .. "]+") do
      table.insert(result, part)
    end
    return result
  end

  -- Divide il percorso in segmenti
  local parts = split(path, "/")

  -- Costruisce i breadcrumb escludendo l'ultimo elemento
  local breadcrumbs = {}
  local currentPath = ""

  for i = 1, #parts - 1 do
    if i == 1 then
      currentPath = parts[i]
    else
      currentPath = currentPath .. "/" .. parts[i]
    end
    table.insert(breadcrumbs, "[[" .. currentPath .. "]]")
  end

  -- Restituisce i breadcrumb formattati
  return table.concat(breadcrumbs, " > ")
end

event.listen {
  name = "hooks:renderTopWidgets",
  run = function(e)
    return widgets.breadcrumb()
  end
}

[Shnawblle]

Just had this exact issue haha! Try:

event.listen {
  name = "hooks:renderTopWidgets",
  run = function(e)
    return widget.new {markdown = widgets.breadcrumb()}
  end
}

And see if it works!

[Marco10x15 (Marco)]

Fine!

Have you already sorted out how to get conditional application?
How to build the part “where: ‘name =~ /^places//’” in v2?

And now I have my breadcrump overlapping with the table of context..

[Shnawblle]

An extremely dirty workaround to that would be something like this:

event.listen {
  name = "hooks:renderTopWidgets",
  run = function(e)
    return widget.new {markdown = "\n\n"..widgets.breadcrumb().."\n\n"}
  end
}

But I do think that that is a bug.

About the conditional application, I think that it should be as easy as:

event.listen {
 name = "hooks:renderTopWidgets",
  run = function(e)
    if not editor.getCurrentPage().startsWith("places/") then
        return
    end
    return widget.new {markdown = "\n\n"..widgets.breadcrumb().."\n\n"}
    end
}

Note: I am using editor.getCurrentPage() because _CTX.currentPage as specified in Space Lua for some reason has not been working for me

[Marco10x15 (Marco)]

I wil try your suggestion!

[zef (Zef Hemel)]

Yeah I think you figured it all out by now, this still needs to be documented.

[goldenbullet]

Where do i add the event.listen...? I don’t get anything showing at the top of my pages

[zef (Zef Hemel)]

Anywhere in your space inside a space-lua block.

[goldenbullet]

@zef

Anywhere in your space inside a space-lua block.

1. Yes already did that.
2. So 2 files of interest: index.md and luascripts.md.
3. In my index.md, I have ${marquee("scrolll")} and I get a marquee, but I don’t see a widget

```space-lua
event.listen {
  name = "hooks:renderTopWidgets",
  run = function(e)
    return widget.new {markdown = marquee("test")}
    -- return widget.new {markdown = widgets.breadcrumb()}
  end
}

function marquee(text)
  return widget.html(dom.marquee {
    class = "my-marquee",
    onclick = function()
      editor.flashNotification "You clicked me"
    end,
    text
  })
end

[zef (Zef Hemel)]

Anything of interest in your browser’s JavaScript console?

What you’re doing there string concatenating wigets.breadcrumb() is unlikely to work unless that function is returning a string (and not a widget).

[goldenbullet]

You mean like this? Still no “hello” in my index.md

Is there a simple example where I can trial and error? I just want my header show navigation links to other pages

```space-lua
event.listen {
  name = "hooks:renderTopWidgets",
  run = function(e)
    return "hello"
    -- return widget.new {markdown = marquee("test")}
    -- return widget.new {markdown = widgets.breadcrumb()}
  end
}

function marquee(text)
  return widget.html(dom.marquee {
    class = "my-marquee",
    onclick = function()
      editor.flashNotification "You clicked me"
    end,
    text
  })
end
``` 

[zef (Zef Hemel)]

This works for me:

But I recommend opening up your browser’s JS console to see errors you’re (likely) getting.

[goldenbullet]

No console errors… You are currently running SilverBullet 2.2.1-0-gf44f00f4

[goldenbullet]

It is finally showing now. I think v2’s service worker has the same refreshing issue as with v1