Commit 3f5591cf authored by Alexander's avatar Alexander

ability to show and hide umkreissuche control

parent cf4dea96
......@@ -11,10 +11,6 @@ export class RadiusFilterControl extends Control{
isCollapsed:boolean;
basicStyle :string = ' width: 3em; height:3em; background-color:white; border-radius:20px; ';
collapsedStyle : string = ' margin-right:-1em; margin-left:-1em; ';
filterButtons : HTMLElement[]=[];
umkreissucheLabel: HTMLLabelElement;
......@@ -41,9 +37,11 @@ export class RadiusFilterControl extends Control{
//concerning radius range input
//expandToggle.setAttribute('style','border-radius:20px;');
//expandToggle.className='btn btn-primary m-3';
let div1 = document.createElement('div');
div1.className=('form-group p-2 btn');
div1.setAttribute('style','background-color: white');
let div1UmkreissucheActive = document.createElement('div');
div1UmkreissucheActive.className=('form-group p-2 btn');
div1UmkreissucheActive.id="umkreissuche-active";
div1UmkreissucheActive.hidden=true;
div1UmkreissucheActive.setAttribute('style','background-color: white');
const input1 = document.createElement('input');
input1.type='range';
......@@ -55,11 +53,25 @@ export class RadiusFilterControl extends Control{
const label1 = document.createElement('label');
label1.innerText="Umkreissuche ";
div1.appendChild(label1);
const quitUmkreissucheButton = document.createElement('div');
quitUmkreissucheButton.innerText="beende Umkreissuche";
quitUmkreissucheButton.setAttribute('style','btn btn-warning');
quitUmkreissucheButton.addEventListener('click',()=>{
//hide myself and show my other side
document.getElementById('umkreissuche-inactive').hidden=false;
document.getElementById('umkreissuche-active').hidden=true;
});
div1UmkreissucheActive.appendChild(quitUmkreissucheButton);
div1UmkreissucheActive.appendChild(label1);
this.umkreissucheLabel=label1;
div1.appendChild(input1);
div1UmkreissucheActive.appendChild(input1);
expandToggle.appendChild(div1);
expandToggle.appendChild(this.makeUmkreissucheInActive());
expandToggle.appendChild(div1UmkreissucheActive);
//expandToggle.innerText='(TODO) something something radius filter';
//expandToggle.addEventListener('click',()=>this.clickToggleRadiusFilter(this));
......@@ -82,6 +94,22 @@ export class RadiusFilterControl extends Control{
}
makeUmkreissucheInActive():HTMLDivElement{
let div1 = document.createElement('div');
div1.className=('p-2 btn btn-outline-primary');
div1.setAttribute('style','background-color: white');
div1.innerText="Umkreissuche aktivieren";
div1.id="umkreissuche-inactive";
div1.addEventListener('click',function(e:Event){
//hide myself and show my other side
document.getElementById('umkreissuche-inactive').hidden=true;
document.getElementById('umkreissuche-active').hidden=false;
});
return div1;
}
clickToggleRadiusFilter = (instance : RadiusFilterControl) => {
console.log('click toggle radius filter');
......
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