Commit 33105fba authored by Pierre Marchand's avatar Pierre Marchand

[clients/streaming] ported compose and fixed various issues

parent 130ad963
...@@ -32,6 +32,7 @@ const getData = ...@@ -32,6 +32,7 @@ const getData =
const getSource = const getSource =
subscribe('data/alias', state => ({ subscribe('data/alias', state => ({
kind: 'local',
data: getData(state), data: getData(state),
keys: getKeys(), keys: getKeys(),
types: getTypes(), types: getTypes(),
......
import * as debug from 'debug'; import * as debug from 'debug';
import { DIV, NodeOrOptional } from 'sdi/components/elements'; import { DIV, NodeOrOptional } from 'sdi/components/elements';
import { headerWithString } from 'sdi/components/header'; import header from 'sdi/components/header';
import footer from 'sdi/components/footer'; import footer from 'sdi/components/footer';
import { loop, getUserId, getApiUrl } from 'sdi/app'; import { loop, getUserId, getApiUrl } from 'sdi/app';
...@@ -30,13 +30,13 @@ const wrappedMain = (name: string, ...elements: NodeOrOptional[]) => ...@@ -30,13 +30,13 @@ const wrappedMain = (name: string, ...elements: NodeOrOptional[]) =>
DIV( DIV(
{ className: 'query-inner' }, { className: 'query-inner' },
modal(), modal(),
headerWithString(getAppName())(() => header('angled-query', () =>
DIV({ DIV({
className: 'navigate app-listview', className: 'navigate app-listview',
onClick: navigateIndex onClick: navigateIndex
}, },
tr.angled('toQueryList') tr.angled('toQueryList')
))(), )),
DIV({ className: `main ${name}` }, ...elements), DIV({ className: `main ${name}` }, ...elements),
footer() footer()
); );
......
...@@ -29,7 +29,7 @@ import * as mapEvents from '../events/map'; ...@@ -29,7 +29,7 @@ import * as mapEvents from '../events/map';
import tr from 'sdi/locale'; import tr from 'sdi/locale';
const logger = debug('sdi:comp:map'); const logger = debug('sdi:comp:map');
export const mapId = 'main-view'; export const mapName = 'main-view';
const options: IMapOptions = { const options: IMapOptions = {
element: null, element: null,
...@@ -46,7 +46,7 @@ let mapUpdate: () => void; ...@@ -46,7 +46,7 @@ let mapUpdate: () => void;
const attachMap = (element: Element | null) => { const attachMap = (element: Element | null) => {
if (!mapUpdate) { if (!mapUpdate) {
const { update, setTarget } = create(mapId, { const { update, setTarget } = create(mapName, {
...options, ...options,
element, element,
}); });
...@@ -64,7 +64,7 @@ const renderZoomLevel = ...@@ -64,7 +64,7 @@ const renderZoomLevel =
() => DIV({ className: 'map__zoom-level' }, () => DIV({ className: 'map__zoom-level' },
`${tr.compose('mapZoomLevel')} : ${Math.round(getZoom())}` `${tr.compose('mapZoomLevel')} : ${Math.round(getZoom())}`
); );
const render = () => { const render = () => {
if (mapUpdate) { if (mapUpdate) {
mapUpdate(); mapUpdate();
...@@ -72,15 +72,15 @@ const render = () => { ...@@ -72,15 +72,15 @@ const render = () => {
const overlays: ReactNode[] = []; const overlays: ReactNode[] = [];
overlays.push(DIV({ className: 'scale-and-zoom' }, overlays.push(DIV({ className: 'scale-and-zoom' },
renderScaleline(mapQueries.getScaleLine()), renderScaleline(mapQueries.getScaleLine()),
renderZoomLevel()), renderZoomLevel()),
); );
return ( return (
DIV({ className: 'map-wrapper', key: 'the-map-wrapper' }, DIV({ className: 'map-wrapper', key: 'the-map-wrapper' },
DIV({ DIV({
id: mapId, id: mapName,
className: 'map', className: 'map',
ref: attachMap, ref: attachMap,
}), }),
......
This diff is collapsed.
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
import { query } from 'sdi/shape'; import { query } from 'sdi/shape';
import { uniqIdGen } from 'sdi/util'; import { uniqIdGen } from 'sdi/util';
import { setCurrentMapId, setLayout } from './app'; import { setCurrentMapId, setLayout, clearMap } from './app';
import { AppLayout } from '../shape/types'; import { AppLayout } from '../shape/types';
...@@ -55,7 +55,7 @@ const pushHome = ...@@ -55,7 +55,7 @@ const pushHome =
const goHome = const goHome =
() => { () => {
setCurrentMapId(null); clearMap();
setLayout(AppLayout.Dashboard); setLayout(AppLayout.Dashboard);
}; };
......
...@@ -38,6 +38,8 @@ const queries = { ...@@ -38,6 +38,8 @@ const queries = {
export default queries; export default queries;
export const getView = queries.getView;
export const getZoom = () => queries.getView().zoom; export const getZoom = () => queries.getView().zoom;
......
...@@ -75,6 +75,7 @@ const getLayerListData = ...@@ -75,6 +75,7 @@ const getLayerListData =
export const getTableSource = export const getTableSource =
subscribe('data/datasetMetadata', state => ({ subscribe('data/datasetMetadata', state => ({
kind: 'local',
data: getLayerListData(state), data: getLayerListData(state),
keys: loadLayerListKeys(), keys: loadLayerListKeys(),
types: loadLayerListTypes(), types: loadLayerListTypes(),
......
...@@ -22,6 +22,8 @@ import { ...@@ -22,6 +22,8 @@ import {
TableDataType, TableDataType,
tableQueries, tableQueries,
emptySource, emptySource,
TableSourceGetter,
TableSource,
} from 'sdi/components/table'; } from 'sdi/components/table';
import { import {
FeatureCollection, FeatureCollection,
...@@ -139,13 +141,16 @@ const getLayerTypes = ...@@ -139,13 +141,16 @@ const getLayerTypes =
return getLayerKeys(layer).map(typer); return getLayerKeys(layer).map(typer);
}; };
export const getSource = export const getSource: TableSourceGetter =
() => getLayerOption().fold(emptySource(), () => getLayerOption()
layer => ({ .fold<TableSource>(
data: getLayerData(layer), emptySource(),
keys: getLayerKeys(layer), layer => ({
types: getLayerTypes(layer), kind: 'local',
})); data: getLayerData(layer),
keys: getLayerKeys(layer),
types: getLayerTypes(layer),
}));
......
...@@ -36,7 +36,7 @@ const wrappedMain = ( ...@@ -36,7 +36,7 @@ const wrappedMain = (
) => ) =>
DIV( DIV(
{ className: 'dashboard-inner' }, { className: 'dashboard-inner' },
header('dashboard')(() => DIV({}))(), header('dashboard'),
DIV({ className: `main ${name}` }, ...elements), DIV({ className: `main ${name}` }, ...elements),
footer() footer()
); );
......
...@@ -108,13 +108,10 @@ const loadLayer = ...@@ -108,13 +108,10 @@ const loadLayer =
), ),
() => { () => {
if (bbox) { if (bbox) {
return addFeaturesToLayer(mapName, return addFeaturesToLayer(
() => some({ mapName,
name: getMessageRecord(metadata.resourceTitle), info,
info, layer.features,
metadata,
}),
() => right(some(layer)),
); );
} }
return null; return null;
...@@ -178,7 +175,7 @@ const loadLayerDataAccordingToZoom = (layer: ILayerInfo, metadata: Inspire) => { ...@@ -178,7 +175,7 @@ const loadLayerDataAccordingToZoom = (layer: ILayerInfo, metadata: Inspire) => {
if (isZoomVisible(zoom, minZoom, maxZoom)) { if (isZoomVisible(zoom, minZoom, maxZoom)) {
let extent = null; let extent = null;
if (metadata.dataStreamUrl) { if (metadata.dataStreamUrl) {
extent = getView().extent; extent = getView().extent;
} }
loadLayer(layer, metadata, extent); loadLayer(layer, metadata, extent);
......
...@@ -74,6 +74,7 @@ const getLayerListData = ...@@ -74,6 +74,7 @@ const getLayerListData =
export const getTableSource = export const getTableSource =
subscribe('data/datasetMetadata', state => ({ subscribe('data/datasetMetadata', state => ({
kind: 'local',
data: getLayerListData(state), data: getLayerListData(state),
keys: loadLayerListKeys(), keys: loadLayerListKeys(),
types: loadLayerListTypes(), types: loadLayerListTypes(),
...@@ -107,6 +108,7 @@ const getKeywordsData = ...@@ -107,6 +108,7 @@ const getKeywordsData =
export const getKeywordsSource = export const getKeywordsSource =
subscribe('data/keywords', state => ({ subscribe('data/keywords', state => ({
kind: 'local',
data: getKeywordsData(state), data: getKeywordsData(state),
keys: keywordsKeys(), keys: keywordsKeys(),
types: keywordsTypes(), types: keywordsTypes(),
......
...@@ -20,6 +20,7 @@ const getTypes = ...@@ -20,6 +20,7 @@ const getTypes =
export const getSource: TableSourceGetter = export const getSource: TableSourceGetter =
() => ({ () => ({
kind: 'local',
data: getData(), data: getData(),
keys: getKeys(), keys: getKeys(),
types: getTypes(), types: getTypes(),
......
...@@ -47,11 +47,6 @@ import { isNotNullNorUndefined } from 'sdi/util'; ...@@ -47,11 +47,6 @@ import { isNotNullNorUndefined } from 'sdi/util';
const logger = debug('sdi:events/app'); const logger = debug('sdi:events/app');
export const activityLogger = activity('view'); export const activityLogger = activity('view');
// observe('component/table', (ts) => {
// console.group('table');
// console.info(JSON.stringify(ts, null, 2));
// console.groupEnd();
// });
observe('data/maps', observe('data/maps',
() => fromNullable(getMapInfo()) () => fromNullable(getMapInfo())
...@@ -66,7 +61,7 @@ observe('port/map/view', ...@@ -66,7 +61,7 @@ observe('port/map/view',
fromNullable(view.extent) fromNullable(view.extent)
.map(e => .map(e =>
mapStream(e, ({ uri, lid }, extent) => mapStream(e, ({ uri, lid }, extent) =>
loadLayerDataExtent(lid, uri)(extent)))); loadLayerDataExtent(lid, uri, extent))));
...@@ -98,7 +93,7 @@ const loadLayer = ...@@ -98,7 +93,7 @@ const loadLayer =
if (l.visible && layerInRange(l)) { if (l.visible && layerInRange(l)) {
fromNullable(getView().extent) fromNullable(getView().extent)
.map((e) => { .map((e) => {
loadLayerDataExtent(l.id, md.uniqueResourceIdentifier)(e); loadLayerDataExtent(l.id, md.uniqueResourceIdentifier, e);
}); });
} }
} }
...@@ -111,34 +106,37 @@ const loadLayer = ...@@ -111,34 +106,37 @@ const loadLayer =
const loadLayerDataExtent = const loadLayerDataExtent = (
(layerId: string, url: string) => (bbox: Extent) => layerId: string,
getSyntheticLayerInfo(layerId) url: string,
.map(({ info }) => bbox: Extent,
whenInRange(info) ) =>
.map((info) => { getSyntheticLayerInfo(layerId)
pushStreamExtent(bbox, { lid: layerId, uri: url }); .map(({ info }) =>
fetchLayer(`${url}?bbox=${bbox[0]},${bbox[1]},${bbox[2]},${bbox[3]}`) whenInRange(info)
.then((layer) => { .map((info) => {
if (layer.features !== null) { pushStreamExtent(bbox, { lid: layerId, uri: url });
addFeaturesToLayer(mapName, info, layer.features); fetchLayer(`${url}?bbox=${bbox[0]},${bbox[1]},${bbox[2]},${bbox[3]}`)
dispatch('data/layers', (state) => { .then((layer) => {
if (url in state) { if (layer.features !== null) {
state[url].features = state[url].features.concat(layer.features); addFeaturesToLayer(mapName, info, layer.features);
} dispatch('data/layers', (state) => {
else { if (url in state) {
state[url] = layer; state[url].features = state[url].features.concat(layer.features);
} }
return state; else {
}); state[url] = layer;
} }
}) return state;
.catch((err) => { });
logger(`Failed to load features at ${url} due to ${err}`); }
dispatch('remote/errors', state => ({ ...state, [url]: `${err}` })); })
}); .catch((err) => {
}) logger(`Failed to load features at ${url} due to ${err}`);
); dispatch('remote/errors', state => ({ ...state, [url]: `${err}` }));
});
})
);
const loadLayerData = (url: string) => { const loadLayerData = (url: string) => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment