Commit cf4dea96 authored by Alexander's avatar Alexander

indicate the radius for the umkreissuche to the user

parent 91ef6365
......@@ -3,6 +3,7 @@ import Map from 'ol/Map.js'
import View from 'ol/View.js'
import { isContentQueryHost } from '@angular/core/src/render3/util';
import { MapService } from 'src/app/services/map.service';
import { LogService } from 'src/app/services/log.service';
export class RadiusFilterControl extends Control{
......@@ -14,8 +15,10 @@ export class RadiusFilterControl extends Control{
collapsedStyle : string = ' margin-right:-1em; margin-left:-1em; ';
filterButtons : HTMLElement[]=[];
umkreissucheLabel: HTMLLabelElement;
constructor(opt_options, private mapService:MapService){
constructor(opt_options, private mapService:MapService, private logger:LogService){
super({});
let rowContainer = document.createElement('div');
......@@ -49,13 +52,22 @@ export class RadiusFilterControl extends Control{
input1.min='50'; //50 m
input1.max='50000';//50 km
const label1 = document.createElement('label');
label1.innerText="Umkreissuche ";
div1.appendChild(label1);
this.umkreissucheLabel=label1;
div1.appendChild(input1);
expandToggle.appendChild(div1);
//expandToggle.innerText='(TODO) something something radius filter';
expandToggle.addEventListener('click',()=>this.clickToggleRadiusFilter(this));
expandToggle.addEventListener('change',()=>this.clickToggleRadiusFilter(this));
//expandToggle.addEventListener('click',()=>this.clickToggleRadiusFilter(this));
//'input' || 'change'
// listening to the input event allows scaling the circle as the user
// changes the range input value
expandToggle.addEventListener('input',()=>this.clickToggleRadiusFilter(this));
element.appendChild(expandToggle);
......@@ -73,12 +85,18 @@ export class RadiusFilterControl extends Control{
clickToggleRadiusFilter = (instance : RadiusFilterControl) => {
console.log('click toggle radius filter');
//BUG: when no last clicked position is present, adjusting the circle
//throws an exception
let myrangeinput:HTMLElement = document.getElementById('radius-control-input');
let myrangeinput1:HTMLInputElement = <HTMLInputElement>myrangeinput;
//propagate this value to set the radius
//myrangeinput1.value;
this.logger.debug("new radius : "+myrangeinput1.value);
this.umkreissucheLabel.innerText="Umkreissuche: "+myrangeinput1.value+" m";
//this.logger.notify('info','hello');
this.mapService.radius_meters=parseInt(myrangeinput1.value);
this.mapService.updateUmkreisRadiusFeature();
......
......@@ -554,7 +554,8 @@ export class MapService {
source:this.source,
target:'map'
},
this
this,
this.logger
)
]
)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment