-
-
-
- {{title}}
-{{ _activeButtonInfo.kind | translate}}
-
- = [
+ private _btnInfos: ButtonInfo[] = [
{
- kind : 'osm'
+ kind: "osm",
},
{
- kind : 'square'
+ kind: "square",
},
{
- kind : 'city'
- }
+ kind: "city",
+ },
];
private _activeButtonInfo: ButtonInfo = this._btnInfos[0];
- constructor(private translateService: TranslateService) {
+ constructor(private translateService: TranslateService) {}
+ public ngOnInit(): void {
+ this.mapComponent.getDefaultMap();
}
- private onClick(btnInfo: ButtonInfo) {
- this.setActive(btnInfo);
- this.mapComponent.mapZoom = (this.translateService.get("mapZoom")as ScalarObservable).value;
+ public ngAfterViewInit() {
+ // Init default btnInfo to first
+ this.setActive(this._btnInfos[0]);
}
- private updateTool(tool: Command & KindTool) {
+ public initMap(optionMap: OptionMap) {
+ if (optionMap.layerType) {
+ this.selectTabByLayerType(optionMap.layerType);
+ } else {
+ this.selectTabByLayerType({ kind: "osm" });
+ }
+ // Not Savable when the map load isn't save
+ if (optionMap.title) {
+ this.flagSavable = true;
+ }
+
+ this.mapComponent.map.on("mouse-drag-end", () => {
+ this.flagSavable = false;
+ this.title = this.defaultTitle;
+ this.mapComponent.resetInfos();
+ });
+
+ this.drawEdit = new AbaDrawEdit(this.mapComponent.map);
+ }
- // Personalized operation on command
- switch (tool.command) {
+ private onClick(btnInfo: ButtonInfo) {
+ this.setActive(btnInfo);
+ this.mapComponent.mapZoom = (this.translateService.get(
+ "mapZoom",
+ ) as ScalarObservable).value;
+ }
+ private updateTool(toolId: string) {
+ switch (toolId) {
case "move":
this.drawEdit.enableDraw(false);
this.mapComponent.map.enableMapNavigation();
@@ -83,85 +101,65 @@ export class EditorComponent {
this.mapComponent.map.disableMapNavigation();
break;
- case "fill":
- this.drawEdit.changeTexture(
- this.toolbarMapComponent.changeFillTool());
+ // Should be a draw shape
+ default:
+ this.mapComponent.map.disableMapNavigation();
+ this.drawEdit.enableDraw(true, toolId);
+ this.drawEdit.enableDelete(false);
+ this.drawEdit.enableEdit(false);
break;
+ }
+ }
+ private operation(operationId: string) {
+ switch (operationId) {
case "print":
- if (!this.flagSavable)
+ if (!this.flagSavable) {
this.modalYesNoComponent.open();
- else
- window.print();
-
+ } else {
+ (window as any).print();
+ }
break;
case "open":
this.modalMapComponent.open();
break;
+
case "save":
this.modalSaveMapComponent.open();
break;
- default:
- console.warn("action buttons not implemented");
+ default:
+ if (process.env.NODE_ENV !== "production") {
+ // tslint:disable-next-line no-console
+ console.warn("operation not implemented");
+ }
+ break;
}
- // Global operation on kind
- switch (tool.kind) {
- case "draw" :
- this.mapComponent.map.disableMapNavigation();
- const drawTool = tool as DrawTool;
- this.drawEdit.enableDraw(true, drawTool.drawType);
- this.drawEdit.enableDelete(false);
- this.drawEdit.enableEdit(false);
- break;
-
- case "action" :
- this.drawEdit.enableDraw(false);
- this.drawEdit.enableDelete(false);
- this.drawEdit.enableEdit(false);
- break;
- }
-
+ this.drawEdit.enableDraw(false);
+ this.drawEdit.enableDelete(false);
+ this.drawEdit.enableEdit(false);
}
private isActive(btnInfo: ButtonInfo) {
return btnInfo === this._activeButtonInfo;
}
- private setActive(btnInfo: ButtonInfo){
+ private setActive(btnInfo: ButtonInfo) {
this._activeButtonInfo = btnInfo;
- if (this.mapComponent)
+ if (this.mapComponent) {
this.mapComponent.setLayerType(btnInfo);
+ }
}
- private selectTabByLayerType(layerType : LayerType) : void {
+ private selectTabByLayerType(layerType: LayerType): void {
// Find first layer type _btnInfos
- this._btnInfos.forEach( (btnInfo) => {
- if (btnInfo.kind == layerType.kind)
- this.setActive(btnInfo)
+ this._btnInfos.forEach((btnInfo) => {
+ if (btnInfo.kind === layerType.kind) {
+ this.setActive(btnInfo);
}
- );
- }
-
- public initMap(optionMap : OptionMap){
- if (optionMap.layerType){
- this.selectTabByLayerType(optionMap.layerType);
- } else {
- this.selectTabByLayerType( {kind: "osm"} );
- }
- //Not Savable when the map load isn't save
- if(optionMap.title)
- this.flagSavable = true;
-
- this.mapComponent.map.on('mouse-drag-end', () => {
- this.flagSavable = false;
- this.title = this.defaultTitle;
- this.mapComponent.resetInfos();
});
-
- this.drawEdit = new AbaDrawEdit(this.mapComponent.map);
}
// Fire when a user choose a map
@@ -193,22 +191,14 @@ export class EditorComponent {
}
private setMapAsSavable($event): void {
- console.log("Merde");
+ if (process.env.NODE_ENV !== "production") {
+ // tslint:disable-next-line no-console
+ console.log("Merde");
+ }
this.modalSaveMapComponent.open();
}
private printMapWithoutSaving(): void {
- window.print();
- }
-
-
- ngOnInit(): void {
- this.mapComponent.getDefaultMap();
- }
-
- ngAfterViewInit() {
- // Init default btnInfo to first
- this.setActive(this._btnInfos[0]);
+ (window as any).print();
}
-
}
diff --git a/src/app/editor/editor.module.ts b/src/app/editor/editor.module.ts
index c0ddf2c..50e87f0 100644
--- a/src/app/editor/editor.module.ts
+++ b/src/app/editor/editor.module.ts
@@ -1,36 +1,30 @@
-import { NgModule } from '@angular/core';
-
-import { SharedModule } from "../shared/shared.module";
-
+import { NgModule } from "@angular/core";
+import { TranslateModule } from "ng2-translate";
/* Services */
-import { MapService } from '../map/map.service';
-
+import { MapService } from "../map/map.service";
+/* External Components */
+import { PaginationComponent } from "../shared/pagination/pagination-buttons.component";
+import { SharedModule } from "../shared/shared.module";
/* Internal Components */
-import { ModalMapComponent } from "./modal-maps-list/modal-maps-list.component";
-import { ModalSaveMapComponent } from "./modal-save-map/modal-save-map.component";
-import { ToolbarMapComponent } from "./toolbar/toolbar.component";
import { EditorComponent } from "./editor.component";
-import { SelectLangComponent } from "./select-lang/select-lang.component";
-
/* Internal Pipes */
import { FilterMapsPipe } from "./modal-maps-list/filtermaps.pipe";
-
-/* External Components */
-import { PaginationComponent } from "../shared/pagination/pagination-buttons.component";
-
-import {TranslateModule} from "ng2-translate";
+import { ModalMapComponent } from "./modal-maps-list/modal-maps-list.component";
+import { ModalSaveMapComponent } from "./modal-save-map/modal-save-map.component";
+import { SelectLangComponent } from "./select-lang/select-lang.component";
+import { ToolbarMapComponent } from "./toolbar/toolbar.component";
@NgModule({
- imports: [ SharedModule, TranslateModule ],
declarations: [
- SelectLangComponent
- , EditorComponent
- , ModalMapComponent
- , ModalSaveMapComponent
- , ToolbarMapComponent
- , FilterMapsPipe
- , PaginationComponent
+ SelectLangComponent,
+ EditorComponent,
+ ModalMapComponent,
+ ModalSaveMapComponent,
+ ToolbarMapComponent,
+ FilterMapsPipe,
+ PaginationComponent,
],
- providers: [ MapService ]
+ imports: [SharedModule, TranslateModule],
+ providers: [MapService],
})
-export class EditorModule { }
+export class EditorModule {}
diff --git a/src/app/editor/modal-maps-list/filtermaps.pipe.ts b/src/app/editor/modal-maps-list/filtermaps.pipe.ts
index 290589e..6a6f732 100644
--- a/src/app/editor/modal-maps-list/filtermaps.pipe.ts
+++ b/src/app/editor/modal-maps-list/filtermaps.pipe.ts
@@ -1,23 +1,24 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { OptionMap } from "../../map/map";
-
-
-@Pipe({name: 'filterMaps'})
-export class FilterMapsPipe implements PipeTransform {
- transform(maps: OptionMap[], query: string, activePage: number): OptionMap[] {
- const filteredMaps = maps
- .filter(
- m => {
- if (m.title === undefined){
- m.title = "";
- }
- if (m.uid === undefined){
- m.uid = -1;
- }
- return m.title.toString().toLowerCase().includes(query.toLowerCase()) || m.uid.toString().includes(query);
- }
- );
-
- return filteredMaps;
- }
-}
+import { Pipe, PipeTransform } from "@angular/core";
+import { OptionMap } from "../../map/map";
+
+@Pipe({ name: "filterMaps" })
+export class FilterMapsPipe implements PipeTransform {
+ public transform(maps: OptionMap[], query: string, activePage: number): OptionMap[] {
+ const filteredMaps = maps.filter((m) => {
+ if (m.title === undefined) {
+ m.title = "";
+ }
+ if (m.uid === undefined) {
+ m.uid = -1;
+ }
+ return (
+ m.title
+ .toString()
+ .toLowerCase()
+ .includes(query.toLowerCase()) || m.uid.toString().includes(query)
+ );
+ });
+
+ return filteredMaps;
+ }
+}
diff --git a/src/app/editor/modal-maps-list/modal-maps-list.component.ts b/src/app/editor/modal-maps-list/modal-maps-list.component.ts
index 32bbc9f..5e38ffb 100644
--- a/src/app/editor/modal-maps-list/modal-maps-list.component.ts
+++ b/src/app/editor/modal-maps-list/modal-maps-list.component.ts
@@ -1,66 +1,63 @@
-import { Component, Input, Output, EventEmitter } from "@angular/core";
-import { MapService } from "../../map/map.service";
-import { OptionMap } from "../../map/map";
-import * as _ from "lodash";
-
-import {TranslateService} from 'ng2-translate';
-
-@Component({
- selector: 'aba-modal-maps',
- templateUrl: 'modal-maps-list.component.html',
- styleUrls: ['modal-maps-list.component.css']
-})
-export class ModalMapComponent {
-
- @Input('visible') visible: boolean = false;
- @Output() onSelectEvent: EventEmitter<[number, string]> = new EventEmitter();
-
- private maps: OptionMap[] = [];
- private queryInputValue: string = "";
- private activePage = 1;
- private readonly chunkListSize = 8;
-
-
- constructor(private mapService: MapService,private translateService: TranslateService) {
- }
-
- private isVisible(): boolean {
- return this.visible;
- }
-
- public open(): void {
- this.visible = true;
- this.activePage = 1;
- this.queryInputValue = "";
-
- this.mapService.maps().subscribe(
- (maps : OptionMap[]) => {
- this.maps = maps;
- },
- (error) => {
- console.log(error);
- }
- );
- }
- public close(): void {
- this.visible = false;
- }
-
- private onChange(): void {
- this.activePage = 1;
- }
-
- private onClick(info: [number, string]): void {
- this.close();
- this.onSelectEvent.emit(info);
- }
-
- private range(n): number[] {
- return _.range(1, n+1);
- }
-
- private updateSelectedPage(idPage: number){
- this.activePage = idPage;
- }
-
-}
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+import * as _ from "lodash";
+import { TranslateService } from "ng2-translate";
+import { OptionMap } from "../../map/map";
+import { MapService } from "../../map/map.service";
+
+@Component({
+ selector: "aba-modal-maps",
+ styleUrls: ["modal-maps-list.component.css"],
+ templateUrl: "modal-maps-list.component.html",
+})
+export class ModalMapComponent {
+ @Input("visible") public visible: boolean = false;
+ @Output() public onSelectEvent: EventEmitter<[number, string]> = new EventEmitter();
+
+ private maps: OptionMap[] = [];
+ private queryInputValue: string = "";
+ private activePage = 1;
+ private readonly chunkListSize = 8;
+
+ constructor(
+ private mapService: MapService,
+ private translateService: TranslateService,
+ ) {}
+
+ public open(): void {
+ this.visible = true;
+ this.activePage = 1;
+ this.queryInputValue = "";
+
+ this.mapService.maps().subscribe(
+ (maps: OptionMap[]) => {
+ this.maps = maps;
+ },
+ (error) => console.error(error), // tslint:disable-line no-console
+ );
+ }
+
+ public close(): void {
+ this.visible = false;
+ }
+
+ private isVisible(): boolean {
+ return this.visible;
+ }
+
+ private onChange(): void {
+ this.activePage = 1;
+ }
+
+ private onClick(info: [number, string]): void {
+ this.close();
+ this.onSelectEvent.emit(info);
+ }
+
+ private range(n): number[] {
+ return _.range(1, n + 1);
+ }
+
+ private updateSelectedPage(idPage: number) {
+ this.activePage = idPage;
+ }
+}
diff --git a/src/app/editor/modal-save-map/modal-save-map.component.ts b/src/app/editor/modal-save-map/modal-save-map.component.ts
index f4cf20d..58950cb 100644
--- a/src/app/editor/modal-save-map/modal-save-map.component.ts
+++ b/src/app/editor/modal-save-map/modal-save-map.component.ts
@@ -1,35 +1,33 @@
-import { Component, Input, Output, EventEmitter } from "@angular/core";
-import {TranslateService} from 'ng2-translate';
-
-@Component({
- selector: 'aba-modal-save-map',
- templateUrl: 'modal-save-map.component.html',
- styleUrls: ['modal-save-map.component.css']
-})
-export class ModalSaveMapComponent {
-
- @Input('visible') visible: boolean = false;
- @Output() onSaveEvent: EventEmitter = new EventEmitter();
-
- private title: string = "";
-
- constructor(private translateService: TranslateService) {
- }
-
- private isVisible(): boolean {
- return this.visible;
- }
-
- public open(): void {
- this.visible = true;
- }
- public close(): void{
- this.visible = false;
- }
-
- private onSubmit(): void {
- this.close();
- this.onSaveEvent.emit( {title: this.title} );
- }
-
-}
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+import { TranslateService } from "ng2-translate";
+
+@Component({
+ selector: "aba-modal-save-map",
+ styleUrls: ["modal-save-map.component.css"],
+ templateUrl: "modal-save-map.component.html",
+})
+export class ModalSaveMapComponent {
+ @Input("visible") public visible: boolean = false;
+ @Output() public onSaveEvent: EventEmitter = new EventEmitter();
+
+ private title: string = "";
+
+ constructor(private translateService: TranslateService) {}
+
+ public open(): void {
+ this.visible = true;
+ }
+
+ public close(): void {
+ this.visible = false;
+ }
+
+ private isVisible(): boolean {
+ return this.visible;
+ }
+
+ private onSubmit(): void {
+ this.close();
+ this.onSaveEvent.emit({ title: this.title });
+ }
+}
diff --git a/src/app/editor/select-lang/select-lang.component.ts b/src/app/editor/select-lang/select-lang.component.ts
index 97355ee..b37e039 100644
--- a/src/app/editor/select-lang/select-lang.component.ts
+++ b/src/app/editor/select-lang/select-lang.component.ts
@@ -1,22 +1,19 @@
-import { Component, Input, Output, EventEmitter } from "@angular/core";
-import {TranslateService} from 'ng2-translate';
-
-@Component({
- selector: 'aba-select-lang',
- templateUrl: 'select-lang.component.html',
- styleUrls: ['select-lang.component.css']
-})
-export class SelectLangComponent {
-
- private _langsDropDowns : Array = this.translateService.getLangs();
- private _activeLangsDropDowns : string = this.translateService.getBrowserLang();;
-
- constructor(private translateService: TranslateService) {
- }
-
- /** Triggerd when user change the lang */
- onChange(newValue) {
- this.translateService.use(newValue);
- }
-
-}
+import { Component } from "@angular/core";
+import { TranslateService } from "ng2-translate";
+
+@Component({
+ selector: "aba-select-lang",
+ styleUrls: ["select-lang.component.css"],
+ templateUrl: "select-lang.component.html",
+})
+export class SelectLangComponent {
+ private _langsDropDowns: string[] = this.translateService.getLangs();
+ private _activeLangsDropDowns: string = this.translateService.getBrowserLang();
+
+ constructor(private translateService: TranslateService) {}
+
+ /** Triggerd when user change the lang */
+ public onChange(newValue) {
+ this.translateService.use(newValue);
+ }
+}
diff --git a/src/app/editor/toolbar/img/dot.png b/src/app/editor/toolbar/img/dot.png
deleted file mode 100644
index 13cb07b..0000000
Binary files a/src/app/editor/toolbar/img/dot.png and /dev/null differ
diff --git a/src/app/editor/toolbar/img/passage.png b/src/app/editor/toolbar/img/passage.png
deleted file mode 100644
index de045de..0000000
Binary files a/src/app/editor/toolbar/img/passage.png and /dev/null differ
diff --git a/src/app/editor/toolbar/img/pedestrian2.png b/src/app/editor/toolbar/img/pedestrian2.png
deleted file mode 100644
index d99fb25..0000000
Binary files a/src/app/editor/toolbar/img/pedestrian2.png and /dev/null differ
diff --git a/src/app/editor/toolbar/toolbar.component.css b/src/app/editor/toolbar/toolbar.component.css
index dfde57f..a68a2d9 100644
--- a/src/app/editor/toolbar/toolbar.component.css
+++ b/src/app/editor/toolbar/toolbar.component.css
@@ -19,7 +19,7 @@ img {
.btn .tooltiptext {
visibility: hidden;
- width: 120px;
+ width: 130px;
background-color: #555;
color: #fff;
text-align: center;
@@ -29,9 +29,9 @@ img {
z-index: 1;
bottom: 125%;
left: 50%;
- margin-left: -60px;
opacity: 0;
transition: opacity 1s;
+ transform: translateX(-50%);
}
.btn .tooltiptext::after {
diff --git a/src/app/editor/toolbar/toolbar.component.html b/src/app/editor/toolbar/toolbar.component.html
index d766630..09907dd 100644
--- a/src/app/editor/toolbar/toolbar.component.html
+++ b/src/app/editor/toolbar/toolbar.component.html
@@ -1,57 +1,37 @@
-
-
+
\ No newline at end of file
diff --git a/src/app/editor/editor.component.ts b/src/app/editor/editor.component.ts
index 1581060..077e10c 100644
--- a/src/app/editor/editor.component.ts
+++ b/src/app/editor/editor.component.ts
@@ -1,71 +1,89 @@
-import { Component, ViewChild } from '@angular/core';
-import { LayerType } from '../map/layer';
-import { MapComponent } from '../map/map.component'
-import { OptionMap } from '../map/map';
-import {
- ToolbarMapComponent
- , DrawTool
- , Command
- , KindTool
-} from "./toolbar/toolbar.component";
-
-import { AbaDrawEdit } from './drawEditMap';
+import { Component, ViewChild } from "@angular/core";
+import { TranslateService } from "ng2-translate";
+import { ScalarObservable } from "rxjs/observable/ScalarObservable";
+import { LayerType } from "../map/layer";
+import { OptionMap } from "../map/map";
+import { MapComponent } from "../map/map.component";
+import { ModalYesNoComponent } from "../shared/modal-yesno/modal-yesno.component";
+import { AbaDrawEdit } from "./drawEditMap";
import { ModalMapComponent } from "./modal-maps-list/modal-maps-list.component";
import { ModalSaveMapComponent } from "./modal-save-map/modal-save-map.component";
-import {ModalYesNoComponent} from "../shared/modal-yesno/modal-yesno.component";
+import { ToolbarMapComponent } from "./toolbar/toolbar.component";
-import {TranslateService} from 'ng2-translate';
-import {ScalarObservable} from 'rxjs/observable/ScalarObservable';
-
-type ButtonInfo = LayerType ;
+type ButtonInfo = LayerType;
@Component({
- selector: 'aba-editor',
- templateUrl: 'editor.component.html',
- styleUrls: ['editor.component.css']
+ selector: "aba-editor",
+ styleUrls: ["editor.component.css"],
+ templateUrl: "editor.component.html",
})
export class EditorComponent {
+ @ViewChild(MapComponent) public mapComponent: MapComponent;
+ @ViewChild(ToolbarMapComponent) public toolbarMapComponent: ToolbarMapComponent;
- @ViewChild(MapComponent) mapComponent: MapComponent;
- @ViewChild(ToolbarMapComponent) toolbarMapComponent: ToolbarMapComponent;
-
- @ViewChild(ModalMapComponent) modalMapComponent: ModalMapComponent;
- @ViewChild(ModalSaveMapComponent) modalSaveMapComponent: ModalSaveMapComponent;
- @ViewChild(ModalYesNoComponent) modalYesNoComponent: ModalYesNoComponent;
+ @ViewChild(ModalMapComponent) public modalMapComponent: ModalMapComponent;
+ @ViewChild(ModalSaveMapComponent) public modalSaveMapComponent: ModalSaveMapComponent;
+ @ViewChild(ModalYesNoComponent) public modalYesNoComponent: ModalYesNoComponent;
- private readonly defaultTitle: string = "AbaPlans";
- private flagSavable: boolean = false;
- title = this.defaultTitle;
+ public readonly defaultTitle: string = "AbaPlans";
+ public flagSavable: boolean = false;
+ public title = this.defaultTitle;
- drawEdit : AbaDrawEdit;
+ public drawEdit: AbaDrawEdit;
- private _btnInfos: Array
+
-
+
-
-
-
-
-
+
-
-
-
+
-
+
-
-
-
-
-
-
-
-
-
-
+
+
-
-
-
-
+
+
-
- = new EventEmitter();
-
- // Array of state for the fill button
- private fillState : Array = [
- {
- kind: 'texture',
- command: 'fill',
- image: require("file?name=./assets/[name].[ext]!./img/blackTextureFill.png"),
- color: 'white',
- texture: 'black'
- },
- {
- kind: 'texture',
- command: 'fill',
- image: require("file?name=./assets/[name].[ext]!./img/whiteTextureFill.png"),
- color: 'black',
- texture: 'white'
- },
- {
- kind: 'texture',
- command: 'fill',
- image: require("file?name=./assets/[name].[ext]!./img/water.png"),
- color: 'black',
- texture: 'water'
- },
- ];
- private activeFill: number = 0;
-
- private tools: Array = [
- {
- kind: 'edit',
- command: 'move',
- image: require("file?name=./assets/[name].[ext]!./img/move.png")
- },
- {
- kind: 'edit',
- command: 'select',
- image: require("file?name=./assets/[name].[ext]!./img/select.png")
- },
- {
- kind: 'edit',
- command: 'delete',
- image: require("file?name=./assets/[name].[ext]!./img/delete.png")
- },
- {
- kind: 'draw',
- command: 'draw_circle',
- drawType : { kind: 'circle' },
- image: require("file?name=./assets/[name].[ext]!./img/circle.png")
- },
- {
- kind: 'draw',
- command: 'draw_polygon',
- drawType : { kind: 'polygon' },
- image: require("file?name=./assets/[name].[ext]!./img/polygon.png")
- },
- {
- kind: 'draw',
- command: 'draw_traits',
- drawType : { kind: 'line' },
- image: require("file?name=./assets/[name].[ext]!./img/dotted.png")
- },
- {
- kind: 'draw',
- command: 'draw_pedestrian',
- drawType : { kind: 'pedestrian' },
- image: require("file?name=./assets/[name].[ext]!./img/pedestrian.png")
- },
- {
- kind: 'action',
- command: 'print',
- image: require("file?name=./assets/[name].[ext]!./img/print.png")
- },
- {
- kind: 'action',
- command: 'open',
- image: require("file?name=./assets/[name].[ext]!./img/open.png")
- },
- {
- kind: 'action',
- command: 'save',
- image: require("file?name=./assets/[name].[ext]!./img/save.png")
- },
- {
- kind: 'texture',
- command: 'fill',
- image: this.fillState[this.activeFill].image,
- color: (this.fillState[this.activeFill]as TextureTool).color,
- texture : (this.fillState[this.activeFill]as TextureTool).texture
- }
- ];
- private activeTool: Tool = this.tools[0];
-
-
-
- constructor(private translateService: TranslateService){ }
-
-
- private drawTools(): Array {
- return this.tools.filter( (tool) => tool.kind === 'draw');
- }
-
- private editTools(): Array {
- return this.tools.filter( (tool) => tool.kind === 'edit');
- }
-
- private actionTools(): Array {
- return this.tools.filter( (tool) => tool.kind === 'action');
- }
-
- private textureTools(): Array {
- return this.tools.filter( (tool) => tool.kind === 'texture');
- }
-
- public changeFillTool():string{
- const item : TextureTool = (this.tools.filter( (tool) => tool.command === 'fill'))[0] as TextureTool;
- this.increaseActiveFill();
- item.color = (this.fillState[this.activeFill]as TextureTool).color;
- (item as Tool).image = this.fillState[this.activeFill].image;
- item.texture = (this.fillState[this.activeFill]as TextureTool).texture;
-
- return item.texture;
- }
-
- private increaseActiveFill() : void{
- this.activeFill++;
- if(this.fillState.length == this.activeFill)
- this.activeFill = 0;
- }
-
- public isActive(tool: Tool){
- return tool === this.activeTool;
- }
-
- public onClick(tool: Tool) {
- this.activeTool = tool;
- this.onUpdateTool.emit(tool);
- }
-
- public changeEditableState(): void {
- this.activeTool = this.tools[0];
- }
-
- public getActiveToolKind(): string{
- return this.activeTool.kind;
- }
-
- public isEditableEditButton(): boolean {
- if(this.activeTab){
- return this.activeTab.kind !== 'osm';
- }
- return false;
- }
-
-}
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+import * as deleteIconUrl from "Assets/img/icons/mouseActions/delete.png";
+import * as moveIconUrl from "Assets/img/icons/mouseActions/move.png";
+import * as selectIconUrl from "Assets/img/icons/mouseActions/select.png";
+import * as openIconUrl from "Assets/img/icons/operations/open.png";
+import * as printIconUrl from "Assets/img/icons/operations/print.png";
+import * as saveIconUrl from "Assets/img/icons/operations/save.png";
+import * as circleIconUrl from "Assets/img/icons/shapes/circle.png";
+import * as pedestrianIconUrl from "Assets/img/icons/shapes/pedestrian.png";
+import * as polygonIconUrl from "Assets/img/icons/shapes/polygon.png";
+import * as tiledLinesIconUrl from "Assets/img/icons/shapes/tiledLines.png";
+import * as blackTextureFillUrl from "Assets/img/icons/textures/black.png";
+import * as vegetationIconUrl from "Assets/img/icons/textures/vegetation.png";
+import * as waterIconUrl from "Assets/img/icons/textures/water.png";
+import * as whiteTextureFillUrl from "Assets/img/icons/textures/white.png";
+import { TranslateService } from "ng2-translate";
+import { LayerType } from "../../map/layer";
+
+export interface Button {
+ tooltip: string;
+ imageURL: string;
+ id: string;
+}
+
+@Component({
+ selector: "aba-toolbar-map",
+ styleUrls: ["toolbar.component.css"],
+ templateUrl: "toolbar.component.html",
+})
+export class ToolbarMapComponent {
+ @Input() public activeTab: LayerType;
+ @Output() public onUpdateTool: EventEmitter = new EventEmitter();
+ @Output() public onUpdateTexture: EventEmitter = new EventEmitter();
+ @Output() public onOperation: EventEmitter = new EventEmitter();
+
+ private toolButtons: Button[] = [
+ {
+ id: "move",
+ imageURL: moveIconUrl,
+ tooltip: "move",
+ },
+ {
+ id: "select",
+ imageURL: selectIconUrl,
+ tooltip: "select",
+ },
+ {
+ id: "delete",
+ imageURL: deleteIconUrl,
+ tooltip: "delete",
+ },
+ {
+ id: "circle",
+ imageURL: circleIconUrl,
+ tooltip: "draw_circle",
+ },
+ {
+ id: "polygon",
+ imageURL: polygonIconUrl,
+ tooltip: "draw_polygon",
+ },
+ {
+ id: "line",
+ imageURL: tiledLinesIconUrl,
+ tooltip: "draw_traits",
+ },
+ {
+ id: "pedestrian",
+ imageURL: pedestrianIconUrl,
+ tooltip: "draw_pedestrian",
+ },
+ ];
+
+ private textureButtons: Button[] = [
+ {
+ id: "black",
+ imageURL: blackTextureFillUrl,
+ tooltip: "texture_black",
+ },
+ {
+ id: "white",
+ imageURL: whiteTextureFillUrl,
+ tooltip: "texture_white",
+ },
+ {
+ id: "water",
+ imageURL: waterIconUrl,
+ tooltip: "texture_water",
+ },
+ {
+ id: "vegetation",
+ imageURL: vegetationIconUrl,
+ tooltip: "texture_vegetation",
+ },
+ ];
+
+ private operationButtons: Button[] = [
+ {
+ id: "print",
+ imageURL: printIconUrl,
+ tooltip: "print",
+ },
+ {
+ id: "open",
+ imageURL: openIconUrl,
+ tooltip: "open",
+ },
+ {
+ id: "save",
+ imageURL: saveIconUrl,
+ tooltip: "save",
+ },
+ ];
+
+ private activeToolId: string = this.toolButtons[0].id;
+ private activeTextureId: string = this.textureButtons[0].id;
+
+ constructor(private translateService: TranslateService) {}
+
+ public toolButtonClick(toolId: string): void {
+ this.activeToolId = toolId;
+ this.onUpdateTool.emit(toolId);
+ }
+
+ public textureButtonClick(textureId: string): void {
+ this.activeTextureId = textureId;
+ this.onUpdateTexture.emit(textureId);
+ }
+
+ public operationButtonClick(operationId: string): void {
+ this.onOperation.emit(operationId);
+ }
+
+ public isToolButtonActive(toolId: string) {
+ return this.activeToolId === toolId;
+ }
+
+ public isTextureButtonActive(textureId: string) {
+ return this.activeTextureId === textureId;
+ }
+}
diff --git a/src/app/map/assets/img/spin.gif b/src/app/map/assets/img/spin.gif
deleted file mode 100644
index 6879c3d..0000000
Binary files a/src/app/map/assets/img/spin.gif and /dev/null differ
diff --git a/src/app/map/layer.ts b/src/app/map/layer.ts
index d951a56..1db5898 100644
--- a/src/app/map/layer.ts
+++ b/src/app/map/layer.ts
@@ -1,333 +1,81 @@
-import OpenStreetMapLayer = require("esri/layers/OpenStreetMapLayer");
-import Layer = require('esri/layers/layer');
-import SimpleLineSymbol = require('esri/symbols/SimpleLineSymbol');
-import SimpleFillSymbol = require('esri/symbols/SimpleFillSymbol');
-import PictureFillSymbol = require('esri/symbols/PictureFillSymbol');
-import PictureMarkerSymbol = require('esri/symbols/PictureMarkerSymbol');
-import UniqueValueRenderer = require('esri/renderers/UniqueValueRenderer');
-import FeatureLayer = require('esri/layers/FeatureLayer');
-import SimpleRenderer = require('esri/renderers/SimpleRenderer');
-import Color = require('esri/Color');
-import urlUtils = require('esri/urlUtils');
-import * as _ from "lodash";
-import Graphic = require("esri/graphic");
-import geometryEngine = require("esri/geometry/geometryEngine");
-import esriConfig = require('esri/config');
-
-import { removeCommonSegments } from './polygon';
-import {LayerOptions} from "esri";
-
-export type LayerType = City | Square | Osm;
-export interface City { kind: "city"; }
-export interface Square { kind: "square"; }
-export interface Osm { kind: "osm"; }
-
-//esriConfig.defaults.io.corsDetection = false;
-
-urlUtils.addProxyRule({
- urlPrefix: "https://hepiageo.hesge.ch",
- //proxyUrl : "http://localhost:8880/proxy/proxy.php"
- proxyUrl : "https://audiotactile.ovh/proxy/proxy.php"
-});
-
-
-const surface = {
- hard: [
- "ilot",
- "trottoir",
- "autre_revetement_dur",
- "rocher",
- "place_aviation"
- ],
- building: [
- "batiment"
- ],
- water: [
- "eau_stagnante",
- "bassin",
- "cours_eau",
- "fontaine"
- ],
- green: [
- "roseliere",
- "paturage_boise_ouvert",
- "tourbiere",
- "autre_verte",
- "autre_culture_intensive",
- "paturage_boise_dense",
- "autre_boisee",
- "jardin",
- "foret_dense",
- "vigne",
- "champ_pre_paturage"
- ],
- linear: [
- "route_chemin",
- "chemin_de_fer"
- ]
-};
-
-const HARD_SYMBOL = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(), new Color('black'));
-
-const url_traitilles = require("file?name=./assets/[name].[ext]!./../core/img/traitilles.png");
-const url_cercle = require("file?name=./assets/[name].[ext]!./../core/img/cercle.png");
-
-const BUILDING_SYMBOL = new PictureFillSymbol(url_traitilles, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), 15, 15);
-const WATER_SYMBOL = new PictureFillSymbol(url_cercle, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), 15, 15);
-const GREEN_SYMBOL = new PictureFillSymbol(url_traitilles, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), 25, 25);
-
-const URL_FEATURE_LAYER = "https://hepiageo.hesge.ch/arcgis/rest/services/audiotactile/audiotactile/FeatureServer/";
-const URL_FEATURE_LAYER_SURFACE = URL_FEATURE_LAYER + '3';
-const URL_FEATURE_LAYER_LINEAR = URL_FEATURE_LAYER + '1';
-
-/**
- * Base class for a layer view in the ArcgisMap dom
- */
-export abstract class RootLayer {
- protected subLayers: Layer[] = [];
- public id : string;
- protected nbLayerUpdating : number = 0;
-
- public onUpdateStart? : () => void;
- public onUpdateEnd? : () => void;
-
- constructor(lt: LayerType){
- this.id = lt.kind;
- }
-
- public setVisibility(state: boolean): void {
- this.subLayers.forEach( layer => layer.setVisibility(state));
- }
-
- public layers(): Layer[] {
- return this.subLayers;
- }
-
- protected addLayer(layer : Layer): void{
- this.registerLoadEventsOnLayer(layer);
- this.subLayers.push(layer);
- }
-
- protected registerLoadEventsOnLayer(layer : Layer): void{
- // On start
- layer.on("update-start", () => {
- // First layer load start ?
- if(this.nbLayerUpdating == 0){
- this.nbLayerUpdating = this.subLayers.length;
-
- if(this.onUpdateStart)
- this.onUpdateStart();
- }
- });
-
- // On end
- layer.on("update-end", () => {
- this.nbLayerUpdating--;
-
- // Last layer load end ?
- if(this.nbLayerUpdating == 0)
- if(this.onUpdateEnd)
- this.onUpdateEnd();
- });
- }
-}
-
-/**
- * ArcgisMap Layer for City Braille representation
- */
-export class CityRootBrailleLayer extends RootLayer {
-
- constructor(){
- super( {kind: 'city'} );
- this.addLayer(new CityBrailleSubLayer());
- }
-}
-
-/**
- * ArcgisMap Layer for Square Braille representation
- */
-export class SquareRootBrailleLayer extends RootLayer {
- constructor(){
- super( {kind: 'square'} );
- this.addLayer(new SquareBrailleSubLayer());
- this.addLayer(new RailroadBrailleSubLayer());
- }
-}
-
-/**
- * ArcgisMap Layer for OpenStreet Map representation
- */
-export class OsmRootLayer extends RootLayer {
- constructor(){
- super( {kind: 'osm'} );
- this.addLayer(new OsmSubLayer());
- }
-}
-
-/**
- * Sublayer for city details
- */
-class CityBrailleSubLayer extends FeatureLayer {
-
- constructor() {
-
- super(URL_FEATURE_LAYER_SURFACE, {
- id: 'city',
- });
-
- const defaultSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), new Color("black"));
- const renderer = new UniqueValueRenderer(defaultSymbol, "type");
-
- const champs = surface.linear.concat(surface.water, surface.green);
- const LINEAR_SYMBOL = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), new Color("black"));
- //const LINEAR_SYMBOL = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 3);
-
- surface.water.forEach( (value) => renderer.addValue(value, WATER_SYMBOL) );
- //surface.green.forEach( (value) => renderer.addValue(value, GREEN_SYMBOL) );
- surface.linear.forEach( (value) => renderer.addValue(value, LINEAR_SYMBOL));
-
- this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
- this.setRenderer(renderer);
-
- }
-
-}
-
-/**
- * Sublayer for square details
- */
-class SquareBrailleSubLayer extends FeatureLayer {
-
- constructor() {
-
- super(URL_FEATURE_LAYER_SURFACE, {
- id: 'square',
- });
-
- const defaultSymbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL, new Color("black"), 0);
- const renderer = new UniqueValueRenderer(defaultSymbol, "type");
-
- //const champs = surface.green.concat(surface.building, surface.hard, surface.water, surface.linear);
- const champs = surface.building.concat(surface.hard, surface.water, surface.linear);
- const LINEAR_SYMBOL = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 3);
-
- surface.linear.forEach((value) => renderer.addValue(value, LINEAR_SYMBOL));
- surface.water.forEach((value) => renderer.addValue(value, WATER_SYMBOL));
- surface.building.forEach((value) => renderer.addValue(value, BUILDING_SYMBOL));
- surface.hard.forEach((value) => renderer.addValue(value, HARD_SYMBOL));
-
- this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
- this.setRenderer(renderer);
- }
-
-
- /* this function mutate a graphic to transform a list of coordinates representing a rings to a list of
- * segments. Thanks to this, we can remove segments intersections later.
- * Because some fields are not accessible for the Esri/Graphic type, we get it as an pojo js object
- * (jca)
- */
- transform(graphic: any): void {
-
- const xs: number[][][] = [];
-
- // Esri lib doesn't refresh all element on a map, we have to keep the original reference of the rings as a
- // good comparator
- if (graphic.geometry.originalRings === undefined) {
- graphic.geometry.originalRings = graphic.geometry.rings;
- graphic.geometry.xmin = _.minBy(graphic.geometry.originalRings[0], g => g[0] )[0];
- graphic.geometry.xmax = _.maxBy(graphic.geometry.originalRings[0], g => g[0] )[0];
- graphic.geometry.ymin = _.minBy(graphic.geometry.originalRings[0], g => g[1] )[1];
- graphic.geometry.ymax = _.maxBy(graphic.geometry.originalRings[0], g => g[1] )[1];
- }
- graphic.geometry.originalRings.forEach(r => {
- const set: number[] = _.flatten(r.map( g => [g, g])).slice(1) as number[];
- set.pop();
- xs.push(_.chunk(set, 2));
- });
- graphic.geometry.rings = _.flatten(xs);
- }
-
- /* Fires when a layer has finished updating its content
- * We compare way-objects segments and remove those which intersect
- * (jca)
- */
- onUpdateEnd(){
-
- const pathsGraphics = this.graphics.filter( g => g.attributes.type === 'route_chemin');
- pathsGraphics.forEach( g => this.transform(g) );
-
- const railwaysGraphics = this.graphics.filter( g => g.attributes.type === 'chemin_de_fer');
- railwaysGraphics.forEach( g => this.transform(g) );
-
- removeCommonSegments(pathsGraphics);
- removeCommonSegments(railwaysGraphics);
-
- // Reorder paths
- railwaysGraphics.filter(g => g.getShape() !== null).forEach(g => g.getShape().moveToFront());
- pathsGraphics.filter(g => g.getShape() !== null).forEach(g => g.getShape().moveToFront());
-
- this.redraw();
-
- }
-}
-
-/**
- * Sublayer for stairs details
- */
-class StairsBrailleLayer extends FeatureLayer {
-
- constructor() {
-
- super(URL_FEATURE_LAYER_LINEAR, {
- id: 'stairs',
- });
-
- const defaultSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), new Color("black"));
- const renderer = new UniqueValueRenderer(defaultSymbol, "type");
-
- const object1 = 'escalier_important';
- const object2 = 'tunnel_passage_inferieur_galerie';
- const champs = [object1, object2];
-
- renderer.addValue(object1, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 1));
- renderer.addValue(object2, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 1));
-
- this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
- this.setRenderer(renderer);
-
- }
-
-}
-
-/**
- * Sublayer for railroad details
- */
-class RailroadBrailleSubLayer extends FeatureLayer {
-
- constructor() {
-
- super(URL_FEATURE_LAYER_LINEAR, {
- id: 'railroad',
- });
-
- const defaultSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_NULL, new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL), new Color("black"));
- const renderer = new UniqueValueRenderer(defaultSymbol, "type");
-
- const object = 'voie_ferree';
- const champs = [object];
-
- renderer.addValue(object, new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 3));
-
- this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
- this.setRenderer(renderer);
-
- }
-}
-
-class OsmSubLayer extends OpenStreetMapLayer {
- public id: string = "osm";
- constructor() {
- super();
- this.setMaxScale(25);
- }
-}
+import Color = require("esri/Color");
+import esriConfig = require("esri/config");
+import geometryEngine = require("esri/geometry/geometryEngine");
+import Graphic = require("esri/graphic");
+import Layer = require("esri/layers/layer");
+import OpenStreetMapLayer = require("esri/layers/OpenStreetMapLayer");
+import SimpleRenderer = require("esri/renderers/SimpleRenderer");
+import PictureFillSymbol = require("esri/symbols/PictureFillSymbol");
+import PictureMarkerSymbol = require("esri/symbols/PictureMarkerSymbol");
+import SimpleFillSymbol = require("esri/symbols/SimpleFillSymbol");
+import SimpleLineSymbol = require("esri/symbols/SimpleLineSymbol");
+import urlUtils = require("esri/urlUtils");
+
+export type LayerType = City | Square | Osm;
+export interface City {
+ kind: "city";
+}
+export interface Square {
+ kind: "square";
+}
+export interface Osm {
+ kind: "osm";
+}
+
+urlUtils.addProxyRule({
+ proxyUrl: "https://audiotactile.ovh/proxy/proxy.php",
+ urlPrefix: "https://hepiageo.hesge.ch",
+});
+
+/**
+ * Base class for a layer view in the ArcgisMap dom
+ */
+export abstract class RootLayer {
+ public id: string;
+ public onUpdateStart?: () => void;
+ public onUpdateEnd?: () => void;
+
+ protected subLayers: Layer[] = [];
+ protected nbLayerUpdating: number = 0;
+
+ constructor(lt: LayerType) {
+ this.id = lt.kind;
+ }
+
+ public setVisibility(state: boolean): void {
+ this.subLayers.forEach((layer) => layer.setVisibility(state));
+ }
+
+ public layers(): Layer[] {
+ return this.subLayers;
+ }
+
+ protected addLayer(layer: Layer): void {
+ this.registerLoadEventsOnLayer(layer);
+ this.subLayers.push(layer);
+ }
+
+ protected registerLoadEventsOnLayer(layer: Layer): void {
+ // On start
+ layer.on("update-start", () => {
+ // First layer load start ?
+ if (this.nbLayerUpdating === 0) {
+ this.nbLayerUpdating = this.subLayers.length;
+
+ if (this.onUpdateStart) {
+ this.onUpdateStart();
+ }
+ }
+ });
+
+ // On end
+ layer.on("update-end", () => {
+ this.nbLayerUpdating--;
+
+ // Last layer load end ?
+ if (this.nbLayerUpdating === 0 && this.onUpdateEnd) {
+ this.onUpdateEnd();
+ }
+ });
+ }
+}
diff --git a/src/app/map/layers/CityBrailleSubLayer.ts b/src/app/map/layers/CityBrailleSubLayer.ts
new file mode 100644
index 0000000..42777b9
--- /dev/null
+++ b/src/app/map/layers/CityBrailleSubLayer.ts
@@ -0,0 +1,43 @@
+import Color = require("esri/Color");
+import FeatureLayer = require("esri/layers/FeatureLayer");
+import UniqueValueRenderer = require("esri/renderers/UniqueValueRenderer");
+import SimpleFillSymbol = require("esri/symbols/SimpleFillSymbol");
+import SimpleLineSymbol = require("esri/symbols/SimpleLineSymbol");
+
+import { URL_FEATURE_LAYER_SURFACE } from "../../../conf/featureLayerApiUrls";
+import Surfaces from "../../../conf/surfaces";
+import { WATER_SYMBOL } from "../symbols";
+
+/**
+ * Sublayer for city details
+ */
+export default class CityBrailleSubLayer extends FeatureLayer {
+ constructor() {
+ super(URL_FEATURE_LAYER_SURFACE, {
+ id: "city",
+ });
+
+ const defaultSymbol = new SimpleFillSymbol(
+ SimpleFillSymbol.STYLE_NULL,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ new Color("black"),
+ );
+ const renderer = new UniqueValueRenderer(defaultSymbol, "type");
+
+ const champs = Surfaces.linear.concat(Surfaces.water, Surfaces.green);
+ const LINEAR_SYMBOL = new SimpleFillSymbol(
+ SimpleFillSymbol.STYLE_SOLID,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ new Color("black"),
+ );
+ // TODO: check this lines
+ // const LINEAR_SYMBOL = new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 3);
+
+ Surfaces.water.forEach((value) => renderer.addValue(value, WATER_SYMBOL));
+ // surface.green.forEach( (value) => renderer.addValue(value, GREEN_SYMBOL) );
+ Surfaces.linear.forEach((value) => renderer.addValue(value, LINEAR_SYMBOL));
+
+ this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
+ this.setRenderer(renderer);
+ }
+}
diff --git a/src/app/map/layers/CityRootBrailleLayer.ts b/src/app/map/layers/CityRootBrailleLayer.ts
new file mode 100644
index 0000000..9ac45ac
--- /dev/null
+++ b/src/app/map/layers/CityRootBrailleLayer.ts
@@ -0,0 +1,12 @@
+import { RootLayer } from "../layer";
+import CityBrailleSubLayer from "./CityBrailleSubLayer";
+
+/**
+ * ArcgisMap Layer for City Braille representation
+ */
+export default class CityRootBrailleLayer extends RootLayer {
+ constructor() {
+ super({ kind: "city" });
+ this.addLayer(new CityBrailleSubLayer());
+ }
+}
diff --git a/src/app/map/layers/OsmRootLayer.ts b/src/app/map/layers/OsmRootLayer.ts
new file mode 100644
index 0000000..5523f67
--- /dev/null
+++ b/src/app/map/layers/OsmRootLayer.ts
@@ -0,0 +1,12 @@
+import { RootLayer } from "../layer";
+import OsmSubLayer from "./OsmSubLayer";
+
+/**
+ * ArcgisMap Layer for OpenStreet Map representation
+ */
+export default class OsmRootLayer extends RootLayer {
+ constructor() {
+ super({ kind: "osm" });
+ this.addLayer(new OsmSubLayer());
+ }
+}
diff --git a/src/app/map/layers/OsmSubLayer.ts b/src/app/map/layers/OsmSubLayer.ts
new file mode 100644
index 0000000..7e0297b
--- /dev/null
+++ b/src/app/map/layers/OsmSubLayer.ts
@@ -0,0 +1,9 @@
+import OpenStreetMapLayer = require("esri/layers/OpenStreetMapLayer");
+
+export default class OsmSubLayer extends OpenStreetMapLayer {
+ public id: string = "osm";
+ constructor() {
+ super();
+ this.setMaxScale(25);
+ }
+}
diff --git a/src/app/map/layers/RailroadBrailleSubLayer.ts b/src/app/map/layers/RailroadBrailleSubLayer.ts
new file mode 100644
index 0000000..b1eccee
--- /dev/null
+++ b/src/app/map/layers/RailroadBrailleSubLayer.ts
@@ -0,0 +1,36 @@
+import Color = require("esri/Color");
+import FeatureLayer = require("esri/layers/FeatureLayer");
+import UniqueValueRenderer = require("esri/renderers/UniqueValueRenderer");
+import SimpleFillSymbol = require("esri/symbols/SimpleFillSymbol");
+import SimpleLineSymbol = require("esri/symbols/SimpleLineSymbol");
+
+import { URL_FEATURE_LAYER_LINEAR } from "../../../conf/featureLayerApiUrls";
+
+/**
+ * Sublayer for railroad details
+ */
+export default class RailroadBrailleSubLayer extends FeatureLayer {
+ constructor() {
+ super(URL_FEATURE_LAYER_LINEAR, {
+ id: "railroad",
+ });
+
+ const defaultSymbol = new SimpleFillSymbol(
+ SimpleFillSymbol.STYLE_NULL,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ new Color("black"),
+ );
+ const renderer = new UniqueValueRenderer(defaultSymbol, "type");
+
+ const object = "voie_ferree";
+ const champs = [object];
+
+ renderer.addValue(
+ object,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 3),
+ );
+
+ this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
+ this.setRenderer(renderer);
+ }
+}
diff --git a/src/app/map/layers/SquareBrailleSubLayer.ts b/src/app/map/layers/SquareBrailleSubLayer.ts
new file mode 100644
index 0000000..6c4eaf2
--- /dev/null
+++ b/src/app/map/layers/SquareBrailleSubLayer.ts
@@ -0,0 +1,116 @@
+import Color = require("esri/Color");
+import FeatureLayer = require("esri/layers/FeatureLayer");
+import UniqueValueRenderer = require("esri/renderers/UniqueValueRenderer");
+import SimpleFillSymbol = require("esri/symbols/SimpleFillSymbol");
+import SimpleLineSymbol = require("esri/symbols/SimpleLineSymbol");
+
+import * as _ from "lodash";
+import { URL_FEATURE_LAYER_SURFACE } from "../../../conf/featureLayerApiUrls";
+import Surfaces from "../../../conf/surfaces";
+import { removeCommonSegments } from "../polygon";
+import { BUILDING_SYMBOL, HARD_SYMBOL, WATER_SYMBOL } from "../symbols";
+
+/**
+ * Sublayer for square details
+ */
+export default class SquareBrailleSubLayer extends FeatureLayer {
+ constructor() {
+ super(URL_FEATURE_LAYER_SURFACE, {
+ id: "square",
+ });
+
+ const defaultSymbol = new SimpleLineSymbol(
+ SimpleLineSymbol.STYLE_NULL,
+ new Color("black"),
+ 0,
+ );
+ const renderer = new UniqueValueRenderer(defaultSymbol, "type");
+
+ // TODO: check the line below
+ // const champs = Surfaces.green.concat(Surfaces.building, Surfaces.hard, Surfaces.water, Surfaces.linear);
+ const champs = Surfaces.building.concat(
+ Surfaces.hard,
+ Surfaces.water,
+ Surfaces.linear,
+ );
+ const LINEAR_SYMBOL = new SimpleLineSymbol(
+ SimpleLineSymbol.STYLE_SOLID,
+ new Color("black"),
+ 3,
+ );
+
+ Surfaces.linear.forEach((value) => renderer.addValue(value, LINEAR_SYMBOL));
+ Surfaces.water.forEach((value) => renderer.addValue(value, WATER_SYMBOL));
+ Surfaces.building.forEach((value) => renderer.addValue(value, BUILDING_SYMBOL));
+ Surfaces.hard.forEach((value) => renderer.addValue(value, HARD_SYMBOL));
+
+ this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
+ this.setRenderer(renderer);
+ }
+
+ /* this function mutate a graphic to transform a list of coordinates representing a rings to a list of
+ * segments. Thanks to this, we can remove segments intersections later.
+ * Because some fields are not accessible for the Esri/Graphic type, we get it as an pojo js object
+ * (jca)
+ */
+ private transform(graphic: any): void {
+ const xs: number[][][] = [];
+
+ // Esri lib doesn't refresh all element on a map, we have to keep the original reference of the rings as a
+ // good comparator
+ if (graphic.geometry.originalRings === undefined) {
+ graphic.geometry.originalRings = graphic.geometry.rings;
+ graphic.geometry.xmin = _.minBy(
+ graphic.geometry.originalRings[0],
+ (g) => g[0],
+ )[0];
+ graphic.geometry.xmax = _.maxBy(
+ graphic.geometry.originalRings[0],
+ (g) => g[0],
+ )[0];
+ graphic.geometry.ymin = _.minBy(
+ graphic.geometry.originalRings[0],
+ (g) => g[1],
+ )[1];
+ graphic.geometry.ymax = _.maxBy(
+ graphic.geometry.originalRings[0],
+ (g) => g[1],
+ )[1];
+ }
+ graphic.geometry.originalRings.forEach((r) => {
+ const set: number[] = _.flatten(r.map((g) => [g, g])).slice(1) as number[];
+ set.pop();
+ xs.push(_.chunk(set, 2));
+ });
+ graphic.geometry.rings = _.flatten(xs);
+ }
+
+ /* Fires when a layer has finished updating its content
+ * We compare way-objects segments and remove those which intersect
+ * (jca)
+ */
+ private onUpdateEnd() {
+ const pathsGraphics = this.graphics.filter(
+ (g) => g.attributes.type === "route_chemin",
+ );
+ pathsGraphics.forEach((g) => this.transform(g));
+
+ const railwaysGraphics = this.graphics.filter(
+ (g) => g.attributes.type === "chemin_de_fer",
+ );
+ railwaysGraphics.forEach((g) => this.transform(g));
+
+ removeCommonSegments(pathsGraphics);
+ removeCommonSegments(railwaysGraphics);
+
+ // Reorder paths
+ railwaysGraphics
+ .filter((g) => g.getShape() !== null)
+ .forEach((g) => g.getShape().moveToFront());
+ pathsGraphics
+ .filter((g) => g.getShape() !== null)
+ .forEach((g) => g.getShape().moveToFront());
+
+ this.redraw();
+ }
+}
diff --git a/src/app/map/layers/SquareRootBrailleLayer.ts b/src/app/map/layers/SquareRootBrailleLayer.ts
new file mode 100644
index 0000000..61891f2
--- /dev/null
+++ b/src/app/map/layers/SquareRootBrailleLayer.ts
@@ -0,0 +1,14 @@
+import { RootLayer } from "../layer";
+import RailroadBrailleSubLayer from "./RailroadBrailleSubLayer";
+import SquareBrailleSubLayer from "./SquareBrailleSubLayer";
+
+/**
+ * ArcgisMap Layer for Square Braille representation
+ */
+export default class SquareRootBrailleLayer extends RootLayer {
+ constructor() {
+ super({ kind: "square" });
+ this.addLayer(new SquareBrailleSubLayer());
+ this.addLayer(new RailroadBrailleSubLayer());
+ }
+}
diff --git a/src/app/map/layers/StairsBrailleLayer.ts b/src/app/map/layers/StairsBrailleLayer.ts
new file mode 100644
index 0000000..b4cbe5d
--- /dev/null
+++ b/src/app/map/layers/StairsBrailleLayer.ts
@@ -0,0 +1,41 @@
+import Color = require("esri/Color");
+import FeatureLayer = require("esri/layers/FeatureLayer");
+import UniqueValueRenderer = require("esri/renderers/UniqueValueRenderer");
+import SimpleFillSymbol = require("esri/symbols/SimpleFillSymbol");
+import SimpleLineSymbol = require("esri/symbols/SimpleLineSymbol");
+
+import { URL_FEATURE_LAYER_LINEAR } from "../../../conf/featureLayerApiUrls";
+
+/**
+ * Sublayer for stairs details
+ */
+export default class StairsBrailleLayer extends FeatureLayer {
+ constructor() {
+ super(URL_FEATURE_LAYER_LINEAR, {
+ id: "stairs",
+ });
+
+ const defaultSymbol = new SimpleFillSymbol(
+ SimpleFillSymbol.STYLE_NULL,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ new Color("black"),
+ );
+ const renderer = new UniqueValueRenderer(defaultSymbol, "type");
+
+ const object1 = "escalier_important";
+ const object2 = "tunnel_passage_inferieur_galerie";
+ const champs = [object1, object2];
+
+ renderer.addValue(
+ object1,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 1),
+ );
+ renderer.addValue(
+ object2,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color("black"), 1),
+ );
+
+ this.setDefinitionExpression("type='" + champs.join("' or type='") + "'");
+ this.setRenderer(renderer);
+ }
+}
diff --git a/src/app/map/map.component.css b/src/app/map/map.component.css
index 9d767fb..c02537f 100644
--- a/src/app/map/map.component.css
+++ b/src/app/map/map.component.css
@@ -1,22 +1,13 @@
#esri-map {
width: 1058px;
height: 720px;
- border-style: solid;
- border-width: 2px;
- position:relative;
+ border: solid 2px #000000;
+ margin: auto;
}
-.row {
- padding-bottom: 4px;
-}
-
-.need-zoom {
- background: repeating-linear-gradient(
- 45deg,
- #ffffff,
- #ffffff 10px,
- #9a9a9a 10px,
- #9a9a9a 20px );
+.searchBar {
+ margin-top: 5px;
+ margin-bottom: 5px;
}
.center-div {
@@ -27,40 +18,39 @@
vertical-align: middle;
}
-.dataMap{
+.hide-on-screen {
display: none;
}
@media print {
- .load{
- display: none;
+ @page {
+ size: 320mm 450mm;
+ margin: 0;
}
- #esri-map {
- margin-left: 0px;
+ html, body {
+ height: 100%;
+ width: 100%;
+ margin: 0;
+ padding: 0;
}
-
- .map {
- border-style:solid;
- border: 5px;
- overflow: hidden;
-
- margin-top: 1%;
- margin-bottom: 0px;
-
- }
-
- .searchBar{
+ .hide-on-print {
display: none;
}
- .dataMap{
- display: block;
- margin-top: 0px;
+ #esri-map {
+ margin: 0;
+ padding: 0;
+
+ overflow: hidden;
}
+ .hide-on-screen {
+ display: block;
+ margin-top: 0px;
+ }
.titleMap{
text-align: left;
@@ -83,6 +73,4 @@
.text{
font-size: 150%;
}
-
-
}
\ No newline at end of file
diff --git a/src/app/map/map.component.html b/src/app/map/map.component.html
index cf5a88e..f4bb854 100644
--- a/src/app/map/map.component.html
+++ b/src/app/map/map.component.html
@@ -1,34 +1,41 @@
-
-
-
-
+
+
diff --git a/src/app/editor/toolbar/toolbar.component.ts b/src/app/editor/toolbar/toolbar.component.ts
index e62aeb2..43afc94 100644
--- a/src/app/editor/toolbar/toolbar.component.ts
+++ b/src/app/editor/toolbar/toolbar.component.ts
@@ -1,194 +1,141 @@
-import { Component, Input, Output, EventEmitter, ViewChild } from "@angular/core";
-import { LayerType } from '../../map/layer';
-import { DrawType } from '../drawEditMap';
-
-import {TranslateService} from 'ng2-translate';
-
-export interface ITool { image?: string, command: string }
-
-export interface DrawTool { kind: 'draw', drawType : DrawType }
-export interface ActionTool { kind: 'action' }
-export interface EditTool { kind: 'edit' }
-export interface TextureTool { kind: 'texture',color:string,texture:string}
-
-export type Command = Move | Select | Delete | Texture | DrawCircle | DrawPolygon | DrawTraits | DrawPedestrian | Print | Open | Save | Fill;
-export interface Move { command: "move"; }
-export interface Select { command: "select"; }
-export interface Delete { command: "delete"; }
-export interface Texture { command: "texture"; }
-export interface DrawCircle { command: "draw_circle"; }
-export interface DrawPolygon { command: "draw_polygon"; }
-export interface DrawTraits { command: "draw_traits"; }
-export interface DrawPedestrian { command: "draw_pedestrian"; }
-export interface Print { command: "print"; }
-export interface Open { command: "open"; }
-export interface Save { command: "save"; }
-
-export interface Fill { command: "fill"; }
-
-export type KindTool = (DrawTool | EditTool | ActionTool | TextureTool);
-export type Tool = KindTool & ITool & Command;
-
-@Component({
- selector: 'aba-toolbar-map',
- templateUrl: 'toolbar.component.html',
- styleUrls: ['toolbar.component.css']
-})
-export class ToolbarMapComponent {
-
- @Input() activeTab: LayerType;
- @Output() onUpdateTool: EventEmitter
-
+
-
-
- 
-
-
-
-
-
- {{ mapZoom }}
-
+
+
+
+
+
+
+
+
+ {{ mapZoom }}
+
- = new EventEmitter();
+ @Input()
+ public searchable: boolean = true;
- needZoom : boolean = false;
+ private needZoom: boolean = false;
+ private search: ArcgisSearch;
+ private readonly ZOOM_LEVEL_MINIMUM: number = 16;
- @Output() onMapInstancied: EventEmitter = new EventEmitter();
- @Input() searchable: boolean = true;
+ constructor(private mapService: MapService) {}
- readonly ZOOM_LEVEL_MINIMUM : number = 16;
-
- mapZoom = "";
-
- constructor(private mapService: MapService) {
+ public getDefaultMap(): void {
+ this.mapService.defaultMap().subscribe((optionMap) => {
+ this.initMap(optionMap);
+ });
}
- getDefaultMap(): void {
- this.mapService
- .defaultMap()
- .subscribe(
- optionMap => {
- console.log(optionMap);
- this.initMap(optionMap);
- }
- );
- }
-
- ngOnInit(): void {
- }
-
- setLayerType(layerType : LayerType): boolean {
- if (this.map){
+ public setLayerType(layerType: LayerType): boolean {
+ if (this.map) {
this.map.setLayerVisible(layerType);
return true;
}
return false;
}
- setZoom(zoom:number):void{
+ public setZoom(zoom: number): void {
this.map.setZoom(zoom);
}
- isInMap(point : Point):boolean{
+ public isInMap(point: Point): boolean {
return this.map.extent.contains(point);
}
- centerMap(point : Point):void{
+ public centerMap(point: Point): void {
this.map.centerAt(point);
}
- resetInfos():void{
+ public resetInfos(): void {
this.map.uid = undefined;
this.map.title = undefined;
this.map.owner = undefined;
@@ -81,107 +68,90 @@ export class MapComponent implements OnInit {
this.map.creationDate = undefined;
}
- private getBrailleTitle () : string{
- if(this.map && this.map.title)
- return br.toBraille(this.map.title);
- else
- return "";
- }
-
- private getBrailleId () : string{
- if(this.map && this.map.uid)
- return br.toBraille(String(this.map.uid));
- else
- return "";
- }
-
- private getTitle() : string{
- if(this.map && this.map.title)
- return String(this.map.title);
- else
- return "";
- }
-
- private getId () : string{
- if(this.map && this.map.uid)
- return String(this.map.uid);
- else
- return "";
- }
-
- initMap(optionMap: OptionMap, layerType? : LayerType): void {
-
+ public initMap(optionMap: OptionMap, layerType?: LayerType): void {
this.map = AbaMap.fromOptionMap("esri-map", optionMap, layerType);
this.applyDefaultCallbackToTheMap();
- if (this.searchable){
+ if (this.searchable) {
this.search = new ArcgisSearch(
{
+ enableHighlight: false,
map: this.map,
/* useMapExtent:false, */
- enableHighlight: false,
- }, "search"
+ },
+ "search",
);
-
- /* hack for fix placeholder
+ /* hack for fix placeholder
* get the object and replace with emtpy string
* (pj) Issue #90
*/
const s = this.search.sources;
s[0].placeholder = "";
this.search.set("sources", s);
-
}
this.checkNeedZoom();
this.onMapInstancied.emit(optionMap);
}
- private applyDefaultCallbackToTheMap(): void {
- this.map.onUpdateStart = () => this.mapLoading = true;
- this.map.onUpdateEnd = () => this.mapLoading = false;
-
- // Zoom restriction
- this.map.on("zoom-end", () => this.checkNeedZoom());
- }
-
-
// Show or hide 'need zoom' message
- public checkNeedZoom(): boolean{
- this.needZoom = (this.map.getLevel() < this.ZOOM_LEVEL_MINIMUM);
- if(this.mapLoading)
+ public checkNeedZoom(): boolean {
+ this.needZoom = this.map.getLevel() < this.ZOOM_LEVEL_MINIMUM;
+ if (this.mapLoading) {
this.mapLoading = false;
+ }
return this.needZoom;
}
public selectMapId(id: number): void {
- this.mapService.map(id).subscribe(
- optionMap => {
-
- // Fixed: Must destroy before attributing a new instance
- this.map.destroy();
- this.map = AbaMap.fromOptionMap("esri-map", optionMap);
- this.checkNeedZoom();
+ this.mapService.map(id).subscribe((optionMap) => {
+ // Fixed: Must destroy before attributing a new instance
+ this.map.destroy();
+ this.map = AbaMap.fromOptionMap("esri-map", optionMap);
+ this.checkNeedZoom();
- // Call onMapInstancied event to prevent others components of new map
- this.onMapInstancied.emit(optionMap);
+ // Call onMapInstancied event to prevent others components of new map
+ this.onMapInstancied.emit(optionMap);
- this.applyDefaultCallbackToTheMap();
-
- if (optionMap.layerType){
- this.setLayerType(optionMap.layerType);
- }else{
- this.setLayerType( {kind: "osm"});
- }
+ this.applyDefaultCallbackToTheMap();
+ if (optionMap.layerType) {
+ this.setLayerType(optionMap.layerType);
+ } else {
+ this.setLayerType({ kind: "osm" });
}
- );
+ });
}
public saveMapWithTitle(title: string): void {
this.map.title = title;
- this.mapService.add(this.map.toOptionMap()).subscribe( i => this.map.uid = i );
+ this.mapService
+ .add(this.map.toOptionMap())
+ .subscribe((i) => (this.map.uid = i));
+ }
+
+ private getBrailleTitle(): string {
+ return (this.map && this.map.title) ? br.toBraille(this.map.title) : "";
+ }
+
+ private getBrailleId(): string {
+ return (this.map && this.map.uid) ? br.toBraille(String(this.map.uid)) : "";
+ }
+
+ private getTitle(): string {
+ return (this.map && this.map.title) ? String(this.map.title) : "";
+ }
+
+ private getId(): string {
+ return (this.map && this.map.uid) ? String(this.map.uid) : "";
}
+ private applyDefaultCallbackToTheMap(): void {
+ this.map.onUpdateStart = () => (this.mapLoading = true);
+ this.map.onUpdateEnd = () => (this.mapLoading = false);
+
+ // Zoom restriction
+ this.map.on("zoom-end", () => this.checkNeedZoom());
+ }
}
diff --git a/src/app/map/map.module.ts b/src/app/map/map.module.ts
index 1c565d5..cd5ec3b 100644
--- a/src/app/map/map.module.ts
+++ b/src/app/map/map.module.ts
@@ -1,16 +1,13 @@
-import { NgModule } from '@angular/core';
-
-
-//import { MapService } from './map.service';
-import {SharedModule} from "../shared/shared.module";
-import {MapComponent} from "./map.component";
-import {CommonModule} from "@angular/common";
-import {ModalSaveMapComponent} from "../editor/modal-save-map/modal-save-map.component";
-import {ModalMapComponent} from "../editor/modal-maps-list/modal-maps-list.component";
-import {FormsModule} from "@angular/forms";
-
+import { NgModule } from "@angular/core";
@NgModule({
+ declarations: [
+ /*
+ MapComponent
+ , ModalSaveMapComponent
+ , ModalMapComponent
+ */
+ ],
imports: [
/*
CommonModule
@@ -18,13 +15,8 @@ import {FormsModule} from "@angular/forms";
, SharedModule
*/
],
- declarations: [
- /*
- MapComponent
- , ModalSaveMapComponent
- , ModalMapComponent
- */
+ providers: [
+ /* MapService*/
],
- providers: [/* MapService*/]
})
-export class MapModule { }
+export class MapModule {}
diff --git a/src/app/map/map.service.spec.ts b/src/app/map/map.service.spec.ts
index 2d03093..9201d61 100644
--- a/src/app/map/map.service.spec.ts
+++ b/src/app/map/map.service.spec.ts
@@ -1,53 +1,51 @@
-import { OptionMap } from './map';
-import { MapService } from './map.service';
+import { inject, TestBed } from "@angular/core/testing";
+import { HttpModule } from "@angular/http";
+import "rxjs/add/operator/map";
+import { OptionMap } from "./map";
+import { MapService } from "./map.service";
-import {HttpModule} from '@angular/http';
-
-import { inject, async, TestBed} from '@angular/core/testing';
-import 'rxjs/add/operator/map';
-
-describe('MapService', () => {
+describe("MapService", () => {
// Before each, import module and providers
beforeEach(() => {
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
TestBed.configureTestingModule({
- imports: [HttpModule],
- providers: [MapService]
- }
- );
+ imports: [HttpModule],
+ providers: [MapService],
+ });
});
- it('should get map #2', async(done) =>
+ it("should get map #2", async (done) =>
inject([MapService], (service: MapService) => {
return service.defaultMap().subscribe(
- (map : OptionMap) => {
+ (map: OptionMap) => {
expect(map).toBeDefined();
done();
},
(error) => {
fail(error);
done();
- });
-
- })()
- );
+ },
+ );
+ })());
- it('should get maps', async(done) =>
+ it("should get maps", async (done) =>
inject([MapService], (service: MapService) => {
// Return promise
- return service.maps().toPromise().then(
- // Pass
- (maps : OptionMap[]) => {
- expect(maps).toBeDefined();
- expect(maps.length).toBeGreaterThan(1);
- done();
- },
- // Fail
- (error) => {
- fail(error);
- done();
- });
- })()
- );
-
+ return service
+ .maps()
+ .toPromise()
+ .then(
+ // Pass
+ (maps: OptionMap[]) => {
+ expect(maps).toBeDefined();
+ expect(maps.length).toBeGreaterThan(1);
+ done();
+ },
+ // Fail
+ (error) => {
+ fail(error);
+ done();
+ },
+ );
+ })());
});
diff --git a/src/app/map/map.service.ts b/src/app/map/map.service.ts
index 6012db3..69624f6 100644
--- a/src/app/map/map.service.ts
+++ b/src/app/map/map.service.ts
@@ -1,75 +1,70 @@
-import { Injectable } from '@angular/core';
-import {Http, Response, Headers, RequestOptions} from '@angular/http';
-import { Observable } from 'rxjs/Observable';
-import {OptionMap, AbaMap } from './map';
-import { LayerType } from './layer';
-import 'rxjs/add/operator/toPromise';
-
-const LayerTypeId: { [id: number]: LayerType } = {
- 0: { kind: "square" },
- 1: { kind: "city" }
-};
-
-@Injectable()
-export class MapService {
-
- //private mapsUrl = "app/maps";
- private mapsUrl = "https://audiotactile.ovh/proxy/index.php/";
- private divId: Node | string = 'map-div';
-
- constructor(private http: Http) {
- }
-
- add(optionMap: OptionMap): Observable {
-
- return this.http.post(
- this.mapsUrl, JSON.stringify(optionMap)
- ).map( r => r.json().id );
-
- }
-
- map(id: number): Observable {
- return this.http.get(
- this.mapsUrl + `maps/${id}`).map(
- (r: Response) => this.build(r.json())
- );
- }
-
- defaultMap(): Observable {
- const startExtent = {
- xmin: 780000.0,
- ymin: 5720000.0,
- xmax: 1105000.0,
- ymax: 6100000.0,
-
- spatialReference: {
- wkid: 102100
- }
- };
-
- return Observable.create(
- o => {
- const om = new OptionMap(800, 1176, 0, JSON.stringify(startExtent));
- om.layerType = { kind: "osm" };
- o.next(om)
- }
- );
- }
-
- maps(): Observable {
- return this.http.get(this.mapsUrl + 'maps').map( (r: Response) => {
- let os = r.json() as OptionMap[];
- return os.map(o => this.build(o) );
- } );
- }
-
- delete(id: number) {}
-
- /**
- * Build a complete OptionMap from the basic OptionMap
- */
- private build(optionMap: OptionMap): OptionMap {
- optionMap.layerType = LayerTypeId[optionMap.city];
- return optionMap;
- }
-}
+import { Injectable } from "@angular/core";
+import { Http, Response } from "@angular/http";
+import "rxjs/add/operator/toPromise";
+import { Observable } from "rxjs/Observable";
+import { LayerType } from "./layer";
+import { OptionMap } from "./map";
+
+const LAYER_TYPE_ID: { [id: number]: LayerType } = {
+ 0: { kind: "square" },
+ 1: { kind: "city" },
+};
+
+@Injectable()
+export class MapService {
+ private mapsUrl = "https://audiotactile.ovh/proxy/index.php/";
+ private divId: Node | string = "map-div";
+
+ constructor(private http: Http) {}
+
+ public add(optionMap: OptionMap): Observable {
+ return this.http
+ .post(this.mapsUrl, JSON.stringify(optionMap))
+ .map((r) => r.json().id);
+ }
+
+ public map(id: number): Observable {
+ return this.http
+ .get(this.mapsUrl + `maps/${id}`)
+ .map((r: Response) => this.build(r.json()));
+ }
+
+ public defaultMap(): Observable {
+ const startExtent = {
+ xmax: 1105000.0,
+ xmin: 780000.0,
+ ymax: 6100000.0,
+ ymin: 5720000.0,
+
+ spatialReference: {
+ wkid: 102100,
+ },
+ };
+
+ return Observable.create((o) => {
+ const om: OptionMap = {
+ city: 0,
+ extent: JSON.stringify(startExtent),
+ height: 800,
+ width: 1176,
+ };
+ om.layerType = { kind: "osm" };
+ o.next(om);
+ });
+ }
+
+ public maps(): Observable {
+ return this.http.get(this.mapsUrl + "maps").map((r: Response) => {
+ const os = r.json() as OptionMap[];
+ return os.map((o) => this.build(o));
+ });
+ }
+
+ /**
+ * Build a complete OptionMap from the basic OptionMap
+ */
+ private build(optionMap: OptionMap): OptionMap {
+ optionMap.layerType = LAYER_TYPE_ID[optionMap.city];
+ return optionMap;
+ }
+}
diff --git a/src/app/map/map.ts b/src/app/map/map.ts
index 1036e3f..29bcc1d 100644
--- a/src/app/map/map.ts
+++ b/src/app/map/map.ts
@@ -1,147 +1,163 @@
-import ArcgisMap = require('esri/map');
-import Graphic = require('esri/graphic');
-import Extent = require('esri/geometry/Extent');
-import OpenStreetMapLayer = require('esri/layers/OpenStreetMapLayer');
-import * as _ from "lodash";
-
-import {RootLayer, CityRootBrailleLayer, SquareRootBrailleLayer, OsmRootLayer, LayerType, Square, City} from './layer';
-import Layer = require("esri/layers/layer");
-
-export class OptionMap {
- public constructor(
- public height: number,
- public width: number,
- public city: number,
- public extent: string,
- public uid?: number,
- public title?: string,
- public owner?: number,
- public graphics?: any,
- public hash?: string,
- public creationDate?: string,
- public layerType?: LayerType
- ) {}
-
-}
-
-export class AbaMap extends ArcgisMap {
-
- private layers: RootLayer[] = [];
-
- public uid?: number;
- public title?: string;
- public owner?: number;
- public hash?: string;
- public creationDate?: string;
-
- public currentLayerVisible : LayerType;
- public onUpdateStart? : () => void;
- public onUpdateEnd? : () => void;
-
- // Create a new fresh instance
- public constructor(divId: Node | string, extent?: Extent, layerType? : LayerType) {
-
- super(divId, { logo: false, slider: false });
-
- if(!extent){
- extent = new Extent({
- xmin: 780000.0,
- ymin: 5720000.0,
- xmax: 1105000.0,
- ymax: 6100000.0,
- spatialReference: {
- wkid: 102100
- }
- });
- }
-
- this.setExtent(extent);
-
- this.layers.push(new OsmRootLayer());
- this.layers.push(new SquareRootBrailleLayer());
- this.layers.push(new CityRootBrailleLayer());
- let finalLayers = _.flatten(this.layers.map ( l => l.layers() ));
-
- this.setLayerVisible({kind:"osm"});
-
- this.registerUpdateEventsOnLayers();
-
- this.addLayers(finalLayers);
-
- }
-
- // Register update state of each layers
- public registerUpdateEventsOnLayers() {
- this.layers.forEach((layer) => {
- layer.onUpdateStart = () => {
- if(layer.id == this.currentLayerVisible.kind && this.onUpdateStart)
- this.onUpdateStart();
- }
- layer.onUpdateEnd = () => {
- if(layer.id == this.currentLayerVisible.kind && this.onUpdateEnd)
- this.onUpdateEnd();
- }
- })
- }
-
- public setLayerVisible(layerType: LayerType) {
- // Set current layer visible
- this.currentLayerVisible = layerType;
-
- this.layers.forEach(
- (layer) => {
- layer.setVisibility( layerType.kind === layer.id );
- }
- );
- }
-
- public static fromOptionMap(divId: Node | string, optionMap: OptionMap, layerType? : LayerType): AbaMap {
-
- const abaMap: AbaMap = new AbaMap(divId, new Extent(JSON.parse(optionMap.extent)));
-
- abaMap.uid = optionMap.uid;
- abaMap.height = optionMap.height;
- abaMap.width = optionMap.width;
-
- if(layerType)
- abaMap.setLayerVisible(layerType);
- else if (optionMap.layerType)
- abaMap.setLayerVisible(optionMap.layerType);
- else
- abaMap.setLayerVisible( {kind: "osm"} );
-
- abaMap.title = optionMap.title;
- abaMap.owner = optionMap.owner;
-
- if(optionMap.graphics) {
- const json: any = JSON.parse(optionMap.graphics);
- json.forEach( (graphic) => abaMap.graphics.add(new Graphic(graphic)));
- }
-
- abaMap.hash = optionMap.hash;
- abaMap.creationDate = optionMap.creationDate;
-
- return abaMap;
- }
-
- public toOptionMap(): OptionMap {
-
- let optionMap: OptionMap = new OptionMap(this.height, this.width, 0, this.extent.toJson());
- optionMap.title = this.title;
-
- let graphics = this.graphics.graphics.filter( g => g.symbol !== undefined).map( g => g.toJson() );
- optionMap.graphics = graphics;
-
- if ( this.isCityMap() ) {
- optionMap.city = 1;
- } else {
- optionMap.city = 0;
- }
-
- return optionMap;
- }
-
- public isCityMap(): boolean {
- return this.layers.some( (l: RootLayer) => l.layers().some( (l: Layer) => l.id === 'city' && l.visible));
- }
-}
+import Extent = require("esri/geometry/Extent");
+import Graphic = require("esri/graphic");
+import Layer = require("esri/layers/layer");
+import OpenStreetMapLayer = require("esri/layers/OpenStreetMapLayer");
+import ArcgisMap = require("esri/map");
+
+import * as _ from "lodash";
+import { LayerType, RootLayer } from "./layer";
+import CityRootBrailleLayer from "./layers/CityRootBrailleLayer";
+import OsmRootLayer from "./layers/OsmRootLayer";
+import SquareRootBrailleLayer from "./layers/SquareRootBrailleLayer";
+
+export interface OptionMap {
+ height: number;
+ width: number;
+ city: number;
+ extent: string;
+ uid?: number;
+ title?: string;
+ owner?: number;
+ graphics?: any;
+ hash?: string;
+ creationDate?: string;
+ layerType?: LayerType;
+}
+
+export class AbaMap extends ArcgisMap {
+ public static fromOptionMap(
+ divId: Node | string,
+ optionMap: OptionMap,
+ layerType?: LayerType,
+ ): AbaMap {
+ const abaMap: AbaMap = new AbaMap(
+ divId,
+ new Extent(JSON.parse(optionMap.extent)),
+ );
+
+ abaMap.uid = optionMap.uid;
+ abaMap.height = optionMap.height;
+ abaMap.width = optionMap.width;
+
+ if (layerType) {
+ abaMap.setLayerVisible(layerType);
+ } else if (optionMap.layerType) {
+ abaMap.setLayerVisible(optionMap.layerType);
+ } else {
+ abaMap.setLayerVisible({ kind: "osm" });
+ }
+
+ abaMap.title = optionMap.title;
+ abaMap.owner = optionMap.owner;
+
+ if (optionMap.graphics) {
+ const json: any = JSON.parse(optionMap.graphics);
+ json.forEach((graphic) => abaMap.graphics.add(new Graphic(graphic)));
+ }
+
+ abaMap.hash = optionMap.hash;
+ abaMap.creationDate = optionMap.creationDate;
+
+ return abaMap;
+ }
+
+ public uid?: number;
+ public title?: string;
+ public owner?: number;
+ public hash?: string;
+ public creationDate?: string;
+
+ public currentLayerVisible: LayerType;
+ public onUpdateStart?: () => void;
+ public onUpdateEnd?: () => void;
+
+ private layers: RootLayer[] = [];
+
+ // Create a new fresh instance
+ public constructor(
+ divId: Node | string,
+ extent?: Extent,
+ layerType?: LayerType,
+ ) {
+ super(divId, { logo: false, slider: false });
+
+ if (!extent) {
+ extent = new Extent({
+ spatialReference: {
+ wkid: 102100,
+ },
+ xmax: 1105000.0,
+ xmin: 780000.0,
+ ymax: 6100000.0,
+ ymin: 5720000.0,
+ });
+ }
+
+ this.setExtent(extent);
+
+ this.layers.push(new OsmRootLayer());
+ this.layers.push(new SquareRootBrailleLayer());
+ this.layers.push(new CityRootBrailleLayer());
+ const finalLayers = _.flatten(this.layers.map((l) => l.layers()));
+
+ this.setLayerVisible({ kind: "osm" });
+
+ this.registerUpdateEventsOnLayers();
+
+ this.addLayers(finalLayers);
+ }
+
+ // Register update state of each layers
+ public registerUpdateEventsOnLayers() {
+ this.layers.forEach((layer) => {
+ layer.onUpdateStart = () => {
+ if (layer.id === this.currentLayerVisible.kind && this.onUpdateStart) {
+ this.onUpdateStart();
+ }
+ };
+ layer.onUpdateEnd = () => {
+ if (layer.id === this.currentLayerVisible.kind && this.onUpdateEnd) {
+ this.onUpdateEnd();
+ }
+ };
+ });
+ }
+
+ public setLayerVisible(layerType: LayerType) {
+ // Set current layer visible
+ this.currentLayerVisible = layerType;
+
+ this.layers.forEach((layer) => {
+ layer.setVisibility(layerType.kind === layer.id);
+ });
+ }
+
+ public toOptionMap(): OptionMap {
+ const optionMap: OptionMap = {
+ city: 0,
+ extent: this.extent.toJson(),
+ height: this.height,
+ width: this.width,
+ };
+ optionMap.title = this.title;
+
+ const graphics = this.graphics.graphics
+ .filter((g) => g.symbol !== undefined)
+ .map((g) => g.toJson());
+ optionMap.graphics = graphics;
+
+ if (this.isCityMap()) {
+ optionMap.city = 1;
+ } else {
+ optionMap.city = 0;
+ }
+
+ return optionMap;
+ }
+
+ public isCityMap(): boolean {
+ return this.layers.some((rootLayer: RootLayer) =>
+ rootLayer.layers().some((l: Layer) => l.id === "city" && l.visible),
+ );
+ }
+}
diff --git a/src/app/map/polygon.ts b/src/app/map/polygon.ts
index bf3e776..e52d1aa 100644
--- a/src/app/map/polygon.ts
+++ b/src/app/map/polygon.ts
@@ -3,8 +3,8 @@
* (jca)
*/
-import * as _ from "lodash";
import Graphic = require("esri/graphic");
+import * as _ from "lodash";
// Segment is a structure of type [ Vertex (in), Vertex (out) ]
// where Vertex is a structure of [ number (x) , number (y) ]
@@ -17,61 +17,76 @@ type Tuple = number[];
// * Enumerates all combination of comparative paths
// * For each, detects segments' intersections and remove them
export function removeCommonSegments(xs: Graphic[]) {
-
- enumerate(xs.length).forEach( ([a, b]: Tuple) => {
+ enumerate(xs.length).forEach(([a, b]: Tuple) => {
const g1: any = xs[a];
const g2: any = xs[b];
- const xWindow = commonCoordinates( [g1.geometry.xmin, g1.geometry.xmax], [g2.geometry.xmin, g2.geometry.xmax] );
- const yWindow = commonCoordinates( [g1.geometry.ymin, g1.geometry.ymax], [g2.geometry.ymin, g2.geometry.ymax] );
-
- if ( !(xWindow.length == 0 || yWindow.length == 0) ) {
+ const xWindow = commonCoordinates(
+ [g1.geometry.xmin, g1.geometry.xmax],
+ [g2.geometry.xmin, g2.geometry.xmax],
+ );
+ const yWindow = commonCoordinates(
+ [g1.geometry.ymin, g1.geometry.ymax],
+ [g2.geometry.ymin, g2.geometry.ymax],
+ );
+ if (!(xWindow.length === 0 || yWindow.length === 0)) {
// Filter only segments inside x and y windows
- const g1FilteredRings = _.filter(g1.geometry.rings, (segment: Segment) => isInside(segment, xWindow, yWindow));
- const g2FilteredRings = _.filter(g2.geometry.rings, (segment: Segment) => isInside(segment, xWindow, yWindow));
+ const g1FilteredRings = _.filter(g1.geometry.rings, (segment: Segment) =>
+ isInside(segment, xWindow, yWindow),
+ );
+ const g2FilteredRings = _.filter(g2.geometry.rings, (segment: Segment) =>
+ isInside(segment, xWindow, yWindow),
+ );
// Compare only segments inside the same window (on x and y)
- _.intersectionWith(g1FilteredRings, g2FilteredRings, isSameSegments).forEach( (s1: Segment) => {
+ _.intersectionWith(
+ g1FilteredRings,
+ g2FilteredRings,
+ isSameSegments,
+ ).forEach((s1: Segment) => {
_.remove(g1.geometry.rings, (s2: Segment) => isSameSegments(s1, s2));
_.remove(g2.geometry.rings, (s2: Segment) => isSameSegments(s1, s2));
- })
+ });
}
-
});
}
// Enumerate tuple of n combinations
// By example, enumerate(3) will return [[0,1], [0, 2], [1, 2]]
function enumerate(n: number): Tuple[] {
-
- let ys: Tuple[] = [];
- let processed: number[] = [];
- let xs = _.range(0, n);
- xs.forEach( (x) => {
+ const ys: Tuple[] = [];
+ const processed: number[] = [];
+ const xs = _.range(0, n);
+ xs.forEach((x) => {
processed.push(x);
- let zs = _.difference(xs, processed);
- zs.forEach( (z) => ys.push([x, z]));
+ const zs = _.difference(xs, processed);
+ zs.forEach((z) => ys.push([x, z]));
});
return ys;
-
}
// Returns if two segments are identical
-function isSameSegments(s1: Segment, s2: Segment): boolean {
- return (s1[0][0] === s2[0][0] && s1[0][1] === s2[0][1]) && (s1[1][0] === s2[1][0] && s1[1][1] === s2[1][1]) ||
- (s1[0][0] === s2[1][0] && s1[0][1] === s2[1][1]) && (s1[1][0] === s2[0][0] && s1[1][1] === s2[0][1]);
+function isSameSegments(s1: Segment, s2: Segment): boolean {
+ return (
+ (s1[0][0] === s2[0][0] &&
+ s1[0][1] === s2[0][1] &&
+ (s1[1][0] === s2[1][0] && s1[1][1] === s2[1][1])) ||
+ (s1[0][0] === s2[1][0] &&
+ s1[0][1] === s2[1][1] &&
+ (s1[1][0] === s2[0][0] && s1[1][1] === s2[0][1]))
+ );
}
// Returns common coordinates of two collinear segments
-function commonCoordinates( segment1: Tuple, segment2: Tuple): Tuple {
+function commonCoordinates(segment1: Tuple, segment2: Tuple): Tuple {
const [s1min, s1max] = segment1;
const [s2min, s2max] = segment2;
const a = Math.max(s1min, s2min);
const b = Math.min(s1max, s2max);
- if ( a < b ) {
+ if (a < b) {
return [a, b];
- }else{
+ } else {
return [];
}
}
@@ -80,8 +95,14 @@ function commonCoordinates( segment1: Tuple, segment2: Tuple): Tuple {
function isInside(segment: Segment, xWindow: Tuple, yWindow: Tuple): boolean {
const vertex1: Vertex = segment[0];
const vertex2: Vertex = segment[1];
- const v1InsideWindow = (xWindow[0] <= vertex1[0] && vertex1[0] <= xWindow[1]) && (yWindow[0] <= vertex1[1] && vertex1[1] <= yWindow[1]);
- const v2InsideWindow = (xWindow[0] <= vertex2[0] && vertex2[0] <= xWindow[1]) && (yWindow[0] <= vertex2[1] && vertex2[1] <= yWindow[1]);
+ const v1InsideWindow =
+ xWindow[0] <= vertex1[0] &&
+ vertex1[0] <= xWindow[1] &&
+ (yWindow[0] <= vertex1[1] && vertex1[1] <= yWindow[1]);
+ const v2InsideWindow =
+ xWindow[0] <= vertex2[0] &&
+ vertex2[0] <= xWindow[1] &&
+ (yWindow[0] <= vertex2[1] && vertex2[1] <= yWindow[1]);
return v1InsideWindow || v2InsideWindow;
}
diff --git a/src/app/map/symbols.ts b/src/app/map/symbols.ts
new file mode 100644
index 0000000..f57eb14
--- /dev/null
+++ b/src/app/map/symbols.ts
@@ -0,0 +1,34 @@
+import Color = require("esri/Color");
+import PictureFillSymbol = require("esri/symbols/PictureFillSymbol");
+import SimpleFillSymbol = require("esri/symbols/SimpleFillSymbol");
+import SimpleLineSymbol = require("esri/symbols/SimpleLineSymbol");
+
+import * as blackDotTextureUrl from "Assets/img/textures/blackDot.png";
+import * as tiledLinesTextureUrl from "Assets/img/textures/traitilles.png";
+
+export const HARD_SYMBOL = new SimpleFillSymbol(
+ SimpleFillSymbol.STYLE_SOLID,
+ new SimpleLineSymbol(),
+ new Color("black"),
+);
+
+export const BUILDING_SYMBOL = new PictureFillSymbol(
+ tiledLinesTextureUrl,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ 16,
+ 16,
+);
+
+export const WATER_SYMBOL = new PictureFillSymbol(
+ blackDotTextureUrl,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ 16,
+ 16,
+);
+
+export const GREEN_SYMBOL = new PictureFillSymbol(
+ tiledLinesTextureUrl,
+ new SimpleLineSymbol(SimpleLineSymbol.STYLE_NULL),
+ 16,
+ 16,
+);
diff --git a/src/app/shared/abaplanHotkeysService.ts b/src/app/shared/abaplanHotkeysService.ts
new file mode 100644
index 0000000..362a256
--- /dev/null
+++ b/src/app/shared/abaplanHotkeysService.ts
@@ -0,0 +1,21 @@
+import { Injectable } from "@angular/core";
+import { Hotkey, HotkeysService } from "angular2-hotkeys";
+
+interface Combination {
+ hotkeys: string | string[];
+ callback: (event?: KeyboardEvent, combo?: string) => boolean | ExtendedKeyboardEvent;
+ description: string;
+}
+
+@Injectable()
+export class AbaplanHotkeysService {
+ private hotkeys: {string: Hotkey | Hotkey[]};
+
+ constructor(private _hotkeysService: HotkeysService) {}
+
+ public addHotkeys(hotkeys: Combination[]) {
+ hotkeys.forEach((hotkey) => this._hotkeysService.add(
+ new Hotkey(hotkey.hotkeys, hotkey.callback, undefined, hotkey.description),
+ ));
+ }
+}
diff --git a/src/app/shared/drop.pipe.ts b/src/app/shared/drop.pipe.ts
index 990c34d..1b26ffe 100644
--- a/src/app/shared/drop.pipe.ts
+++ b/src/app/shared/drop.pipe.ts
@@ -1,9 +1,9 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import * as _ from "lodash";
-
-@Pipe({name: 'drop'})
-export class DropPipe implements PipeTransform {
- transform(collection: any[], n: number): any[] {
- return _.drop(collection, n);
- }
-}
\ No newline at end of file
+import { Pipe, PipeTransform } from "@angular/core";
+import * as _ from "lodash";
+
+@Pipe({name: "drop"})
+export class DropPipe implements PipeTransform {
+ public transform(collection: any[], n: number): any[] {
+ return _.drop(collection, n);
+ }
+}
diff --git a/src/app/shared/length.pipe.ts b/src/app/shared/length.pipe.ts
index 80053da..30cdb16 100644
--- a/src/app/shared/length.pipe.ts
+++ b/src/app/shared/length.pipe.ts
@@ -1,8 +1,8 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({name: 'length'})
-export class LengthPipe implements PipeTransform {
- transform(collection: any[]): number {
- return collection.length;
- }
-}
\ No newline at end of file
+import { Pipe, PipeTransform } from "@angular/core";
+
+@Pipe({name: "length"})
+export class LengthPipe implements PipeTransform {
+ public transform(collection: any[]): number {
+ return collection.length;
+ }
+}
diff --git a/src/app/shared/modal-yesno/modal-yesno.component.ts b/src/app/shared/modal-yesno/modal-yesno.component.ts
index 1f36421..337f583 100644
--- a/src/app/shared/modal-yesno/modal-yesno.component.ts
+++ b/src/app/shared/modal-yesno/modal-yesno.component.ts
@@ -1,40 +1,38 @@
-import { Component, Input, Output, EventEmitter } from "@angular/core";
-
-@Component({
- selector: 'aba-modal-yesno',
- templateUrl: 'modal-yesno.component.html',
- styleUrls: ['modal-yesno.component.css']
-})
-export class ModalYesNoComponent {
-
- @Input('visible') visible: boolean = false;
- @Output() onYesEvent: EventEmitter = new EventEmitter();
- @Output() onCloseEvent: EventEmitter = new EventEmitter();
-
- private title: string = "";
-
- constructor() {
- }
-
- private isVisible(): boolean {
- return this.visible;
- }
-
- public open(): void {
- this.visible = true;
- }
- public close(): void{
- this.visible = false;
- }
- public closeWithNo(): void{
- this.visible = false;
- this.onCloseEvent.emit( {} );
- }
-
- private onSubmit(): void {
- this.close();
- console.log("sumbit)");
- this.onYesEvent.emit( {} );
- }
-
-}
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+
+@Component({
+ selector: "aba-modal-yesno",
+ styleUrls: ["modal-yesno.component.css"],
+ templateUrl: "modal-yesno.component.html",
+})
+export class ModalYesNoComponent {
+
+ @Input("visible") public visible: boolean = false;
+ @Output() public onYesEvent: EventEmitter = new EventEmitter();
+ @Output() public onCloseEvent: EventEmitter = new EventEmitter();
+
+ private title: string = "";
+
+ public open(): void {
+ this.visible = true;
+ }
+
+ public close(): void {
+ this.visible = false;
+ }
+
+ public closeWithNo(): void {
+ this.visible = false;
+ this.onCloseEvent.emit( {} );
+ }
+
+ private isVisible(): boolean {
+ return this.visible;
+ }
+
+ private onSubmit(): void {
+ this.close();
+ this.onYesEvent.emit( {} );
+ }
+
+}
diff --git a/src/app/shared/pagination/paginate.purs b/src/app/shared/pagination/paginate.purs
deleted file mode 100644
index 97ef333..0000000
--- a/src/app/shared/pagination/paginate.purs
+++ /dev/null
@@ -1,21 +0,0 @@
-module Pagination where
-
-import Prelude (map, (==), (<=), ($), show, (>), (&&), (<>), (-), (>=), otherwise, (+))
-import Data.Array ((..))
-import Data.Show (class Show)
-
-mapToString :: forall a. ( Show a ) => Array a -> Array String
-mapToString = map show
-
-paginate :: Int -> Int -> Array String
-paginate page activep
- | page == 0 = []
- | page <= 10 = mapToString $ 1..page
- | page > 10 && activep <= 5 = (mapToString $ 1..7) <> ["..."] <> (mapToString [page-1, page])
- | activep >= page -5 = (mapToString $ 1..2) <> ["..."] <> (mapToString $ (page-6)..page)
- | otherwise = (mapToString $ 1..2)
- <> ["..."]
- <> (mapToString $ (activep-1)..(activep+2))
- <> ["..."]
- <> (mapToString [page-1, page])
-
diff --git a/src/app/shared/pagination/pagination-buttons.component.html b/src/app/shared/pagination/pagination-buttons.component.html
index 0b149f5..6450b87 100644
--- a/src/app/shared/pagination/pagination-buttons.component.html
+++ b/src/app/shared/pagination/pagination-buttons.component.html
@@ -1,15 +1,15 @@
diff --git a/src/app/shared/pagination/pagination-buttons.component.ts b/src/app/shared/pagination/pagination-buttons.component.ts
index cb4178a..3895958 100644
--- a/src/app/shared/pagination/pagination-buttons.component.ts
+++ b/src/app/shared/pagination/pagination-buttons.component.ts
@@ -1,41 +1,80 @@
-import { Component, Input, Output, EventEmitter } from "@angular/core";
-
-const Pagination = require('./paginate');
-
-
-@Component({
- selector: 'aba-pagination-buttons',
- templateUrl: 'pagination-buttons.component.html',
- styleUrls: ['pagination-buttons.component.css']
-})
-export class PaginationComponent {
-
- private activePage: number;
- @Input() collectionSize: number;
- @Input() chunkSize: number;
- @Output() selectedPageChange: EventEmitter = new EventEmitter();
- @Input()
- get selectedPage() { return this.activePage; }
- set selectedPage(val: number){
- this.activePage = val;
- this.selectedPageChange.emit(val);
- }
-
-
- constructor(){
-
- }
-
- private paginationButtonClick(id: string): void {
- this.activePage = parseInt(id);
- this.selectedPageChange.emit(this.activePage);
- }
- private movePagination(inc: number): void {
- this.paginationButtonClick((this.activePage+inc).toString());
- }
-
- private paginate(activePage: string, size: number): string[] {
- const length = Math.ceil(size);
- return Pagination.paginate(length)(parseInt(activePage));
- }
-}
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+import * as _ from "lodash";
+
+@Component({
+ selector: "aba-pagination-buttons",
+ styleUrls: ["pagination-buttons.component.css"],
+ templateUrl: "pagination-buttons.component.html",
+})
+export class PaginationComponent {
+ get activePageNumero(): number {
+ return this._activePageNumero;
+ }
+ set activePageNumero(newValue: number) {
+ this._activePageNumero = newValue;
+ }
+
+ @Input() private collectionSize: number;
+ @Input() private chunkSize: number;
+ get pageNumber() {
+ return Math.ceil(this.collectionSize / this.chunkSize);
+ }
+ @Output()
+ private selectedPageChange: EventEmitter = new EventEmitter();
+ @Input()
+ get selectedPage() {
+ return this.activePageNumero;
+ }
+ set selectedPage(val: number) {
+ this.activePageNumero = val;
+ this.selectedPageChange.emit(val);
+ }
+
+ private _activePageNumero: number;
+
+ public getPagination(): string[] {
+ // no pages
+ if (this.pageNumber === 0) {
+ return [];
+ } else if (this.pageNumber < 10) {
+ // less than 10 pages
+ return _.range(1, this.pageNumber + 1).map((value, index) => String(index));
+ } else {
+ // more than 10 pages
+
+ // currently in the 5 first
+ if (this.activePageNumero <= 5) {
+ return [
+ ..._.range(1, 7 + 1).map((value) => String(value)),
+ "...",
+ ..._.range(this.pageNumber - 1, this.pageNumber + 1).map((value) => String(value)),
+ ];
+ } else if (this.activePageNumero >= this.pageNumber - 5) {
+ // currently in the 5 last
+ return [
+ ..._.range(1, 2 + 1).map((value) => String(value)),
+ "...",
+ ..._.range(this.pageNumber - 6, this.pageNumber + 1).map((value) => String(value)),
+ ];
+ } else {
+ // in the middle
+ return [
+ ..._.range(1, 2 + 1).map((value) => String(value)),
+ "...",
+ ..._.range(this.activePageNumero - 1, this.activePageNumero + 4).map((value) => String(value)),
+ "...",
+ ..._.range(this.pageNumber - 1, this.pageNumber + 1).map((value) => String(value)),
+ ];
+ }
+ }
+ }
+
+ private paginationButtonClick(id: string): void {
+ this.activePageNumero = +id;
+ this.selectedPageChange.emit(this.activePageNumero);
+ }
+
+ private movePagination(inc: number): void {
+ this.paginationButtonClick((this.activePageNumero + inc).toString());
+ }
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 875f32e..92ae226 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -1,45 +1,40 @@
-// good practices: https://angular.io/styleguide/#!#-a-id-04-10-a-shared-feature-module
-
-import { NgModule } from "@angular/core";
-import { FormsModule } from '@angular/forms';
-
-import { TakePipe } from "./take.pipe";
-import { DropPipe } from "./drop.pipe";
-import { LengthPipe } from "./length.pipe";
-import { HttpModule } from "@angular/http";
-import { MapComponent } from "../map/map.component";
-import { CommonModule } from "@angular/common";
-import {AppRoutingModule} from "../app-routing.module";
-import {ModalYesNoComponent} from "./modal-yesno/modal-yesno.component";
-
-
-@NgModule({
- imports: [
- FormsModule
- , HttpModule // editor component
- , CommonModule
- , AppRoutingModule
- ],
- declarations: [
- TakePipe
- , DropPipe
- , LengthPipe
- , MapComponent
- , ModalYesNoComponent
- ],
- exports: [
- FormsModule
- , TakePipe
- , DropPipe
- , LengthPipe
- , CommonModule
- , MapComponent
- , AppRoutingModule
- , ModalYesNoComponent
- ],
- providers: [ ]
-})
-export class SharedModule { }
-
-
-
+// good practices: https://angular.io/styleguide/#!#-a-id-04-10-a-shared-feature-module
+
+import { CommonModule } from "@angular/common";
+import { NgModule } from "@angular/core";
+import { FormsModule } from "@angular/forms";
+import { HttpModule } from "@angular/http";
+import { AppRoutingModule } from "../app-routing.module";
+import { MapComponent } from "../map/map.component";
+import { DropPipe } from "./drop.pipe";
+import { LengthPipe } from "./length.pipe";
+import { ModalYesNoComponent } from "./modal-yesno/modal-yesno.component";
+import { TakePipe } from "./take.pipe";
+
+@NgModule({
+ declarations: [
+ TakePipe,
+ DropPipe,
+ LengthPipe,
+ MapComponent,
+ ModalYesNoComponent,
+ ],
+ exports: [
+ FormsModule,
+ TakePipe,
+ DropPipe,
+ LengthPipe,
+ CommonModule,
+ MapComponent,
+ AppRoutingModule,
+ ModalYesNoComponent,
+ ],
+ imports: [
+ FormsModule,
+ HttpModule, // editor component
+ CommonModule,
+ AppRoutingModule,
+ ],
+ providers: [],
+})
+export class SharedModule { }
diff --git a/src/app/shared/take.pipe.ts b/src/app/shared/take.pipe.ts
index 020113a..d77332e 100644
--- a/src/app/shared/take.pipe.ts
+++ b/src/app/shared/take.pipe.ts
@@ -1,9 +1,9 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import * as _ from "lodash";
-
-@Pipe({name: 'take'})
-export class TakePipe implements PipeTransform {
- transform(collection: any[], n: number): any[] {
- return _.take(collection, n);
- }
-}
\ No newline at end of file
+import { Pipe, PipeTransform } from "@angular/core";
+import * as _ from "lodash";
+
+@Pipe({name: "take"})
+export class TakePipe implements PipeTransform {
+ public transform(collection: any[], n: number): any[] {
+ return _.take(collection, n);
+ }
+}
diff --git a/src/app/touchpad/touchpad.component.ts b/src/app/touchpad/touchpad.component.ts
index 67bfe47..b608452 100644
--- a/src/app/touchpad/touchpad.component.ts
+++ b/src/app/touchpad/touchpad.component.ts
@@ -1,546 +1,605 @@
-import {Component, ViewChild, ElementRef} from "@angular/core";
-import { Router, ActivatedRoute, Params } from '@angular/router';
-import 'rxjs/add/operator/switchMap';
-import { MapService } from '../map/map.service';
-import { GeoService } from '../core/geo.service';
-import { VoiceService } from '../core/voice.service';
-import { StateService } from "../core/state.service";
-import { KmlService } from "../core/kml.service";
-import { TransportService } from "../core/transport.service";
-import { OptionMap } from '../map/map';
-import { MapComponent } from '../map/map.component'
-
-import WebMercatorUtils = require('esri/geometry/webMercatorUtils');
-import Geometry = require('esri/geometry/Geometry');
-import Point = require('esri/geometry/Point')
-import Graphic = require("esri/graphic");
-import SimpleMarkerSymbol = require("esri/symbols/SimpleMarkerSymbol");
-import {Vector2d, Plane2d, transform} from '../core/vector2d';
-import LatLng = google.maps.LatLng;
-
-import {TranslateService} from "ng2-translate";
-import {ScalarObservable} from 'rxjs/observable/ScalarObservable';
-
-interface translations {value : string};
-
-@Component({
- selector: 'aba-touchpad',
- templateUrl: 'touchpad.component.html',
- styleUrls: ['touchpad.component.css'],
- providers : []
-})
-export class TouchpadComponent {
- @ViewChild(MapComponent)
- private mapComponent: MapComponent;
- private nbClick: number = 0;
- private readonly defaultVector: Vector2d = {x: 0, y: 0};
- private devicePlane: Plane2d = { A: this.defaultVector, B: this.defaultVector, C: this.defaultVector, D: this.defaultVector};
- private divPlane: Plane2d = { A: this.defaultVector, B: this.defaultVector, C: this.defaultVector, D: this.defaultVector};
-
- private searchingPoint: Point | undefined = undefined;
-
- constructor(
- private route: ActivatedRoute,
- private router: Router,
- private mapService: MapService,
- private voiceService : VoiceService,
- private stateService : StateService,
- private geoService : GeoService,
- private translateService: TranslateService,
- private kmlService: KmlService,
- private transportService: TransportService,
- private _elementRef: ElementRef
- ){
-
- /**Init the voice commands and start calibration
- *
- * Can't be directly in the constructor beacause of
- * compatibity with voice Commands (library can't charge voice early)
- * Hack with onReady callback to be call after
- * init of page
- * (pj)
- */
- document.onreadystatechange= () => {
- this.voiceService.initialization();
- this.prepareVoiceCommand();
- this.voiceService.say(this.getStringTranslation("touchpadCenter"));
- }
-
- document.onclick = (ev: MouseEvent) => {
- if (!this.isCalibrated()) {
- /*
- * Calibration mode.
- * At the beginning, we detect the 4th corner of the device to map with de real div esri map
- */
- switch (this.nbClick) {
- case 0:
- this.voiceService.say(this.getStringTranslation("touchpadTopLeft"));
- break;
- case 1:
- /* Note: clientX and clientY for firefox compatibility */
- this.devicePlane.A = {x: ev.x || ev.clientX, y: ev.y || ev.clientY};
-
- const geo = this.mapComponent.map.extent;
-
- this.divPlane.C = {x: geo.xmin, y: geo.ymin };
- this.divPlane.D = {x: geo.xmax, y: geo.ymin };
- this.divPlane.A = {x: geo.xmin, y: geo.ymax };
- this.divPlane.B = {x: geo.xmax, y: geo.ymax };
-
- this.voiceService.say(this.getStringTranslation("touchpadTopRight"));
- break;
-
- case 2:
- this.devicePlane.B = {x: ev.x || ev.clientX, y: ev.y || ev.clientY};
-
- this.voiceService.say(this.getStringTranslation("touchpadBottomLeft"));
- break;
- case 3:
- this.devicePlane.C = {x: ev.x || ev.clientX, y: ev.y || ev.clientY};
-
- this.voiceService.say(this.getStringTranslation("touchpadBottomRight"));
- break;
- case 4:
- this.devicePlane.D = {x: ev.x || ev.clientX, y: ev.y || ev.clientY};
-
- this.voiceService.say(this.getStringTranslation("touchpadOk"));
- break;
- }
- this.nbClick += 1;
-
- } else if (this.isCalibrated()) {
-
- // Transformation from device coordinates to esri map coordinates
-
- // Detect current `P` point
- const OP = { x: ev.x || ev.clientX, y: ev.y || ev.clientY };
-
- // `P'` is the transformed final point on the esri map
- const OP_ = transform(OP, this.devicePlane, this.divPlane);
-
- // Transform to EsriPoint
- const mappedPoint = new Point(OP_.x, OP_.y);
- const touchPoint : Point = WebMercatorUtils.webMercatorToGeographic(mappedPoint);
- this.transportService.currentPoint = touchPoint;
-
- switch (this.stateService.activeMode().mode){
- case "reading":
- this.locateClick(touchPoint);
- break;
- case "searching":
- if (this.searchingPoint !== undefined){
- this.searchLocationClick(this.searchingPoint, touchPoint);
- } else {
- this.voiceService.say("Recherche en cours");
- }
- break;
- case "itinerary":
- this.kmlService.currentPoint(touchPoint.y,touchPoint.x);
- this.locateClick(touchPoint);
- break;
- }
-
- const symbol = new SimpleMarkerSymbol({
- color: [226, 119, 40],
- outline: { color: [255, 255, 255], width: 2 },
- });
- const graphic = new Graphic(touchPoint, symbol);
- this.mapComponent.map.graphics.add(graphic);
-
- }
- };
-
- }
-
- private isCalibrated(): boolean {
- return this.nbClick > 4;
- }
-
- onClick() {
- // Enable full screen
- this.mapComponent.map.setLayerVisible({kind: "osm"});
- const elem = document.getElementsByTagName('body')[0];
- const f = elem.requestFullscreen || elem.msRequestFullscreen || elem.mozRequestFullScreen || elem.webkitRequestFullscreen;
- f.call(elem);
- }
-
- ngOnInit() {
-
- // (+) converts string 'id' to a number
- let id = +this.route.snapshot.params['id'];
-
- this.mapService.map(id)
- .subscribe((optionMap: OptionMap) => {
-
- this.mapComponent.initMap(optionMap);
-
- /* jca: hack for the issue #76 and #77
- * To load an OSM map on a map saved with a different layer, we must load osm right
- * after the beginning of the original layer.
- */
- this.mapComponent.map.on("layer-reorder", () => {
- //this.mapComponent.map.setLayerVisible({kind: "osm"});
- });
- this.mapComponent.map.on("extent-change", () => {
- this.mapComponent.map.setLayerVisible({kind: "osm"});
-
- const map = document.getElementById("esri-map");
- if (map !== null){
- const style = map.style;
- style.height = optionMap.height + "px";
- style.width = optionMap.width + "px";
- }
-
- });
-
- this.mapComponent.map.disableMapNavigation();
-
- this.mapComponent.map.width = optionMap.width;
- this.mapComponent.map.height = optionMap.height;
-
- });
- }
-
- /** Switch to reading mode and notify the user */
- private readCommand():void{
- this.stateService.changeMode( {mode: "reading"} );
- this.voiceService.say(this.getStringTranslation("readActive"));
- }
-
- /** Switch to search mode and notify the user */
- private searchCommand(i: number, wildcard: string):void{
- this.searchingPoint = undefined;
- this.stateService.changeMode( {mode: "searching"} );
- this.voiceService.say(this.getStringTranslation("searchOk") + wildcard);
-
- this.geoService.point(wildcard).subscribe(
- (searchPoint: Point) => {
- this.searchingPoint = searchPoint;
- if (searchPoint === undefined){
- this.voiceService.say(this.getStringTranslation("searchKo"));
- this.stateService.changeMode( {mode: "reading"} );
- }
- }
- );
- }
-
- /** Search the closest station */
- private searchStation():void{
- this.searchingPoint = undefined;
- this.stateService.changeMode( {mode: "searching"} );
-
- this.transportService.stationsNearby().subscribe(
- (stations : any) => {
- if (stations){
- const station = stations.json().stations.find(station => station.coordinate.x !== null && station.coordinate.y !== null);
- if (station) {
- const point = new Point(station.coordinate.y,station.coordinate.x);
- this.searchingPoint = point;
- this.voiceService.say(this.getStringTranslation("transportOKDescri") + station.name);
- return
- }
- }
-
- // If we get to this point, that mean that something went wrong with the station search
- this.voiceService.say(this.getStringTranslation("transportKODescri"));
- this.readCommand();
- }
- );
- }
-
- /** Search the closest station by line */
- private searchStationByLine(i: number, wildcard: string):void{
- this.searchingPoint = undefined;
- this.stateService.changeMode( {mode: "searching"} );
-
- this.transportService.stationsNearby().subscribe(
- (stations : any) => {
- if (stations){
- this.voiceService.say(this.getStringTranslation("transportOKDescri") + wildcard);
- this.getBusByStation(stations.json(),0,wildcard);
- }else{
- this.voiceService.say(this.getStringTranslation("transportKODescri")+wildcard);
- this.readCommand();
- }
- }
- );
- }
-
- /* Check if stops contains specific line */
- private getBusByStation(station : any,index : number,line: string){
- if(index < station.stations.length){
- this.transportService.closerStationFilter(station.stations[index].name).subscribe(
- st => {
- if(st.json().stationboard.some(elem => elem.number == line)){
- const station = st.json().station;
- const point = new Point(station.coordinate.y,station.coordinate.x);
- this.searchingPoint = point;
- }
- else{
- setTimeout(() =>this.getBusByStation(station,index+1,line), 400)
- }
- }
- )
- }else{
- this.voiceService.say(this.getStringTranslation("transportKODescri"));
- this.readCommand();
- }
- }
-
- /** Switch to itinerary mode */
- private itineraryCommand():void{
- this.stateService.changeMode( {mode: "itinerary"} );
- this.voiceService.say(this.getStringTranslation("itineraryActive"));
- //In case of the user switch mod in middle of session , reset values
- this.kmlService.endCurrentSession();
- }
-
- /** Add last Press Location */
- private itineraryAddCommand(i: number, wildcard: string):void{
- if(this.stateService.activeMode().mode == "itinerary"){
- if(this.kmlService.addCurrentPoint(wildcard))
- this.voiceService.say(this.getStringTranslation("itineraryAddPoint")+wildcard);
- else
- this.voiceService.say(this.getStringTranslation("itineraryAddPointError"));
- }else{
- this.voiceService.say(this.getStringTranslation("itineraryError"));
- }
- }
-
- /** Delet last add point */
- private itineraryDeletLastCommand():void{
- if(this.stateService.activeMode().mode == "itinerary"){
- if(this.kmlService.deletLastPoint())
- this.voiceService.say(this.getStringTranslation("itineraryDelet"));
- else
- this.voiceService.say(this.getStringTranslation("itineraryDeletLastError"));
- }else{
- this.voiceService.say(this.getStringTranslation("itineraryError"));
- }
- }
-
- /** Stop the current Session */
- private itineraryStopSession():void{
- this.kmlService.endCurrentSession();
- this.readCommand();
- }
-
- private itineraryEndSession(i: number, wildcard: string):void{
- if(this.kmlService.toKml(wildcard)){
- this.voiceService.say(this.getStringTranslation("itinerarySave"));
- this.kmlService.endCurrentSession();
- this.readCommand();
- }
- else
- this.voiceService.say(this.getStringTranslation("itinerarySaveError"));
- }
-
- /** Notity the user in terms of input number */
- private offendCommand(i:number):void{
- if (i%3===0) {
- this.voiceService.say(this.getStringTranslation("offendTextOne"));
- } else if (i%3 === 1){
- this.voiceService.say(this.getStringTranslation("offendTextTwo"));
- }else{
- this.voiceService.say(this.getStringTranslation("offendTextTree"));
- }
- }
-
- /** Change language of application */
- private changeLang(langTranslate : string,langVoice : string):void{
- this.translateService.use(langTranslate);
- this.voiceService.changeLang(langVoice);
- }
-
- /** Help Command */
- private helpCommand(i: number, wildcard: string, langTranslate : string):void{
- let currentLang = this.translateService.currentLang;
- this.translateService.use(langTranslate);
- console.log(wildcard);
- console.log(this.getStringTranslations("itineraryId")[0]);
- switch(wildcard){
- case this.getStringTranslations("readId")[0]:
- this.voiceService.say(this.getStringTranslation("readHelp"));
- break;
- case this.getStringTranslations("itineraryId")[0]:
- this.voiceService.say(this.getStringTranslation("itineraryHelp"));
- this.voiceService.say(this.getStringTranslations("itineraryAddId")[0]
- +this.getStringTranslation("itineraryAddHelp"));
- this.voiceService.say(this.getStringTranslations("itineraryDeletId")[0]
- +this.getStringTranslation("itineraryDelHelp"));
- this.voiceService.say(this.getStringTranslations("itinerarySaveId")[0]
- +this.getStringTranslation("itinerarySaveHelp"));
- this.voiceService.say(this.getStringTranslations("itineraryAbortId")[0]
- +this.getStringTranslation("itineraryEndHelp"));
- break;
- case this.getStringTranslations("searchId")[0].replace(' *',''):
- this.voiceService.say(this.getStringTranslation("searchHelp"));
- break;
- default:
- this.voiceService.say(this.getStringTranslation("mainHelpIntro"));
- // Read Command
- this.voiceService.say(this.getStringTranslation("mainHelpMode")
- +this.getStringTranslations("readId")[0]);
- this.voiceService.say(this.getStringTranslation("mainHelpDo")
- + this.getStringTranslation("readDescri"));
- // Search Command
- this.voiceService.say(this.getStringTranslation("mainHelpMode")
- +this.getStringTranslations("searchId")[0]);
- this.voiceService.say(this.getStringTranslation("mainHelpDo")
- + this.getStringTranslation("searchDescri"));
-
- // Search Transport Command
- this.voiceService.say(this.getStringTranslation("mainHelpMode")
- +this.getStringTranslations("transportId")[0]);
- this.voiceService.say(this.getStringTranslation("mainHelpDo")
- + this.getStringTranslation("transportDescri"));
-
- // Itinerary Command
- this.voiceService.say(this.getStringTranslation("mainHelpMode")
- +this.getStringTranslations("itineraryId")[0]);
- this.voiceService.say(this.getStringTranslation("mainHelpDo")
- + this.getStringTranslation("itineraryDescri"));
- // * help
- this.voiceService.say(this.getStringTranslation("mainHelp*"));
-
- // lang
- this.voiceService.say(this.getStringTranslation("mainHelpLang"));
- break;
- }
- this.translateService.use(currentLang);
- }
-
- /** Add Commands */
- private prepareVoiceCommand() {
- // Loop for add command in each lang of application
- let langs = this.translateService.getLangs();
- for(let entry of langs){
- this.translateService.use(entry);
- let codeVoice = this.getStringTranslation("codeLangVoice");
-
- // Reading mode (default)
- this.voiceService.addCommand(
- this.getStringTranslations("readId"),
- this.getStringTranslation("readDescri"),
- () => this.readCommand()
- );
-
- // Searching mode
- this.voiceService.addCommand(
- this.getStringTranslations("searchId"),
- this.getStringTranslation("searchDescri"),
- (i: number, wildcard: string) => this.searchCommand(i, wildcard)
- );
-
- // React to insults command
- this.voiceService.addCommand(
- this.getStringTranslations("offendId"),
- this.getStringTranslation("offendDescri"),
- (i: number) => this.offendCommand(i)
- );
-
- // Switch Lang command
- this.voiceService.addCommand(
- [this.getStringTranslation("myLang")],
- this.getStringTranslation("codeLang"),
- () => this.changeLang(entry,codeVoice)
- );
-
- // switch to itinerary Mode
- this.voiceService.addCommand(
- this.getStringTranslations("itineraryId"),
- this.getStringTranslation("itineraryDescri"),
- () => this.itineraryCommand()
- );
-
- // itinerary Mode - Add
- this.voiceService.addCommand(
- this.getStringTranslations("itineraryAddId"),
- this.getStringTranslation("itineraryAddDescri"),
- (i: number, wildcard: string) => this.itineraryAddCommand(i, wildcard)
- );
-
- // itinerary Mode - Delet Last
- this.voiceService.addCommand(
- this.getStringTranslations("itineraryDeletId"),
- this.getStringTranslation("itineraryDeletDescri"),
- () => this.itineraryDeletLastCommand()
- );
-
- // itinerary Mode - Abort
- this.voiceService.addCommand(
- this.getStringTranslations("itineraryAbortId"),
- this.getStringTranslation("itineraryAbortDescri"),
- () => this.itineraryStopSession()
- );
-
- // itinerary Mode - Save As
- this.voiceService.addCommand(
- this.getStringTranslations("itinerarySaveId"),
- this.getStringTranslation("itinerarySaveDescri"),
- (i: number, wildcard: string) => this.itineraryEndSession(i, wildcard)
- );
-
- // Search Station
- this.voiceService.addCommand(
- this.getStringTranslations("transportId"),
- this.getStringTranslation("transportDescri"),
- () => this.searchStation()
- );
-
- // Search Station
- this.voiceService.addCommand(
- this.getStringTranslations("transportSearchId"),
- this.getStringTranslation("transportSearchDescri"),
- (i: number, wildcard: string) => this.searchStationByLine(i,wildcard)
- );
-
- // itinerary Mode - Save As
- this.voiceService.addCommand(
- this.getStringTranslations("helpId"),
- this.getStringTranslation("helpDescri"),
- (i: number, wildcard: string) => this.helpCommand(i, wildcard,entry)
- );
-
- }
- this.translateService.use(this.translateService.getBrowserLang());
- }
-
- /** Locate click and notity the user */
- private locateClick(point: Point): void {
-
- this.geoService.address(point).subscribe(
- address => {
- if (address){
- this.voiceService.sayGeocodeResult(address);
- }
- }
- );
- }
-
-
- /** Notity the user of direction */
- private searchLocationClick(location: Point, touchPoint: Point): void {
- let data : Array = this.geoService.directionToText(location, touchPoint);
- let diction : string;
- if(data.length>1){//["search_upper", "searchTo", "522", "searchKilometer"]
- diction = this.getStringTranslation(data[0])+" "+this.getStringTranslation(data[1])
- +" "+ data[2] +" "+ this.getStringTranslation(data[3]);
- }
- else{
- diction = this.getStringTranslation(data[0]);
- }
- this.voiceService.say(diction);
- }
-
- /** Return string by id and current lang of application */
- private getStringTranslation(s: string) : string {
- return (this.translateService.get(s)as ScalarObservable).value;
- }
-
- /** Return array of string by id and current lang of application */
- private getStringTranslations(s: string) : Array {
- return (this.translateService.get(s)as ScalarObservable>).value.map(object => object.value);
-
- }
-}
+import { Component, ElementRef, ViewChild } from "@angular/core";
+import { ActivatedRoute, Router } from "@angular/router";
+import { TranslateService } from "ng2-translate";
+import "rxjs/add/operator/switchMap";
+import { ScalarObservable } from "rxjs/observable/ScalarObservable";
+import { GeoService, SearchedPointIndications } from "../core/geo.service";
+import { KmlService } from "../core/kml.service";
+import { StateService } from "../core/state.service";
+import { TransportService } from "../core/transport.service";
+import { Plane2d, transform, Vector2d } from "../core/vector2d";
+import { VoiceService } from "../core/voice.service";
+import { OptionMap } from "../map/map";
+import { MapComponent } from "../map/map.component";
+import { MapService } from "../map/map.service";
+import { AbaplanHotkeysService } from "../shared/abaplanHotkeysService";
+
+import Geometry = require("esri/geometry/Geometry");
+import Point = require("esri/geometry/Point");
+import WebMercatorUtils = require("esri/geometry/webMercatorUtils");
+import Graphic = require("esri/graphic");
+import SimpleMarkerSymbol = require("esri/symbols/SimpleMarkerSymbol");
+import LatLng = google.maps.LatLng;
+
+interface Translations {
+ value: string;
+}
+
+@Component({
+ providers: [],
+ selector: "aba-touchpad",
+ styleUrls: ["touchpad.component.css"],
+ templateUrl: "touchpad.component.html",
+})
+export class TouchpadComponent {
+ @ViewChild(MapComponent)
+ private mapComponent: MapComponent;
+ private nbClick: number = 0;
+ private readonly defaultVector: Vector2d = {x: 0, y: 0};
+ private devicePlane: Plane2d = {
+ A: this.defaultVector,
+ B: this.defaultVector,
+ C: this.defaultVector,
+ D: this.defaultVector,
+ } as Plane2d;
+ private divPlane: Plane2d = {
+ A: this.defaultVector,
+ B: this.defaultVector,
+ C: this.defaultVector,
+ D: this.defaultVector,
+ } as Plane2d;
+
+ private searchingPoint: Point | undefined = undefined;
+
+ constructor(
+ private route: ActivatedRoute,
+ private router: Router,
+ private mapService: MapService,
+ private voiceService: VoiceService,
+ private stateService: StateService,
+ private geoService: GeoService,
+ private translateService: TranslateService,
+ private kmlService: KmlService,
+ private transportService: TransportService,
+ private _elementRef: ElementRef,
+ private hotkey: AbaplanHotkeysService,
+ ) {
+
+ // TODO: move this outside of the code
+ hotkey.addHotkeys([
+ {
+ callback: () => {
+ this.readCommand();
+ return false;
+ },
+ description: "Passe en mode plan (lecture)",
+ hotkeys: ["l", "p"],
+ },
+ {
+ callback: () => {
+ this.searchStation();
+ return false;
+ },
+ description: "Passe en mode transport",
+ hotkeys: "t",
+ },
+ {
+ callback: () => {
+ this.itineraryCommand();
+ return false;
+ },
+ description: "Passe en mode itinéraire",
+ hotkeys: "i",
+ },
+ ]);
+
+ /**Init the voice commands and start calibration
+ *
+ * Can"t be directly in the constructor beacause of
+ * compatibity with voice Commands (library can"t charge voice early)
+ * Hack with onReady callback to be call after
+ * init of page
+ * (pj)
+ */
+ document.onreadystatechange = () => {
+ this.voiceService.initialization();
+ this.prepareVoiceCommand();
+ this.voiceService.say(this.getStringTranslation("touchpadCenter"));
+ };
+
+ document.onclick = (ev: MouseEvent) => {
+ if (!this.isCalibrated()) {
+ /*
+ * Calibration mode.
+ * At the beginning, we detect the 4th corner of the device to map with de real div esri map
+ */
+ switch (this.nbClick) {
+ case 0:
+ this.voiceService.say(this.getStringTranslation("touchpadTopLeft"));
+ break;
+ case 1:
+ /* Note: clientX and clientY for firefox compatibility */
+ this.devicePlane.A = {
+ x: ev.x || ev.clientX,
+ y: ev.y || ev.clientY,
+ } as Vector2d;
+
+ const geo = this.mapComponent.map.extent;
+
+ this.divPlane.C = {x: geo.xmin, y: geo.ymin } as Vector2d;
+ this.divPlane.D = {x: geo.xmax, y: geo.ymin } as Vector2d;
+ this.divPlane.A = {x: geo.xmin, y: geo.ymax } as Vector2d;
+ this.divPlane.B = {x: geo.xmax, y: geo.ymax } as Vector2d;
+
+ this.voiceService.say(this.getStringTranslation("touchpadTopRight"));
+ break;
+
+ case 2:
+ this.devicePlane.B = {x: ev.x || ev.clientX, y: ev.y || ev.clientY} as Vector2d;
+
+ this.voiceService.say(this.getStringTranslation("touchpadBottomLeft"));
+ break;
+ case 3:
+ this.devicePlane.C = {x: ev.x || ev.clientX, y: ev.y || ev.clientY} as Vector2d;
+
+ this.voiceService.say(this.getStringTranslation("touchpadBottomRight"));
+ break;
+ case 4:
+ this.devicePlane.D = {x: ev.x || ev.clientX, y: ev.y || ev.clientY} as Vector2d;
+
+ this.voiceService.say(this.getStringTranslation("touchpadOk"));
+ break;
+ }
+ this.nbClick += 1;
+
+ } else {
+
+ // Transformation from device coordinates to esri map coordinates
+
+ // Detect current `P` point
+ const OP = { x: ev.x || ev.clientX, y: ev.y || ev.clientY };
+
+ // `P"` is the transformed final point on the esri map
+ const OP_ = transform(OP, this.devicePlane, this.divPlane);
+
+ // Transform to EsriPoint
+ const mappedPoint = new Point(OP_.x, OP_.y);
+ const touchPoint: Point = WebMercatorUtils.webMercatorToGeographic(mappedPoint) as Point;
+ this.transportService.currentPoint = touchPoint;
+
+ switch (this.stateService.activeMode().mode) {
+ case "reading":
+ this.locateClick(touchPoint);
+ break;
+ case "searching":
+ if (this.searchingPoint !== undefined) {
+ this.searchLocationClick(this.searchingPoint, touchPoint);
+ } else {
+ this.voiceService.say("Recherche en cours");
+ }
+ break;
+ case "itinerary":
+ this.kmlService.currentPoint(touchPoint.y, touchPoint.x);
+ this.locateClick(touchPoint);
+ break;
+ }
+
+ const symbol = new SimpleMarkerSymbol({
+ color: [226, 119, 40],
+ outline: { color: [255, 255, 255], width: 2 },
+ });
+ const graphic = new Graphic(touchPoint, symbol);
+ this.mapComponent.map.graphics.add(graphic);
+
+ }
+ };
+
+ }
+
+ private isCalibrated(): boolean {
+ return this.nbClick > 4;
+ }
+
+ private onClick() {
+ // Enable full screen
+ this.mapComponent.map.setLayerVisible({kind: "osm"});
+ const elem = document.getElementsByTagName("body")[0] as any;
+ const f = elem.requestFullscreen ||
+ elem.msRequestFullscreen ||
+ elem.mozRequestFullScreen ||
+ elem.webkitRequestFullscreen;
+ f.call(elem);
+ }
+
+ private ngOnInit() {
+
+ // (+) converts string "id" to a number
+ const id = +this.route.snapshot.params.id;
+
+ this.mapService.map(id)
+ .subscribe((optionMap: OptionMap) => {
+
+ this.mapComponent.initMap(optionMap);
+
+ /* jca: hack for the issue #76 and #77
+ * To load an OSM map on a map saved with a different layer, we must load osm right
+ * after the beginning of the original layer.
+ */
+ this.mapComponent.map.on("layer-reorder", () => {
+ // TODO: check the line below
+ // this.mapComponent.map.setLayerVisible({kind: "osm"});
+ });
+ this.mapComponent.map.on("extent-change", () => {
+ this.mapComponent.map.setLayerVisible({kind: "osm"});
+
+ const map = document.getElementById("esri-map");
+ if (map !== null) {
+ const style = map.style;
+ style.height = optionMap.height + "px";
+ style.width = optionMap.width + "px";
+ }
+
+ });
+
+ this.mapComponent.map.disableMapNavigation();
+
+ this.mapComponent.map.width = optionMap.width;
+ this.mapComponent.map.height = optionMap.height;
+
+ });
+ }
+
+ /** Switch to reading mode and notify the user */
+ private readCommand(): void {
+ this.stateService.changeMode( {mode: "reading"} );
+ this.voiceService.say(this.getStringTranslation("readActive"));
+ }
+
+ /** Switch to search mode and notify the user */
+ private searchCommand(i: number, wildcard: string): void {
+ this.searchingPoint = undefined;
+ this.stateService.changeMode( {mode: "searching"} );
+ this.voiceService.say(this.getStringTranslation("searchOk") + wildcard);
+
+ this.geoService.point(wildcard).subscribe(
+ (searchPoint: Point) => {
+ this.searchingPoint = searchPoint;
+ if (searchPoint === undefined) {
+ this.voiceService.say(this.getStringTranslation("searchKo"));
+ this.stateService.changeMode( {mode: "reading"} );
+ }
+ },
+ );
+ }
+
+ /** Search the closest station */
+ private searchStation(): void {
+ this.searchingPoint = undefined;
+ this.stateService.changeMode( {mode: "searching"} );
+
+ this.transportService.stationsNearby().subscribe(
+ (stations: any) => {
+ if (stations) {
+ const correspondingStation = stations.json()
+ .stations.find((station) => station.coordinate.x !== null && station.coordinate.y !== null);
+
+ if (correspondingStation) {
+ const point = new Point(correspondingStation.coordinate.y, correspondingStation.coordinate.x);
+ this.searchingPoint = point;
+ this.voiceService.say(this.getStringTranslation("transportOKDescri") + correspondingStation.name);
+ return;
+ }
+ }
+
+ // If we get to this point, that mean that something went wrong with the station search
+ this.voiceService.say(this.getStringTranslation("transportKODescri"));
+ this.readCommand();
+ },
+ );
+ }
+
+ /** Search the closest station by line */
+ private searchStationByLine(i: number, wildcard: string): void {
+ this.searchingPoint = undefined;
+ this.stateService.changeMode( {mode: "searching"} );
+
+ this.transportService.stationsNearby().subscribe(
+ (stations: any) => {
+ if (stations) {
+ this.voiceService.say(this.getStringTranslation("transportOKDescri") + wildcard);
+ this.getBusByStation(stations.json(), 0, wildcard);
+ } else {
+ this.voiceService.say(this.getStringTranslation("transportKODescri") + wildcard);
+ this.readCommand();
+ }
+ },
+ );
+ }
+
+ /* Check if stops contains specific line */
+ private getBusByStation(station: any, index: number, line: string) {
+ if (index < station.stations.length) {
+ this.transportService.closerStationFilter(station.stations[index].name).subscribe(
+ (st) => {
+ if (st.json().stationboard.some((elem) => elem.number === line)) {
+ const returnedStation = st.json().station;
+ const point = new Point(returnedStation.coordinate.y, returnedStation.coordinate.x);
+ this.searchingPoint = point;
+ } else {
+ setTimeout(() => this.getBusByStation(station, index + 1, line), 400);
+ }
+ },
+ );
+ } else {
+ this.voiceService.say(this.getStringTranslation("transportKODescri"));
+ this.readCommand();
+ }
+ }
+
+ /** Switch to itinerary mode */
+ private itineraryCommand(): void {
+ this.stateService.changeMode( {mode: "itinerary"} );
+ this.voiceService.say(this.getStringTranslation("itineraryActive"));
+ // In case of the user switch mod in middle of session , reset values
+ this.kmlService.endCurrentSession();
+ }
+
+ /** Add last Press Location */
+ private itineraryAddCommand(i: number, wildcard: string): void {
+ if (this.stateService.activeMode().mode === "itinerary") {
+ if (this.kmlService.addCurrentPoint(wildcard)) {
+ this.voiceService.say(this.getStringTranslation("itineraryAddPoint") + wildcard);
+ } else {
+ this.voiceService.say(this.getStringTranslation("itineraryAddPointError"));
+ }
+ } else {
+ this.voiceService.say(this.getStringTranslation("itineraryError"));
+ }
+ }
+
+ /** Delet last add point */
+ private itineraryDeletLastCommand(): void {
+ if (this.stateService.activeMode().mode === "itinerary") {
+ if (this.kmlService.deletLastPoint()) {
+ this.voiceService.say(this.getStringTranslation("itineraryDelet"));
+ } else {
+ this.voiceService.say(this.getStringTranslation("itineraryDeletLastError"));
+ }
+ } else {
+ this.voiceService.say(this.getStringTranslation("itineraryError"));
+ }
+ }
+
+ /** Stop the current Session */
+ private itineraryStopSession(): void {
+ this.kmlService.endCurrentSession();
+ this.readCommand();
+ }
+
+ private itineraryEndSession(i: number, wildcard: string): void {
+ if (this.kmlService.toKml(wildcard)) {
+ this.voiceService.say(this.getStringTranslation("itinerarySave"));
+ this.kmlService.endCurrentSession();
+ this.readCommand();
+ } else {
+ this.voiceService.say(this.getStringTranslation("itinerarySaveError"));
+ }
+ }
+
+ /** Notity the user in terms of input number */
+ private offendCommand(i: number): void {
+ if (i % 3 === 0) {
+ this.voiceService.say(this.getStringTranslation("offendTextOne"));
+ } else if (i % 3 === 1) {
+ this.voiceService.say(this.getStringTranslation("offendTextTwo"));
+ } else {
+ this.voiceService.say(this.getStringTranslation("offendTextTree"));
+ }
+ }
+
+ /** Change language of application */
+ private changeLang(langTranslate: string, langVoice: string): void {
+ this.translateService.use(langTranslate);
+ this.voiceService.changeLang(langVoice);
+ }
+
+ /** Help Command */
+ private helpCommand(i: number, wildcard: string, langTranslate: string): void {
+ const currentLang = this.translateService.currentLang;
+ this.translateService.use(langTranslate);
+ if (process.env.NODE_ENV !== "production") {
+ // tslint:disable-next-line no-console
+ console.log(wildcard);
+ // tslint:disable-next-line no-console
+ console.log(this.getStringTranslations("itineraryId")[0]);
+ }
+ switch (wildcard) {
+ case this.getStringTranslations("readId")[0]:
+ this.voiceService.say(this.getStringTranslation("readHelp"));
+ break;
+ case this.getStringTranslations("itineraryId")[0]:
+ this.voiceService.say(this.getStringTranslation("itineraryHelp"));
+ this.voiceService.say(this.getStringTranslations("itineraryAddId")[0]
+ + this.getStringTranslation("itineraryAddHelp"));
+ this.voiceService.say(this.getStringTranslations("itineraryDeletId")[0]
+ + this.getStringTranslation("itineraryDelHelp"));
+ this.voiceService.say(this.getStringTranslations("itinerarySaveId")[0]
+ + this.getStringTranslation("itinerarySaveHelp"));
+ this.voiceService.say(this.getStringTranslations("itineraryAbortId")[0]
+ + this.getStringTranslation("itineraryEndHelp"));
+ break;
+ case this.getStringTranslations("searchId")[0].replace(" *", ""):
+ this.voiceService.say(this.getStringTranslation("searchHelp"));
+ break;
+ default:
+ this.voiceService.say(this.getStringTranslation("mainHelpIntro"));
+ // Read Command
+ this.voiceService.say(this.getStringTranslation("mainHelpMode")
+ + this.getStringTranslations("readId")[0]);
+ this.voiceService.say(this.getStringTranslation("mainHelpDo")
+ + this.getStringTranslation("readDescri"));
+ // Search Command
+ this.voiceService.say(this.getStringTranslation("mainHelpMode")
+ + this.getStringTranslations("searchId")[0]);
+ this.voiceService.say(this.getStringTranslation("mainHelpDo")
+ + this.getStringTranslation("searchDescri"));
+
+ // Search Transport Command
+ this.voiceService.say(this.getStringTranslation("mainHelpMode")
+ + this.getStringTranslations("transportId")[0]);
+ this.voiceService.say(this.getStringTranslation("mainHelpDo")
+ + this.getStringTranslation("transportDescri"));
+
+ // Itinerary Command
+ this.voiceService.say(this.getStringTranslation("mainHelpMode")
+ + this.getStringTranslations("itineraryId")[0]);
+ this.voiceService.say(this.getStringTranslation("mainHelpDo")
+ + this.getStringTranslation("itineraryDescri"));
+ // * help
+ this.voiceService.say(this.getStringTranslation("mainHelp*"));
+
+ // lang
+ this.voiceService.say(this.getStringTranslation("mainHelpLang"));
+ break;
+ }
+ this.translateService.use(currentLang);
+ }
+
+ /** Add Commands */
+ private prepareVoiceCommand() {
+ // Loop for add command in each lang of application
+ const langs = this.translateService.getLangs();
+ for (const entry of langs) {
+ this.translateService.use(entry);
+ const codeVoice = this.getStringTranslation("codeLangVoice");
+
+ // Reading mode (default)
+ this.voiceService.addCommand(
+ this.getStringTranslations("readId"),
+ this.getStringTranslation("readDescri"),
+ () => this.readCommand(),
+ );
+
+ // Searching mode
+ this.voiceService.addCommand(
+ this.getStringTranslations("searchId"),
+ this.getStringTranslation("searchDescri"),
+ (i: number, wildcard: string) => this.searchCommand(i, wildcard),
+ );
+
+ // React to insults command
+ this.voiceService.addCommand(
+ this.getStringTranslations("offendId"),
+ this.getStringTranslation("offendDescri"),
+ (i: number) => this.offendCommand(i),
+ );
+
+ // Switch Lang command
+ this.voiceService.addCommand(
+ [this.getStringTranslation("myLang")],
+ this.getStringTranslation("codeLang"),
+ () => this.changeLang(entry, codeVoice),
+ );
+
+ // switch to itinerary Mode
+ this.voiceService.addCommand(
+ this.getStringTranslations("itineraryId"),
+ this.getStringTranslation("itineraryDescri"),
+ () => this.itineraryCommand(),
+ );
+
+ // itinerary Mode - Add
+ this.voiceService.addCommand(
+ this.getStringTranslations("itineraryAddId"),
+ this.getStringTranslation("itineraryAddDescri"),
+ (i: number, wildcard: string) => this.itineraryAddCommand(i, wildcard),
+ );
+
+ // itinerary Mode - Delet Last
+ this.voiceService.addCommand(
+ this.getStringTranslations("itineraryDeletId"),
+ this.getStringTranslation("itineraryDeletDescri"),
+ () => this.itineraryDeletLastCommand(),
+ );
+
+ // itinerary Mode - Abort
+ this.voiceService.addCommand(
+ this.getStringTranslations("itineraryAbortId"),
+ this.getStringTranslation("itineraryAbortDescri"),
+ () => this.itineraryStopSession(),
+ );
+
+ // itinerary Mode - Save As
+ this.voiceService.addCommand(
+ this.getStringTranslations("itinerarySaveId"),
+ this.getStringTranslation("itinerarySaveDescri"),
+ (i: number, wildcard: string) => this.itineraryEndSession(i, wildcard),
+ );
+
+ // Search Station
+ this.voiceService.addCommand(
+ this.getStringTranslations("transportId"),
+ this.getStringTranslation("transportDescri"),
+ () => this.searchStation(),
+ );
+
+ // Search Station
+ this.voiceService.addCommand(
+ this.getStringTranslations("transportSearchId"),
+ this.getStringTranslation("transportSearchDescri"),
+ (i: number, wildcard: string) => this.searchStationByLine(i, wildcard),
+ );
+
+ // itinerary Mode - Save As
+ this.voiceService.addCommand(
+ this.getStringTranslations("helpId"),
+ this.getStringTranslation("helpDescri"),
+ (i: number, wildcard: string) => this.helpCommand(i, wildcard, entry),
+ );
+
+ }
+ this.translateService.use(this.translateService.getBrowserLang());
+ }
+
+ /** Locate click and notity the user */
+ private locateClick(point: Point): void {
+
+ this.geoService.address(point).subscribe(
+ (address) => {
+ if (address) {
+ this.voiceService.sayGeocodeResult(address);
+ }
+ },
+ );
+ }
+
+ /** Notify the user of direction */
+ private searchLocationClick(location: Point, touchPoint: Point): void {
+ const indication: SearchedPointIndications = this.geoService.directionToText(location, touchPoint);
+ let diction: string;
+
+ if (indication.reached) {
+ diction = this.getStringTranslation("searchArrived");
+ } else {
+ const direction = this.getStringTranslation(indication.direction);
+ const directionDistanceConnector = this.getStringTranslation("searchTo");
+ const distance = indication.distance;
+ const unit = this.getStringTranslation(indication.unit);
+
+ diction = `${direction} ${directionDistanceConnector} ${distance} ${unit}`;
+ }
+
+ this.voiceService.say(diction);
+ }
+
+ /** Return string by id and current lang of application */
+ private getStringTranslation(s: string): string {
+ return (this.translateService.get(s)as ScalarObservable).value;
+ }
+
+ /** Return array of string by id and current lang of application */
+ private getStringTranslations(s: string): string[] {
+ return (this.translateService.get(s)as ScalarObservable).value.map((object) => object.value);
+
+ }
+}
diff --git a/src/app/touchpad/touchpad.module.ts b/src/app/touchpad/touchpad.module.ts
index 36499fb..c81ec61 100644
--- a/src/app/touchpad/touchpad.module.ts
+++ b/src/app/touchpad/touchpad.module.ts
@@ -1,28 +1,23 @@
-import { NgModule } from '@angular/core';
-
-
-import { MapService } from '../map/map.service';
-import { GeoService } from "../core/geo.service";
-import { VoiceService } from "../core/voice.service";
-import { KmlService } from "../core/kml.service";
-import { MapComponent } from "../map/map.component";
-import {SharedModule} from "../shared/shared.module";
-import {TouchpadComponent} from "./touchpad.component";
-import {StateService} from "../core/state.service";
-import {TransportService} from "../core/transport.service";
-
-@NgModule({
- imports: [ SharedModule ],
- declarations: [
- TouchpadComponent
- ],
- providers: [
- MapService
- , GeoService
- , VoiceService
- , StateService
- , KmlService
- , TransportService
- ]
-})
-export class TouchpadModule { }
+import { NgModule } from "@angular/core";
+import { GeoService } from "../core/geo.service";
+import { KmlService } from "../core/kml.service";
+import { StateService } from "../core/state.service";
+import { TransportService } from "../core/transport.service";
+import { VoiceService } from "../core/voice.service";
+import { MapService } from "../map/map.service";
+import { SharedModule } from "../shared/shared.module";
+import { TouchpadComponent } from "./touchpad.component";
+
+@NgModule({
+ declarations: [TouchpadComponent],
+ imports: [SharedModule],
+ providers: [
+ MapService,
+ GeoService,
+ VoiceService,
+ StateService,
+ KmlService,
+ TransportService,
+ ],
+})
+export class TouchpadModule {}
diff --git a/src/conf/.gitignore b/src/conf/.gitignore
new file mode 100644
index 0000000..7990448
--- /dev/null
+++ b/src/conf/.gitignore
@@ -0,0 +1 @@
+/secret.ts
\ No newline at end of file
diff --git a/src/app/core/example.secret.ts b/src/conf/example.secret.ts
similarity index 57%
rename from src/app/core/example.secret.ts
rename to src/conf/example.secret.ts
index 55ada2e..655574f 100644
--- a/src/app/core/example.secret.ts
+++ b/src/conf/example.secret.ts
@@ -1,4 +1,4 @@
-// TODO before compile :
+// TODO before compile :
// 1) rename example.secret.ts to secret.ts
// 2) enter google geocode key instead of ""
-export let GOOGLE_GEOCODE_KEY = "";
\ No newline at end of file
+export let GOOGLE_GEOCODE_KEY = "";
diff --git a/src/conf/featureLayerApiUrls.ts b/src/conf/featureLayerApiUrls.ts
new file mode 100644
index 0000000..35ed663
--- /dev/null
+++ b/src/conf/featureLayerApiUrls.ts
@@ -0,0 +1,4 @@
+const URL_FEATURE_LAYER =
+ "https://hepiageo.hesge.ch/arcgis/rest/services/audiotactile/audiotactile/FeatureServer/";
+export const URL_FEATURE_LAYER_SURFACE = URL_FEATURE_LAYER + "3";
+export const URL_FEATURE_LAYER_LINEAR = URL_FEATURE_LAYER + "1";
diff --git a/src/conf/internationalSystem.ts b/src/conf/internationalSystem.ts
new file mode 100644
index 0000000..9806cad
--- /dev/null
+++ b/src/conf/internationalSystem.ts
@@ -0,0 +1 @@
+export const METERS_BY_KILOMETER = 1000;
diff --git a/src/conf/surfaces.ts b/src/conf/surfaces.ts
new file mode 100644
index 0000000..dff14ae
--- /dev/null
+++ b/src/conf/surfaces.ts
@@ -0,0 +1,25 @@
+export default {
+ building: ["batiment"],
+ green: [
+ "roseliere",
+ "paturage_boise_ouvert",
+ "tourbiere",
+ "autre_verte",
+ "autre_culture_intensive",
+ "paturage_boise_dense",
+ "autre_boisee",
+ "jardin",
+ "foret_dense",
+ "vigne",
+ "champ_pre_paturage",
+ ],
+ hard: [
+ "ilot",
+ "trottoir",
+ "autre_revetement_dur",
+ "rocher",
+ "place_aviation",
+ ],
+ linear: ["route_chemin", "chemin_de_fer"],
+ water: ["eau_stagnante", "bassin", "cours_eau", "fontaine"],
+};
diff --git a/src/conf/touchpad-voice.ts b/src/conf/touchpad-voice.ts
new file mode 100644
index 0000000..ec4c181
--- /dev/null
+++ b/src/conf/touchpad-voice.ts
@@ -0,0 +1 @@
+export const SEARCH_BY_PRESS_PRECISION_IN_METERS = 50;
diff --git a/src/definitions/braille.d.ts b/src/definitions/braille.d.ts
new file mode 100644
index 0000000..a3d9371
--- /dev/null
+++ b/src/definitions/braille.d.ts
@@ -0,0 +1,4 @@
+declare module "braille" {
+ function toBraille(text: string): string;
+ function toText(braille: string): string;
+}
diff --git a/src/definitions/geojson.d.ts b/src/definitions/geojson.d.ts
new file mode 100644
index 0000000..8170221
--- /dev/null
+++ b/src/definitions/geojson.d.ts
@@ -0,0 +1,3 @@
+declare module "geojson" {
+ function parse(data: {}, settings: {}, callback?: function): string;
+}
diff --git a/src/definitions/images.d.ts b/src/definitions/images.d.ts
new file mode 100644
index 0000000..f73338c
--- /dev/null
+++ b/src/definitions/images.d.ts
@@ -0,0 +1,2 @@
+declare module "*.gif";
+declare module "*.png";
diff --git a/src/definitions/tokml-function.d.ts b/src/definitions/tokml-function.d.ts
new file mode 100644
index 0000000..b4f3c23
--- /dev/null
+++ b/src/definitions/tokml-function.d.ts
@@ -0,0 +1,17 @@
+// import { GeoJsonObject } from "geojson";
+
+declare module "tokml" {
+ interface Options {
+ name?: string;
+ description?: string;
+ timestamp?: string;
+ documentName?: string;
+ documentDescription?: string;
+ simplestyle?: boolean;
+ }
+
+ function tokml(geojsonObject: GeoJsonObject, options: tokml.Options): string;
+
+ namespace tokml {} // workaround: https://github.com/Microsoft/TypeScript/issues/5073#issue-109478860
+ export = tokml;
+}
diff --git a/src/index.html b/src/index.html
new file mode 100644
index 0000000..d4feb49
--- /dev/null
+++ b/src/index.html
@@ -0,0 +1,13 @@
+
+
+ Projet AbaPlans
+
+ Loading...
+
+
+
diff --git a/karma-test-main.js b/test/karma-test-main.js
similarity index 100%
rename from karma-test-main.js
rename to test/karma-test-main.js
diff --git a/karma-test-shim.js b/test/karma-test-shim.js
similarity index 95%
rename from karma-test-shim.js
rename to test/karma-test-shim.js
index 543983b..751a20d 100644
--- a/karma-test-shim.js
+++ b/test/karma-test-shim.js
@@ -22,7 +22,7 @@ require('zone.js/dist/fake-async-test');
any file that ends with '.spec.ts' and get its path. By passing in true
we say do this recursively
*/
-var appContext = require.context('./', true, /\.spec\.ts/);
+var appContext = require.context('../', true, /\.spec\.ts/);
// get all the files, for each file, call the context function
// that will require the file and load it up here. Context will
diff --git a/karma.conf.js b/test/karma.conf.js
similarity index 87%
rename from karma.conf.js
rename to test/karma.conf.js
index 20963bc..22ac765 100644
--- a/karma.conf.js
+++ b/test/karma.conf.js
@@ -1,4 +1,4 @@
-var webpackConfig = require('./webpack.config');
+var webpackConfig = require('../build/webpack.config');
webpackConfig.devtool = 'inline-source-map';
delete webpackConfig.plugins;
@@ -12,22 +12,22 @@ module.exports = function (config) {
// asset (HTML & CSS) paths loaded via Angular's component compiler
// (these paths need to be rewritten, see proxies section)
{
- pattern: './src/**/*.html',
+ pattern: '../src/**/*.html',
included: false,
watched: true
}, {
- pattern: './src/**/*.css',
+ pattern: '../src/**/*.css',
included: false,
watched: true
},
// paths for debugging with source maps in dev tools
{
- pattern: './src/**/*.ts',
+ pattern: '../src/**/*.ts',
included: false,
watched: false
}, {
- pattern: './src/**/*.js.map',
+ pattern: '../src/**/*.js.map',
included: false,
watched: false
},
diff --git a/tsconfig.json b/tsconfig.json
index 01f9ddc..c3dcb0e 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -7,17 +7,9 @@
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
- "noImplicitAny": false,
- "rootDir": "src",
- "strictNullChecks": true,
- "skipLibCheck": true,
- "types": [
- "node"
- ],
- "typeRoots" : ["../node_modules/@types"]
+ "skipLibCheck": true
},
"include": [
- "src/**/*.ts",
- "node_modules/@types"
+ "src/**/*.ts"
]
}
diff --git a/tslint.json b/tslint.json
new file mode 100644
index 0000000..6bf3b5c
--- /dev/null
+++ b/tslint.json
@@ -0,0 +1,18 @@
+{
+ "defaultSeverity": "error",
+ "extends": "tslint:recommended",
+ "jsRules": {},
+ "rules": {
+ "interface-name": [
+ true,
+ "never-prefix"
+ ],
+ "variable-name": [
+ true,
+ "ban-keywords",
+ "check-format",
+ "allow-leading-underscore"
+ ]
+ },
+ "rulesDirectory": []
+}
diff --git a/webpack.config.js b/webpack.config.js
deleted file mode 100644
index e59c561..0000000
--- a/webpack.config.js
+++ /dev/null
@@ -1,81 +0,0 @@
-var webpack = require("webpack");
-
-module.exports = {
- entry: {
- main: [
- './src/app/boot.ts' // entry point for your application code
- ],
- vendor: [
- // put your third party libs here
- "core-js",
- "rxjs",
- "zone.js",
- '@angular/core',
- '@angular/common',
- "@angular/compiler",
- "@angular/core",
- "@angular/http",
- "@angular/platform-browser",
- "@angular/platform-browser-dynamic",
- "@angular/router",
- "angular-in-memory-web-api",
- "ng2-bootstrap"
- ]
- /*,
- pure: [
- './app/shared/pagination/paginate.purs'
- ]
- */
- },
- output: {
- filename: 'dist/[name].bundle.js',
- libraryTarget: "amd"
- },
- resolve: {
- modulesDirectories: [ 'node_modules', 'bower_components' ],
- extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js', '.html', '.purs']
- },
- module: {
- loaders: [
- {
- test: /\.tsx?$/,
- loaders: ['ts-loader', 'angular2-template-loader'],
- },
- {
- test: /\.(html|css)$/,
- loader: 'raw-loader'
- },
- {
- test: /\.purs$/,
- loader: 'purs-loader',
- exclude: /node_modules/,
- query: {
- src: [ 'bower_components/purescript-*/src/**/*.purs', 'src/**/*.purs' ],
- bundle: false,
- psc: 'psc',
- pscIde: false
- }
- }
- ]
- },
- plugins: [
- new webpack.optimize.CommonsChunkPlugin({
- name: 'vendor',
- minChunks: Infinity
- })
- ],
- externals: [
- function(context, request, callback) {
- if (/^dojo/.test(request) ||
- /^dojox/.test(request) ||
- /^dijit/.test(request) ||
- /^esri/.test(request)
- ) {
- return callback(null, "amd " + request);
- }
- callback();
- }
- ],
- debug: true,
- devtool: 'source-map'
-};
-
- {{getTitle()}}
- {{getId()}}
-
-
+
diff --git a/src/app/map/map.component.ts b/src/app/map/map.component.ts
index e62ae52..01fe79c 100644
--- a/src/app/map/map.component.ts
+++ b/src/app/map/map.component.ts
@@ -1,79 +1,66 @@
-import { Component, OnInit, Input, Output, EventEmitter, SimpleChanges} from '@angular/core';
-import { OptionMap, AbaMap } from './map';
-import { LayerType } from './layer';
-import { MapService } from './map.service';
-import ArcgisSearch = require('esri/dijit/Search');
-const img_loading = require("file?name=./assets/img/[name].[ext]!./assets/img/spin.gif");
-
-import 'rxjs/add/operator/toPromise';
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+import * as loadingSpinnerUrl from "Assets/img/spin.gif";
+import * as br from "braille";
+import "rxjs/add/operator/toPromise";
+import { LayerType } from "./layer";
+import { AbaMap, OptionMap } from "./map";
+import { MapService } from "./map.service";
+
+import ArcgisSearch = require("esri/dijit/Search");
import Extent = require("esri/geometry/Extent");
+import Point = require("esri/geometry/Point");
import Graphic = require("esri/graphic");
import Layer = require("esri/layers/layer");
-import Point = require("esri/geometry/Point");
-
-import * as br from 'braille';
@Component({
- selector: 'aba-map',
- templateUrl: 'map.component.html',
- styleUrls: ['map.component.css']
+ selector: "aba-map",
+ styleUrls: ["map.component.css"],
+ templateUrl: "map.component.html",
})
-export class MapComponent implements OnInit {
-
- //optionMaps: OptionMap[];
- map : AbaMap;
- search: ArcgisSearch;
+export class MapComponent {
+ public get loadingSpinnerURL(): string { return String(loadingSpinnerUrl); }
+ public map: AbaMap;
+ public mapLoading: boolean = false;
+ public mapZoom = "";
- mapLoading : boolean = false;
- imgLoading : string = img_loading;
+ @Output()
+ public onMapInstancied: EventEmitter {{getBrailleTitle()}}
- {{getBrailleId()}}
-