From dd4fee9951b78cb76529b4b53ce814e86a2c5adf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Francisco=20Javier=20Guzm=C3=A1n=20Jim=C3=A9nez?= <906599+javierguzman@users.noreply.github.com> Date: Mon, 28 Aug 2023 13:31:13 +0200 Subject: [PATCH] feat: add British layout, so Defy shows ISO English (#491) * feat: add British layout, so Defy shows ISO English * chore: added new flags images to the library --- src/api/keymap/db.js | 2 +- src/api/keymap/languages/newLanguageLayout.js | 2 +- .../modules/KeyPickerKeyboard/KeyPicker.js | 1 + .../modules/Settings/GeneralSettings.js | 99 ++++++++++-------- src/static/flags/englishUK.png | Bin 0 -> 1003 bytes src/static/flags/englishUS.png | Bin 0 -> 911 bytes 6 files changed, 59 insertions(+), 45 deletions(-) create mode 100644 src/static/flags/englishUK.png create mode 100644 src/static/flags/englishUS.png diff --git a/src/api/keymap/db.js b/src/api/keymap/db.js index afeb99b26..fa9ffd5ed 100644 --- a/src/api/keymap/db.js +++ b/src/api/keymap/db.js @@ -178,7 +178,7 @@ class KeymapDB { // Modify our baseKeyCodeTable, depending on the language selected by the static methods and by inside function newLanguageLayout baseKeyCodeTable = KeymapDB.updateBaseKeyCode(); const keyCodeTableWithModifiers = - this.language !== "english" && supportModifiedTables[this.language] + this.language !== "english" && this.language !== "british" && supportModifiedTables[this.language] ? defaultKeyCodeTable.concat(supportModifiedTables[this.language]) : defaultKeyCodeTable; // Modify our baseKeyCodeTable, depending on the language selected through function newLanguageLayout diff --git a/src/api/keymap/languages/newLanguageLayout.js b/src/api/keymap/languages/newLanguageLayout.js index 2991f3f25..a9949e236 100644 --- a/src/api/keymap/languages/newLanguageLayout.js +++ b/src/api/keymap/languages/newLanguageLayout.js @@ -22,7 +22,7 @@ * @param {newKeyCodeTable} newKeyCodeTable Key codes for new language */ function newLanguageLayout(baseKeyCodeTable, language = "english", newKeyCodeTable) { - if (language === "english") { + if (language === "english" || language === "british") { return baseKeyCodeTable; } return baseKeyCodeTable.map(group => { diff --git a/src/renderer/modules/KeyPickerKeyboard/KeyPicker.js b/src/renderer/modules/KeyPickerKeyboard/KeyPicker.js index 5794c6580..a77064fcd 100644 --- a/src/renderer/modules/KeyPickerKeyboard/KeyPicker.js +++ b/src/renderer/modules/KeyPickerKeyboard/KeyPicker.js @@ -399,6 +399,7 @@ class KeyPicker extends Component { const liso = { english: ENi, + british: ENi, spanish: ES, german: GR, french: FR, diff --git a/src/renderer/modules/Settings/GeneralSettings.js b/src/renderer/modules/Settings/GeneralSettings.js index 905289d93..4ec3e4360 100644 --- a/src/renderer/modules/Settings/GeneralSettings.js +++ b/src/renderer/modules/Settings/GeneralSettings.js @@ -1,5 +1,6 @@ import PropTypes from "prop-types"; import React, { Component } from "react"; +import Styled from "styled-components"; // React Bootstrap Components import Card from "react-bootstrap/Card"; @@ -17,7 +18,8 @@ import germanF from "@Assets/flags/germany.png"; import japaneseF from "@Assets/flags/japan.png"; import koreanF from "@Assets/flags/korean.png"; import spanishF from "@Assets/flags/spain.png"; -import englishUSUKF from "@Assets/flags/english.png"; +import englishUSF from "@Assets/flags/englishUS.png"; +import englishUKF from "@Assets/flags/englishUK.png"; import danishF from "@Assets/flags/denmark.png"; import swedishF from "@Assets/flags/sweden.png"; import finnishF from "@Assets/flags/finland.png"; @@ -35,6 +37,12 @@ import i18n from "../../i18n"; import Store from "../../utils/Store"; +const GeneraslSettihngsWrapper = Styled.div` +.dropdown-menu { + min-width: 13rem; +} +`; + const store = Store.getStore(); export default class GeneralSettings extends Component { @@ -67,8 +75,9 @@ export default class GeneralSettings extends Component { const { selectDarkMode, darkMode, neurons, selectedNeuron, connected, defaultLayer, selectDefaultLayer } = this.props; const { selectedLanguage } = this.state; let layersNames = neurons[selectedNeuron] ? neurons[selectedNeuron].layers : []; - let flags = [ - englishUSUKF, + const flags = [ + englishUSF, + englishUKF, spanishF, germanF, frenchF, @@ -84,6 +93,7 @@ export default class GeneralSettings extends Component { ]; let language = [ "english", + "british", "spanish", "german", "french", @@ -97,8 +107,9 @@ export default class GeneralSettings extends Component { "swissGerman", "eurkey", ]; - let languageNames = [ - "English", + const languageNames = [ + "English US", + "English UK", "Spanish", "German", "French", @@ -116,7 +127,7 @@ export default class GeneralSettings extends Component { text: languageNames[index], value: item, icon: flags[index], - index + index, })); layersNames = layersNames.map((item, index) => ({ @@ -148,43 +159,45 @@ export default class GeneralSettings extends Component { ]; return ( - - - } /> - </Card.Title> - <Card.Body> - <Form> - <Row> - <Col lg={6} md={12}> - <Form.Group controlId="selectLanguage" className="mb-3"> - <Form.Label>{i18n.preferences.language}</Form.Label> - <Select onSelect={this.changeLanguage} value={selectedLanguage} listElements={language} /> - </Form.Group> - </Col> - <Col lg={6} md={12}> - <Form.Group controlId="defaultLayer" className="mb-3"> - <Form.Label>{i18n.keyboardSettings.keymap.defaultLayer}</Form.Label> - <Select onSelect={selectDefaultLayer} value={defaultLayer} listElements={layersNames} disabled={!connected} /> - </Form.Group> - </Col> - </Row> - <Row> - <Col md={12}> - <Form.Group controlId="DarkMode" className="m-0"> - <Form.Label>{i18n.preferences.darkMode.label}</Form.Label> - <ToggleButtons - selectDarkMode={selectDarkMode} - value={darkMode} - listElements={layoutsModes} - style="flex" - size="sm" - /> - </Form.Group> - </Col> - </Row> - </Form> - </Card.Body> - </Card> + <GeneraslSettihngsWrapper> + <Card className="overflowFix card-preferences mt-4"> + <Card.Title> + <Title text={i18n.keyboardSettings.keymap.title} headingLevel={3} svgICO={<IconWrench />} /> + </Card.Title> + <Card.Body> + <Form> + <Row> + <Col lg={6} md={12}> + <Form.Group controlId="selectLanguage" className="mb-3"> + <Form.Label>{i18n.preferences.language}</Form.Label> + <Select onSelect={this.changeLanguage} value={selectedLanguage} listElements={language} /> + </Form.Group> + </Col> + <Col lg={6} md={12}> + <Form.Group controlId="defaultLayer" className="mb-3"> + <Form.Label>{i18n.keyboardSettings.keymap.defaultLayer}</Form.Label> + <Select onSelect={selectDefaultLayer} value={defaultLayer} listElements={layersNames} disabled={!connected} /> + </Form.Group> + </Col> + </Row> + <Row> + <Col md={12}> + <Form.Group controlId="DarkMode" className="m-0"> + <Form.Label>{i18n.preferences.darkMode.label}</Form.Label> + <ToggleButtons + selectDarkMode={selectDarkMode} + value={darkMode} + listElements={layoutsModes} + style="flex" + size="sm" + /> + </Form.Group> + </Col> + </Row> + </Form> + </Card.Body> + </Card> + </GeneraslSettihngsWrapper> ); } } diff --git a/src/static/flags/englishUK.png b/src/static/flags/englishUK.png new file mode 100644 index 0000000000000000000000000000000000000000..8c53fc7b726ab773b12df066ce75d5881cfbfed4 GIT binary patch literal 1003 zcmV<H0~Gv;P)<h;3K|Lk000e1NJLTq000;O000;W1^@s6;CDUv00009a7bBm000XU z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1As|HK~#7FwN`sb zQ&AlL?(y!?%&8Rym0?9$L6&6%Y9u|Zm|#VL1-;Nnt>|5=9NV(gUX);t=xKo#L=+Zb z2}))DQ`yrV|0s+8$V_KT+nl?%bMBmTwoMKE;ND%%@0{=Z{mwbxIRgS<^ybQmQJGbG zi^Wp)HB0~F6QV`-n78U$Sli4!)km@7VN@Uv-e)TvBv%L*zPH(u$B$CF+JcBDF5|=L zJE_&$l?39{kyQ__3j)#O?()XIRHSdi%_j|6T#&P_(;+5ffDj;V01@g+OP*>23VhR^ z(JzY$FE*u53F9yraJZ794x6jf<ueYS0!+Q5wA}E!;3CrEBVfvyf`N%}C|WWc^9?!- zTbF`hZMxxJtvS<MfX?~)@-|(?VI%&OKEPl^Xy#a&ub0S&Yco*xya}nN-sZa(Us_~B z1fx@cYWpKAim1raJXe)z+AWA2sqjmFc2O{54jl53*EAvf$`=+23m%4|b|8f?C25hm z!9;pjk`Nv0S76rhJg>|dxhT3~?RKYT?6%60{Ip1Udb?fp8hG-R1EIOc5P$jvg2s=b zBpROrs;o3AR`a<H`FG8<TBTQ<IK>@&ZSI^zzbU5PKp?n<S(R^3#`)^9fMc%gHcmh| zp1p$O^(X0DHft(miL?6~0?sKkbIke}LJ$lwcvbe=CJ-*7zmESiMR0Vr^6I=@_4Kn} z0c%d7M}U&6kL|<&@P>~&{Ia^UOHAtBs*)4x;>n1O3ZZ_uFYR?-U|#7km7#W@7DsAq z=)0JqDpF45GWk_=vkjidj-AWLN#x9E9j04;(_`CIp-I9#T@Log%HYjo!@EZN9a3L7 z->j683fB-0w|7s++Jp#+oMrfY-$B0ubq!X@#jHYh9-Utj(ksecWA}r!i)?l-Gg!%6 zO0uJ|ct&^+dBq_ka%k!Pu+j8cIwIU6$xI|U1Uye#AP^(#<JzWF>2k*8BdKwtyvTP{ zS`pABG?;bi3+}!6=@Fp^Wm$?k*L}P7_#kcJq+)BqMWdU1`(ta*!POr&7Juv!QLfV% z*K9~U=Z<+9EwW(0;r;QvU3;tBtr#Szh^6X7Yc}KP-Tsf0SFVpQwA;BDntlle2nA1W zLkNmpnJ~fBH|G0ag=_vc(YwN+kaMf)w?=ey&7{AsLs1Z$=(}FdlPY!ih@xMY<6Gbd Ze*s-sg7;=r1@Zs@002ovPDHLkV1j9f-|GMX literal 0 HcmV?d00001 diff --git a/src/static/flags/englishUS.png b/src/static/flags/englishUS.png new file mode 100644 index 0000000000000000000000000000000000000000..bfe630a84a1f8077ae2572d5879f29aad000e9d9 GIT binary patch literal 911 zcmV;A191F_P)<h;3K|Lk000e1NJLTq000;O000;W1^@s6;CDUv00009a7bBm000XU z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH10+dAK~#7FwUv8F zQ&AkpzxR6FY!2sUWLe3rh@KQhL{WcCDk>@p6Dy;l{L9`Tfd<hmdqMuAm48I#A6XQY zg_@;8LYN_yp*BtP(F{$e+nqWeyLa8rz2++Ov5|h@aGt*h=l46m!(bFb4;Ie0b_x3o zT0bN26c&qaX)=F%t-RGvTP1CUk|bs7_4>w<bg;uMCfq6G!eaAZ_6lO%41>QZe#;DF zm|i{kk0bKfNLw<)FbxieBg1aDbHnLkhA!|tA6NCwd2#cV%3$g>F726(*obLZpZpQ! z7AIQPJBHH($tCcvg5nEY?#-(s8;Hz3yJeZdq}LMMech@ot(qGImnfmVOMs=l57kfN zF&Ydc(>&B94bDAR6tF8Vf%;*pXmTR^eTPTjZEYtsDppbM4H6jBm!RcGe;bt9oyW0) z`_rPCff`d32bDjIBe!Z5ua9q<j+ix5aOPnHp1tcpeOu<(RtVwsS*gq9;1hYinhP|Q z)O2bp=pDB@1gHt)@mTK5Ej=hQ58S;WCmmi8%(83>?RPTRk;j2`Hw^CRGz5Wa7R`3o zfHN$EzyLpG?C25kD^0zEW>^R*Pg%ZyZ<-mh_p<VcMZpkgP@Vk_dY{x4x)!$~4Cw{U ziUGH!#cKmp!7&mZqK=4J6N*GjJ%T0?oQvjQ?-o&#(g|C)fQ0SgI217z_lsL$p)%Gb zJKzIG5}8uDw7bu(%$hp-ka({F2AZa_a+wEj+K^Rh1>fU_uQ0@KF@wk)$rquq-oZac z=*#uVfUmGL(mq7ZXWCg>4L@Vzs3g`E(M52%jF<>?+H9t7;kIzWT=NwZ0If^2*g58G z3)KGk7-wja%UFQwMy1$QVLlh~G_4H8FBszh{Tr-5N<XZeb~&-p^B>r3w!^eQUB@^; zGxLN_r%RQ`p8vpLFx;RSm4yF9)-kADF*fwT_s7pqx?U8Ymz=#?_=1Y?0bAFd4vpIQ zS3PHjJ1fV8b|(7$9e_8eRga{8;glTIp<B#oa<U<oke!k!ZlwvZ6r!kCga~PqM7Nny l`M=TxXs^xeEU}HG<0k?PIvUf=E%yKb002ovPDHLkV1inFp+f)w literal 0 HcmV?d00001