Tile loading progress for vector sources utilizing tile loading strategy - openlayers-3

Question

I am loading features into Vector source utilizing the Tile strategy. I'd like implement kind of progress bar, similar to http://openlayers.org/en/master/examples/tile-load-events.html.
However, unlike VectorTile source, the Vector source doesn't trigger tile loading events which could be used for calculating desired ratio 100*(tilesLoaded/tilesToLoad).
So far I can retrieve the total count of tiles to load, but I am unable to count already loaded tiles. The most promising is a custom loader, but it is not clear to me how to modify it without touching the original OL source code.
var vectorSource = new ol.source.Vector({
loader: ol.featureloader.xhrX(url, format),
strategy: ol.loadingstrategy.tile(tileGrid)
});
// forked method, but the inner 'loadFeaturesXhr' method seems to be private and cannot be used
ol.featureloader.xhrX = function(url, format) {
/*
return ol.featureloader.loadFeaturesXhr(url, format,
function(features, dataProjection) {
this.addFeatures(features);
// when tile loading succeeds
tilesLoaded++;
},
function() {
// when tile loading fails
tilesLoaded++;
});
*/
// just returning the original loader
return ol.featureloader.xhr(url, format);
}
var url = function(extent, resolution) {
tilesToLoad++; // when a new tile is needed, this counter is incremented
var tileCoord = tileGrid.getTileCoordForCoordAndResolution(ol.extent.getCenter(extent), resolution);
return 'tiles/' +
tileCoord[0] + '/' +
tileCoord[1] + '/' +
(Math.pow(2, tileCoord[0]) + tileCoord[2]) + '.json';
}
var format = new ol.format.GeoJSON({
defaultDataProjection: 'EPSG:3857'
});
Any idea how to call loadFeaturesXhr() method from my source?

Answer 1

Instead of forking default OL3 loader I created a custom one. It was not as hard as expected. Now I can freely add counters to proper places (in the code below I actually update the progress component itself):
var vectorSource = new ol.source.Vector({
loader: function(extent, resolution, projection) {
var getUrl = function(extent, resolution) {
progress.addLoading();
...
};
var xhr = new XMLHttpRequest();
xhr.open('GET', getUrl(extent, resolution), true);
xhr.onload = function(event) {
...
progress.addLoaded();
}.bind(this);
xhr.onerror = function(event) {
progress.addLoaded();
}
xhr.send();
},
strategy: ol.loadingstrategy.tile(tileGrid)
});