Skip to content

Commit

Permalink
feat: fetch ui5-datepicker assets from CDN (#420)
Browse files Browse the repository at this point in the history 
- the CLDR data is fetched by default from the ui5 CDN
- no more JSON imports when importing ui5-datepicker
- still available as CLDRAssets.js if apps want to bundle the CLDR data
with a build plugin
  • Loading branch information
@pskelin
pskelin authored May 22, 2019
1 parent 1696cef commit 1f62dda
Show file tree
Hide file tree
Showing 10 changed files with 5,088 additions and 178 deletions.
213 changes: 42 additions & 171 deletions packages/base/src/CLDR.js
View file
Original file line number Diff line number Diff line change
@@ -1,166 +1,14 @@
/* eslint-disable camelcase */
import ar from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ar.json";
import ar_EG from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ar_EG.json";
import ar_SA from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ar_SA.json";
import bg from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/bg.json";
import ca from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ca.json";
import cs from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/cs.json";
import da from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/da.json";
import de from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/de.json";
import de_AT from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/de_AT.json";
import de_CH from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/de_CH.json";
import el from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/el.json";
import el_CY from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/el_CY.json";
import en from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en.json";
import en_AU from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_AU.json";
import en_GB from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_GB.json";
import en_HK from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_HK.json";
import en_IE from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_IE.json";
import en_IN from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_IN.json";
import en_NZ from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_NZ.json";
import en_PG from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_PG.json";
import en_SG from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_SG.json";
import en_ZA from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/en_ZA.json";
import es from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es.json";
import es_AR from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_AR.json";
import es_BO from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_BO.json";
import es_CL from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_CL.json";
import es_CO from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_CO.json";
import es_MX from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_MX.json";
import es_PE from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_PE.json";
import es_UY from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_UY.json";
import es_VE from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/es_VE.json";
import et from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/et.json";
import fa from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fa.json";
import fi from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fi.json";
import fr from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fr.json";
import fr_BE from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fr_BE.json";
import fr_CA from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fr_CA.json";
import fr_CH from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fr_CH.json";
import fr_LU from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/fr_LU.json";
import he from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/he.json";
import hi from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/hi.json";
import hr from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/hr.json";
import hu from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/hu.json";
import id from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/id.json";
import it from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/it.json";
import it_CH from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/it_CH.json";
import ja from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ja.json";
import kk from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/kk.json";
import ko from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ko.json";
import lt from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/lt.json";
import lv from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/lv.json";
import ms from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ms.json";
import nb from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/nb.json";
import nl from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/nl.json";
import nl_BE from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/nl_BE.json";
import pl from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/pl.json";
import pt from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/pt.json";
import pt_PT from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/pt_PT.json";
import ro from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ro.json";
import ru from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ru.json";
import ru_UA from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/ru_UA.json";
import sk from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/sk.json";
import sl from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/sl.json";
import sr from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/sr.json";
import sv from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/sv.json";
import th from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/th.json";
import tr from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/tr.json";
import uk from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/uk.json";
import vi from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/vi.json";
import zh_CN from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_CN.json";
import zh_HK from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_HK.json";
import zh_SG from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_SG.json";
import zh_TW from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_TW.json";

import { registerModuleContent } from "./ResourceLoaderOverrides.js";
import { fetchTextOnce } from "./util/FetchHelper.js";

const cldrData = {
ar,
ar_EG,
ar_SA,
bg,
ca,
cs,
da,
de,
de_AT,
de_CH,
el,
el_CY,
en,
en_AU,
en_GB,
en_HK,
en_IE,
en_IN,
en_NZ,
en_PG,
en_SG,
en_ZA,
es,
es_AR,
es_BO,
es_CL,
es_CO,
es_MX,
es_PE,
es_UY,
es_VE,
et,
fa,
fi,
fr,
fr_BE,
fr_CA,
fr_CH,
fr_LU,
he,
hi,
hr,
hu,
id,
it,
it_CH,
ja,
kk,
ko,
lt,
lv,
ms,
nb,
nl,
nl_BE,
pl,
pt,
pt_PT,
ro,
ru,
ru_UA,
sk,
sl,
sr,
sv,
th,
tr,
uk,
vi,
zh_CN,
zh_HK,
zh_SG,
zh_TW,
};
const supportedLocales = ["ar", "ar_EG", "ar_SA", "bg", "ca", "cs", "da", "de", "de_AT", "de_CH", "el", "el_CY", "en", "en_AU", "en_GB", "en_HK", "en_IE", "en_IN", "en_NZ", "en_PG", "en_SG", "en_ZA", "es", "es_AR", "es_BO", "es_CL", "es_CO", "es_MX", "es_PE", "es_UY", "es_VE", "et", "fa", "fi", "fr", "fr_BE", "fr_CA", "fr_CH", "fr_LU", "he", "hi", "hr", "hu", "id", "it", "it_CH", "ja", "kk", "ko", "lt", "lv", "ms", "nb", "nl", "nl_BE", "pl", "pt", "pt_PT", "ro", "ru", "ru_UA", "sk", "sl", "sr", "sv", "th", "tr", "uk", "vi", "zh_CN", "zh_HK", "zh_SG", "zh_TW"];

const allEntriesInlined = Object.entries(cldrData).every(([_key, value]) => typeof (value) === "object");
/* eslint-disable */
if (allEntriesInlined) {
console.warn(`Inefficient bundling detected: consider bundling CLDR imports as URLs instead of inlining them.
See rollup-plugin-url or webpack file-loader for more information.
Suggested pattern: "cldr\\\/.*\\\.json"`);
}
/* eslint-enable */
const cldrData = {};
const cldrUrls = {};

// externally configurable mapping function for resolving (localeId -> URL)
// default implementation - ui5 CDN
let cldrMappingFn = locale => `https://ui5.sap.com/1.60.2/resources/sap/ui/core/cldr/${locale}.json`;

const M_ISO639_OLD_TO_NEW = {
"iw": "he",
Expand All @@ -187,36 +35,59 @@ const calcLocale = (language, region, script) => {

// try language + region
let localeId = `${language}_${region}`;
if (!cldrData[localeId]) {
if (!supportedLocales.includes(localeId)) {
// fallback to language only
localeId = language;
}
if (!cldrData[localeId]) {
if (!supportedLocales.includes(localeId)) {
// fallback to english
localeId = "en";
}

return localeId;
};


const resolveMissingMappings = () => {
if (!cldrMappingFn) {
return;
}

const missingLocales = supportedLocales.filter(locale => !cldrData[locale] && !cldrUrls[locale]);
missingLocales.forEach(locale => {
cldrUrls[locale] = cldrMappingFn(locale);
});
};

const fetchCldrData = async (language, region, script) => {
resolveMissingMappings();
const localeId = calcLocale(language, region, script);

if (typeof (cldrData[localeId]) === "object") {
// inlined from build
registerModuleContent(`sap/ui/core/cldr/${localeId}.json`, JSON.stringify(cldrData[localeId]));
return cldrData[localeId];
const cldrObj = cldrData[localeId];
const url = cldrUrls[localeId];

if (cldrObj) {
// inlined from build or fetched independently
registerModuleContent(`sap/ui/core/cldr/${localeId}.json`, JSON.stringify(cldrObj));
} else if (url) {
// fetch it
const cldrText = await fetchTextOnce(url);
registerModuleContent(`sap/ui/core/cldr/${localeId}.json`, cldrText);
}
};

const localeUrl = cldrData[localeId];
const registerCldrUrl = (locale, url) => {
cldrUrls[locale] = url;
};

const cldrContent = await fetchTextOnce(localeUrl);
registerModuleContent(`sap/ui/core/cldr/${localeId}.json`, cldrContent);
const registerCldrData = (locale, data) => {
cldrData[locale] = data;
};

const registerCldrUrl = (locale, url) => {
cldrData[locale] = url;
const _registerMappingFunction = mappingFn => {
cldrMappingFn = mappingFn;
};

export { fetchCldrData, registerCldrUrl };
/* eslint-enable camelcase */
export {
fetchCldrData, registerCldrUrl, registerCldrData, _registerMappingFunction,
};
16 changes: 15 additions & 1 deletion packages/base/src/RenderScheduler.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,21 @@ class RenderScheduler {
/**
* return a promise that will be resolved once all ui5 webcomponents on the page have their shadow root ready
*/
static whenShadowDOMReady() {
static async whenShadowDOMReady() {
const undefinedElements = document.querySelectorAll(":not(:defined)");

const definedPromises = [...undefinedElements].map(
el => customElements.whenDefined(el.localName)
);
const timeoutPromise = new Promise(resolve => setTimeout(resolve, 5000));

await Promise.race([Promise.all(definedPromises), timeoutPromise]);
const stillUndefined = document.querySelectorAll(":not(:defined)");
if (stillUndefined.length) {
// eslint-disable-next-line
console.warn("undefined elements after 5 seconds: ", [...stillUndefined].map(el => el.localName));
}

// TODO: track promises internally, the dom traversal is a POC only
const ui5Components = Array.from(document.querySelectorAll("*")).filter(_ => _._shadowRootReadyPromise);
return Promise.all(ui5Components.map(comp => comp._whenShadowRootReady()))
Expand Down
6 changes: 6 additions & 0 deletions packages/base/src/ResourceLoaderOverrides.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,12 @@ sap.ui.loader._.getModuleContent = (moduleName, url) => {
return getModulecontentOrig(moduleName, url);
}

const missingModule = moduleName.match(/sap\/ui\/core\/cldr\/(\w+)\.json/);

if (missingModule) {
throw new Error(`CLDR data for locale ${missingModule[1]} is not loaded!`);
}

return "";
};

Expand Down
Loading

0 comments on commit 1f62dda

Please sign in to comment.