@bar_jaw_test/test

pp-api-widget

Olza Logistic's Pickup Point selection widget.

---

Usage

Widget layout

By default, Olza Widget injects its layout into your HTML page. If for any reason you'd like to keep its main container into specified place in your layout hierarchy, insert empty div named olza-widget:

<div id="olza-widget"></div>

Calling Pickup Point selector

Olza.Widget.pick(config);

where config is a dictionary of parameters overriding widget defaults, for example:

function pick() {
    const options = {
        url: '<URL>',
        accessToken: '<ACCESS-TOKEN>',
        country: 'cz',
        onSelect: function (item) {
            console.log(`Picked PP: ${JSON.stringify(item)}`);
        },
        speditions: ['zas', 'zas-econt-pp'],
    };
    Olza.Widget.pick(options);
}

Available options are:

Parameter	Description	Default	Notes
url	OlzaLogistic's API base URL	null
accessToken	OlzaLogistic's API access token.	null
country	Target country to use library for.	cz
language	Requested UI language	null	Will use browser defined language if not explicitly specified.
latitude	Latitude of the initial map location
longitude	Longitude of the initial map location
zoom	Initial Leaflet map zoom level.	12
showOnMapZoomLevel	Zoom level used while "Show on map" button is clicked in PP details pane	17
speditions	List of requested speditions that are going to be used (passed all the filtering etc.).	[]	If empty list is provided, all available speditions will be used.
onSelect	Called to pass user selected Pickup Point (as JSON object).	null
useBrowserLocation	If true, widget will try to use browser's geolocation to determine initial map location.	true

Notes

• speditions is a list of spedition codes requested to be used. Final list may differ as not all
  requested speditions might be available at the time.

Dev notes

How to start development

• Install devDependencies yarn install --production=false
• Turn on files watching yarn watch
• Make changes in files in src directory
• Build new version yarn build

If you don't want to install node and yarn on your machine you can use docker-compose.yml from repository:

• docker-compose up -d
• docker-compose exec node yarn watch
• docker-compose exec node yarn build

Flags

Country flags sourced from Flagpedia (docs).

Spedition imagery

Widget expects both map pin and spedition logos to be located in relative img/ sub folder and saved as PNG files. The file names must follow the convention <SPEDITION-CODE>.png for pin and <SPEDITION-CODE>-logo.png for spedition logo.

Logo size: 600x600 px