v3.0
Allows user to pick Bliska Paczka point of service on interactive map with several extra features.
See demo page.
In order to install Bliska Paczka Widget on your web page include following code snippets in head
section of your html document:
<script type="text/javascript" src="https://widget.bliskapaczka.pl/v3.0/main.js"></script>
<link rel="stylesheet" href="https://widget.bliskapaczka.pl/v3.0/main.css" />
Bliska Paczka Widget will be available through object assigned to global variable BPWidget
.
To initialize widget use method:
BPWidget::init(element: HTMLElement, options: BPWidgetOptionsObject): void
Widget will be displayed in given html element. Element has to have width
and height
defined and should be displayed on page when map is initialized.
<div id="bpWidget" style="height: 800px; width: 1024px;"></div>
BPWidget.init(
document.getElementById('bpWidget'),
{
googleMapApiKey: 'AIzaSyCUyydNCGhxGi5GIt5z5I-X6hofzptsRjE',
callback: function(point) {
console.log('point code:', point,code);
console.log('point operator:', point.operator);
},
posType: 'DELIVERY'
}
);
Bliska Paczka Widget changes its look depending of given width.
Breakpoints: 992px, 768px, 576px.
See our demo for details.
(string
) [required]
Google Maps API key that will be used for displaying the map widget.
Example: AIzaSyCUyydNCGhxGi5GIt5z5I-X6hofzptsRjE
Be careful! Example goole map key is provided for testing purposes only.
({operator: string, name?: string, price?: number}[]
) [optional]
Indicates operators that will be available on widget. Also provides interface for displaying shipment prices for each operator. By default all operators fully supported in this version of widget are available with no prices displayed. You can use this property to display prices, limit end user operator selection options or add operators not supported by default in this widget version.
Names and code names of operators fully supported in this widget version:
'RUCH'
'INPOST'
'POCZTA'
Option operators
as value takes array of objects with following properties:
Example: [{operator: "RUCH", price: 5}, {operator: "INPOST", price: 5}]
.
(string
) [optional]
Filter displayed points by scope.
Options: 'DELIVERY'
, 'POSTING'
.
(function({code: string, operator: string}): void
) [optional]
Callback function executed when user pick point on the widget. It is invoked with point object as argument.
Example callback argument: {"code": "234-567", "operator": "POCZTA"}
.
({code: string, operator: string}
) [optional]
Point that will be selected on map initialization.
Example: {"code": "123-456", "operator": "RUCH"}
.
(string
) [optional]
User address that will be available for search with special button.
({[key: string]: boolean}
) [optional]
Modules that will be enabled/disabled in widget.
All enabled by default.
Options: 'search'
, 'list'
, 'filters'
.
Example: {"search": true, "list": false, "filters": false}
(HTMLInputElement
) [optional]
External input element that will be used as map search.
(function(): void
) [optional]
Callback function executed when map loading is finished.
(google.maps.MapOptions
) [optional]
Google map options.
See google reference for details.
In order to automatically follow minor releases use chosen major version in resource url, e.g.
<script type="text/javascript" src="https://widget.bliskapaczka.pl/v3/main.js"></script>
<link rel="stylesheet" href="https://widget.bliskapaczka.pl/v3/main.css" />