{{root}} helper doesn't work as intended in all situations

[Vlasterx]

It seems that Panini specific helper {{root}} doesn't always work as intended.

Take this folder structure for example:

/site/
  |-data/
    |-galery.yml
  |-pages/
    |-en/
      |-test_page.html

Data galery.yml is just a list of image URL's

If I use {{root}} from withing an article located in /pages/en/test-page.com and if I don't wrap it in some other Panini helpers - it will work as intended, but if I use it like this

{{#each galery.team }} <p>Image root: {{root}}</p> {{/each}}

It will not work at all.

[gakimball]

Could you see if writing {{../root}} works instead? Might be a Handlebars quirk.

[Vlasterx]

Doesn't that defeat the purpose of {{root}} helper? What if I put that code in a partial that could be used in files that reside in different directory levels?

It seems that path is not passed along properly with each helper.

[gakimball]

The ../ isn't related to the path of the root variable, it's a Handlebars thing.

Handlebars has scopes, and some helpers create a new scope. This means you can't access variables in the parent scope just by writing them normally. Adding the ../ means you want to access a variable in the parent scope.

Does that make sense?

[Vlasterx]

Yes, thank you gakimball, this makes sense. I will try it out.

[bloomdigital]

@Vlasterx did you ever find a fix for this? Having the same issue myself

[Vlasterx]

@daaanpace yes, I had to reorganize my markup and abandon the use of {{root}} in this particular case.

Data - galery.yml

-
  image: images/work/0-new/13
  title: Some title
  more: textile/new.html
-
  image: images/work/1-textile-art
  title: Some title
  more: textile/more.html
-
  image: images/work/1-prints
  title: some title
  more: prints/more.html
-
  image: images/work/0-new/21
  title: some title
  more: textile/new.html

Partial - galery-part.html

  <a href="/{{this.image}}.jpg"
     title="{{#if this.more}}<a href='/{{ this.more }}' class='galery__info'><span class='icon icon-image'></span> More</a>{{/if}}
     {{#if this.buy}}<a href='{{ this.buy }}' class='galery__buy'><span class='icon icon-cart'></span> Buy</a>{{/if}}
     {{this.title}}"><img src="/{{this.image}}_th.jpg" srcset="/{{this.image}}_th.jpg 1x, /{{this.image}}_th@2x.jpg 2x" alt="{{ this.title }}"/></a>

Page - galery.html

---
(all front-matter stuff)
---

<section class="masonry">
{{#each galery}}
  {{> galery_part}}
{{/each}}
</section>