datalog-theme 0.6.1 → 0.8.0

data/_includes/components/language-switcher.html

@@ -1,396 +0,0 @@
-{%- comment -%}
-Multi-language Support (i18n) Component
-Provides language switching and translated content
-
-Parameters:
-  - show_language_switcher: Show language dropdown (default: true)
-  - show_flags: Show country flags (default: true)
-  - position: Position (header, footer, floating) (default: header)
-  - available_languages: Languages to show (default: from config)
-{%- endcomment -%}
-
-{%- assign show_language_switcher = include.show_language_switcher | default: true -%}
-{%- assign show_flags = include.show_flags | default: true -%}
-{%- assign position = include.position | default: "header" -%}
-
-{%- comment -%} Get available languages from config or use defaults {%- endcomment -%}
-{%- if site.phase5_features.i18n.languages -%}
-  {%- assign available_languages = site.phase5_features.i18n.languages -%}
-{%- else -%}
-  {%- assign available_languages = "en,es,fr,de,pt" | split: "," -%}
-{%- endif -%}
-
-{%- comment -%} Detect current language from page or site config {%- endcomment -%}
-{%- assign current_lang = page.lang | default: site.lang | default: "en" -%}
-
-{%- comment -%} Language names and flags {%- endcomment -%}
-{%- assign lang_names = "English,Español,Français,Deutsch,Português" | split: "," -%}
-{%- assign lang_codes = "en,es,fr,de,pt" | split: "," -%}
-{%- assign lang_flags = "🇺🇸,🇪🇸,🇫🇷,🇩🇪,🇵🇹" | split: "," -%}
-
-{%- if show_language_switcher -%}
-  <div class="language-switcher language-switcher--{{ position }}"
-       data-language-switcher
-       role="navigation"
-       aria-label="Language selection">
-
-    <button type="button"
-            class="language-switcher__trigger"
-            data-lang-trigger
-            aria-haspopup="true"
-            aria-expanded="false"
-            aria-controls="language-menu">
-
-      {%- comment -%} Current language display {%- endcomment -%}
-      {%- for code in lang_codes -%}
-        {%- if code == current_lang -%}
-          {%- if show_flags -%}
-            <span class="language-switcher__flag" aria-hidden="true">
-              {{ lang_flags[forloop.index0] }}
-            </span>
-          {%- endif -%}
-          <span class="language-switcher__name">
-            {{ lang_names[forloop.index0] }}
-          </span>
-          <svg class="language-switcher__icon"
-               xmlns="http://www.w3.org/2000/svg"
-               width="16"
-               height="16"
-               viewBox="0 0 24 24"
-               fill="none"
-               stroke="currentColor"
-               stroke-width="2"
-               aria-hidden="true">
-            <polyline points="6 9 12 15 18 9"></polyline>
-          </svg>
-        {%- endif -%}
-      {%- endfor -%}
-    </button>
-
-    <ul class="language-switcher__menu"
-        id="language-menu"
-        data-lang-menu
-        role="menu"
-        hidden>
-
-      {%- for code in available_languages -%}
-        {%- assign lang_index = nil -%}
-        {%- for check_code in lang_codes -%}
-          {%- if check_code == code -%}
-            {%- assign lang_index = forloop.index0 -%}
-            {%- break -%}
-          {%- endif -%}
-        {%- endfor -%}
-
-        {%- if lang_index -%}
-          {%- assign is_current = false -%}
-          {%- if code == current_lang -%}
-            {%- assign is_current = true -%}
-          {%- endif -%}
-
-          <li class="language-switcher__item"
-              role="none">
-            <button type="button"
-                    class="language-switcher__option{% if is_current %} language-switcher__option--active{% endif %}"
-                    data-lang="{{ code }}"
-                    role="menuitem"
-                    {% if is_current %}aria-current="true"{% endif %}
-                    lang="{{ code }}">
-              {%- if show_flags -%}
-                <span class="language-switcher__flag" aria-hidden="true">
-                  {{ lang_flags[lang_index] }}
-                </span>
-              {%- endif -%}
-              <span class="language-switcher__label">
-                {{ lang_names[lang_index] }}
-              </span>
-              {%- if is_current -%}
-                <svg class="language-switcher__check"
-                     xmlns="http://www.w3.org/2000/svg"
-                     width="16"
-                     height="16"
-                     viewBox="0 0 24 24"
-                     fill="none"
-                     stroke="currentColor"
-                     stroke-width="2"
-                     aria-hidden="true">
-                  <polyline points="20 6 9 17 4 12"></polyline>
-                </svg>
-              {%- endif -%}
-            </button>
-          </li>
-        {%- endif -%}
-      {%- endfor -%}
-    </ul>
-  </div>
-
-  {%- comment -%} Translation strings for common UI elements {%- endcomment -%}
-  <script type="application/json" data-i18n-strings>
-  {
-    "en": {
-      "readMore": "Read more",
-      "readLess": "Read less",
-      "share": "Share",
-      "bookmark": "Bookmark",
-      "unbookmark": "Remove bookmark",
-      "comments": "Comments",
-      "noComments": "No comments yet",
-      "loading": "Loading...",
-      "error": "An error occurred",
-      "publishedOn": "Published on",
-      "updatedOn": "Updated on",
-      "by": "by",
-      "in": "in",
-      "minutes": "minutes",
-      "minRead": "min read",
-      "relatedPosts": "Related Posts",
-      "popularPosts": "Popular Posts",
-      "recentPosts": "Recent Posts",
-      "categories": "Categories",
-      "tags": "Tags",
-      "searchPlaceholder": "Search posts...",
-      "noResults": "No results found",
-      "showingResults": "Showing {{count}} results"
-    },
-    "es": {
-      "readMore": "Leer más",
-      "readLess": "Leer menos",
-      "share": "Compartir",
-      "bookmark": "Guardar",
-      "unbookmark": "Eliminar marcador",
-      "comments": "Comentarios",
-      "noComments": "Aún no hay comentarios",
-      "loading": "Cargando...",
-      "error": "Ocurrió un error",
-      "publishedOn": "Publicado el",
-      "updatedOn": "Actualizado el",
-      "by": "por",
-      "in": "en",
-      "minutes": "minutos",
-      "minRead": "min de lectura",
-      "relatedPosts": "Artículos Relacionados",
-      "popularPosts": "Artículos Populares",
-      "recentPosts": "Artículos Recientes",
-      "categories": "Categorías",
-      "tags": "Etiquetas",
-      "searchPlaceholder": "Buscar artículos...",
-      "noResults": "No se encontraron resultados",
-      "showingResults": "Mostrando {{count}} resultados"
-    },
-    "fr": {
-      "readMore": "Lire la suite",
-      "readLess": "Lire moins",
-      "share": "Partager",
-      "bookmark": "Enregistrer",
-      "unbookmark": "Supprimer le signet",
-      "comments": "Commentaires",
-      "noComments": "Pas encore de commentaires",
-      "loading": "Chargement...",
-      "error": "Une erreur s'est produite",
-      "publishedOn": "Publié le",
-      "updatedOn": "Mis à jour le",
-      "by": "par",
-      "in": "dans",
-      "minutes": "minutes",
-      "minRead": "min de lecture",
-      "relatedPosts": "Articles Connexes",
-      "popularPosts": "Articles Populaires",
-      "recentPosts": "Articles Récents",
-      "categories": "Catégories",
-      "tags": "Étiquettes",
-      "searchPlaceholder": "Rechercher des articles...",
-      "noResults": "Aucun résultat trouvé",
-      "showingResults": "Affichage de {{count}} résultats"
-    },
-    "de": {
-      "readMore": "Weiterlesen",
-      "readLess": "Weniger lesen",
-      "share": "Teilen",
-      "bookmark": "Lesezeichen",
-      "unbookmark": "Lesezeichen entfernen",
-      "comments": "Kommentare",
-      "noComments": "Noch keine Kommentare",
-      "loading": "Wird geladen...",
-      "error": "Ein Fehler ist aufgetreten",
-      "publishedOn": "Veröffentlicht am",
-      "updatedOn": "Aktualisiert am",
-      "by": "von",
-      "in": "in",
-      "minutes": "Minuten",
-      "minRead": "Min. Lesezeit",
-      "relatedPosts": "Verwandte Beiträge",
-      "popularPosts": "Beliebte Beiträge",
-      "recentPosts": "Neueste Beiträge",
-      "categories": "Kategorien",
-      "tags": "Schlagwörter",
-      "searchPlaceholder": "Beiträge durchsuchen...",
-      "noResults": "Keine Ergebnisse gefunden",
-      "showingResults": "Zeige {{count}} Ergebnisse"
-    },
-    "pt": {
-      "readMore": "Ler mais",
-      "readLess": "Ler menos",
-      "share": "Compartilhar",
-      "bookmark": "Salvar",
-      "unbookmark": "Remover marcador",
-      "comments": "Comentários",
-      "noComments": "Ainda sem comentários",
-      "loading": "Carregando...",
-      "error": "Ocorreu um erro",
-      "publishedOn": "Publicado em",
-      "updatedOn": "Atualizado em",
-      "by": "por",
-      "in": "em",
-      "minutes": "minutos",
-      "minRead": "min de leitura",
-      "relatedPosts": "Artigos Relacionados",
-      "popularPosts": "Artigos Populares",
-      "recentPosts": "Artigos Recentes",
-      "categories": "Categorias",
-      "tags": "Tags",
-      "searchPlaceholder": "Pesquisar artigos...",
-      "noResults": "Nenhum resultado encontrado",
-      "showingResults": "Mostrando {{count}} resultados"
-    }
-  }
-  </script>
-
-  <script>
-  (function() {
-    'use strict';
-
-    const STORAGE_KEY = 'preferredLanguage';
-
-    class LanguageSwitcher {
-      constructor() {
-        this.currentLang = '{{ current_lang }}';
-        this.translations = {};
-        this.init();
-      }
-
-      init() {
-        // Load translation strings
-        const stringsEl = document.querySelector('[data-i18n-strings]');
-        if (stringsEl) {
-          try {
-            this.translations = JSON.parse(stringsEl.textContent);
-          } catch (e) {
-            console.error('Failed to parse translation strings:', e);
-          }
-        }
-
-        // Restore preferred language
-        const savedLang = this.getPreferredLanguage();
-        if (savedLang && savedLang !== this.currentLang) {
-          this.switchLanguage(savedLang);
-        }
-
-        this.attachEventListeners();
-      }
-
-      attachEventListeners() {
-        const trigger = document.querySelector('[data-lang-trigger]');
-        const menu = document.querySelector('[data-lang-menu]');
-        const options = document.querySelectorAll('[data-lang]');
-
-        if (!trigger || !menu) return;
-
-        // Toggle menu
-        trigger.addEventListener('click', () => {
-          const isHidden = menu.hidden;
-          menu.hidden = !isHidden;
-          trigger.setAttribute('aria-expanded', isHidden);
-        });
-
-        // Close on outside click
-        document.addEventListener('click', (e) => {
-          if (!e.target.closest('[data-language-switcher]')) {
-            menu.hidden = true;
-            trigger.setAttribute('aria-expanded', 'false');
-          }
-        });
-
-        // Language selection
-        options.forEach(option => {
-          option.addEventListener('click', () => {
-            const lang = option.dataset.lang;
-            this.switchLanguage(lang);
-            menu.hidden = true;
-            trigger.setAttribute('aria-expanded', 'false');
-          });
-        });
-
-        // Keyboard navigation
-        menu.addEventListener('keydown', (e) => {
-          if (e.key === 'Escape') {
-            menu.hidden = true;
-            trigger.setAttribute('aria-expanded', 'false');
-            trigger.focus();
-          }
-        });
-      }
-
-      switchLanguage(lang) {
-        this.currentLang = lang;
-        this.savePreferredLanguage(lang);
-
-        // Update document language
-        document.documentElement.lang = lang;
-
-        // Reload page with language parameter
-        const url = new URL(window.location.href);
-        url.searchParams.set('lang', lang);
-
-        // Store scroll position
-        sessionStorage.setItem('scrollPosition', window.pageYOffset);
-
-        window.location.href = url.toString();
-      }
-
-      getPreferredLanguage() {
-        try {
-          return localStorage.getItem(STORAGE_KEY);
-        } catch (e) {
-          return null;
-        }
-      }
-
-      savePreferredLanguage(lang) {
-        try {
-          localStorage.setItem(STORAGE_KEY, lang);
-        } catch (e) {
-          console.error('Failed to save language preference:', e);
-        }
-      }
-
-      // Translate a key
-      t(key, replacements = {}) {
-        let text = this.translations[this.currentLang]?.[key] || key;
-
-        // Replace placeholders
-        Object.keys(replacements).forEach(placeholder => {
-          text = text.replace(`{{${placeholder}}}`, replacements[placeholder]);
-        });
-
-        return text;
-      }
-    }
-
-    // Initialize
-    const languageSwitcher = new LanguageSwitcher();
-
-    // Make available globally
-    window.i18n = {
-      t: (key, replacements) => languageSwitcher.t(key, replacements),
-      currentLang: () => languageSwitcher.currentLang
-    };
-
-    // Restore scroll position
-    const scrollPos = sessionStorage.getItem('scrollPosition');
-    if (scrollPos) {
-      window.scrollTo(0, parseInt(scrollPos, 10));
-      sessionStorage.removeItem('scrollPosition');
-    }
-  })();
-  </script>
-{%- endif -%}