diff --git a/projects/common-map/package-lock.json b/projects/common-map/package-lock.json
index 4a71f1e..6e5c34d 100644
--- a/projects/common-map/package-lock.json
+++ b/projects/common-map/package-lock.json
@@ -5,9 +5,9 @@
"requires": true,
"dependencies": {
"@farmmaps/common": {
- "version": "0.0.1-prerelease.51",
- "resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common/-/common-0.0.1-prerelease.51.tgz",
- "integrity": "sha512-1E7BDQVQ34N+dFiipHHUj9X50fpU3c8UqTLqwb9UpE+PpfLp+njN4rg2MXYwglbB8chlz/glaPPurYwjzDadxQ==",
+ "version": "0.0.1-prerelease.56",
+ "resolved": "https://repository.akkerweb.nl/repository/npm-group/@farmmaps/common/-/common-0.0.1-prerelease.56.tgz",
+ "integrity": "sha512-m9KxWsLkTSz2JI074gIJH1kDR0PCLsFAug8oBjtlU/QxgBySrvqHCRiODpNmNWnFyNTZHqKHJQefn3Q9iAil4g==",
"requires": {
"angular-oauth2-oidc": "^5.0.2",
"ngx-uploadx": "^3.1.3",
diff --git a/projects/common-map/package.json b/projects/common-map/package.json
index 4270006..c2a690d 100644
--- a/projects/common-map/package.json
+++ b/projects/common-map/package.json
@@ -5,7 +5,7 @@
"registry": "https://repository.akkerweb.nl/repository/npm-hosted/"
},
"dependencies": {
- "@farmmaps/common": "0.0.1-prerelease.51",
+ "@farmmaps/common": "0.0.1-prerelease.56",
"ngx-openlayers": "1.0.0-next.9",
"ol": "^5.3.3"
},
@@ -15,6 +15,7 @@
"@ngrx/effects": "^7.2",
"@ngrx/router-store": "^7.2",
"@ngrx/store": "^7.2",
- "tassign": "^1.0.0"
+ "tassign": "^1.0.0",
+ "@farmmaps/common": "^0.0.1"
}
}
diff --git a/projects/common-map/src/fm-map/common-map.module.ts b/projects/common-map/src/fm-map/common-map.module.ts
index ca9815b..dbfdced 100644
--- a/projects/common-map/src/fm-map/common-map.module.ts
+++ b/projects/common-map/src/fm-map/common-map.module.ts
@@ -12,9 +12,17 @@ import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
import { AppCommonModule } from '@farmmaps/common';
import { MODULE_NAME } from './module-name';
-import * as mapReducer from './reducers/map.reducer';
+import * as mapReducers from './reducers/map.reducer';
+import * as mapActions from './actions/map.actions';
import * as mapEffects from './effects/map.effects';
+import { IMapState} from './models';
+import { ISelectedFeatures } from './models';
+import { IItemLayer } from './models';
+import { ItemLayer} from './models';
+import { IQueryState } from './models';
+import { IPeriodState } from './models';
+
// components
import { GpsLocation} from './components/aol/gps-location/gps-location.component';
//import {Switch2D3DComponent } from './components/aol/switch2d3d/switch2d3d.component';
@@ -58,7 +66,8 @@ import { WidgetStatusComponent } from './components/widget-status/widget-status.
export {
mapEffects,
- mapReducer,
+ mapReducers,
+ mapActions,
ZoomToExtentComponent,
ItemVectorSourceComponent,
ItemFeaturesSourceComponent,
@@ -99,7 +108,13 @@ export {
AbstractItemListItemComponent,
AbstractItemListComponent,
StateSerializerService,
- GeolocationService
+ GeolocationService,
+ IMapState,
+ ISelectedFeatures,
+ IItemLayer,
+ ItemLayer,
+ IQueryState,
+ IPeriodState
}
@NgModule({
@@ -107,7 +122,7 @@ export {
CommonModule,
AngularOpenlayersModule,
MapRoutingModule,
- StoreModule.forFeature(MODULE_NAME, mapReducer.reducer),
+ StoreModule.forFeature(MODULE_NAME, mapReducers.reducer),
EffectsModule.forFeature([mapEffects.MapEffects]),
NgbModule,
FormsModule,
diff --git a/projects/common-map/src/fm-map/components/map/map.component.html b/projects/common-map/src/fm-map/components/map/map.component.html
index 1c6009d..6ad1c2a 100644
--- a/projects/common-map/src/fm-map/components/map/map.component.html
+++ b/projects/common-map/src/fm-map/components/map/map.component.html
@@ -46,51 +46,11 @@
-
+
-
-
-
-
-
-
+
+
diff --git a/projects/common-map/src/fm-map/components/map/map.component.scss b/projects/common-map/src/fm-map/components/map/map.component.scss
index 8b4f02a..71dac1a 100644
--- a/projects/common-map/src/fm-map/components/map/map.component.scss
+++ b/projects/common-map/src/fm-map/components/map/map.component.scss
@@ -91,11 +91,6 @@ div.logo {
margin-bottom:1em;
}
-div.logo img {
- width:100%;
- align-self:center;
-}
-
div.logo button {
margin-left:1em;
}
diff --git a/projects/common/src/fm/common.module.ts b/projects/common/src/fm/common.module.ts
index 7da9a9c..021dacb 100644
--- a/projects/common/src/fm/common.module.ts
+++ b/projects/common/src/fm/common.module.ts
@@ -1,5 +1,5 @@
// angular modules
-import { NgModule, APP_INITIALIZER, ModuleWithProviders, Injector } from '@angular/core';
+import { NgModule, APP_INITIALIZER, ModuleWithProviders, Injector,Optional,SkipSelf } from '@angular/core';
import { CommonModule, DatePipe } from '@angular/common';
import { HttpClientModule, HttpClient, HTTP_INTERCEPTORS } from '@angular/common/http';
import { FormsModule } from '@angular/forms';
@@ -137,6 +137,12 @@ export {FolderService,
]
})
export class AppCommonModule {
+ constructor (@Optional() @SkipSelf() parentModule: AppCommonModule) {
+ if (parentModule) {
+ throw new Error(
+ 'AppCommonModule is already loaded. Import it in the AppModule only');
+ }
+ }
static forRoot(): ModuleWithProviders {
return {
ngModule: AppCommonModule,
@@ -152,19 +158,7 @@ export class AppCommonModule {
provide: HTTP_INTERCEPTORS,
useClass: AccessTokenInterceptor,
multi: true
- },
- ResumableFileUploadService,
- EventService,
- FolderService,
- UserService,
- ItemService,
- TypeaheadService,
- AuthCallbackGuard,
- AuthGuard,
- NavBarGuard,
- FullScreenGuard,
- TimespanService,
- ItemTypeService
+ }
]
};
}
diff --git a/projects/common/src/fm/services/auth-guard.service.ts b/projects/common/src/fm/services/auth-guard.service.ts
index 5c75284..3799812 100644
--- a/projects/common/src/fm/services/auth-guard.service.ts
+++ b/projects/common/src/fm/services/auth-guard.service.ts
@@ -13,7 +13,9 @@ import * as appCommonReducer from '../reducers/app-common.reducer'
import * as appCommonActions from '../actions/app-common.actions';
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class AuthGuard implements CanActivate, CanLoad, CanActivateChild {
private loginDispatched = false;
diff --git a/projects/common/src/fm/services/date-adapter.service.ts b/projects/common/src/fm/services/date-adapter.service.ts
index a942580..fea6b8a 100644
--- a/projects/common/src/fm/services/date-adapter.service.ts
+++ b/projects/common/src/fm/services/date-adapter.service.ts
@@ -1,7 +1,9 @@
import { Component, Injectable } from '@angular/core';
import { NgbDateAdapter, NgbDateStruct } from '@ng-bootstrap/ng-bootstrap';
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class NgbDateNativeAdapter extends NgbDateAdapter {
fromModel(date: Date): NgbDateStruct {
diff --git a/projects/common/src/fm/services/event.service.ts b/projects/common/src/fm/services/event.service.ts
index 70755b7..2391478 100644
--- a/projects/common/src/fm/services/event.service.ts
+++ b/projects/common/src/fm/services/event.service.ts
@@ -6,7 +6,9 @@ import { HubConnection, HubConnectionBuilder, LogLevel ,HttpTransportType} from
import { AppConfig } from "../shared/app.config";
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class EventService {
public event:Subject = new Subject();
diff --git a/projects/common/src/fm/services/folder.service.ts b/projects/common/src/fm/services/folder.service.ts
index f714b77..5ac8740 100644
--- a/projects/common/src/fm/services/folder.service.ts
+++ b/projects/common/src/fm/services/folder.service.ts
@@ -6,7 +6,9 @@ import { IItem } from '../models/item';
import { HttpClient } from "@angular/common/http";
import { AppConfig } from "../shared/app.config";
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class FolderService {
constructor(public httpClient: HttpClient, public appConfig: AppConfig) {
diff --git a/projects/common/src/fm/services/full-screen-guard.service.ts b/projects/common/src/fm/services/full-screen-guard.service.ts
index 59e9e1d..9e36f5a 100644
--- a/projects/common/src/fm/services/full-screen-guard.service.ts
+++ b/projects/common/src/fm/services/full-screen-guard.service.ts
@@ -7,7 +7,9 @@ import * as appCommonReducer from '../reducers/app-common.reducer'
import * as appCommonActions from '../actions/app-common.actions';
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class FullScreenGuard implements CanActivate {
private loginDispatched = false;
diff --git a/projects/common/src/fm/services/item.service.ts b/projects/common/src/fm/services/item.service.ts
index 2b42895..1024d4e 100644
--- a/projects/common/src/fm/services/item.service.ts
+++ b/projects/common/src/fm/services/item.service.ts
@@ -7,7 +7,9 @@ import { IItemTask } from '../models/itemTask';
import { HttpClient, HttpParams } from "@angular/common/http";
import { AppConfig } from "../shared/app.config";
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class ItemService {
constructor(public httpClient: HttpClient, public appConfig: AppConfig) {
}
diff --git a/projects/common/src/fm/services/itemtype.service.ts b/projects/common/src/fm/services/itemtype.service.ts
index 62fed20..dc030af 100644
--- a/projects/common/src/fm/services/itemtype.service.ts
+++ b/projects/common/src/fm/services/itemtype.service.ts
@@ -4,7 +4,9 @@ import * as appCommonReducer from '../reducers/app-common.reducer'
import {IItemTypes} from '../models/item.types'
import {IItem} from '../models/item'
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class ItemTypeService {
public itemTypes: IItemTypes;
diff --git a/projects/common/src/fm/services/nav-bar-guard.service.ts b/projects/common/src/fm/services/nav-bar-guard.service.ts
index 93142af..5a82428 100644
--- a/projects/common/src/fm/services/nav-bar-guard.service.ts
+++ b/projects/common/src/fm/services/nav-bar-guard.service.ts
@@ -7,7 +7,9 @@ import * as appCommonReducer from '../reducers/app-common.reducer'
import * as appCommonActions from '../actions/app-common.actions';
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class NavBarGuard implements CanActivate {
private loginDispatched = false;
diff --git a/projects/common/src/fm/services/timespan.service.ts b/projects/common/src/fm/services/timespan.service.ts
index cb623b0..6c7ce41 100644
--- a/projects/common/src/fm/services/timespan.service.ts
+++ b/projects/common/src/fm/services/timespan.service.ts
@@ -3,7 +3,9 @@ import { DatePipe } from '@angular/common';
import { Observable , Observer } from 'rxjs';
import { ITypeaheadItem } from '../models/typeahead.item';
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class TimespanService {
constructor(private datePipe: DatePipe) {
}
diff --git a/projects/common/src/fm/services/typeahead.service.ts b/projects/common/src/fm/services/typeahead.service.ts
index d979092..a4e7495 100644
--- a/projects/common/src/fm/services/typeahead.service.ts
+++ b/projects/common/src/fm/services/typeahead.service.ts
@@ -4,7 +4,9 @@ import { ITypeaheadItem } from '../models/typeahead.item';
import { HttpClient, HttpParams } from "@angular/common/http";
import { AppConfig } from "../shared/app.config";
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class TypeaheadService {
constructor(public httpClient: HttpClient, public appConfig: AppConfig) {
}
diff --git a/projects/common/src/fm/services/user.service.ts b/projects/common/src/fm/services/user.service.ts
index 2c29fc2..fd9e668 100644
--- a/projects/common/src/fm/services/user.service.ts
+++ b/projects/common/src/fm/services/user.service.ts
@@ -4,7 +4,9 @@ import { IUser } from '../models/user';
import { HttpClient } from "@angular/common/http";
import { AppConfig } from "../shared/app.config";
-@Injectable()
+@Injectable({
+ providedIn: 'root',
+})
export class UserService {
constructor(public httpClient: HttpClient, public appConfig: AppConfig) {
}
diff --git a/projects/common/src/fm/shared/app.config.ts b/projects/common/src/fm/shared/app.config.ts
index d966676..9640b7d 100644
--- a/projects/common/src/fm/shared/app.config.ts
+++ b/projects/common/src/fm/shared/app.config.ts
@@ -20,7 +20,6 @@ export class AppConfig {
return this.config[key];
}
-
public load(): Promise {
return this.httpClient.get('/configuration.json')
.toPromise()
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 21dda87..ceaf760 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -3,6 +3,8 @@ import { RouterModule } from '@angular/router';
import { AuthGuard,FullScreenGuard } from '@farmmaps/common';
import { MapComponent } from '@farmmaps/common-map';
+import { LogoComponent } from './logo/logo.component';
+import { MenuComponent } from './menu/menu.component';
const routes = [
{
@@ -17,7 +19,19 @@ const routes = [
},
{
path: ':xCenter/:yCenter/:zoom/:rotation/:baseLayer/:queryState',
- component: MapComponent
+ component: MapComponent,
+ children:[
+ {
+ path: '',
+ component: LogoComponent,
+ outlet: 'side-panel-logo'
+ },
+ {
+ path: '',
+ component: MenuComponent,
+ outlet: 'side-panel-menu'
+ }
+ ]
}
]},
];
diff --git a/src/app/app.component.html b/src/app/app.component.html
deleted file mode 100644
index 506f70a..0000000
--- a/src/app/app.component.html
+++ /dev/null
@@ -1,3 +0,0 @@
-
-
-
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
deleted file mode 100644
index e69de29..0000000
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 51a6f2d..fa37eb8 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -2,9 +2,8 @@ import { Component } from '@angular/core';
@Component({
selector: 'app-root',
- templateUrl: './app.component.html',
- styleUrls: ['./app.component.scss']
+ template:''
})
export class AppRootComponent {
- title = 'farmmaps-lib-app';
+ title = 'FarmMaps';
}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 781f739..410325c 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -16,6 +16,8 @@ import {EffectsModule, EffectSources} from '@ngrx/effects';
import { StoreRouterConnectingModule} from '@ngrx/router-store';
import {AppRoutingModule} from './app-routing.module';
+import { LogoComponent } from './logo/logo.component';
+import { MenuComponent } from './menu/menu.component';
export const BOOTSTRAP_EFFECTS = new InjectionToken('Bootstrap Effects');
@@ -44,7 +46,9 @@ export function provideBootstrapEffects(effects: Type[]) {
@NgModule({
declarations: [
- AppRootComponent
+ AppRootComponent,
+ LogoComponent,
+ MenuComponent
],
imports: [
AppRoutingModule,
diff --git a/src/app/logo/logo.component.spec.ts b/src/app/logo/logo.component.spec.ts
new file mode 100644
index 0000000..09020df
--- /dev/null
+++ b/src/app/logo/logo.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LogoComponent } from './logo.component';
+
+describe('LogoComponent', () => {
+ let component: LogoComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ LogoComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LogoComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/logo/logo.component.ts b/src/app/logo/logo.component.ts
new file mode 100644
index 0000000..7465c7d
--- /dev/null
+++ b/src/app/logo/logo.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-logo',
+ template: '',
+ styles:['img {width:100%;align-self:center;}']
+})
+export class LogoComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/menu/menu.component.html b/src/app/menu/menu.component.html
new file mode 100644
index 0000000..c0802e6
--- /dev/null
+++ b/src/app/menu/menu.component.html
@@ -0,0 +1,32 @@
+
+
+
+
+
diff --git a/src/app/menu/menu.component.scss b/src/app/menu/menu.component.scss
new file mode 100644
index 0000000..b3a923a
--- /dev/null
+++ b/src/app/menu/menu.component.scss
@@ -0,0 +1,41 @@
+.menu-card {
+ margin-left:-7px;
+ padding-left:7px;
+ margin-right:-7px;
+ padding-right:7px;
+ margin-bottom:7px;
+ }
+
+ .shortcut-icon {
+ display: inline-block;
+ text-align: center;
+ margin: 0.5rem;
+ cursor:pointer;
+ }
+
+ .shortcut-icon > .icon {
+ width: 3rem;
+ height: 3rem;
+ background-color: #731e64;
+ display: inline-block;
+ text-align: center;
+ line-height: 3rem;
+ color: #ffffff;
+ font-size: 2rem;
+ }
+
+ .shortcut-icon > .caption {
+ text-align: center;
+ width: 4rem;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ color: theme-color();
+ }
+
+ .shortcut-icon > .farm-icon {
+ background-color: #731E64;
+ }
+
+ .shortcut-icon > .trijntje-icon {
+ background-color: #FAA33F;
+ }
\ No newline at end of file
diff --git a/src/app/menu/menu.component.spec.ts b/src/app/menu/menu.component.spec.ts
new file mode 100644
index 0000000..beb2d9b
--- /dev/null
+++ b/src/app/menu/menu.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MenuComponent } from './menu.component';
+
+describe('MenuComponent', () => {
+ let component: MenuComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ MenuComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(MenuComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/menu/menu.component.ts b/src/app/menu/menu.component.ts
new file mode 100644
index 0000000..23aa692
--- /dev/null
+++ b/src/app/menu/menu.component.ts
@@ -0,0 +1,77 @@
+import { Component, OnInit } from '@angular/core';
+import { commonReducers, } from '@farmmaps/common';
+import { } from '@farmmaps/common-map';
+import {mapReducers,mapActions,IItemLayer} from '@farmmaps/common-map';
+import { Store } from '@ngrx/store';
+import { tassign } from 'tassign';
+import { Observable } from 'rxjs';
+import {createEmpty,extend } from 'ol/extent';
+
+@Component({
+ selector: 'app-menu',
+ templateUrl: './menu.component.html',
+ styleUrls: ['./menu.component.scss']
+})
+export class MenuComponent implements OnInit {
+ public baseLayersCollapsed:boolean = true;
+ public overlayLayersCollapsed: boolean = true;
+ public overlayLayers: Observable>;
+ public selectedOverlayLayer: Observable;
+ public baseLayers: Observable>;
+ public selectedBaseLayer: Observable;
+
+
+ constructor( private store: Store ) { }
+
+ ngOnInit() {
+ this.overlayLayers = this.store.select(mapReducers.selectGetOverlayLayers);
+ this.selectedOverlayLayer = this.store.select(mapReducers.selectGetSelectedOverlayLayer);
+ this.baseLayers = this.store.select(mapReducers.selectGetBaseLayers);
+ this.selectedBaseLayer = this.store.select(mapReducers.selectGetSelectedBaseLayer);
+ }
+
+ handleToggleBaseLayers(event:MouseEvent) {
+ this.baseLayersCollapsed = !this.baseLayersCollapsed;
+ event.preventDefault();
+ }
+
+ handleToggleOverlayLayers(event: MouseEvent) {
+ this.overlayLayersCollapsed = !this.overlayLayersCollapsed;
+ event.preventDefault();
+ }
+
+ handlePredefinedQuery(event: MouseEvent, query: any) {
+ event.preventDefault();
+ var queryState = tassign(mapReducers.initialQueryState, query);
+ this.store.dispatch(new mapActions.DoQuery(queryState));
+ }
+
+ handleOnToggleVisibility(itemLayer: IItemLayer) {
+ this.store.dispatch(new mapActions.SetVisibility(itemLayer,!itemLayer.visible));
+ }
+
+ handleOnSetOpacity(event:{ layer: IItemLayer,opacity:number }) {
+ this.store.dispatch(new mapActions.SetOpacity(event.layer, event.opacity));
+ }
+
+ handleOnDelete(itemLayer: IItemLayer) {
+ this.store.dispatch(new mapActions.RemoveLayer(itemLayer));
+ }
+
+ handleZoomToExtent(itemLayer: IItemLayer) {
+ var extent = createEmpty();
+ extend(extent, itemLayer.layer.getExtent());
+ if (extent) {
+ this.store.dispatch(new mapActions.SetExtent(extent));
+ }
+ }
+
+ handleSelectOverlayLayer(itemLayer: IItemLayer) {
+ this.store.dispatch(new mapActions.SelectOverlayLayer(itemLayer));
+ }
+
+ handleSelectBaseLayer(itemLayer: IItemLayer) {
+ this.store.dispatch(new mapActions.SelectBaseLayer(itemLayer));
+ }
+
+}