Identify language codes available for page

support
1

I’m trying to build a multilingual website with Hugo, and one of my problems is that I need to check whether the current page (in a list) is available in a specific language. So I’m doing this:

{{ range ... }}
    {{ $page := . }}
    <li><a href="{{ .Permalink }}">
            {{- range .Site.Languages }}<span class="post_{{ cond (in $page.AllTranslations .) .Lang `none` }}"></span>{{ end -}}
            {{ .Title }}
        </a></li>
{{ end }}

I want that for every site language a span be created with either language name (post_en, post_fr etc) or post_none, depending on the translation availability for this page.

The problem is that the condition in $page.AllTranslations . is never true, apparently because I’m comparing objects.

An alternative would be to convert $page.AllTranslations to a list of language codes, but I failed to find an appropriate function for that. The closest call would be

apply $page.AllTranslations "index" ".Lang"

But that doesn’t seem to work because index cannot resolve attributes of an object.

Essentially I want to map the map’s content, like I would in Java (pseudocode):

allTranslations.stream()
    .map(page -> page.getLang())
    .collect(Collectors.toList())

My current approach, which does work, is to make a list of language codes to check against:

<!-- Compile a list of languages the current page is translated to -->
{{ $pageLangs := slice .Lang }}
{{ range .Translations }}{{ $pageLangs = $pageLangs | append .Lang }}{{ end }}

But it feels rather lame to make a list in this way. Any ideas? Is there any other function I can give apply?

2

I may have a solution for you, but it isn’t pretty. Here’s the code I am using:

{{- if .Site.IsMultiLingual -}}

{{- range .Site.Languages -}}

	{{- if eq . $.Site.Language -}}
					<li class="nav-item active"><a href="#" title="{{- .LanguageName -}}" class="nav-link language">
					{{- partial "language-icons" (dict "context" .  "active" true "lang" .Lang "hasTranslation" true) -}}
					</a></li>
			{{- else -}} <!-- else if not eq . $.Site.Language -->

				{{- if eq (len $.Translations) 0 -}}
					<li class="nav-item language-inactive"><a title="{{- .LanguageName -}}" class="nav-link language-inactive language">{{- partial "language-icons" (dict "context" .  "active" false "lang" .Lang "hasTranslation" false) -}}</a></li>
					{{- else -}}
					{{- range $.Translations -}}
						<li class="nav-item"><a href="{{- .Permalink -}}" title="{{- .Language.LanguageName -}}" class="nav-link language">{{- partial "language-icons" (dict "context" .  "active" false "lang" .Lang "hasTranslation" true) -}}</a></li>
					{{- end -}} <!-- end range translations -->
			{{- end -}} <!-- if  len translation 0  -->

	{{- end -}} <!-- if eq . $.Site.Language -->

{{- end -}} <!-- range site languates -->

{{- end -}} <!-- end if site is multilingual   -->

and then, on the partial named language-icons.html, I have this:

{{ if eq .lang "en" }}
	<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve" >
		<path {{ if .hasTranslation }}fill="#fff"{{ else }}fill="#ccc" opacity="0.7"{{ end }} d="M51.283,7.69c-21.367,0-38.75,17.384-38.75,38.751c0,7.399,2.093,14.577,6.058,20.794l-6.277,16.49  c-0.156,0.409-0.05,0.87,0.268,1.17c0.205,0.194,0.472,0.296,0.742,0.296c0.149,0,0.3-0.03,0.442-0.094l15.361-6.875  c6.524,4.562,14.172,6.969,22.157,6.969c21.368,0,38.751-17.384,38.751-38.75C90.034,25.074,72.651,7.69,51.283,7.69z   M48.846,57.236H32.484V35.645h15.835v3.823H36.893v4.585h10.488v3.75H36.893v5.552h11.953V57.236z M69.793,57.236h-4.51  l-8.791-15.32v15.32h-4.203V35.645h4.729L65.59,50.7V35.645h4.203V57.236z"></path></svg>
{{ end }}
{{ if eq .lang "pt" }}
	<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><path {{ if .hasTranslation }}fill="#fff"{{ end }} d="M49.507,10.357c-21.367,0-38.75,17.384-38.75,38.751c0,7.399,2.093,14.577,6.058,20.795l-6.277,16.49  c-0.156,0.409-0.05,0.87,0.268,1.17c0.205,0.194,0.472,0.296,0.742,0.296c0.149,0,0.3-0.03,0.442-0.094l15.361-6.875  c6.524,4.562,14.172,6.969,22.157,6.969c21.368,0,38.751-17.384,38.751-38.751S70.875,10.357,49.507,10.357z M45.957,50.559  c-1.264,1.055-3.069,1.582-5.415,1.582h-4.496v7.764h-4.482V38.312h9.271c2.137,0,3.841,0.557,5.112,1.67  c1.271,1.113,1.906,2.837,1.906,5.171C47.853,47.702,47.221,49.503,45.957,50.559z M67.159,42.135H60.7v17.769h-4.541V42.135h-6.49  v-3.823h17.49V42.135z"></path><path  fill="#fff" d="M40.112,42.062h-4.066v6.357h4.066c1.029,0,1.83-0.259,2.401-0.776s0.857-1.338,0.857-2.461s-0.286-1.924-0.857-2.402  S41.142,42.062,40.112,42.062z"></path></svg>
{{ end }}
3

Thanks for your reply. This solution seems even more unwieldy than mine, and assumes a lot of manual work whereas mine is fully automatic :slight_smile:

By the way, isn’t eq (len $.Translations) 0 the same as not .IsTranslated ?

4

I’m not sure but I can try to replace them to see if I get the same results.