narayana/simple-translate
3
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Properly render Sõnaveeb in translate panel

Browse source
This commit is contained in:
Bohdan Horbeshko 2023-10-30 09:32:04 +02:00
parent 7d1cd83de7
commit 289f341029
3 changed files with 10 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/_locales/en/messages.json
View file

@ -453,7 +453,7 @@
"message": "Error: Authentication of DeepL API failed. Please set the authentication key and plan correctly on the settings page." "message": "Error: Authentication of DeepL API failed. Please set the authentication key and plan correctly on the settings page."
}, },
"sonaveebWordIdNotFound": { "sonaveebWordIdNotFound": {
"message": "Sõnaveeb word id not found" "message": "Word not found"
}, },
"unknownError": { "unknownError": {
"message": "Error: Unknown error" "message": "Error: Unknown error"

3
src/content/components/TranslateContainer.js
View file

@ -39,6 +39,7 @@ export default class TranslateContainer extends Component {
shouldShowPanel: false, shouldShowPanel: false,
panelPosition: { x: 0, y: 0 }, panelPosition: { x: 0, y: 0 },
currentLang: getSettings("targetLang"), currentLang: getSettings("targetLang"),
rawHTML: false,
resultText: "", resultText: "",
candidateText: "", candidateText: "",
isError: false, isError: false,
@ -96,6 +97,7 @@ export default class TranslateContainer extends Component {
this.setState({ this.setState({
shouldShowPanel: true, shouldShowPanel: true,
panelPosition: panelPosition, panelPosition: panelPosition,
rawHTML: result.rawHTML,
resultText: result.resultText, resultText: result.resultText,
candidateText: getSettings("ifShowCandidate") ? result.candidateText : "", candidateText: getSettings("ifShowCandidate") ? result.candidateText : "",
isError: result.isError, isError: result.isError,
@ -121,6 +123,7 @@ export default class TranslateContainer extends Component {
position={this.state.panelPosition} position={this.state.panelPosition}
selectedText={this.selectedText} selectedText={this.selectedText}
currentLang={this.state.currentLang} currentLang={this.state.currentLang}
rawHTML={this.state.rawHTML}
resultText={this.state.resultText} resultText={this.state.resultText}
candidateText={this.state.candidateText} candidateText={this.state.candidateText}
isError={this.state.isError} isError={this.state.isError}

10
src/content/components/TranslatePanel.js
View file

@ -163,7 +163,7 @@ export default class TranslatePanel extends Component {
}; };
render = () => { render = () => {
const { shouldShow, selectedText, currentLang, resultText, candidateText, isError, errorMessage } = this.props; const { shouldShow, selectedText, currentLang, rawHTML, resultText, candidateText, isError, errorMessage } = this.props;
const { width, height } = this.state.shouldResize const { width, height } = this.state.shouldResize
? { width: parseInt(getSettings("width")), height: parseInt(getSettings("height")) } ? { width: parseInt(getSettings("width")), height: parseInt(getSettings("height")) }
: { width: this.state.panelWidth, height: this.state.panelHeight }; : { width: this.state.panelWidth, height: this.state.panelHeight };
@ -193,12 +193,14 @@ export default class TranslatePanel extends Component {
ref="panel" ref="panel"
style={panelStyles} style={panelStyles}
> >
{translationApi === "sonaveeb" && ( <link rel="stylesheet" href="https://sonaveeb.ee/view/css/styles.css" /> )}
<div className="simple-translate-result-wrapper" ref="wrapper" style={wrapperStyles}> <div className="simple-translate-result-wrapper" ref="wrapper" style={wrapperStyles}>
<div className="simple-translate-move" draggable="true" ref="move"></div> <div className="simple-translate-move" draggable="true" ref="move"></div>
<div className="simple-translate-result-contents"> <div className="simple-translate-result-contents">
<p className="simple-translate-result" style={getResultFontColor()} dir="auto"> {rawHTML
{splitLine(resultText)} ? ( <p className="simple-translate-result" dir="auto" dangerouslySetInnerHTML={{__html: resultText}}></p> )
</p> : ( <p className="simple-translate-result" style={getResultFontColor()} dir="auto">{splitLine(resultText)}</p> )
}
<p className="simple-translate-candidate" style={getCandidateFontColor()} dir="auto"> <p className="simple-translate-candidate" style={getCandidateFontColor()} dir="auto">
{splitLine(candidateText)} {splitLine(candidateText)}
</p> </p>