From 6c8a8d58c7f01b2c0933049dc4f2884174fceb1a Mon Sep 17 00:00:00 2001 From: Antoine Nguyen Date: Sat, 31 Oct 2020 11:06:58 +0100 Subject: [PATCH] Added vue-gettext. --- frontend/Makefile | 57 ++ frontend/locale/en/LC_MESSAGES/app.po | 55 ++ frontend/locale/fr/LC_MESSAGES/app.po | 70 +++ frontend/package.json | 2 + .../src/components/domains/DomainList.vue | 14 +- .../src/components/layout/ConfirmDialog.vue | 4 +- frontend/src/components/layout/Navbar.vue | 10 +- frontend/src/components/layout/Topbar.vue | 2 +- frontend/src/main.js | 1 + frontend/src/plugins/vue-gettext.js | 15 + frontend/src/translations.json | 1 + frontend/yarn.lock | 587 +++++++++++++++++- 12 files changed, 796 insertions(+), 22 deletions(-) create mode 100644 frontend/Makefile create mode 100644 frontend/locale/en/LC_MESSAGES/app.po create mode 100644 frontend/locale/fr/LC_MESSAGES/app.po create mode 100644 frontend/src/plugins/vue-gettext.js create mode 100644 frontend/src/translations.json diff --git a/frontend/Makefile b/frontend/Makefile new file mode 100644 index 000000000..c138dcd7d --- /dev/null +++ b/frontend/Makefile @@ -0,0 +1,57 @@ +# On OSX the PATH variable isn't exported unless "SHELL" is also set, see: http://stackoverflow.com/a/25506676 +SHELL = /bin/bash +NODE_BINDIR = ./node_modules/.bin +export PATH := $(NODE_BINDIR):$(PATH) + +INPUT_DIR = src +# Where to write the files generated by this makefile. +OUTPUT_DIR = . + +# Available locales for the app. +LOCALES = en fr + +# Name of the generated .po files for each available locale. +LOCALE_FILES ?= $(patsubst %,$(OUTPUT_DIR)/locale/%/LC_MESSAGES/app.po,$(LOCALES)) + +GETTEXT_HTML_SOURCES = $(shell find $(INPUT_DIR) -name '*.vue' -o -name '*.html' 2> /dev/null) +GETTEXT_VUE_SOURCES = $(shell find $(INPUT_DIR) -name '*.vue') +GETTEXT_JS_SOURCES = $(shell find $(INPUT_DIR) -name '*.vue' -o -name '*.js') + +# Makefile Targets +.PHONY: clean makemessages translations + +clean: + rm -f /tmp/template.pot $(INPUT_DIR)/translations.json + +makemessages: /tmp/template.pot + +translations: ./$(INPUT_DIR)/translations.json + +# Create a main .pot template, then generate .po files for each available language. +# Thanx to Systematic: https://github.com/Polyconseil/systematic/blob/866d5a/mk/main.mk#L167-L183 +/tmp/template.pot: $(GETTEXT_HTML_SOURCES) +# `dir` is a Makefile built-in expansion function which extracts the directory-part of `$@`. +# `$@` is a Makefile automatic variable: the file name of the target of the rule. +# => `mkdir -p /tmp/` + mkdir -p $(dir $@) + which gettext-extract +# Extract gettext strings from templates files and create a POT dictionary template. + gettext-extract --quiet --output $@ $(GETTEXT_HTML_SOURCES) + gettext-extract --startDelimiter "" --endDelimiter "" --quiet --output $@ $(GETTEXT_VUE_SOURCES) +# Extract gettext strings from JavaScript files. + xgettext --language=JavaScript --keyword=npgettext:1c,2,3 \ + --from-code=utf-8 --join-existing --no-wrap \ + --package-name=$(shell node -e "console.log(require('./package.json').name);") \ + --package-version=$(shell node -e "console.log(require('./package.json').version);") \ + --output $@ $(GETTEXT_JS_SOURCES) +# Generate .po files for each available language. + @for lang in $(LOCALES); do \ + export PO_FILE=$(OUTPUT_DIR)/locale/$$lang/LC_MESSAGES/app.po; \ + echo "msgmerge --update $$PO_FILE $@"; \ + mkdir -p $$(dirname $$PO_FILE); \ + [ -f $$PO_FILE ] && msgmerge --lang=$$lang --update $$PO_FILE $@ || msginit --no-translator --locale=$$lang --input=$@ --output-file=$$PO_FILE; \ + msgattrib --no-wrap --no-obsolete -o $$PO_FILE $$PO_FILE; \ + done; + +$(INPUT_DIR)/translations.json: clean /tmp/template.pot + gettext-compile --output $@ $(LOCALE_FILES) diff --git a/frontend/locale/en/LC_MESSAGES/app.po b/frontend/locale/en/LC_MESSAGES/app.po new file mode 100644 index 000000000..f2d4500b8 --- /dev/null +++ b/frontend/locale/en/LC_MESSAGES/app.po @@ -0,0 +1,55 @@ +msgid "" +msgstr "" +"Project-Id-Version: \n" +"Report-Msgid-Bugs-To: \n" +"POT-Creation-Date: 2020-10-31 11:03+0100\n" +"Last-Translator: Automatically generated\n" +"Language-Team: none\n" +"Language: en\n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=UTF-8\n" +"Content-Transfer-Encoding: 8bit\n" +"Generated-By: easygettext\n" +"Plural-Forms: nplurals=2; plural=(n != 1);\n" + +#: src/components/layout/Navbar.vue:9 src/components/layout/Navbar.vue:71 +msgid "Dashboard" +msgstr "" + +#: src/components/domains/DomainList.vue:20 +#: src/components/domains/DomainList.vue:4 +msgid "Delete this domain" +msgstr "" + +#: src/components/domains/DomainList.vue:30 +#: src/components/domains/DomainList.vue:1 +msgid "Domain" +msgstr "" + +#: src/components/layout/Navbar.vue:13 src/components/layout/Navbar.vue:75 +msgid "Domains" +msgstr "" + +#: src/components/layout/Navbar.vue:18 src/components/layout/Navbar.vue:80 +msgid "Identities" +msgstr "" + +#: src/components/layout/Topbar.vue:6 src/components/layout/Topbar.vue:53 +msgid "Logout" +msgstr "" + +#: src/components/layout/Navbar.vue:23 src/components/layout/Navbar.vue:85 +msgid "Logs" +msgstr "" + +#: src/components/layout/ConfirmDialog.vue:10 +msgid "No" +msgstr "" + +#: src/components/layout/Navbar.vue:28 src/components/layout/Navbar.vue:90 +msgid "Parameters" +msgstr "" + +#: src/components/layout/ConfirmDialog.vue:13 +msgid "Yes" +msgstr "" diff --git a/frontend/locale/fr/LC_MESSAGES/app.po b/frontend/locale/fr/LC_MESSAGES/app.po new file mode 100644 index 000000000..6fb5c34b9 --- /dev/null +++ b/frontend/locale/fr/LC_MESSAGES/app.po @@ -0,0 +1,70 @@ +# SOME DESCRIPTIVE TITLE. +# Copyright (C) YEAR Free Software Foundation, Inc. +# FIRST AUTHOR , YEAR. +# +#, fuzzy +msgid "" +msgstr "" +"Project-Id-Version: PACKAGE VERSION\n" +"PO-Revision-Date: 2020-10-31 11:05+0100\n" +"Last-Translator: FULL NAME \n" +"Language-Team: LANGUAGE \n" +"MIME-Version: 1.0\n" +"Content-Type: text/plain; charset=CHARSET\n" +"Content-Transfer-Encoding: 8bit\n" + +#~ msgid "" +#~ msgstr "" +#~ "Project-Id-Version: \n" +#~ "Report-Msgid-Bugs-To: \n" +#~ "POT-Creation-Date: 2020-10-31 11:03+0100\n" +#~ "Last-Translator: Automatically generated\n" +#~ "Language-Team: none\n" +#~ "Language: fr\n" +#~ "MIME-Version: 1.0\n" +#~ "Content-Type: text/plain; charset=UTF-8\n" +#~ "Content-Transfer-Encoding: 8bit\n" +#~ "Generated-By: easygettext\n" +#~ "Plural-Forms: nplurals=2; plural=(n > 1);\n" + +#: src/components/layout/Navbar.vue:9 src/components/layout/Navbar.vue:71 +msgid "Dashboard" +msgstr "" + +#: src/components/domains/DomainList.vue:20 +#: src/components/domains/DomainList.vue:4 +msgid "Delete this domain" +msgstr "" + +#: src/components/domains/DomainList.vue:30 +#: src/components/domains/DomainList.vue:1 +msgid "Domain" +msgstr "" + +#: src/components/layout/Navbar.vue:13 src/components/layout/Navbar.vue:75 +msgid "Domains" +msgstr "" + +#: src/components/layout/Navbar.vue:18 src/components/layout/Navbar.vue:80 +msgid "Identities" +msgstr "" + +#: src/components/layout/Topbar.vue:6 src/components/layout/Topbar.vue:53 +msgid "Logout" +msgstr "" + +#: src/components/layout/Navbar.vue:23 src/components/layout/Navbar.vue:85 +msgid "Logs" +msgstr "" + +#: src/components/layout/ConfirmDialog.vue:10 +msgid "No" +msgstr "" + +#: src/components/layout/Navbar.vue:28 src/components/layout/Navbar.vue:90 +msgid "Parameters" +msgstr "" + +#: src/components/layout/ConfirmDialog.vue:13 +msgid "Yes" +msgstr "" diff --git a/frontend/package.json b/frontend/package.json index 913855ea0..e2e67f5a0 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -13,6 +13,7 @@ "js-cookie": "^2.2.1", "vue": "^2.6.11", "vue-cookie": "^1.1.4", + "vue-gettext": "^2.1.10", "vue-router": "^3.2.0", "vuetify": "^2.2.11", "vuex": "^3.4.0" @@ -29,6 +30,7 @@ "axios": "^0.18.0", "babel-eslint": "^10.1.0", "chai": "^4.1.2", + "easygettext": "^2.15.0", "eslint": "^6.7.2", "eslint-plugin-import": "^2.20.2", "eslint-plugin-node": "^11.1.0", diff --git a/frontend/src/components/domains/DomainList.vue b/frontend/src/components/domains/DomainList.vue index a5e95985b..8b5b83307 100644 --- a/frontend/src/components/domains/DomainList.vue +++ b/frontend/src/components/domains/DomainList.vue @@ -24,7 +24,11 @@ mdi-circle-edit-outline - + mdi-delete-outline @@ -34,13 +38,13 @@