Externalize i18n Strings, Replace jQuery and Bootstrap Icons.

* Replace material design icons with bootstrap icons (#209) * Externalize and translate some more strings (#267) * Replace some more jQuery jQuery (#201)
thsmi · May 7, 2020 · a669596 · a669596
1 parent 14fbb12
commit a669596
Show file tree

Hide file tree

Showing 71 changed files with 1,688 additions and 1,441 deletions.
diff --git a/gulp/gulpfile.app.js b/gulp/gulpfile.app.js
@@ -162,19 +162,6 @@ function packageBootstrap() {
  `${BUILD_DIR_APP}/libs/bootstrap`);
 }
 
-/**
- * Copies the material design icons into the build directory.
- *
- * @returns {Stream}
- * a stream to be consumed by gulp
- */
-function packageMaterialIcons() {
- "use strict";
-
- return common.packageMaterialIcons(
- `${BUILD_DIR_APP}/libs/material-icons`);
-}
-
 /**
  * Copies the source files into the app/ directory...
  *
@@ -465,7 +452,6 @@ exports["packageDefinition"] = packageDefinition;
 exports["packageJQuery"] = packageJQuery;
 exports["packageCodeMirror"] = packageCodeMirror;
 exports["packageBootstrap"] = packageBootstrap;
-exports["packageMaterialIcons"] = packageMaterialIcons;
 exports["packageLicense"] = packageLicense;
 exports["packageSrc"] = packageSrc;
 exports["packageCommon"] = packageCommon;
@@ -493,7 +479,6 @@ exports['package'] = parallel(
  packageJQuery,
  packageCodeMirror,
  packageBootstrap,
- packageMaterialIcons,
  packageLicense,
  packageSrc,
  packageCommon,

diff --git a/gulp/gulpfile.common.js b/gulp/gulpfile.common.js
@@ -129,24 +129,6 @@ function packageBootstrap(destination) {
  dest(destination));
 }
 
-/**
- * Copies the material design icons into the build directory.
- *
- * @param {string} destination
- * where to place the material design sources
- *
- * @returns {Stream}
- * a stream to be consumed by gulp
- */
-function packageMaterialIcons(destination) {
- "use strict";
-
- return src([
- BASE_DIR_MATERIALICONS + "/material-design-icons.css",
- BASE_DIR_MATERIALICONS + "/fonts/MaterialIcons-Regular.woff2"
- ], { base: BASE_DIR_MATERIALICONS }).pipe(dest(destination));
-}
-
 /**
  * Extracts the version from the package.json file
  *
@@ -410,7 +392,6 @@ exports["download"] = download;
 exports["packageJQuery"] = packageJQuery;
 exports["packageCodeMirror"] = packageCodeMirror;
 exports["packageBootstrap"] = packageBootstrap;
-exports["packageMaterialIcons"] = packageMaterialIcons;
 
 exports["getPackageVersion"] = getPackageVersion;
 exports["setPackageVersion"] = setPackageVersion;

diff --git a/gulp/gulpfile.wx.js b/gulp/gulpfile.wx.js
@@ -71,18 +71,6 @@ function packageBootstrap() {
  `${BUILD_DIR_WX}/libs/bootstrap`);
 }
 
-/**
- * Copies the material design icons into the build directory.
- * @returns {Stream}
- * a stream to be consumed by gulp
- */
-function packageMaterialIcons() {
- "use strict";
-
- return common.packageMaterialIcons(
- `${BUILD_DIR_WX}/libs/material-icons`);
-}
-
 /**
  * Copies the source files into the app/ directory...
  *
@@ -169,7 +157,6 @@ exports["updateVersion"] = updateVersion;
 exports["packageJQuery"] = packageJQuery;
 exports["packageCodeMirror"] = packageCodeMirror;
 exports["packageBootstrap"] = packageBootstrap;
-exports["packageMaterialIcons"] = packageMaterialIcons;
 exports["packageLicense"] = packageLicense;
 exports["packageSrc"] = packageSrc;
 exports["packageCommon"] = packageCommon;
@@ -178,7 +165,6 @@ exports['package'] = parallel(
  packageJQuery,
  packageCodeMirror,
  packageBootstrap,
- packageMaterialIcons,
  packageLicense,
  packageSrc,
  packageCommon

diff --git a/package.json b/package.json
@@ -17,7 +17,6 @@
  "gulp": "^4.0.0",
  "jquery": "~3.4.1",
  "keytar": "^5.4.0",
- "material-design-icons-iconfont": "^5.0.1",
  "tar": "^6.0.1",
  "yazl": "^2.5.1"
  },

diff --git a/src/common/libSieve/RFC5228/templates/SieveAddressPartAll.html b/src/common/libSieve/RFC5228/templates/SieveAddressPartAll.html
@@ -1,9 +1,6 @@
-<div id="test42">
+<div>
  <div class="dropdown-item" href="#" data-value=":all">
- <h5>... an email address with ...</h5>
- <small class="form-text text-muted">
- An email address consists of a domain an a local part split by the "@" sign.
- <br /> The local part is case sensitive while the domain part is not
- </small>
+ <h5 data-i18n="addresspart.all.title"></h5>
+ <small data-i18n="addresspart.all.text" class="form-text text-muted" style="white-space: pre-line"></small>
  </div>
 </div>
diff --git a/src/common/libSieve/RFC5228/templates/SieveAddressPartDomain.html b/src/common/libSieve/RFC5228/templates/SieveAddressPartDomain.html
@@ -1,9 +1,6 @@
-<div id="test42">
+<div>
  <div class="dropdown-item" href="#" data-value=":domain">
- <h5>... a domain part with ...</h5>
- <small class="form-text text-muted">
- Everything after the @ sign. The domain part is not case sensitive.
- <br /> e.g.: "me@example.com" is stripped to "example.com"
- </small>
+ <h5 data-i18n="addresspart.domain.text"></h5>
+ <small data-i18n="addresspart.domain.text" class="form-text text-muted" style="white-space: pre-line"></small>
  </div>
 </div>
diff --git a/src/common/libSieve/RFC5228/templates/SieveAddressPartLocal.html b/src/common/libSieve/RFC5228/templates/SieveAddressPartLocal.html
@@ -1,9 +1,6 @@
-<div id="test42">
+<div>
  <div class="dropdown-item" href="#" data-value=":localpart">
- <h5>... a local part with ...</h5>
- <small class="form-text text-muted">
- Everything before the @ sign. The local part is case sensitive.
- <br /> e.g.: "me@example.com" is stripped to "me"
- </small>
+ <h5 data-i18n="addresspart.local.title"></h5>
+ <small data-i18n="addresspart.local.text" class="form-text text-muted" style="white-space: pre-line"></small>
  </div>
 </div>
diff --git a/src/common/libSieve/RFC5228/templates/SieveAddressTestUI.html b/src/common/libSieve/RFC5228/templates/SieveAddressTestUI.html
@@ -1,21 +1,21 @@
 <div>
  <ul id="template-tabs">
  <li class="nav-item">
- <a class="nav-link active" data-toggle="tab" href="#sieve-widget-addresstest" role="tab">Address</a>
+ <a data-i18n="address.tab.home" class="nav-link active" data-toggle="tab" href="#sieve-widget-addresstest" role="tab"></a>
  </li>
  <li class="nav-item">
- <a class="nav-link" data-toggle="tab" href="#sieve-widget-advanced" role="tab">Advanced</a>
+ <a data-i18n="address.tab.advanced" class="nav-link" data-toggle="tab" href="#sieve-widget-advanced" role="tab"></a>
  </li>
  <li class="nav-item">
- <a class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab">Help</a>
+ <a data-i18n="address.tab.help" class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab"></a>
  </li>
  </ul>
 
  <div id="template-content">
  <div class="tab-content m-2">
  <div class="tab-pane fade show active" id="sieve-widget-addresstest" role="tabpanel">
  <div class="form-group">
- <h5>Any of the following header ... </h5>
+ <h5 data-i18n="address.headers"></h5>
 
  <div id="sivAddressHeaderList"
  data-list-dropdown="#sivAddressHeaderListTemplate">
@@ -37,7 +37,7 @@ <h5>Any of the following header ... </h5>
  <div id="sivAddressAddressPart"> </div>
  <hr />
 
- <h5>... any of the keyword(s):</h5>
+ <h5 data-i18n="address.keywords"></h5>
  <div id="sivAddressKeyList">
  </div>
 
@@ -46,12 +46,7 @@ <h5>... any of the keyword(s):</h5>
  <div class="tab-pane fade" id="sieve-widget-advanced" role="tabpanel">
  <div id="sivAddressComparator"> </div>
  </div>
- <div class="tab-pane fade" id="sieve-widget-help" role="tabpanel">
- <p>Compares headers against E-Mail addresses.</p>
- <p>You typically use test with headers like "to", "from", "cc" etc. </p>
- <p>As this test is aware of e-mail addresses containing display names. A header containing '"roadrunner" &lt;roadrunner@acme.example.com&gt;'
- is considered to be equivalent to "'roadrunner@acme.example.com"</p>
- <p>If the header should be matched against a string use the header test.</p>
+ <div data-i18n="address.help" class="tab-pane fade" id="sieve-widget-help" role="tabpanel" style="white-space: pre-line">
  </div>
  </div>
  </div>

diff --git a/src/common/libSieve/RFC5228/templates/SieveAllOfAnyOfOperator.html b/src/common/libSieve/RFC5228/templates/SieveAllOfAnyOfOperator.html
@@ -1,10 +1,10 @@
 <div>
  <ul id="template-tabs">
  <li class="nav-item">
- <a class="nav-link active" data-toggle="tab" href="#sieve-widget-allofanyof" role="tab">AllOf/AnyOf</a>
+ <a data-i18n="allofanyof.tab.home" class="nav-link active" data-toggle="tab" href="#sieve-widget-allofanyof" role="tab"></a>
  </li>
  <li class="nav-item">
- <a class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab">Help</a>
+ <a data-i18n="allofanyof.tab.help" class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab"></a>
  </li>
  </ul>
 
@@ -13,20 +13,20 @@
  <div class="tab-pane fade show active" id="sieve-widget-allofanyof" role="tabpanel">
 
  <div class="form-group">
- <label>Consider the test as successfull if ...</label>
+ <label data-i18n="allofanyof.label"></label>
 
  <div class="custom-control custom-radio">
  <input type="radio" id="SieveAllOf" name="allofanyof" value="true" class="custom-control-input" />
- <label class="custom-control-label" for="SieveAllOf">... all of the tests succeed</label>
+ <label data-i18n="allofanyof.allof" class="custom-control-label" for="SieveAllOf"></label>
  </div>
  <div class="custom-control custom-radio">
  <input type="radio" id="SieveAnyOf" name="allofanyof" value="false" class="custom-control-input" />
- <label class="custom-control-label" for="SieveAnyOf">... any of the tests succeed</label>
+ <label data-i18n="allofanyof.anyof" class="custom-control-label" for="SieveAnyOf"></label>
  </div>
  </div>
 
  </div>
- <div class="tab-pane fade" id="sieve-widget-help" role="tabpanel">
+ <div data-i18n="allofanyof.help" class="tab-pane fade" id="sieve-widget-help" role="tabpanel">
  </div>
  </div>
  </div>

diff --git a/src/common/libSieve/RFC5228/templates/SieveBooleanTest.html b/src/common/libSieve/RFC5228/templates/SieveBooleanTest.html
@@ -1,10 +1,11 @@
 <div>
  <ul id="template-tabs">
  <li class="nav-item">
- <a class="nav-link active" data-toggle="tab" href="#sieve-widget-test" role="tab">Boolean</a>
+ <a data-i18n="boolean.tab.home" class="nav-link active" data-toggle="tab" href="#sieve-widget-test"
+ role="tab"></a>
  </li>
  <li class="nav-item">
- <a class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab">Help</a>
+ <a data-i18n="boolean.tab.help" class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab"></a>
  </li>
  </ul>
 
@@ -13,23 +14,23 @@
  <div class="tab-pane fade show active" id="sieve-widget-test" role="tabpanel">
 
  <div class="form-group">
- <label>Make this test always </label>
+ <label data-i18n></label>
 
  <div class="custom-control custom-radio">
- <input type="radio" id="SieveBooleanTrue" name="booleanValue" value="test/boolean/true" class="custom-control-input" />
- <label class="custom-control-label" for="SieveBooleanTrue">succeed (true)</label>
+ <input type="radio" id="SieveBooleanTrue" name="booleanValue" value="test/boolean/true"
+ class="custom-control-input" />
+ <label data-i18n="boolean.true" class="custom-control-label" for="SieveBooleanTrue"></label>
  </div>
  <div class="custom-control custom-radio">
- <input type="radio" id="SieveBooleanFalse" name="booleanValue" value="test/boolean/false" class="custom-control-input" />
- <label class="custom-control-label" for="SieveBooleanFalse">fail (false)</label>
+ <input type="radio" id="SieveBooleanFalse" name="booleanValue" value="test/boolean/false"
+ class="custom-control-input" />
+ <label data-i18n="boolean.false" class="custom-control-label" for="SieveBooleanFalse"></label>
  </div>
  </div>
 
  </div>
- <div class="tab-pane fade" id="sieve-widget-help" role="tabpanel">
- <p>The boolean test is of limited practical use.
- If it is set to true it will always succeed. If set to false it will always fail</p>
+ <div data-i18n="boolean.help" class="tab-pane fade" id="sieve-widget-help" role="tabpanel">
  </div>
  </div>
  </div>
-</div>
+</div>
diff --git a/src/common/libSieve/RFC5228/templates/SieveComparatorAsciiCasemap.html b/src/common/libSieve/RFC5228/templates/SieveComparatorAsciiCasemap.html
@@ -1,16 +1,10 @@
 <div>
 
  <div class="custom-control custom-radio">
- <input type="radio" class="custom-control-input" name="sieve-comparator" id="sieve-comparator-ascii-casemap" value='"i;ascii-casemap"'
- />
- <label class="custom-control-label" for="sieve-comparator-ascii-casemap">
- Case insensitive (default)
- </label>
+ <input type="radio" class="custom-control-input" name="sieve-comparator" id="sieve-comparator-ascii-casemap" value='"i;ascii-casemap"'/>
+ <label data-i18n="comparator.asciicasemap.title" class="custom-control-label" for="sieve-comparator-ascii-casemap"></label>
  <div>
- <small class="form-text text-muted">
- Treats uppercase and lowercase ASCII characters as the same.<br/>
- All non ASCII characters are compared byte by byte.
- </small>
+ <small class="form-text text-muted" data-i18n="comparator.asciicasemap.text" style="white-space: pre-line"></small>
  </div>
  </div>
 

diff --git a/src/common/libSieve/RFC5228/templates/SieveComparatorAsciiNumeric.html b/src/common/libSieve/RFC5228/templates/SieveComparatorAsciiNumeric.html
@@ -1,15 +1,12 @@
 <div>
 
  <div class="custom-control custom-radio">
- <input type="radio" class="custom-control-input" name="sieve-comparator" id="sieve-comparator-ascii-numeric" value='"i;ascii-numeric"'
- />
- <label class="custom-control-label" for="sieve-comparator-ascii-numeric">
- Numeric
- </label>
+ <input type="radio" class="custom-control-input" name="sieve-comparator" id="sieve-comparator-ascii-numeric"
+ value='"i;ascii-numeric"' />
+ <label data-i18n="comparator.asciinumeric.title" class="custom-control-label"
+ for="sieve-comparator-ascii-numeric"></label>
  <div>
- <small class="form-text text-muted">
- Converts the string to an integer and does a numeric compare.
- </small>
+ <small class="form-text text-muted" data-i18n="comparator.asciinumeric.text"></small>
  </div>
  </div>
 

diff --git a/src/common/libSieve/RFC5228/templates/SieveComparatorOctet.html b/src/common/libSieve/RFC5228/templates/SieveComparatorOctet.html
@@ -1,15 +1,9 @@
 <div>
-
  <div class="custom-control custom-radio">
  <input type="radio" class="custom-control-input" name="sieve-comparator" id="sieve-comparator-octet" value='"i;octet"' />
- <label class="custom-control-label" for="sieve-comparator-octet">
- Case sensitive
- </label>
+ <label data-i18n="comparator.octet.title" class="custom-control-label" for="sieve-comparator-octet"></label>
  <div>
- <small class="form-text text-muted">
- Compares the string byte by byte.
- </small>
+ <small data-i18n="comparator.octet.text" class="form-text text-muted"></small>
  </div>
  </div>
-
 </div>