Nuxt.js: Lista dostępnych języków
Prosty i Nowoczesny Framework dla Vue.js
7 godz. 2 min · Vue.js · Full-stack i Programowanie
Wojciech PołowniakSr. Fullstack EngineerCzego się nauczysz
- Praktyczny kurs, praktyczny projekt: klon Wikipedii
- Migracja statycznej strony HTML do ekosystemu Nuxt
- Tworzenie klasycznych komponentów VueJS
- Przygotowanie własnego API i konsumpcja zewnętrznych endpointów
- Tworzenie i wykorzystanie modułów i pluginów do Nuxt
- SSR - Server Side Rendering
- Programowanie z duchem idei progressive enhancement
- Animacje podczas przejść między podstronami
- Wsparcie dla różnych wersji językowych
- Niebanalne funkcjonalności aplikacji
- Optymalizacja dla wyszukiwarek internetowych
Praktyczny kurs - praktyczny projekt
W tym projekcie tworzyć będziemy praktyczny projekt - klona Wikipedii! Minipedia pobierze dane z prawdziwego źrodła danych, zewnętrznego API WikiMedia - będzie łudząco podobna do oryginału oraz współdzieliła najważniejsze funkcjonalności, takie jak dostarczanie treści w różnych wersjach językowych, możliwość wyszukiwania artykułów, czy pobieranie najpopularniejszych wpisów dla danego języka. Stworzymy także podstronę wyświetlającą za każdym razem losowy artykuł w danej wersji językowej.Zobaczysz też, jak dokonać migracji ze statycznej strony HTML na Nuxt - oraz jak tworzyć przykładowe komponenty podczas tego procesu.Dzięki temu wszystkiemu, dowiesz się jak wykorzystać nabytą wiedzę w praktyce.
Renderowanie po stronie serwera
Dzięki Nuxtowi dowiesz się jak optymalizować Twoje strony www z duchem idei progressive enhancement, dostarczając coraz to lepsze doświadczenia dla swoich użytkowników oraz tworząc aplikację napisaną w 100% w JavaScript, która będzie działała nawet wtedy, gdy użytkownik jawnie wyłączy go w przeglądarce! To wszystko za SSR (Server Side Rendering), dzięki któremu treści będą gotowe do konsumpcji już przy wstępnej, pierwszej odpowiedzi z serwera WWW.Oczywiście, ma to swoje implikacje na wydajność naszej aplikacji - sprawiając że Lighthouse czy optymalizacja pod SEO staje się coraz prostsza!
Najciekawsze pluginy i moduły
Czymże jest ekosystem danego frameworka bez wsparcia społeczności! Dlatego podczas tego kursu nauczysz się instalować i wykorzystywać różne pluginy i moduły, które zaoszczędzą Ci dużo czasu. Dowiesz się też, jak tworzyć własne moduły - które rozszerzą działanie Twojej aplikacji Nuxt w sposób czysty i zarządzalny.
Tworzenie API
Nuxt jest frameworkiem w którym pracujemy zarówno po stronie front-endu, jak i back-endu. W związku z czym, stworzymy swoje własne API (bazujące na express.js) które będzie pewnego rodzaju pośrednikiem pomiędzy API WikiMedia oraz Twoją aplikacją internetową.
Routing w Nuxt
W tym kursie, dowiesz się także jak tworzyć swoje własne Middleware'y - czyli fragmenty kodu wywoływane pomiędzy przechodzeniem między stronami, czy podczas innych zapytań HTTP.Dodatkowo, zobaczysz jakie narzędzia daje nam Nuxt aby tworzyć progresywne aplikacje internetowe, oferując wsparcie dla takich funkcjonalności jak np. animacje między przejściami pojedynczymi podstronami naszego serwisu.
Lokalizacja i tłumaczenie danych
Tajemnicze i18n - czyli numeronim odpowiadający angielskiemu słowu "internalisation" - odnosi się w kontekście web developmentu do tłumaczenia danych na różne języki. Podczas realizacji projektu Minipedii, nie tylko wykorzystamy standardowe podejście do tłumaczeń stałych elementów naszego interfejsu użytkownika, ale także przetłumaczymy same dane zwracane z API, wykorzystując inną wersję językową w zależności od preferencji użytkownika!
Optymalizacja dla wyszukiwarek internetowych
Poznasz też kilka ciekawych pluginów i rozwiązań dotyczących optymalizacji pod SEO - poza faktem, że podejście spełniające intencje użytkownika jest najlepszym, co możemy zrobić - pluginy generujące nam mapę stron automatycznie na podstawie zadeklarowanych przez nas podstron, czy generatory danych jsonld pomogą w pozycjonowaniu Twojej wydajnej aplikacji jeszcze wyżej w hierarchii wyszukiwarek.
Dla kogo jest ten kurs?
Aby móc efektywnie korzystać z tego kursu, powinieneś posiadać średnio zaawansowaną wiedzę z kategorii Front End, z naciskiem na umiejętność posługiwania się JavaScriptem oraz solidne podstawy NodeJS. Konieczna jest znajomość Vue, jako że Nuxt jest frameworkiem korzystającym z niego u swoich podstaw. Jeśli czujesz się dość swobodnie w wyżej wymienionych aspektach web developmentu, ten kurs będzie idealny dla Ciebie.
Cześć! W tej lekcji będziemy zajmować się
tłumaczeniem API i tutaj też posprzątamy nasz komponent ID View, czyli tą naszą
dynamiczną stronę, bo tutaj widzę, że niektóre rzeczy są kodowane.
No i oczywiście pozbędziemy się tej sekcji języków.
Być może nie zdążymy wszystkiego zrobić w
jednej lekcji, w związku z czym rozbijam to sobie na mniejsze.
Zobaczymy jak pójdzie.
Zacznijmy może od tego, aby faktycznie przetłumaczyć to szybciutko Spanish.
W ramach ćwiczenia z poprzedniej lekcji.
Już na pewno rozumiecie, na czym to polega.
Nazwałam to disclaimer.
I dodamy to do
naszych plików transakcyjnych, które utworzyliśmy sobie w katalogu.
Link tutaj.
Czyli.
Disclaimer.
Zapisujemy i tak samo dla innych języków.
Stawiamy.
Alternatywna wersja.
Czyli tutaj jest hiszpański.
Niech tutaj będzie francuski.
W związku z czym co będziemy musieli
zrobić, to wejść na dokumentację wiki teraz i po wejściu tam znajdziemy
endpoint, który zwróci nam dostępne języki.
Wyświetlimy je sobie właśnie w panelu bocznym.
Zobaczmy, czy to nam się tutaj zaktualizowano.
Jeśli dane tutaj prefix.
Swoją drogą jest to bardzo ciekawe, że w
tym momencie możemy lokalizować nasze ścieżki za pomocą paska przeglądarki.
I faktycznie ta treść nam się tutaj zaktualizowana.
Tylko treści z API jeszcze nie.
Oraz tutaj pay as holder, który też moglibyśmy zmienić.
W związku z czym wejdźmy na
wiki Page dokumentację i tutaj przejdziemy sobie po lewej kolumnie.
Zobaczymy, że jest tutaj takie pole jak Langley X.
Więc to co musimy zrobić to po pierwsze
wejść w tą funkcję, skopiować jej nazwę oraz stworzyć nowy middleware, ponieważ.
Translację będziemy organizować na poziomie layoutu, a nie na poziomie danego
patcha i chcielibyśmy mieć do tego osobny middleware.
W związku z czym wejdźmy do
katalogu middleware i tutaj sobie wpiszmy wiki translation translation.
Jest skopiuj obecny.
Routing.
Przekleić go tutaj.
Oczywiście do Stora też będziemy musieli wejść.
Aby zapisać sobie te języki, które tutaj. Znaleźliśmy.
To było bodajże lang links links.
I tak samo.
Set plank.
Links stats text stats.
Plank links równa się.
W sumie nie powinno to być jako tekst, tylko każde z tych pól powinno mieć osobny
parametr o innej nazwie, bo nie zawsze jest tekst.
No ale zostawmy to już w takiej formie.
Więc rozszerzyliśmy nasz middleware.
Musimy jeszcze rozszerzyć nasze API,
czyli tutaj w raportach w wiki daje się dodajemy nowy endpoint typu GET.
Na szczęście dodawanie jest całkiem proste.
Link links i tutaj.
Zmienimy to na Things, zapiszemy.
To nawet zwróci bodajże tablicę.
W związku z tym może to być Jackson.
I zobaczmy co tutaj się wydarzy.
Jeśli wejdziemy z przeglądarki na naszą
stronę w tym momencie to powinno zadziałać na takiej zasadzie, że jak
wpiszemy API wiki i nie full info tylko rank links
to powinny nam się zwrócić właśnie różne wersje językowe dla danego page'a.
W związku z czym wykorzystamy to
oczywiście na front endzie i powinno to być zapisane już w naszym i wierzę.
Jeśli to zrobiliśmy jeszcze sobie zerknę.
Tutaj na razie jest to skopiowane.
W związku z czym być może chcielibyśmy konsolidować wszystkie
parametry, żeby się upewnić, że akurat język będzie tam obecny.
I ten middleware wiki translation.
Musimy go wykorzystać wewnątrz layoutów, czyli default.
Tutaj wejdziemy sobie do skryptów.
Skrypt nie mamy zupełnie komponentu tutaj nawet ciekawe.
Script.
Skrypt. Nie było takiej potrzeby.
Widocznie export default.
Obiekt middleware i nazwa naszego middleware, czyli wiki.
Translation S.
Zapisujemy i to powinno już nam tutaj zadziałać.
Czyli po wejściu na dowolną podstronę.
Bo znajduje się to na poziomie layoutu.
Powinniśmy tutaj dostać informacje i faktycznie widzimy Janusza Korczaka.
Ponieważ wykonano logo, daliśmy tutaj parametr ID.
Zobaczmy, czy jeżeli zapiszemy.
I tutaj, albo na stronie głównej wejdźmy na stronę główną.
Zmieńmy na francuski, zobaczmy, czy się gdzieś tu wypisała.
To jest puste akurat w naszym przypadku.
To znaczy, że
wersje językowe prawdopodobnie nie są dostępne na tym poziomie,
co może nam troszkę utrudnić sprawę, aby pobrać odpowiednie języki.
Ale w tym momencie nie musimy się tym
przejmować, bo chcemy wyrenderować tylko i wyłącznie tutaj.
Lista języków w tym miejscu dynamicznie,
w związku z czym sprawdźmy w naszym layoucie.
Deflacją.
Czy faktycznie przez to, że znajduje się to, czego byśmy się spodziewali.
Ja to piszę może tam przy.
Language.
To sobie skomentuję za chwilkę albo całkowicie usunę.
Tutaj widzę jakieś zduplikowane.
Listy zagnieżdżone. Tak powinno być?
Wydaje mi się, że nie.
Tak pozbędę się tej jednej wiewiórki stąd.
I po prostu wypisze treść stara, czyli stor stats links.
Jeśli wszystko zrobiliśmy,
czyli musieliśmy po pierwsze zaktualizować stare, po drugie stworzyć endpoint i
zaktualizować nasz state danymi z tego pakietu.
Zobaczmy czy zadziałało.
Po odświeżeniu strony.
Wydaje mi się, że nie.
Zobaczymy czy jest jakiś błąd.
State Link Links.
Nic tu niestety nie ma, czyli jest to prawdopodobnie puste.
Zobaczmy czy wiki translation, więc oczywiście tutaj tego nie zapisaliśmy, w
związku z czym zobaczmy jak to wygląda tutaj.
Comic.
Strajk zaczął się już.
Elegancko hehe.
Sama Flora.
No i tutaj set rank links.
Ciekawe czy tak to zapisaliśmy z TOR czy jest.
Set lang links.
Dobrze to ustawiliśmy i tutaj.
Blank links.
Problemem będzie tylko to, że tutaj nie mam tego pasa, bo go sobie usunęliśmy.
On nie zawsze będzie dostępny, w związku z czym jestem ciekawy jak możemy
to obejść, prawdopodobnie ustawiając link links na jakąś dowolną stronę główną.
Ciężko powiedzieć, więc ustawiam tutaj.
Pass równa się route parametr id.
I będzie nam to działało na pewno.
Napojach, w którym mamy.
Jakąś postać.
Ale widzę, że na stronie głównej.
Chyba też, więc nie powinniśmy się tym przejmować.
I widzimy, że struktura obiektów jest
taka, że mamy tutaj link jako 2 literowy country kod tytuł, czyli
nazwa tego języka i odnośnik do jego wersji językowej na
Wikipedii, w związku z czym ja sobie skopiuję tutaj ten obiekt i wejdę do
West z powrotem, aby stworzyć to na poziomie layoutu, czyli Default view.
Zrobimy sobie dla każdego Eli zrobimy w formie.
Możemy sobie zrobić nas jakieś kompleksy.
Chociaż nie wiem czy to akurat sens w tym przypadku.
Może będzie troszkę czytelni, może tak zróbmy, więc zapiszemy.
Szybko na sam dół konkurs.
Languages.
I to jest funkcja, która musi zwrócić nam tutaj.
Wartość tego store.
Zapiszemy z powrotem do góry w For Language.
A Bank in Languages.
I teraz dla każdego z tych języków możemy stworzyć kotwicę.
Bądź prawdziwe plik tekstowy i chyba tym
od razu się zajmiemy, a nie żadnymi kafelkami.
Czyli po prostu kopiujemy sobie ze strony głównej index view.
Switch lokal Topaz.
I w tym momencie mamy tutaj dostęp do Lang.
Kropka.
No właśnie, jaka to była treść tego obiektu?
Zobaczmy.
Plant kropka lang.
I tutaj jako treść wstawiamy.
Lang kropka.
Tyle.
Zapiszemy URL też nam będzie potrzebne.
Prawdopodobnie.
Zapiszemy.
I w tym momencie.
Jak odświeżyłem stronę, zobaczmy czy to coś zmieniło.
Wydaje mi się, że nie, ponieważ tutaj to jest dalej kodowane.
Tutaj będziemy dostawali różne wzorniki, ponieważ nie mamy tutaj tego tłumaczenia.
Dla różnych ścieżek i widzę, że bardzo dziwne.
Języki tutaj nam się pokazały również and I Find jako country kod.
Zobaczmy czy działa to na stronie
z naszym kurczakiem, ponieważ to chcieliśmy przetestować przede wszystkim.
I tu faktycznie jest całkiem sporo wpisów w tym momencie.
Więc jeśli znajdziemy też ciężko powiedzieć.
Który z tych języków jest hiszpańskim.
Swoją drogą ciekawe, że się wyświetla Janusz Korczak.
A nie nazwa danego języka.
Być może, że wszystkie nie wspierane
języki nam się nie wyświetlają, chociaż byłoby to dziwne.
Wydaje mi się, że to jest problem z API.
Ale jak zobaczyłem japoński np.
to jest chyba japoński to widzę, że jest identyczny.
Czy ja tutaj czegoś nie przetestowałem?
Swój pas lang lang lang.
Wygląda to tak, jakby to powinno nam tutaj działać.
Zrób test.
Być może jest jakiś błąd w konsoli, który nam mówi, że jest problem z kluczami.
Tak nie istnieją na pewno te języki.
I jest to całkiem sporo tych języków.
Ale hiszpański powinien tutaj istnieć.
Możemy też spróbować z limitami tylko do języków, które są zdefiniowane w naszych
plikach transakcji, czyli tutaj jak robimy sobie language return lang.
X. S.
Albo link.
W sumie możemy to robić też na odwrotnej zasadzie, czyli.
PS.
FR.
PM includes.
Lang. Kropka.
Lang.
Jak to zapiszemy, powinniśmy mieć o wiele mniej języków.
I faktycznie wyświetliły się tylko dwa, w związku z czym.
Wygląda na to.
Że język francuski.
Ciekawe zrobiło się. Na hiszpański.
Pamiętam, że pisałem tutaj far.
Nie jestem pewien, dlaczego nam się nie wyświetla na przykład język angielski.
Być może powinniśmy pozbyć się default language.
Naszym max config jest.
Jeżeli pozbędziemy się default local to nie będziemy mieli w robaku.
Chyba że tak.
Wokal.
Będziemy się zobaczymy czy to dalej zadziała.
Jeszcze się chyba przebudowuje.
Next.
Rated.
Jest to zdecydowanie ciekawe.
Co tutaj się dzieje.
Bo angielski zupełnie nam się nie pokazuje na tej liście.
Tak jakby angielski nie był zwracany w ogóle z naszego API.
Być może to jest to jest powód.
No niestety właśnie praca z API,
zwłaszcza z API Wikipedii może być problematyczna,
ale jest to na tyle ciekawe, że myślę, że warte zachodu.
Niekoniecznie ukończymy to w sposób produkcyjny.
Ale na pewno.
W jakiś ukończymy.
W związku z czym tutaj możemy sobie to przenieść do zmiennej.
Hmm przyciskiem myszy jak?
To powinno się w Star Object jako Global variable.
I w tym momencie będziemy mieć dostęp do.
W Polsce się przydają.
Zamknijmy i otwórzmy.
Ten jeden.
A czasem.
Tutaj wstawimy bułeczkę i zobaczmy, czy jest tutaj w ogóle.
Język angielski.
I chyba angielskiego nie ma.
Co też jest dosyć dziwne, bo
spodziewałbym się, że mimo wszystko nawet domyślny język będzie tutaj wypisywane.
No niestety coś. Cóż zrobić?
Możemy to tak naprawdę ręcznie naprawić po
stronie middleware, to znaczy w wiki translation tutaj po prostu dodać.
Wynik tego zapytania.
Tylko wtedy musimy założyć, że dany artykuł będzie dostępny w języku
angielskim, co nie zawsze musi być prawdą, w związku z czym jest to taka ciężka
sytuacja, z której tutaj wyjść w dobry sposób.
I wydaje mi się, że to, co teraz powinniśmy zrobić, to spróbować debatować.
Dlaczego.
Te naklejki nie generują nam się tutaj poprawnie.
A następnie spróbować przekazać informacje do naszego serwera.
Jaki jest to konkretnie page?
W jakim języku?
I wtedy będziemy mieli pełny experience.
Zerknijmy więc ponownie na default kropka view.
Tutaj widzimy już, że niestety angielski nie jest zwracany w tym miejscu, w związku
z czym to się prawdopodobnie nie będzie wykonywało.
Jednak przychodząc tutaj nie powinno być problemu z tym, aby wyświetlić np.
pojedynczy język.
Czyli tutaj, jeśli sobie wyświetlimy.
Dany język, to widzimy, że faktycznie integrując.
A z mojej strony oczywiście, czyli tytuł jest to tytuł strony, a nie tytuł języka.
Tutaj troszkę się w takim razie.
Ja.
Pomyliłem w interpretacji tego API.
Niestety w dokumentacji to chyba nie było opisane.
Tak, jest to po prostu napisane jako long tail i forum.
W związku z czym to co możemy zrobić to.
Chwilowo wyświetlić tutaj lang lang zapisać to.
I w tym momencie mamy odnośniki po prostu
poprzez Country code i teraz możemy znajdź Language Codes.
Gest z językami skopie jamę ustną.
Moglibyśmy go wynieść gdzieś indziej, ale na potrzeby tego przekładu po prostu
wrzućmy go do Compact Properties, czyli tutaj wstawiamy Display Name Language.
Display name language display names.
Dokładnie.
I to jest kolejne properties, które zwróci obiekt.
Żeby to troszkę lepiej wyglądało.
I w tym momencie jesteśmy w stanie tutaj
na etapie powinniśmy zwinąć ten obiekt jeżeli się da.
Mam taką nadzieję, bo jest całkiem sporo języków na świecie.
Super.
Więc w tym miejscu możemy to przefiltrować
po pierwsze, a po drugie jako kolejny krok zmapować.
To znaczy zrobimy sobie mapę, język i będziemy zwracali nowy obiekt.
Link.
Który będzie tak naprawdę rozszerzał.
Obecny.
Tutaj robimy The ring o Display Name.
Z des Language Display Names lang.
Link.
Gdy to zapiszemy to mam nadzieję, że w naszym language.
Tutaj, które renderuje, będziemy w stanie zrobić po prostu display name.
I tutaj powinniśmy wybrać jeszcze zamiast
obiektu, bo teraz będzie nam przypisane są obiekty albo name albo Name Native.
Weźmy Native Name, czyli Display Name.
I teraz wchodząc tutaj faktycznie był to
obiekt i widzimy, że mamy różne języki dostępne, gdzie tłumaczy nam się na tym
etapie tylko i wyłącznie nawigacja oraz tutaj ten disclaimer.
Niestety języka angielskiego tutaj nie ma i chyba możemy zrobić tutaj założenie, że.
Ten język zawsze tam będzie, w związku z czym zróbmy taki troszkę hack.
Oczywiście nie zalecam robić takich rzeczy na produkcji.
Powiedzmy, że znajdujemy to sobie data i data.
Zrobimy push.
Jest to tablica.
Dodamy nowy language lang N. Tytul strony.
No właśnie tutaj to będzie problem, bo nie znamy tytułu angielskiej strony.
Możemy dać Type na null i tak nie będziemy z niego korzystać oraz Display name.
Dostaniemy z layoutu.
Więc to co możemy zrobić, to po prostu
przekierować na API Wikipedię, czyli kropka.
To powinno być akurat zapisane gdzieś.
W naszym kodzie źródłowym dokładnie tutaj, więc to też będziemy musieli zmienić, aby
w zależności od tego jaki język został poproszony, żeby nasze API się
aktualizował i używało innej wersji językowej.
Więc tylko tutaj to rzucimy.
I zobaczmy jaki tam był klucz.
URL podaj URL wstawiamy.
Link do naszego API zapisujemy.
I tutaj oczywiście musimy jeszcze
przekazać datę, to w tym meczu zamknijmy oraz pozbądźmy się tutaj tego błędu.
Składnia i tutaj jest podwójny nawias jeszcze.
Zobaczmy, czy zadziałało.
I faktycznie zadziałało.
Mamy display, mam ustawione na English.
Ja są na samym końcu tej listy, ponieważ
jest dopisywane ręcznie, ale będziemy w stanie przynajmniej
nawigować się z powrotem na wersję angielską naszej strony.
Więc w kolejnych lekcjach skupimy się na tłumaczeniu faktycznego API.
Będzie to zdecydowanie wyzwanie, bo musimy zmienić troszkę nasz kod i pointy,
ale brakuje nam naprawdę krok do pełnej internalizacji naszego serwisu.
Kod
Zmiany wprowadzone w lekcji · 21 min
diff --git a/28/minipedia/api/routes/wiki.js b/28/minipedia/api/routes/wiki.js
index c3c4cc9..194cd4a 100644
--- a/28/minipedia/api/routes/wiki.js
+++ b/28/minipedia/api/routes/wiki.js
@@ -56,6 +56,31 @@ router.get('/summary/page/:id', async (req, res) => {
}
});
+router.get('/langlinks/page/:id', async (req, res) => {
+ try {
+ const id = req.params.id;
+ const page = await Wiki.page(id);
+ const content = await page.langlinks();
+ return res.status(200).json(content);
+
+ } catch (e) {
+ console.error(e);
+ return res.status(500).json(e);
+ }
+});
+router.get('/summary/page/:id', async (req, res) => {
+ try {
+ const id = req.params.id;
+ const page = await Wiki.page(id);
+ const content = await page.summary();
+ return res.status(200).json(content);
+
+ } catch (e) {
+ console.error(e);
+ return res.status(500).json(e);
+ }
+});
+
router.get('/mainImage/page/:id', async (req, res) => {
try {
const id = req.params.id;
diff --git a/28/minipedia/lang/en-US.js b/28/minipedia/lang/en-US.js
index 6828090..0490bf6 100644
--- a/28/minipedia/lang/en-US.js
+++ b/28/minipedia/lang/en-US.js
@@ -29,4 +29,5 @@ export default {
'Languages': 'Languages',
'Register': 'Register',
'Login': 'Login',
+ 'Disclaimer': 'From Wikipedia, the free encyclopedia'
}
\ No newline at end of file
diff --git a/28/minipedia/lang/es-ES.js b/28/minipedia/lang/es-ES.js
index 132a634..788f80f 100644
--- a/28/minipedia/lang/es-ES.js
+++ b/28/minipedia/lang/es-ES.js
@@ -29,4 +29,5 @@ export default {
'Languages': 'Idiomas',
'Register': 'Registrarse',
'Login': 'Acceso',
+ 'Disclaimer': 'De Wikipedia, la enciclopedia libre'
}
\ No newline at end of file
diff --git a/28/minipedia/lang/fr-FR.js b/28/minipedia/lang/fr-FR.js
index db133b7..c7a2eda 100644
--- a/28/minipedia/lang/fr-FR.js
+++ b/28/minipedia/lang/fr-FR.js
@@ -29,4 +29,5 @@ export default {
'Languages': 'Langues',
'Register': 'S\'inscrire',
'Login': 'Connexion',
+ 'Disclaimer': 'Un article de Wikipédia, l\'encyclopédie libre'
}
\ No newline at end of file
diff --git a/28/minipedia/layouts/default.vue b/28/minipedia/layouts/default.vue
index f7ed024..a54e515 100644
--- a/28/minipedia/layouts/default.vue
+++ b/28/minipedia/layouts/default.vue
@@ -45,16 +45,9 @@
</ul>
<h3> {{ $t('Languages') }} </h3>
<ul>
- <li><a href="#беларуская">беларуская</a></li>
- <li><a href="#čeština">čeština</a></li>
- <li><a href="#deutsch">deutsch</a></li>
- <li><a href="#kaszëbsczi">kaszëbsczi</a></li>
- <li><a href="#lietuvių">lietuvių</a></li>
- <li><a href="#polski">polski</a></li>
- <li><a href="#русский">русский</a></li>
- <li><a href="#українська">українська</a></li>
- <li><a href="#中文">中文</a></li>
- </ul>
+ <li v-for="lang in languages">
+ <nuxt-link :to="switchLocalePath(lang.lang)"> {{ lang.displayName.nativeName }} </nuxt-link>
+ </li>
</ul>
</nav>
@@ -79,10 +72,10 @@
</template>
<style>
- h1 {
- font-size: 2rem;
- font-weight: normal;
- margin-top: 0;
+ h1 {
+ font-size: 2rem;
+ font-weight: normal;
+ margin-top: 0;
}
h1,
@@ -91,207 +84,964 @@
h4,
h5,
h6 {
- border-bottom: 0.1rem solid var(--border-color)
+ border-bottom: 0.1rem solid var(--border-color)
}
figure {
- margin: 0;
- margin-bottom: 0.5rem;
+ margin: 0;
+ margin-bottom: 0.5rem;
}
figcaption {
- white-space: nowrap;
- font-weight: normal;
- font-size: 0.9em;
+ white-space: nowrap;
+ font-weight: normal;
+ font-size: 0.9em;
}
h2 {
- font-weight: normal;
+ font-weight: normal;
}
.side-navigation h3 {
- font-weight: normal;
- font-size: 1em;
- color: black;
- opacity: 0.6;
+ font-weight: normal;
+ font-size: 1em;
+ color: black;
+ opacity: 0.6;
}
body {
- line-height: 1.6;
- font-size: 0.9rem;
- font-family: sans-serif;
- padding: 0 1rem;
+ line-height: 1.6;
+ font-size: 0.9rem;
+ font-family: sans-serif;
+ padding: 0 1rem;
}
:root {
- --gray: #f6f6f6;
- --border-color: rgb(162, 169, 177);
- --light-blue: #A7D7F9;
+ --gray: #f6f6f6;
+ --border-color: rgb(162, 169, 177);
+ --light-blue: #A7D7F9;
}
.box {
- background: var(--gray);
- padding: 0.1rem;
- border: 0.1rem solid var(--border-color);
+ background: var(--gray);
+ padding: 0.1rem;
+ border: 0.1rem solid var(--border-color);
}
.full-bio {
- max-width: 271px;
- border-collapse: separate;
- border-spacing: 0.5rem;
- float: right;
- margin-left: 1rem;
- margin-bottom: 1rem;
- position: relative;
- font-size: 0.85rem;
+ max-width: 271px;
+ border-collapse: separate;
+ border-spacing: 0.5rem;
+ float: right;
+ margin-left: 1rem;
+ margin-bottom: 1rem;
+ position: relative;
+ font-size: 0.85rem;
}
.full-bio::before {
- position: absolute;
- left: -1.1rem;
- width: 1rem;
- height: 100%;
- background: white;
- z-index: 1;
- content: '';
- display: inline-block;
+ position: absolute;
+ left: -1.1rem;
+ width: 1rem;
+ height: 100%;
+ background: white;
+ z-index: 1;
+ content: '';
+ display: inline-block;
}
.full-bio [colspan="2"] {
- text-align: center;
+ text-align: center;
}
.full-bio td {
- vertical-align: center;
+ vertical-align: center;
}
.full-bio td:first-child {
- font-weight: bold;
+ font-weight: bold;
}
.site-search {
- font-size: 1rem;
- padding: 0.2rem;
- padding-left: 0.5rem;
- width: 15rem;
- border-color: var(--border-color);
- border-style: solid;
- ;
- border-radius: 0.5rem;
- margin-bottom: 0.4rem;
- font-size: 0.9rem;
+ font-size: 1rem;
+ padding: 0.2rem;
+ padding-left: 0.5rem;
+ width: 15rem;
+ border-color: var(--border-color);
+ border-style: solid;
+ ;
+ border-radius: 0.5rem;
+ margin-bottom: 0.4rem;
+ font-size: 0.9rem;
}
.wrapper {
- display: grid;
- grid-template-areas:
- "sidenav banner banner banner"
- "sidenav content content content";
- grid-template-columns: max-content 1fr;
- grid-template-rows: max-content 1fr;
+ display: grid;
+ grid-template-areas:
+ "sidenav banner banner banner"
+ "sidenav content content content";
+ grid-template-columns: max-content 1fr;
+ grid-template-rows: max-content 1fr;
}
.logo {
- grid-area: logo;
+ grid-area: logo;
}
.logo a {
- text-decoration: none !important;
- color: black !important;
+ text-decoration: none !important;
+ color: black !important;
}
.side-navigation {
- grid-area: sidenav;
- padding: 1rem;
+ grid-area: sidenav;
+ padding: 1rem;
}
.content {
- grid-area: content;
- background: white;
- padding: 1rem;
- border: 0.1rem solid var(--light-blue);
- background: white;
+ grid-area: content;
+ background: white;
+ padding: 1rem;
+ border: 0.1rem solid var(--light-blue);
+ background: white;
}
a {
- text-decoration: none;
- color: #0645ad;
+ text-decoration: none;
+ color: #0645ad;
}
ul {
- padding: 0;
- margin: 0;
- list-style-type: none;
+ padding: 0;
+ margin: 0;
+ list-style-type: none;
}
ol {
- padding: 0 2ch;
+ padding: 0 2ch;
}
body {
- background: var(--gray);
+ background: var(--gray);
}
.toc .box {
- display: inline-block;
- grid-template-columns: max-content;
- padding: 0.5rem;
+ display: inline-block;
+ grid-template-columns: max-content;
+ padding: 0.5rem;
}
.toc h2 {
- margin: 0 auto;
- font-weight: bold;
- border: none;
- font-size: 1rem;
- text-align: center;
+ margin: 0 auto;
+ font-weight: bold;
+ border: none;
+ font-size: 1rem;
+ text-align: center;
}
.references {
- column-count: 2;
- column-gap: 2rem;
+ column-count: 2;
+ column-gap: 2rem;
}
.references li {
- margin-bottom: 0.5rem;
+ margin-bottom: 0.5rem;
}
.banner {
- margin-left: auto;
- text-align: right;
+ margin-left: auto;
+ text-align: right;
}
.banner ul {
- display: flex;
- justify-content: flex-end;
- margin-bottom: 1rem;
+ display: flex;
+ justify-content: flex-end;
+ margin-bottom: 1rem;
}
.banner ul li {
- margin-left: 1rem;
+ margin-left: 1rem;
}
.banner input {
- display: inline-block;
+ display: inline-block;
}
.notice {
- display: block;
- margin-bottom: 1.5rem;
+ display: block;
+ margin-bottom: 1.5rem;
}
.logo a {
- display: flex;
- flex-direction: column;
- align-items: center;
- margin-bottom: 2rem;
- text-transform: uppercase;
- font-family: cursive;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin-bottom: 2rem;
+ text-transform: uppercase;
+ font-family: cursive;
}
.logo img {
- width: 7rem;
- margin-bottom: 0.3rem;
+ width: 7rem;
+ margin-bottom: 0.3rem;
}
+
</style>
+<script>
+ export default {
+ middleware: 'wiki-translations',
+ computed: {
+ languages() {
+ return this.$store.state.langlinks
+ .filter(lang => {
+ return ['es', 'fr', 'en'].includes(lang.lang);
+ })
+ .map(lang => {
+ return {
+ ...lang,
+ displayName: this.languageDisplayNames[lang.lang]
+ }
+ })
+ },
+ languageDisplayNames() {
+ return {
+ "ab": {
+ "name": "Abkhaz",
+ "nativeName": "аҧсуа"
+ },
+ "aa": {
+ "name": "Afar",
+ "nativeName": "Afaraf"
+ },
+ "af": {
+ "name": "Afrikaans",
+ "nativeName": "Afrikaans"
+ },
+ "ak": {
+ "name": "Akan",
+ "nativeName": "Akan"
+ },
+ "sq": {
+ "name": "Albanian",
+ "nativeName": "Shqip"
+ },
+ "am": {
+ "name": "Amharic",
+ "nativeName": "አማርኛ"
+ },
+ "ar": {
+ "name": "Arabic",
+ "nativeName": "العربية"
+ },
+ "an": {
+ "name": "Aragonese",
+ "nativeName": "Aragonés"
+ },
+ "hy": {
+ "name": "Armenian",
+ "nativeName": "Հայերեն"
+ },
+ "as": {
+ "name": "Assamese",
+ "nativeName": "অসমীয়া"
+ },
+ "av": {
+ "name": "Avaric",
+ "nativeName": "авар мацӀ, магӀарул мацӀ"
+ },
+ "ae": {
+ "name": "Avestan",
+ "nativeName": "avesta"
+ },
+ "ay": {
+ "name": "Aymara",
+ "nativeName": "aymar aru"
+ },
+ "az": {
+ "name": "Azerbaijani",
+ "nativeName": "azərbaycan dili"
+ },
+ "bm": {
+ "name": "Bambara",
+ "nativeName": "bamanankan"
+ },
+ "ba": {
+ "name": "Bashkir",
+ "nativeName": "башҡорт теле"
+ },
+ "eu": {
+ "name": "Basque",
+ "nativeName": "euskara, euskera"
+ },
+ "be": {
+ "name": "Belarusian",
+ "nativeName": "Беларуская"
+ },
+ "bn": {
+ "name": "Bengali",
+ "nativeName": "বাংলা"
+ },
+ "bh": {
+ "name": "Bihari",
+ "nativeName": "भोजपुरी"
+ },
+ "bi": {
+ "name": "Bislama",
+ "nativeName": "Bislama"
+ },
+ "bs": {
+ "name": "Bosnian",
+ "nativeName": "bosanski jezik"
+ },
+ "br": {
+ "name": "Breton",
+ "nativeName": "brezhoneg"
+ },
+ "bg": {
+ "name": "Bulgarian",
+ "nativeName": "български език"
+ },
+ "my": {
+ "name": "Burmese",
+ "nativeName": "ဗမာစာ"
+ },
+ "ca": {
+ "name": "Catalan; Valencian",
+ "nativeName": "Català"
+ },
+ "ch": {
+ "name": "Chamorro",
+ "nativeName": "Chamoru"
+ },
+ "ce": {
+ "name": "Chechen",
+ "nativeName": "нохчийн мотт"
+ },
+ "ny": {
+ "name": "Chichewa; Chewa; Nyanja",
+ "nativeName": "chiCheŵa, chinyanja"
+ },
+ "zh": {
+ "name": "Chinese",
+ "nativeName": "中文 (Zhōngwén), 汉语, 漢語"
+ },
+ "cv": {
+ "name": "Chuvash",
+ "nativeName": "чӑваш чӗлхи"
+ },
+ "kw": {
+ "name": "Cornish",
+ "nativeName": "Kernewek"
+ },
+ "co": {
+ "name": "Corsican",
+ "nativeName": "corsu, lingua corsa"
+ },
+ "cr": {
+ "name": "Cree",
+ "nativeName": "ᓀᐦᐃᔭᐍᐏᐣ"
+ },
+ "hr": {
+ "name": "Croatian",
+ "nativeName": "hrvatski"
+ },
+ "cs": {
+ "name": "Czech",
+ "nativeName": "česky, čeština"
+ },
+ "da": {
+ "name": "Danish",
+ "nativeName": "dansk"
+ },
+ "dv": {
+ "name": "Divehi; Dhivehi; Maldivian;",
+ "nativeName": "ދިވެހި"
+ },
+ "nl": {
+ "name": "Dutch",
+ "nativeName": "Nederlands, Vlaams"
+ },
+ "en": {
+ "name": "English",
+ "nativeName": "English"
+ },
+ "eo": {
+ "name": "Esperanto",
+ "nativeName": "Esperanto"
+ },
+ "et": {
+ "name": "Estonian",
+ "nativeName": "eesti, eesti keel"
+ },
+ "ee": {
+ "name": "Ewe",
+ "nativeName": "Eʋegbe"
+ },
+ "fo": {
+ "name": "Faroese",
+ "nativeName": "føroyskt"
+ },
+ "fj": {
+ "name": "Fijian",
+ "nativeName": "vosa Vakaviti"
+ },
+ "fi": {
+ "name": "Finnish",
+ "nativeName": "suomi, suomen kieli"
+ },
+ "fr": {
+ "name": "French",
+ "nativeName": "français, langue française"
+ },
+ "ff": {
+ "name": "Fula; Fulah; Pulaar; Pular",
+ "nativeName": "Fulfulde, Pulaar, Pular"
+ },
+ "gl": {
+ "name": "Galician",
+ "nativeName": "Galego"
+ },
+ "ka": {
+ "name": "Georgian",
+ "nativeName": "ქართული"
+ },
+ "de": {
+ "name": "German",
+ "nativeName": "Deutsch"
+ },
+ "el": {
+ "name": "Greek, Modern",
+ "nativeName": "Ελληνικά"
+ },
+ "gn": {
+ "name": "Guaraní",
+ "nativeName": "Avañeẽ"
+ },
+ "gu": {
+ "name": "Gujarati",
+ "nativeName": "ગુજરાતી"
+ },
+ "ht": {
+ "name": "Haitian; Haitian Creole",
+ "nativeName": "Kreyòl ayisyen"
+ },
+ "ha": {
+ "name": "Hausa",
+ "nativeName": "Hausa, هَوُسَ"
+ },
+ "he": {
+ "name": "Hebrew",
+ "nativeName": "עברית"
+ },
+ "iw": {
+ "name": "Hebrew",
+ "nativeName": "עברית"
+ },
+ "hz": {
+ "name": "Herero",
+ "nativeName": "Otjiherero"
+ },
+ "hi": {
+ "name": "Hindi",
+ "nativeName": "हिन्दी, हिंदी"
+ },
+ "ho": {
+ "name": "Hiri Motu",
+ "nativeName": "Hiri Motu"
+ },
+ "hu": {
+ "name": "Hungarian",
+ "nativeName": "Magyar"
+ },
+ "ia": {
+ "name": "Interlingua",
+ "nativeName": "Interlingua"
+ },
+ "id": {
+ "name": "Indonesian",
+ "nativeName": "Bahasa Indonesia"
+ },
+ "ie": {
+ "name": "Interlingue",
+ "nativeName": "Originally called Occidental; then Interlingue after WWII"
+ },
+ "ga": {
+ "name": "Irish",
+ "nativeName": "Gaeilge"
+ },
+ "ig": {
+ "name": "Igbo",
+ "nativeName": "Asụsụ Igbo"
+ },
+ "ik": {
+ "name": "Inupiaq",
+ "nativeName": "Iñupiaq, Iñupiatun"
+ },
+ "io": {
+ "name": "Ido",
+ "nativeName": "Ido"
+ },
+ "is": {
+ "name": "Icelandic",
+ "nativeName": "Íslenska"
+ },
+ "it": {
+ "name": "Italian",
+ "nativeName": "Italiano"
+ },
+ "iu": {
+ "name": "Inuktitut",
+ "nativeName": "ᐃᓄᒃᑎᑐᑦ"
+ },
+ "ja": {
+ "name": "Japanese",
+ "nativeName": "日本語 (にほんご／にっぽんご)"
+ },
+ "jv": {
+ "name": "Javanese",
+ "nativeName": "basa Jawa"
+ },
+ "kl": {
+ "name": "Kalaallisut, Greenlandic",
+ "nativeName": "kalaallisut, kalaallit oqaasii"
+ },
+ "kn": {
+ "name": "Kannada",
+ "nativeName": "ಕನ್ನಡ"
+ },
+ "kr": {
+ "name": "Kanuri",
+ "nativeName": "Kanuri"
+ },
+ "ks": {
+ "name": "Kashmiri",
+ "nativeName": "कश्मीरी, كشميري"
+ },
+ "kk": {
+ "name": "Kazakh",
+ "nativeName": "Қазақ тілі"
+ },
+ "km": {
+ "name": "Khmer",
+ "nativeName": "ភាសាខ្មែរ"
+ },
+ "ki": {
+ "name": "Kikuyu, Gikuyu",
+ "nativeName": "Gĩkũyũ"
+ },
+ "rw": {
+ "name": "Kinyarwanda",
+ "nativeName": "Ikinyarwanda"
+ },
+ "ky": {
+ "name": "Kirghiz, Kyrgyz",
+ "nativeName": "кыргыз тили"
+ },
+ "kv": {
+ "name": "Komi",
+ "nativeName": "коми кыв"
+ },
+ "kg": {
+ "name": "Kongo",
+ "nativeName": "KiKongo"
+ },
+ "ko": {
+ "name": "Korean",
+ "nativeName": "한국어 (韓國語), 조선말 (朝鮮語)"
+ },
+ "ku": {
+ "name": "Kurdish",
+ "nativeName": "Kurdî, كوردی"
+ },
+ "kj": {
+ "name": "Kwanyama, Kuanyama",
+ "nativeName": "Kuanyama"
+ },
+ "la": {
+ "name": "Latin",
+ "nativeName": "latine, lingua latina"
+ },
+ "lb": {
+ "name": "Luxembourgish, Letzeburgesch",
+ "nativeName": "Lëtzebuergesch"
+ },
+ "lg": {
+ "name": "Luganda",
+ "nativeName": "Luganda"
+ },
+ "li": {
+ "name": "Limburgish, Limburgan, Limburger",
+ "nativeName": "Limburgs"
+ },
+ "ln": {
+ "name": "Lingala",
+ "nativeName": "Lingála"
+ },
+ "lo": {
+ "name": "Lao",
+ "nativeName": "ພາສາລາວ"
+ },
+ "lt": {
+ "name": "Lithuanian",
+ "nativeName": "lietuvių kalba"
+ },
+ "lu": {
+ "name": "Luba-Katanga",
+ "nativeName": ""
+ },
+ "lv": {
+ "name": "Latvian",
+ "nativeName": "latviešu valoda"
+ },
+ "gv": {
+ "name": "Manx",
+ "nativeName": "Gaelg, Gailck"
+ },
+ "mk": {
+ "name": "Macedonian",
+ "nativeName": "македонски јазик"
+ },
+ "mg": {
+ "name": "Malagasy",
+ "nativeName": "Malagasy fiteny"
+ },
+ "ms": {
+ "name": "Malay",
+ "nativeName": "bahasa Melayu, بهاس ملايو"
+ },
+ "ml": {
+ "name": "Malayalam",
+ "nativeName": "മലയാളം"
+ },
+ "mt": {
+ "name": "Maltese",
+ "nativeName": "Malti"
+ },
+ "mi": {
+ "name": "Māori",
+ "nativeName": "te reo Māori"
+ },
+ "mr": {
+ "name": "Marathi (Marāṭhī)",
+ "nativeName": "मराठी"
+ },
+ "mh": {
+ "name": "Marshallese",
+ "nativeName": "Kajin M̧ajeļ"
+ },
+ "mn": {
+ "name": "Mongolian",
+ "nativeName": "монгол"
+ },
+ "na": {
+ "name": "Nauru",
+ "nativeName": "Ekakairũ Naoero"
+ },
+ "nv": {
+ "name": "Navajo, Navaho",
+ "nativeName": "Diné bizaad, Dinékʼehǰí"
+ },
+ "nb": {
+ "name": "Norwegian Bokmål",
+ "nativeName": "Norsk bokmål"
+ },
+ "nd": {
+ "name": "North Ndebele",
+ "nativeName": "isiNdebele"
+ },
+ "ne": {
+ "name": "Nepali",
+ "nativeName": "नेपाली"
+ },
+ "ng": {
+ "name": "Ndonga",
+ "nativeName": "Owambo"
+ },
+ "nn": {
+ "name": "Norwegian Nynorsk",
+ "nativeName": "Norsk nynorsk"
+ },
+ "no": {
+ "name": "Norwegian",
+ "nativeName": "Norsk"
+ },
+ "ii": {
+ "name": "Nuosu",
+ "nativeName": "ꆈꌠ꒿ Nuosuhxop"
+ },
+ "nr": {
+ "name": "South Ndebele",
+ "nativeName": "isiNdebele"
+ },
+ "oc": {
+ "name": "Occitan",
+ "nativeName": "Occitan"
+ },
+ "oj": {
+ "name": "Ojibwe, Ojibwa",
+ "nativeName": "ᐊᓂᔑᓈᐯᒧᐎᓐ"
+ },
+ "cu": {
+ "name": "Old Church Slavonic, Church Slavic, Church Slavonic, Old Bulgarian, Old Slavonic",
+ "nativeName": "ѩзыкъ словѣньскъ"
+ },
+ "om": {
+ "name": "Oromo",
+ "nativeName": "Afaan Oromoo"
+ },
+ "or": {
+ "name": "Oriya",
+ "nativeName": "ଓଡ଼ିଆ"
+ },
+ "os": {
+ "name": "Ossetian, Ossetic",
+ "nativeName": "ирон æвзаг"
+ },
+ "pa": {
+ "name": "Panjabi, Punjabi",
+ "nativeName": "ਪੰਜਾਬੀ, پنجابی"
+ },
+ "pi": {
+ "name": "Pāli",
+ "nativeName": "पाऴि"
+ },
+ "fa": {
+ "name": "Persian",
+ "nativeName": "فارسی"
+ },
+ "pl": {
+ "name": "Polish",
+ "nativeName": "polski"
+ },
+ "ps": {
+ "name": "Pashto, Pushto",
+ "nativeName": "پښتو"
+ },
+ "pt": {
+ "name": "Portuguese",
+ "nativeName": "Português"
+ },
+ "qu": {
+ "name": "Quechua",
+ "nativeName": "Runa Simi, Kichwa"
+ },
+ "rm": {
+ "name": "Romansh",
+ "nativeName": "rumantsch grischun"
+ },
+ "rn": {
+ "name": "Kirundi",
+ "nativeName": "kiRundi"
+ },
+ "ro": {
+ "name": "Romanian, Moldavian, Moldovan",
+ "nativeName": "română"
+ },
+ "ru": {
+ "name": "Russian",
+ "nativeName": "русский язык"
+ },
+ "sa": {
+ "name": "Sanskrit (Saṁskṛta)",
+ "nativeName": "संस्कृतम्"
+ },
+ "sc": {
+ "name": "Sardinian",
+ "nativeName": "sardu"
+ },
+ "sd": {
+ "name": "Sindhi",
+ "nativeName": "सिन्धी, سنڌي، سندھی"
+ },
+ "se": {
+ "name": "Northern Sami",
+ "nativeName": "Davvisámegiella"
+ },
+ "sm": {
+ "name": "Samoan",
+ "nativeName": "gagana faa Samoa"
+ },
+ "sg": {
+ "name": "Sango",
+ "nativeName": "yângâ tî sängö"
+ },
+ "sr": {
+ "name": "Serbian",
+ "nativeName": "српски језик"
+ },
+ "gd": {
+ "name": "Scottish Gaelic; Gaelic",
+ "nativeName": "Gàidhlig"
+ },
+ "sn": {
+ "name": "Shona",
+ "nativeName": "chiShona"
+ },
+ "si": {
+ "name": "Sinhala, Sinhalese",
+ "nativeName": "සිංහල"
+ },
+ "sk": {
+ "name": "Slovak",
+ "nativeName": "slovenčina"
+ },
+ "sl": {
+ "name": "Slovene",
+ "nativeName": "slovenščina"
+ },
+ "so": {
+ "name": "Somali",
+ "nativeName": "Soomaaliga, af Soomaali"
+ },
+ "st": {
+ "name": "Southern Sotho",
+ "nativeName": "Sesotho"
+ },
+ "es": {
+ "name": "Spanish; Castilian",
+ "nativeName": "español, castellano"
+ },
+ "su": {
+ "name": "Sundanese",
+ "nativeName": "Basa Sunda"
+ },
+ "sw": {
+ "name": "Swahili",
+ "nativeName": "Kiswahili"
+ },
+ "ss": {
+ "name": "Swati",
+ "nativeName": "SiSwati"
+ },
+ "sv": {
+ "name": "Swedish",
+ "nativeName": "svenska"
+ },
+ "ta": {
+ "name": "Tamil",
+ "nativeName": "தமிழ்"
+ },
+ "te": {
+ "name": "Telugu",
+ "nativeName": "తెలుగు"
+ },
+ "tg": {
+ "name": "Tajik",
+ "nativeName": "тоҷикӣ, toğikī, تاجیکی"
+ },
+ "th": {
+ "name": "Thai",
+ "nativeName": "ไทย"
+ },
+ "ti": {
+ "name": "Tigrinya",
+ "nativeName": "ትግርኛ"
+ },
+ "bo": {
+ "name": "Tibetan Standard, Tibetan, Central",
+ "nativeName": "བོད་ཡིག"
+ },
+ "tk": {
+ "name": "Turkmen",
+ "nativeName": "Türkmen, Түркмен"
+ },
+ "tl": {
+ "name": "Tagalog",
+ "nativeName": "Wikang Tagalog, ᜏᜒᜃᜅ᜔ ᜆᜄᜎᜓᜄ᜔"
+ },
+ "tn": {
+ "name": "Tswana",
+ "nativeName": "Setswana"
+ },
+ "to": {
+ "name": "Tonga (Tonga Islands)",
+ "nativeName": "faka Tonga"
+ },
+ "tr": {
+ "name": "Turkish",
+ "nativeName": "Türkçe"
+ },
+ "ts": {
+ "name": "Tsonga",
+ "nativeName": "Xitsonga"
+ },
+ "tt": {
+ "name": "Tatar",
+ "nativeName": "татарча, tatarça, تاتارچا"
+ },
+ "tw": {
+ "name": "Twi",
+ "nativeName": "Twi"
+ },
+ "ty": {
+ "name": "Tahitian",
+ "nativeName": "Reo Tahiti"
+ },
+ "ug": {
+ "name": "Uighur, Uyghur",
+ "nativeName": "Uyƣurqə, ئۇيغۇرچە"
+ },
+ "uk": {
+ "name": "Ukrainian",
+ "nativeName": "українська"
+ },
+ "ur": {
+ "name": "Urdu",
+ "nativeName": "اردو"
+ },
+ "uz": {
+ "name": "Uzbek",
+ "nativeName": "zbek, Ўзбек, أۇزبېك"
+ },
+ "ve": {
+ "name": "Venda",
+ "nativeName": "Tshivenḓa"
+ },
+ "vi": {
+ "name": "Vietnamese",
+ "nativeName": "Tiếng Việt"
+ },
+ "vo": {
+ "name": "Volapük",
+ "nativeName": "Volapük"
+ },
+ "wa": {
+ "name": "Walloon",
+ "nativeName": "Walon"
+ },
+ "cy": {
+ "name": "Welsh",
+ "nativeName": "Cymraeg"
+ },
+ "wo": {
+ "name": "Wolof",
+ "nativeName": "Wollof"
+ },
+ "fy": {
+ "name": "Western Frisian",
+ "nativeName": "Frysk"
+ },
+ "xh": {
+ "name": "Xhosa",
+ "nativeName": "isiXhosa"
+ },
+ "yi": {
+ "name": "Yiddish",
+ "nativeName": "ייִדיש"
+ },
+ "yo": {
+ "name": "Yoruba",
+ "nativeName": "Yorùbá"
+ },
+ "za": {
+ "name": "Zhuang, Chuang",
+ "nativeName": "Saɯ cueŋƅ, Saw cuengh"
+ }
+ }
+ }
+ }
+ }
+
+</script>
diff --git a/28/minipedia/middleware/wiki-translations.js b/28/minipedia/middleware/wiki-translations.js
new file mode 100644
index 0000000..69831be
--- /dev/null
+++ b/28/minipedia/middleware/wiki-translations.js
@@ -0,0 +1,15 @@
+export default async function ({ store, route, $axios }) {
+ const path = route.params.id;
+ try {
+ const data = await $axios.$get('/api/wiki/langlinks/page/' + path);
+
+ data.push({
+ lang: 'en',
+ title: null,
+ url: 'https://en.wikipedia.org/w/api.php',
+ })
+ store.commit('setLangLinks', data);
+ } catch (e) {
+ console.error(e);
+ }
+}
diff --git a/28/minipedia/nuxt.config.js b/28/minipedia/nuxt.config.js
index 2fbe808..cd71ecf 100644
--- a/28/minipedia/nuxt.config.js
+++ b/28/minipedia/nuxt.config.js
@@ -69,7 +69,7 @@ module.exports = {
],
lazy: true,
langDir: 'lang/',
- defaultLocale: 'en'
+ fallbackLocale: 'en',
},
basic: {
name: process.env.USERNAME,
diff --git a/28/minipedia/pages/wiki/_id.vue b/28/minipedia/pages/wiki/_id.vue
index 7cfbb56..680e8ec 100644
--- a/28/minipedia/pages/wiki/_id.vue
+++ b/28/minipedia/pages/wiki/_id.vue
@@ -4,7 +4,7 @@
{{ $route.params.id }}
</h1>
- <span class="notice">From Wikipedia, the free encyclopedia</span>
+ <span class="notice"> {{ $t('Disclaimer') }} </span>
<FullInfoBox :content="$store.state.fullInfo.general" />
diff --git a/28/minipedia/store/index.js b/28/minipedia/store/index.js
index 2d8bd21..279a5b1 100644
--- a/28/minipedia/store/index.js
+++ b/28/minipedia/store/index.js
@@ -4,6 +4,7 @@ export const state = () => ({
summary: null,
rawImages: null,
mainImage: null,
+ langlinks: null,
})
export const mutations = {
@@ -22,4 +23,7 @@ export const mutations = {
setMainImage (state, text) {
state.mainImage = text
},
+ setLangLinks (state, text) {
+ state.langlinks = text
+ }
}
\ No newline at end of file