Compare commits
No commits in common. "80fec7ccaa5f2f552c2ef6866f4a77b0044c5a02" and "03284d26dd7cc42c49dfbb6fc1c9b615b15aeaeb" have entirely different histories.
80fec7ccaa
...
03284d26dd
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 62 KiB After Width: | Height: | Size: 34 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -23,30 +23,6 @@
|
||||
content: "b";
|
||||
}
|
||||
|
||||
.fm-trijntje:before {
|
||||
content: "c";
|
||||
}
|
||||
|
||||
.fm-satellite:before {
|
||||
content: "d";
|
||||
}
|
||||
|
||||
.fm-sensoterra:before {
|
||||
content: "e";
|
||||
}
|
||||
|
||||
.fm-blight:before {
|
||||
content: "f";
|
||||
}
|
||||
|
||||
.fm-agrodatacube:before {
|
||||
content: "g";
|
||||
}
|
||||
|
||||
.fm-app-menu:before {
|
||||
content: "h";
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "FarmMaps";
|
||||
src: url("./FMIconFont.woff") format("woff"), /* Modern Browsers */
|
||||
|
||||
@ -16,7 +16,6 @@ export const STARTSEARCHSUCCESS = '[Map] StartSearchSuccess';
|
||||
export const SELECTFEATURE = '[Map] SelectFeature';
|
||||
export const SELECTITEM = '[Map] SelectItem';
|
||||
export const SELECTITEMSUCCESS = '[Map] SelectItemSuccess';
|
||||
export const SETSELECTEDITEMLAYER = '[Map] SetSelectedItemLayer';
|
||||
export const SELECTTEMPORALITEMSSUCCESS = '[Map] SelectTemporalItemsSuccess';
|
||||
export const NEXTTEMPORAL = '[Map] NextTemporal';
|
||||
export const PREVIOUSTEMPORAL = '[Map] PreviousTemporal';
|
||||
@ -33,7 +32,6 @@ export const SETVISIBILITY = '[Map] SetVisibility';
|
||||
export const SETOPACITY = '[Map] SetOpacity';
|
||||
export const SETLAYERINDEX = '[Map] SetLayerIndex';
|
||||
export const REMOVELAYER = '[Map] RemoveLayer';
|
||||
export const CLEARLAYERS = '[Map] ClearLayers';
|
||||
export const LOADBASELAYERS = '[Map] LoadLayers';
|
||||
export const LOADBASELAYERSSUCCESS = '[Map] LoadLayersSuccess';
|
||||
export const SELECTBASELAYER = '[Map] SelectBaseLayers';
|
||||
@ -44,7 +42,6 @@ export const SETSTYLE = '[Map] SetStyle';
|
||||
export const SHOWLAYERSWITCHER = '[Map] ShowLayerSwitcher';
|
||||
export const CLEAR = '[Map] Clear';
|
||||
export const SETREPLACEURL = '[Map] SetReplaceUrl';
|
||||
export const SETFEATURES = '[Map] SetFeatures'
|
||||
|
||||
export class Clear implements Action {
|
||||
readonly type = CLEAR;
|
||||
@ -183,12 +180,6 @@ export class AddLayer implements Action {
|
||||
constructor(public item:IItem,public layerIndex=-1) { }
|
||||
}
|
||||
|
||||
export class SetSelectedItemLayer implements Action {
|
||||
readonly type = SETSELECTEDITEMLAYER;
|
||||
|
||||
constructor(public item:IItem,public layerIndex=-1) { }
|
||||
}
|
||||
|
||||
export class SetVisibility implements Action {
|
||||
readonly type = SETVISIBILITY;
|
||||
|
||||
@ -213,12 +204,6 @@ export class RemoveLayer implements Action {
|
||||
constructor(public itemLayer: IItemLayer) { }
|
||||
}
|
||||
|
||||
export class ClearLayers implements Action {
|
||||
readonly type = CLEARLAYERS;
|
||||
|
||||
constructor() { }
|
||||
}
|
||||
|
||||
export class LoadBaseLayers implements Action {
|
||||
readonly type = LOADBASELAYERS;
|
||||
|
||||
@ -271,12 +256,6 @@ export class SetReplaceUrl implements Action {
|
||||
constructor(public replaceUrl:boolean) {}
|
||||
}
|
||||
|
||||
export class SetFeatures implements Action {
|
||||
readonly type = SETFEATURES;
|
||||
|
||||
constructor(public features: Array<Feature>) { }
|
||||
}
|
||||
|
||||
export type Actions = SetMapState
|
||||
| Init
|
||||
| Clear
|
||||
@ -299,7 +278,6 @@ export type Actions = SetMapState
|
||||
| SetTimeSpan
|
||||
| AddLayer
|
||||
| RemoveLayer
|
||||
| ClearLayers
|
||||
| SetVisibility
|
||||
| SetOpacity
|
||||
| SetLayerIndex
|
||||
@ -313,7 +291,5 @@ export type Actions = SetMapState
|
||||
| DoQuery
|
||||
| SetStyle
|
||||
| ShowLayerSwitcher
|
||||
| SetReplaceUrl
|
||||
| SetFeatures
|
||||
| SetSelectedItemLayer;
|
||||
| SetReplaceUrl;
|
||||
|
||||
|
||||
@ -8,10 +8,6 @@ const routes = [
|
||||
path: '',
|
||||
component: MapComponent
|
||||
},
|
||||
{
|
||||
path: ':xCenter/:yCenter/:zoom/:rotation/:baseLayer',
|
||||
component: MapComponent
|
||||
},
|
||||
{
|
||||
path: ':xCenter/:yCenter/:zoom/:rotation/:baseLayer/:queryState',
|
||||
component: MapComponent
|
||||
|
||||
@ -129,7 +129,7 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
|
||||
source: new VectorTileSource({
|
||||
maxZoom: rt.maxzoom,
|
||||
minZoom: rt.minzoom,
|
||||
format: new MVT({idProperty:'OBJECTID'}),
|
||||
format: new MVT(),
|
||||
url: `${this._apiEndPoint}/api/v1/items/${item.code}/vectortiles/{z}/{x}/{y}.pbf?v=${Date.parse(item.updated)}`
|
||||
}),
|
||||
style: (feature) => {
|
||||
@ -196,7 +196,7 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
|
||||
});
|
||||
}
|
||||
if(l.minzoom) {
|
||||
layer.setMinZoom(l.minzoom);
|
||||
layer.setMinZoom(14);
|
||||
}
|
||||
if(l.maxzoom) {
|
||||
layer.setMaxZoom(l.maxzoom);
|
||||
@ -219,9 +219,12 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
|
||||
|
||||
return new style.Style(
|
||||
{
|
||||
fill: new style.Fill({
|
||||
color: 'red'
|
||||
}),
|
||||
stroke: new style.Stroke({
|
||||
color: 'red',
|
||||
width: 2
|
||||
width: 1.25
|
||||
})
|
||||
}
|
||||
);
|
||||
@ -389,14 +392,14 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
|
||||
//if(event.type === 'click' && !this.onFeatureSelected.observers.length) return;
|
||||
//if(event.type === 'pointermode' && !this.onFeatureHover.observers.length) return;
|
||||
if(this.itemLayer && this.itemLayer.layer) {
|
||||
this.selectedFeatures = {};
|
||||
this.itemLayer.layer.getFeatures(event.pixel).then((features) => {
|
||||
this.selectedFeatures = {};
|
||||
if(!features.length) return;
|
||||
let fid = features[0].getId();
|
||||
this.selectedFeatures[fid] = features[0];
|
||||
console.debug(features[0]);
|
||||
if(this.selectionLayer) this.selectionLayer.changed();
|
||||
})
|
||||
if(this.selectionLayer) this.selectionLayer.changed();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -19,10 +19,9 @@
|
||||
period:period$|async,
|
||||
compassHeading:compassHeading$|async,
|
||||
styles:styles$|async,
|
||||
selectedFeature:selectedFeature$|async,
|
||||
fullscreen:fullscreen$|async
|
||||
selectedFeature:selectedFeature$|async
|
||||
} as state">
|
||||
<aol-map #map (moveEnd)="handleOnMoveEnd($event)" (click)="handleOnMouseDown($event)" [ngClass]="{'panel-visible':state.panelVisible,'fullscreen':state.fullscreen}" class="map">
|
||||
<aol-map #map (moveEnd)="handleOnMoveEnd($event)" (click)="handleOnMouseDown($event)" [ngClass]="{'panel-visible':state.panelVisible}" class="map">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
@ -39,7 +38,7 @@
|
||||
<fm-map-item-source-vector [styles]="state.styles" [features]="state.features" (onFeatureSelected)="handleFeatureClick($event)" (onFeatureHover)="handleFeatureHover($event)" [selectedFeature]="state.selectedFeature" [selectedItem]="state.selectedItem"></fm-map-item-source-vector>
|
||||
</aol-layer-vector>
|
||||
<!-- <fm-map-gps-location [position]="state.position" [headingTolerance]="20" [showHeading]="true" [heading]="state.compassHeading"></fm-map-gps-location> -->
|
||||
<div class="control-container" >
|
||||
<div class="control-container">
|
||||
<router-outlet name="map-controls"></router-outlet>
|
||||
<fm-map-layer-switcher></fm-map-layer-switcher>
|
||||
<fm-map-pan-to-location [position]="state.position" [mapState]="state.mapState" [animate]="true"></fm-map-pan-to-location>
|
||||
@ -47,11 +46,9 @@
|
||||
</div>
|
||||
<fm-map-file-drop-target [parentCode]="state.parentCode" (onFileDropped)="handleFileDropped($event)"></fm-map-file-drop-target>
|
||||
</aol-map>
|
||||
<div *ngIf="noContent">
|
||||
<fm-map-map-search #mapSearch [openedModalName]="state.openedModalName" (onOpenModal)="handleOpenModal($event)" (onCloseModal)="handleCloseModal()" [ngClass]="{'menuVisible':state.menuVisible}" (onToggleMenu)="handleToggleMenu($event)" (onSearchCollapse)="handleSearchCollapse($event)" (onSearchExpand)="handleSearchExpand($event)" [collapsed]="state.searchCollapsed" [searchMinified]="state.searchMinified" (onSearch)="handleSearch($event)" (onClear)="handleClearSearch($event)" [filterOptions]="state.queryState" [clearEnabled]="state.clearEnabled" [period]="state.period"></fm-map-map-search>
|
||||
</div>
|
||||
<fm-side-panel [resizeable]="true" [visible]="state.panelVisible && noContent" [collapsed]="state.panelCollapsed" [collapsable]="false">
|
||||
<div class="panel-wrapper" *ngIf="noContent">
|
||||
<fm-map-map-search #mapSearch [openedModalName]="state.openedModalName" (onOpenModal)="handleOpenModal($event)" (onCloseModal)="handleCloseModal()" [ngClass]="{'menuVisible':state.menuVisible}" (onToggleMenu)="handleToggleMenu($event)" (onSearchCollapse)="handleSearchCollapse($event)" (onSearchExpand)="handleSearchExpand($event)" [collapsed]="state.searchCollapsed" [searchMinified]="state.searchMinified" (onSearch)="handleSearch($event)" (onClear)="handleClearSearch($event)" [filterOptions]="state.queryState" [clearEnabled]="state.clearEnabled" [period]="state.period"></fm-map-map-search>
|
||||
<fm-side-panel [resizeable]="true" [visible]="state.panelVisible" [collapsed]="state.panelCollapsed" [collapsable]="false">
|
||||
<div class="panel-wrapper">
|
||||
<div class="panel-top bg-secondary" *ngIf="!(state.searchMinified)">
|
||||
</div>
|
||||
<div class="panel-bottom">
|
||||
@ -70,9 +67,6 @@
|
||||
</div>
|
||||
</div>
|
||||
</fm-side-panel>
|
||||
<fm-side-panel [resizeable]="true" [visible]="!noContent">
|
||||
<router-outlet></router-outlet>
|
||||
</fm-side-panel>
|
||||
</ng-container>
|
||||
|
||||
|
||||
|
||||
@ -49,10 +49,6 @@ aol-map { position:absolute;width:100%;height:calc(100vh + 4rem);}
|
||||
.control-container {
|
||||
position: absolute;
|
||||
right: 1em;
|
||||
bottom: 8.1em;
|
||||
}
|
||||
|
||||
.fullscreen .control-container {
|
||||
bottom: 5em;
|
||||
}
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { Component, OnInit, OnDestroy, HostListener, ViewChild, AfterViewInit,NgZone,ElementRef } from '@angular/core';
|
||||
import { Component, OnInit, OnDestroy, HostListener, ViewChild, AfterViewInit,NgZone } from '@angular/core';
|
||||
import { Location } from '@angular/common';
|
||||
import { Observable, Subject, Subscription, from,of ,EMPTY } from 'rxjs';
|
||||
import { withLatestFrom, switchMap,skip } from 'rxjs/operators';
|
||||
@ -79,13 +79,10 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
|
||||
public overlayLayersCollapsed: boolean = true;
|
||||
public extent$: Observable<Extent> = this.store.select(mapReducers.selectGetExtent);
|
||||
public styles$:Observable<IStyles> = this.store.select(mapReducers.selectGetStyles);
|
||||
public fullscreen$: Observable<boolean> = this.store.select(commonReducers.selectGetFullScreen);
|
||||
private lastUrl = "";
|
||||
private initialized: boolean = false;
|
||||
public noContent: boolean = false;
|
||||
|
||||
@ViewChild('map') map;
|
||||
@ViewChild('contentDiv') contentDiv: ElementRef;
|
||||
|
||||
constructor(private store: Store<mapReducers.State | commonReducers.State>,
|
||||
private route: ActivatedRoute,
|
||||
@ -240,27 +237,23 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
|
||||
|
||||
ngAfterViewInit() {
|
||||
console.debug("View init");
|
||||
if(this.route.children.length == 0) {
|
||||
this.noContent=true;
|
||||
}
|
||||
|
||||
this.initCustomStyles();
|
||||
|
||||
// url to state
|
||||
|
||||
let urlMapState = this.getMapStateFromUrl(this.route.snapshot.paramMap);
|
||||
let urlQueryState = this.getQueryStateFromUrl(this.route.snapshot.paramMap);
|
||||
if(urlQueryState && urlMapState && this.noContent) {
|
||||
if(urlQueryState && urlMapState) {
|
||||
this.store.dispatch(new mapActions.SetState(urlMapState,urlQueryState));
|
||||
window.localStorage.setItem("FarmMapsCommonMap_mapState",this.serializeMapState(urlMapState));
|
||||
} else if(urlQueryState && this.noContent) {
|
||||
} else if(urlQueryState) {
|
||||
this.store.dispatch(new mapActions.SetQueryState(urlQueryState));
|
||||
} else {
|
||||
this.store.dispatch(new mapActions.SetReplaceUrl(true));
|
||||
}
|
||||
|
||||
this.paramSub = this.route.paramMap.pipe(withLatestFrom(this.state$),switchMap(([params,state]) => {
|
||||
if(this.initialized && this.noContent) {
|
||||
if(this.initialized) {
|
||||
let urlQueryState = this.getQueryStateFromUrl(params);
|
||||
if( this.serializeService.serialize(state.queryState) != this.serializeService.serialize(urlQueryState)) {
|
||||
return of(new mapActions.SetState(state.mapState,urlQueryState));
|
||||
@ -325,24 +318,23 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
|
||||
}
|
||||
|
||||
replaceUrl(mapState: IMapState, queryState: IQueryState, replace: boolean = true) {
|
||||
if(this.noContent) {
|
||||
let newMapState = this.serializeMapState(mapState);
|
||||
let newQueryState = this.serializeService.serialize(queryState);
|
||||
let currentMapState = this.serializeMapState(this.getMapStateFromUrl(this.route.snapshot.paramMap));
|
||||
let urlQueryState = this.getQueryStateFromUrl(this.route.snapshot.paramMap);
|
||||
let currentQueryState = urlQueryState==null?"":this.serializeService.serialize(urlQueryState);
|
||||
if(mapState.baseLayerCode!="" && ((newMapState!= currentMapState) || (newQueryState!=currentQueryState))) {
|
||||
let parts =["."];
|
||||
parts.push(mapState.xCenter.toFixed(5));
|
||||
parts.push(mapState.yCenter.toFixed(5));
|
||||
parts.push( mapState.zoom.toFixed(0));
|
||||
parts.push( mapState.rotation.toFixed(2));
|
||||
parts.push(mapState.baseLayerCode);
|
||||
parts.push( this.serializeService.serialize(queryState));
|
||||
|
||||
console.debug("Replace url",parts);
|
||||
this.router.navigate(parts, { replaceUrl: replace,relativeTo:this.route.parent });
|
||||
}
|
||||
let newMapState = this.serializeMapState(mapState);
|
||||
let newQueryState = this.serializeService.serialize(queryState);
|
||||
let currentMapState = this.serializeMapState(this.getMapStateFromUrl(this.route.snapshot.paramMap));
|
||||
let urlQueryState = this.getQueryStateFromUrl(this.route.snapshot.paramMap);
|
||||
let currentQueryState = urlQueryState==null?"":this.serializeService.serialize(urlQueryState);
|
||||
if(mapState.baseLayerCode!="" && ((newMapState!= currentMapState) || (newQueryState!=currentQueryState))) {
|
||||
let parts =["."];
|
||||
parts.push(mapState.xCenter.toFixed(5));
|
||||
parts.push(mapState.yCenter.toFixed(5));
|
||||
parts.push( mapState.zoom.toFixed(0));
|
||||
parts.push( mapState.rotation.toFixed(2));
|
||||
parts.push(mapState.baseLayerCode);
|
||||
parts.push( this.serializeService.serialize(queryState));
|
||||
|
||||
console.debug("Replace url",parts);
|
||||
this.router.navigate(parts, { replaceUrl: replace,relativeTo:this.route.parent });
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -150,19 +150,6 @@ export class MapEffects {
|
||||
return actions;
|
||||
}));
|
||||
|
||||
@Effect()
|
||||
zoomToExtent2$: Observable<Action> = this.actions$.pipe(
|
||||
ofType(mapActions.SETFEATURES),
|
||||
map((action: mapActions.SetFeatures) => {
|
||||
let extent = createEmpty();
|
||||
if (extent) {
|
||||
for (let f of action.features) {
|
||||
extend(extent, (f as Feature).getGeometry().getExtent());
|
||||
}
|
||||
}
|
||||
return new mapActions.SetExtent(extent);
|
||||
}));
|
||||
|
||||
@Effect()
|
||||
hideMenu$: Observable<Action> = this.actions$.pipe(
|
||||
ofType(mapActions.STARTSEARCHSUCCESS),
|
||||
@ -194,14 +181,6 @@ export class MapEffects {
|
||||
}
|
||||
));
|
||||
|
||||
@Effect()
|
||||
selectItemSuccessSetLayer$: Observable<Action> = this.actions$.pipe(
|
||||
ofType(mapActions.SELECTITEMSUCCESS),
|
||||
map((action:mapActions.SelectItemSuccess) =>
|
||||
new mapActions.SetSelectedItemLayer(action.item)
|
||||
)
|
||||
);
|
||||
|
||||
@Effect()
|
||||
selectItemSuccess$: Observable<Action> = this.actions$.pipe(
|
||||
ofType(mapActions.SELECTITEMSUCCESS),
|
||||
|
||||
@ -138,12 +138,6 @@ export function reducer(state = initialState, action: mapActions.Actions | commo
|
||||
inSearch:false
|
||||
});
|
||||
}
|
||||
case mapActions.SETFEATURES: {
|
||||
let a = action as mapActions.SetFeatures;
|
||||
return tassign(state, {
|
||||
features: a.features
|
||||
});
|
||||
}
|
||||
case mapActions.SELECTFEATURE: {
|
||||
let a = action as mapActions.SelectFeature;
|
||||
return tassign(state, {
|
||||
@ -163,10 +157,18 @@ export function reducer(state = initialState, action: mapActions.Actions | commo
|
||||
}
|
||||
case mapActions.SELECTITEMSUCCESS: {
|
||||
let a = action as mapActions.SelectItemSuccess;
|
||||
var itemLayer = null;
|
||||
if (a.item && "vnd.farmmaps.itemtype.layer,vnd.farmmaps.itemtype.shape.processed,vnd.farmmaps.itemtype.geotiff.processed".indexOf(a.item.itemType) >=0 ) {
|
||||
itemLayer = new ItemLayer(a.item);
|
||||
itemLayer.layerIndex = a.item.data.layers?a.item.data.layers[0].index:-1;
|
||||
} else if (a.item && a.item.itemType == "vnd.farmmaps.itemtype.temporal") {
|
||||
itemLayer = new TemporalItemLayer(a.item);
|
||||
}
|
||||
return tassign(state, {
|
||||
inSearch:false,
|
||||
selectedItem: a.item,
|
||||
parentItem: a.parentItem,
|
||||
selectedItemLayer: itemLayer,
|
||||
panelVisible: a.item != null,
|
||||
clearEnabled: a.item != null,
|
||||
searchCollapsed: false,
|
||||
@ -174,20 +176,6 @@ export function reducer(state = initialState, action: mapActions.Actions | commo
|
||||
queryState: tassign(state.queryState, {itemCode:a.item ? a.item.code:null})
|
||||
});
|
||||
}
|
||||
case mapActions.SETSELECTEDITEMLAYER: {
|
||||
let a = action as mapActions.SetSelectedItemLayer;
|
||||
var itemLayer = null;
|
||||
if (a.item && "vnd.farmmaps.itemtype.layer,vnd.farmmaps.itemtype.shape.processed,vnd.farmmaps.itemtype.geotiff.processed".indexOf(a.item.itemType) >=0 ) {
|
||||
itemLayer = new ItemLayer(a.item);
|
||||
itemLayer.layerIndex = a.layerIndex>=0?a.layerIndex:a.item.data.layers?a.item.data.layers[0].index:-1;
|
||||
} else if (a.item && a.item.itemType == "vnd.farmmaps.itemtype.temporal") {
|
||||
itemLayer = new TemporalItemLayer(a.item);
|
||||
}
|
||||
|
||||
return tassign(state, {
|
||||
selectedItemLayer: itemLayer,
|
||||
});
|
||||
}
|
||||
case mapActions.SELECTTEMPORALITEMSSUCCESS:{
|
||||
let a = action as mapActions.SelectTemporalItemsSuccess;
|
||||
let selectedItemLayer=tassign(state.selectedItemLayer) as TemporalItemLayer;
|
||||
@ -355,9 +343,6 @@ export function reducer(state = initialState, action: mapActions.Actions | commo
|
||||
newLayers.splice(i, 1);
|
||||
return tassign(state, { overlayLayers: newLayers, selectedOverlayLayer: selectedOverlayLayer });
|
||||
}
|
||||
case mapActions.CLEARLAYERS: {
|
||||
return tassign(state, {overlayLayers: [], selectedOverlayLayer: null});
|
||||
}
|
||||
case mapActions.SETVISIBILITY: {
|
||||
let a = action as mapActions.SetVisibility;
|
||||
let newLayers = state.overlayLayers.slice(0);
|
||||
|
||||
@ -60,8 +60,6 @@ export const TOGGLEMENU = '[AppCommon] ToggleMenu';
|
||||
|
||||
export const TOGGLEACCOUNTMENU = '[AppCommon] ToggleAccountMenu';
|
||||
|
||||
export const TOGGLEAPPMENU = '[AppCommon] ToggleAppMenu';
|
||||
|
||||
export const SETMENUVISIBLE = '[AppCommon] SetMenuVisible';
|
||||
|
||||
export const ONLINE = '[AppCommon] Online';
|
||||
@ -285,12 +283,6 @@ export class ToggleAccountMenu implements Action {
|
||||
constructor() { }
|
||||
}
|
||||
|
||||
export class ToggleAppMenu implements Action {
|
||||
readonly type = TOGGLEAPPMENU;
|
||||
|
||||
constructor() { }
|
||||
}
|
||||
|
||||
export class SetMenuVisible implements Action {
|
||||
readonly type = SETMENUVISIBLE;
|
||||
|
||||
@ -354,7 +346,6 @@ export type Actions = OpenModal
|
||||
| CloseAll
|
||||
| Online
|
||||
| Offline
|
||||
| SetPageMode
|
||||
| ToggleAppMenu;
|
||||
| SetPageMode;
|
||||
|
||||
|
||||
|
||||
@ -55,7 +55,6 @@ import * as commonEffects from './effects/app-common.effects';
|
||||
import { SecureOAuthStorage} from './shared/secureOAuthStorage';
|
||||
import { GradientComponent } from './components/gradient/gradient.component';
|
||||
import { GradientSelectComponent } from './components/gradient-select/gradient-select.component';
|
||||
import { AppMenuComponent } from './components/app-menu/app-menu.component';
|
||||
|
||||
export {
|
||||
SafePipe,
|
||||
@ -127,8 +126,7 @@ export {
|
||||
HasClaimDirective,
|
||||
UserMenuComponent,
|
||||
GradientComponent,
|
||||
GradientSelectComponent,
|
||||
AppMenuComponent
|
||||
GradientSelectComponent
|
||||
],
|
||||
exports: [
|
||||
NgbModule,
|
||||
|
||||
@ -1,9 +0,0 @@
|
||||
<div>
|
||||
<div (click)="toggle($event)" class="rounded-circle menu-button hidden" [ngClass]="{'hidden':!user}">
|
||||
<span i18n-title title="Apps"><i class="fm fm-app-menu" aria-hidden="true"></i></span>
|
||||
<div class="menu hidden" [ngClass]="{'hidden':!showMenu}">
|
||||
<router-outlet name="app-menu"></router-outlet>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,48 +0,0 @@
|
||||
.menu-button {
|
||||
background-color: gray;
|
||||
display: inline-block;
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
line-height: 2.5em;
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
div.menu-button > span {
|
||||
color:white;
|
||||
}
|
||||
|
||||
.menu {
|
||||
max-height: 100vh;
|
||||
//transition: max-height 0.2s;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 0 20px rgba(0,0,0,.3);
|
||||
position: absolute;
|
||||
top: 3rem;
|
||||
right:0;
|
||||
background-color: #fff;
|
||||
border-radius: 0.25rem;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding:0.5rem;
|
||||
min-width: 10rem;
|
||||
}
|
||||
|
||||
.card-body {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
max-height: 0;
|
||||
}
|
||||
|
||||
.menu.hidden {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.menu-button.hidden {
|
||||
overflow: hidden;
|
||||
}
|
||||
@ -1,25 +0,0 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AppMenuComponent } from './app-menu.component';
|
||||
|
||||
describe('AppMenuComponent', () => {
|
||||
let component: AppMenuComponent;
|
||||
let fixture: ComponentFixture<AppMenuComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ AppMenuComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(AppMenuComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -1,29 +0,0 @@
|
||||
import { Component, OnInit, Input } from '@angular/core';
|
||||
|
||||
|
||||
import { IUser } from '../../models/user';
|
||||
import {Store} from '@ngrx/store';
|
||||
import * as appReducers from '../../reducers/app-common.reducer';
|
||||
import * as appActions from '../../actions/app-common.actions';
|
||||
|
||||
@Component({
|
||||
selector: 'fm-app-menu',
|
||||
templateUrl: './app-menu.component.html',
|
||||
styleUrls: ['./app-menu.component.scss']
|
||||
})
|
||||
export class AppMenuComponent implements OnInit {
|
||||
|
||||
@Input() user:IUser;
|
||||
@Input() showMenu:boolean;
|
||||
|
||||
constructor(private store: Store<appReducers.State>) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
toggle(event:MouseEvent) {
|
||||
event.stopPropagation();
|
||||
this.store.dispatch(new appActions.ToggleAppMenu());
|
||||
}
|
||||
|
||||
}
|
||||
@ -31,7 +31,6 @@
|
||||
<fm-resumable-file-upload></fm-resumable-file-upload>
|
||||
</ng-container>
|
||||
<div class="user-menu apponly">
|
||||
<fm-app-menu [user]="user|async" [showMenu]="appMenuVisible|async"></fm-app-menu>
|
||||
<fm-user-menu [user]="user|async" [showMenu]="accountMenuVisible|async"></fm-user-menu>
|
||||
</div>
|
||||
<div class="healthstatus-container online apponly" [ngClass]="{'online' :(isOnline|async)}">
|
||||
|
||||
@ -34,8 +34,8 @@ body { background: #f1f1f1; line-height: 18px; user-select:none;font-family: Lat
|
||||
}
|
||||
|
||||
.app {
|
||||
width:100%;
|
||||
height:100%;
|
||||
width:100vw;
|
||||
height:100vh;
|
||||
}
|
||||
|
||||
.app > .navbar {
|
||||
@ -124,8 +124,3 @@ body { background: #f1f1f1; line-height: 18px; user-select:none;font-family: Lat
|
||||
.online {
|
||||
max-height:0em;
|
||||
}
|
||||
|
||||
fm-app-menu,fm-user-menu {
|
||||
display: inline-block;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
@ -42,7 +42,6 @@ export class AppComponent implements OnInit, OnDestroy {
|
||||
public routeLoading: Observable<boolean> = this.store$.select(appReducers.selectGetRouteLoading);
|
||||
public menuVisible: Observable<boolean> = this.store$.select(appReducers.SelectGetMenuVisible);
|
||||
public accountMenuVisible: Observable<boolean> = this.store$.select(appReducers.SelectGetAccountMenuVisible);
|
||||
public appMenuVisible: Observable<boolean> = this.store$.select(appReducers.SelectGetAppMenuVisible);
|
||||
public user: Observable<IUser> = this.store$.select(appReducers.SelectGetUser);
|
||||
public isPageMode: Observable<boolean> = this.store$.select(appReducers.SelectGetIsPageMode);
|
||||
@Input() showUploadProgress: boolean = true;
|
||||
@ -102,10 +101,6 @@ export class AppComponent implements OnInit, OnDestroy {
|
||||
return action;
|
||||
}
|
||||
|
||||
async loadItemTypes() {
|
||||
await this.itemTypeService$.load(this.appConfig$)
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.InstallRouteEventHandler();
|
||||
this.InstallEventServiceEventHandler();
|
||||
@ -113,7 +108,7 @@ export class AppComponent implements OnInit, OnDestroy {
|
||||
this.InstallHealthCheck();
|
||||
|
||||
//load item types
|
||||
this.loadItemTypes();
|
||||
this.itemTypeService$.load(this.appConfig$)
|
||||
}
|
||||
|
||||
@HostListener('document:keyup', ['$event'])
|
||||
|
||||
@ -13,8 +13,6 @@ export class AuthCallbackComponent {
|
||||
oauthService$.loadDiscoveryDocument().then(() => {
|
||||
oauthService$.tryLoginCodeFlow().then(() => {
|
||||
router$.navigateByUrl((oauthService$.state && oauthService$.state!="")?decodeURIComponent(oauthService$.state):"");
|
||||
}).catch(() => {
|
||||
router$.navigateByUrl("/");
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
@ -7,6 +7,7 @@
|
||||
text-align: center;
|
||||
font-size: 1rem;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
div.menu-button > span {
|
||||
|
||||
@ -3,14 +3,4 @@ export interface IUser {
|
||||
name?: string;
|
||||
email?: string;
|
||||
claims: any;
|
||||
firstName?: string;
|
||||
lastName?: string;
|
||||
address?: string;
|
||||
postalCode?: string;
|
||||
city?: string;
|
||||
country?: string;
|
||||
phone?: string;
|
||||
mobile?: string;
|
||||
organisation?: string;
|
||||
cocNumber?: string;
|
||||
}
|
||||
@ -21,7 +21,6 @@ export interface State {
|
||||
userPackages: IPackages,
|
||||
userSettingsRoot: IItem,
|
||||
accountMenuVisible: boolean,
|
||||
appMenuVisible: boolean,
|
||||
isOnline: boolean,
|
||||
isPageMode:boolean
|
||||
}
|
||||
@ -38,7 +37,6 @@ export const initialState: State = {
|
||||
userPackages: {},
|
||||
userSettingsRoot: null,
|
||||
accountMenuVisible: false,
|
||||
appMenuVisible: false,
|
||||
isOnline: true,
|
||||
isPageMode: true
|
||||
}
|
||||
@ -97,20 +95,17 @@ export function reducer(state = initialState, action: appCommonActions.Actions )
|
||||
});
|
||||
}
|
||||
case appCommonActions.TOGGLEMENU: {
|
||||
return tassign(state, { menuVisible: !state.menuVisible,accountMenuVisible:!state.menuVisible?false:state.accountMenuVisible,appMenuVisible:!state.menuVisible?false:state.appMenuVisible });
|
||||
return tassign(state, { menuVisible: !state.menuVisible,accountMenuVisible:!state.menuVisible?false:state.accountMenuVisible });
|
||||
}
|
||||
case appCommonActions.TOGGLEACCOUNTMENU: {
|
||||
return tassign(state, { accountMenuVisible: !state.accountMenuVisible,appMenuVisible:false });
|
||||
}
|
||||
case appCommonActions.TOGGLEAPPMENU: {
|
||||
return tassign(state, { appMenuVisible: !state.appMenuVisible,accountMenuVisible:false });
|
||||
return tassign(state, { accountMenuVisible: !state.accountMenuVisible });
|
||||
}
|
||||
case appCommonActions.ESCAPE: {
|
||||
return tassign(state, { menuVisible: false,accountMenuVisible:false,appMenuVisible: false });
|
||||
return tassign(state, { menuVisible: false,accountMenuVisible:false });
|
||||
}
|
||||
case appCommonActions.SETMENUVISIBLE: {
|
||||
let a = action as appCommonActions.SetMenuVisible;
|
||||
return tassign(state, { menuVisible: a.visible,accountMenuVisible:a.visible?false:state.accountMenuVisible,appMenuVisible:a.visible?false:state.appMenuVisible });
|
||||
return tassign(state, { menuVisible: a.visible,accountMenuVisible:a.visible?false:state.accountMenuVisible });
|
||||
}
|
||||
case appCommonActions.INITUSERPACKAGESSUCCESS:{
|
||||
let a = action as appCommonActions.InitUserPackagesSuccess;
|
||||
@ -129,7 +124,7 @@ export function reducer(state = initialState, action: appCommonActions.Actions )
|
||||
return tassign(state,{user:null,initialized:false});
|
||||
}
|
||||
case appCommonActions.CLOSEALL: {
|
||||
return tassign(state,{accountMenuVisible:false,appMenuVisible:false, menuVisible:false });
|
||||
return tassign(state,{accountMenuVisible:false,menuVisible:false });
|
||||
}
|
||||
case appCommonActions.ONLINE:{
|
||||
return tassign(state,{isOnline:true});
|
||||
@ -158,7 +153,6 @@ export const getUser = (state: State) => state.user;
|
||||
export const getUserPackages = (state: State) => state.userPackages;
|
||||
export const getUserSettingsRoot = (state: State) => state.userSettingsRoot;
|
||||
export const getAccountMenuVisible = (state: State) => state.accountMenuVisible;
|
||||
export const getAppMenuVisible = (state: State) => state.appMenuVisible;
|
||||
export const getIsOnline = (state: State) => state.isOnline;
|
||||
export const getIsPageMode = (state: State) => state.isPageMode;
|
||||
|
||||
@ -175,7 +169,6 @@ export const SelectGetUser = createSelector(selectAppCommonState,getUser);
|
||||
export const SelectGetUserPackages = createSelector(selectAppCommonState,getUserPackages);
|
||||
export const SelectGetUserSettingsRoot = createSelector(selectAppCommonState,getUserSettingsRoot);
|
||||
export const SelectGetAccountMenuVisible = createSelector(selectAppCommonState,getAccountMenuVisible);
|
||||
export const SelectGetAppMenuVisible = createSelector(selectAppCommonState,getAppMenuVisible);
|
||||
export const SelectGetIsOnline = createSelector(selectAppCommonState,getIsOnline);
|
||||
export const SelectGetIsPageMode = createSelector(selectAppCommonState,getIsPageMode);
|
||||
|
||||
|
||||
@ -18,8 +18,4 @@ export class UserService {
|
||||
getCurrentUser(): Observable<IUser> {
|
||||
return this.httpClient.get<IUser>(`${this.ApiEndpoint()}/api/v1/currentuser`);
|
||||
}
|
||||
|
||||
updateCurrentUser(user: IUser): Observable<IUser> {
|
||||
return this.httpClient.put<IUser>(`${this.ApiEndpoint()}/api/v1/currentuser`, user);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
{
|
||||
"issuer": "https://accounts.test.farmmaps.eu",
|
||||
"issuer": "https://accounts.farmmaps.awtest.nl",
|
||||
"clientId": "farmmapsdev",
|
||||
"audience": "https://test.farmmaps.eu/",
|
||||
"audience": "https://farmmaps.awtest.nl/",
|
||||
"requireHttps": true,
|
||||
"apiEndPoint": "https://test.farmmaps.eu",
|
||||
"apiEndPoint": "https://farmmaps.awtest.nl",
|
||||
"grantType":"code"
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user