Our pure JavaScript Scheduler component


Post by rafal »

  1. Is it possible to keep localization data in json file so it could be changed without rebuilding project?

  2. I would like to use your localization for other controls, not only Scheduler. Is it possible to use it directly in Angular html component file? Is it possible to use translation keys like L("SomeMainFeature.SomeFeature.SomeTranslation") where SomeMainFeature, SomeFeature, SomeTranslation are nested properties?

  3. How to change language of bryntum-combo without reloading page? Do you have any example of translation using combo? You have provided example https://www.bryntum.com/forum/viewtopic.php?p=86765#p86775 - is it still valid or is it fixed?

  4. The locale contains localized format for each header of preset (for example: PresetManager.<PresetName>.topDateFormat). But it works only after changing locale to different one (I mean initially I load a locale and then at runtime I change it). Before change the header of scheduler shows format based on current ViewPreset and its ViewPresetHeaderRow.dateFormat. After changing locale the header shows correct header formatted using format from locale.
    Is it the desired behavior?
    Do you have an example of loading and changing locales and ViewPresets? Your localization demo (https://www.bryntum.com/products/schedulerpro/examples/localization/) does not contain any call to publishLocale nor applyLocale which are described in documentation. I am confused about the usage.


Post by alex.l »

  1. Yes, there is no constraints from the library for that. Just import the file from a place you need and apply localization.

  2. Not sure I got the question. We are implemented localization support for our components, not for any other custom framework related components. You can implement your own mechanisms and use same localization file and locale string format for Angular.

  3. It's not fixed. You'll need to use a workaround provided.

  4. viewPreset config in the Scheduler may contain any config you want and it won't be placed into presets list of the Scheduler, it'll be used only for initial init. You also can use one of existed presets, if you provide only id in that config and won't override headers.
    https://bryntum.com/products/scheduler/docs/api/Scheduler/view/Scheduler#config-viewPreset
    https://bryntum.com/products/scheduler/docs/api/Scheduler/view/Scheduler#config-presets
    https://bryntum.com/products/scheduler/docs/api/Scheduler/preset/PresetManager

Do you have an example of loading and changing locales and ViewPresets?

The demo you mentioned is an example of localization.
For ViewPresets we have https://bryntum.com/products/scheduler/examples/configuration/

does not contain any call to publishLocale nor applyLocale which are described in documentation. I am confused about the usage.

Did you see our Localization guide and docs?
https://bryntum.com/products/scheduler/docs/guide/Scheduler/customization/localization
https://bryntum.com/products/scheduler/docs/api/Core/localization/LocaleHelper#function-publishLocale-static
https://bryntum.com/products/scheduler/docs/api/Core/localization/LocaleManager#function-applyLocale

All the best,
Alex


Post by rafal »

Thank you for quick answer!

  1. So I assume you do not provide any mechanism supporting this?

  2. How to translate text in following example:

        <bryntum-button icon="b-fa b-fa-sync-alt"
          text="labelToTranslate">
        </bryntum-button>
    

    Is it supported by Bryntum?

  3. The demo you provided also does not contain any localization configurations in conjunction with viewPreset. I have seen this all guides but none of them solves the problem. I will try to describe the issue again:

a) application loads the default locale (using LocaleHelper.publishLocale and LocaleManager.applyLocale methods) with configuration:

...
    "PresetManager": 
        "day": 
            "displayDateFormat": "ll LST",
            "topDateFormat": "ddd DD.MM, t. WW",
            "middleDateFormat": "LST"
        ...
    ,
...

b) application loads the default preset

...
  
"id": "day", ... "headers": [
"increment": 1, "unit": "day" , "increment": 1, "unit": "hour" "align": "start" ], ...(deleted curly braces because not supported by forum editor)

c) the scheduler shows header: "2023-06-06T11:00:00+02:00" but should show date using formats from locale.
d) user changes locale to different one
e) the scheduler shows header with correct date formatted using newly loaded locale

Do you confirm it is by design? How to load scheduler using format from locale?


Post by alex.l »

  1. Correct.
  2. Please check localization demo in examples-scheduler/frameworks/react/javascript/localization folder of sources you downloaded in CustomerZone. It shows how to use localization in React components.
  3. could you please attach a test case with steps to reproduce that? We need to inspect some details to have an answer on this question.

All the best,
Alex


Post by rafal »

  1. I forgot to mention I use Angular. I checked in appropriate directory in angular example but I could not found any example of translation in html file. I see you use i18next library.

  2. I am attaching slightly modified source code of your localization example (https://www.bryntum.com/products/schedulerpro/examples/localization/). You can compare it with original example to see differences. Most of the added code is from your documentation. At first the resulting application shows "INVALID FORMAT" in the top header (it is from view preset - not localized). After uncommenting last two lines the application shows "THIS IS VALID FORMAT" from locale. I think the last behavior is correct, but it should be without switching locales.

Attachments
InvalidHeaderFormat.js
(5.57 KiB) Downloaded 17 times

Post by alex.l »

Hi,

  1. i18next lib used to localize Angular components, not Bryntum components. You can use it as well to localize your Angular app.
    For Bryntum components you need to use our way of localization, as described in the guide https://bryntum.com/products/schedulerpro/docs/guide/SchedulerPro/customization/localization
    Also there is a demo here examples-scheduler/frameworks/angular/localization
    Code that applies Bryntum localization

        applySchedulerLocale = (schedulerLocale: string): void => {
            switch (schedulerLocale) {
                case 'se':
                    LocaleManager.locale = 'SvSE';
                    break;
               // ....  

    Here is about how to use L function https://bryntum.com/products/schedulerpro/docs/guide/SchedulerPro/customization/localization#using-the-l-function
    All you need is to wrap the text to L{}
    Example

        columns : [
            { type : 'resourceInfo', text : 'L{Name}', width : 150 },
            { text : 'L{Company}', field : 'company', width : 150 }
        ],
    

    In locale file

    
        Column : {
            Name    : 'Naam',
            Company : 'Bedrijf'
        },
    
  2. I've confirmed a bug. Here is a link https://github.com/bryntum/support/issues/6981
    You can subscribe on ticket updates to be notified when it's done.
    Thank you for the report!

All the best,
Alex


Post Reply