diff --git a/src/App.js b/src/App.js
index 0689055..0b94df4 100644
--- a/src/App.js
+++ b/src/App.js
@@ -11,10 +11,10 @@ import empty_1x1 from './empty_1x1.png'
import 'intl-pluralrules'
import { AppLocalizationProvider } from './l10n.js'
-import { Localized } from './Localized.js'
+import { withLocalization, Localized } from './Localized.js'
-// const userLocales = ['de'] || navigator.languages
-const userLocales = navigator.languages
+const userLocales = ['de'] || navigator.languages
+// const userLocales = navigator.languages
const frameSize = 1080
@@ -73,7 +73,7 @@ function trigger_download(name, data){
a.remove()
}
-function App() {
+function App({ getString }) {
const [frameURL, setFrameURL] = useState(null)
const [hashtagURL, setHashtagURL] = useState(null)
const [originalPhoto, setOriginalPhoto] = useState(null)
@@ -285,30 +285,33 @@ function App() {
return (
-
- Drop your photo here ...
+
-
-
It should best be a square image or your face in the middle. The photo is not saved and never leaves your computer.
+
+
+
+
{!!originalPhoto ? (<>
+
+
>) : null}
{!!originalPhoto && !!frameURL ? (<>
-
Reposition your Photo:
+
{/*
Edit your Photo:
Your can reposition the image and scale it. Use pinch-to-zoom or scroll to scale.
@@ -322,19 +325,32 @@ function App() {
onChange={handleCordsChange}
/>
-
+
>) : null}
-
)
}
+const AppLocalized = withLocalization(App)
+
+
+function AppWrapper() {
+ return
+
+
+}
+export default withLocalization(AppWrapper)
-export default App
diff --git a/src/FrameChooser.js b/src/FrameChooser.js
index 7d4fc3f..57a543a 100644
--- a/src/FrameChooser.js
+++ b/src/FrameChooser.js
@@ -42,7 +42,6 @@ function FrameChooser({onChange}) {
return (
-
Choose a frame:
{
frames.map(frame => {
const frame_src_path = frame.src.default
diff --git a/src/HashtagChooser.js b/src/HashtagChooser.js
index 2985101..87f58fb 100644
--- a/src/HashtagChooser.js
+++ b/src/HashtagChooser.js
@@ -1,6 +1,7 @@
import { useState, useEffect, useCallback } from 'react'
+import { withLocalization } from './Localized.js'
-function HashtagChooser({ onChange }) {
+function HashtagChooser({ onChange, getString }) {
const [frames, setFrames] = useState([])
const [choosenFrame, setChoosenFrame] = useState(null)
@@ -46,13 +47,12 @@ function HashtagChooser({ onChange }) {
return (
-
Choose a Hashtag:
{
frames.map(frame => {
const frame_src_path = frame.src.default
const isChoosen = choosenFrame === frame_src_path
return
})
}
@@ -60,4 +60,4 @@ function HashtagChooser({ onChange }) {
)
}
-export default HashtagChooser
+export default withLocalization(HashtagChooser)
diff --git a/src/locales/de.ftl b/src/locales/de.ftl
index 9f6779a..b7f8c46 100644
--- a/src/locales/de.ftl
+++ b/src/locales/de.ftl
@@ -1 +1,18 @@
-choose_your_photo = Wähl dein Bild:
+
+title_drop_photo_here = Leg hier dein Foto ab ...
+title_choose_photo = Wähl Dein Foto:
+text_choose_photo_info = Das Foto wird nicht gespeichert und verlässt nie Deinen Computer.
+button_load_photo = Foto auswählen
+button_change_photo = Foto ändern
+
+title_choose_frame = Wähl einen Rahmen:
+
+title_choose_hashtag = Wähl einen Hashtag:
+button_no_hashtag = Kein Hashtag
+
+title_reposition_photo = Foto bearbeiten:
+button_download = Profilbild herunterladen
+
+link_imprint = Impressum
+link_privacy_policy = Datenschutz
+link_source_code = Quellcode
diff --git a/src/locales/en.ftl b/src/locales/en.ftl
index 50aa551..716c631 100644
--- a/src/locales/en.ftl
+++ b/src/locales/en.ftl
@@ -1 +1,18 @@
-choose_your_photo = Choose your Photo:
+
+title_drop_photo_here = Drop your photo here ...
+title_choose_photo = Choose your Photo:
+text_choose_photo_info = The photo is not saved and never leaves your computer.
+button_load_photo = Load Photo
+button_change_photo = Change Photo
+
+title_choose_frame = Choose a frame:
+
+title_choose_hashtag = Choose a hashtag:
+button_no_hashtag = No Hashtag
+
+title_reposition_photo = Reposition your photo:
+button_download = Download Profile Picture
+
+link_imprint = Imprint
+link_privacy_policy = Privacy Policy
+link_source_code = Source Code