<div>
+
<div class="col-lg-9 col-md-8 col-xs-7"><mou-search (newsearch)="map.update($event)"></mou-search></div>
<div class="col-lg-3 col-md-4 col-xs-5 no-padding"><mou-sidebar (tempmarker)="map.tempMarker($event)" #sidebar></mou-sidebar></div>
- <mou-map (newactive)="sidebar.update($event)" (neworg)="sidebar.add($event)"#map></mou-map>
-
+ <mou-map (newactive)="sidebar.update($event)" (neworg)="sidebar.add($event)"#map (toplevel)="showtoplevel()"></mou-map>
</div>
import {HTTP_PROVIDERS} from 'angular2/http';
-import {Component, View, bootstrap, provide, ELEMENT_PROBE_PROVIDERS} from 'angular2/angular2';
+import {Component, NgZone, NgIf, View, bootstrap, provide, ELEMENT_PROBE_PROVIDERS} from 'angular2/angular2';
import {Map} from './map/map';
import {Search} from "./search/search";
import {Sidebar} from "./sidebar/sidebar";
{
selector: 'mou-app',
templateUrl: './components/app.html',
- directives:[Map, Search, Sidebar]
+ directives:[Map, Search, Sidebar, NgIf]
})
class App {
+ zone: Zone;
+ constructor(zone: NgZone){
+ this.zone = zone;
+ }
+ toplevel: boolean = false;
+
+ showtoplevel(){
+ let instance = this;
+ zone.run(() => {
+ this.setToplevelTrue();
+ });
+ }
+
+ setToplevelTrue(){
+ this.toplevel = true;
+ }
}
bootstrap(App,[HTTP_PROVIDERS, ELEMENT_PROBE_PROVIDERS]);
<div id="map"></div>
+<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+ <div class="modal-dialog modal-sm" role="document">
+ <div class="modal-content">
-<div id="divModal" >
- <!--- class="modal-dialog modal-sm">-->
- <!-- <div class="modal-content">-->
+ <div class="modal-body">
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
- <!-- <div class="modal-header">-->
- <button type="button" class="close" (click)="closeModal()">×</button>
- <h4 class="modal-title">What do you want ? </h4>
- <!-- </div>-->
-
- <!-- <div class="modal-body">-->
- <div id="topLevel">
- <button type="button" class="btn btn-default" (click)="seeDetails()">See details</button>
- <button type="button" class="btn btn-default" (click)="drillDown()">Drill down</button>
- </div>
- <div id="middleLevel">
- <button type="button" class="btn btn-default" (click)="seeDetails()">See details</button>
- <button type="button" class="btn btn-default" (click)="drillDown()">Drill down</button>
- <button type="button" class="btn btn-default" (click)="drillUp()">drill up</button>
- </div>
- <div id="bottomLevel">
- <button type="button" class="btn btn-default" (click)="addUnit()">Yes</button>
- <button type="button" class="btn btn-default" (click)="seeDetails()">See details</button>
- <button type="button" class="btn btn-default" (click)="drillUp()">Drill up</button>
- </div>
- <!-- </div>
-
- <div class="modal-footer">
- hei
+ <div id="topLevel">
+ <button type="button" class="btn btn-default btn-sm" (click)="seeDetails()">See details</button>
+ <button type="button" class="btn btn-default btn-sm" (click)="drillDown()">Drill down</button>
+ </div>
+ <div id="middleLevel">
+ <button type="button" class="btn btn-default btn-sm" (click)="seeDetails()">See details</button>
+ <button type="button" class="btn btn-default btn-sm" (click)="drillDown()">Drill down</button>
+ <button type="button" class="btn btn-default btn-sm" (click)="drillUp()">drill up</button>
+ </div>
+ <div id="bottomLevel">
+ <button type="button" class="btn btn-default btn-sm" (click)="addUnit()">Yes</button>
+ <button type="button" class="btn btn-default btn-sm" (click)="seeDetails()">See details</button>
+ <button type="button" class="btn btn-default btn-sm" (click)="drillUp()">Drill up</button>
+ </div>
+ </div>
</div>
--->
-
-
- <!--</div>-->
+ </div>
</div>
+
-import {Component, EventEmitter,CORE_DIRECTIVES,} from 'angular2/angular2';
+import {Component, EventEmitter,CORE_DIRECTIVES, NgIf} from 'angular2/angular2';
import {Headers, Http} from 'angular2/http';
@Component({
allLevels:Object;
runned:boolean;
uprunned:boolean;
+ toplevel: boolean = false;
parent:Object;
activeId:string;
currentPos:Object;
this.currentMarker = null;
this.isSearched = false;
// this.COLORS = {'red','brown',',yellow','green',',pink','purple','gray','black'};
+/*
this.hideModal = document.getElementById("topLevel").style.visibility = "hidden";
this.hideModal = document.getElementById("middleLevel").style.visibility = "hidden";
this.hideModal = document.getElementById("bottomLevel").style.visibility = "hidden";
- this.hideModal = document.getElementById("divModal").style.display = "none";
+ */
}
setActiveId(id) {
strokeColor: 'black',
scale: 3
};
- instance.map.panTo({lat:unit.geometry.coordinates[1],lng:unit.geometry.coordinates[0]});
+ instance.map.panTo({lat:unit.geometry.coordinates[0],lng:unit.geometry.coordinates[1]});
}
this.map.data.addGeoJson(unit);
instance.seeDetails();
}
this.map.data.addListener('click', function (event) {
+ $('#myModal').modal('show');
+ console.log("blaluaoleua");
instance.setActiveId(event.feature.O.id);
instance.setcurrentPos(event.latLng);
if (instance.uprunned == false && instance.LEVEL == 2) {
- this.hideModal = document.getElementById("topLevel").style.visibility = "visible";
- this.hideModal = document.getElementById("middleLevel").style.visibility = "hidden";
- this.hideModal = document.getElementById("bottomLevel").style.visibility = "hidden";
+ this.hideModal = document.getElementById("topLevel").style.display = "block";
+ this.hideModal = document.getElementById("middleLevel").style.display = "none";
+ this.hideModal = document.getElementById("bottomLevel").style.display = "none";
instance.showModal();
}
else if (instance.runned == false && instance.LEVEL < instance.allLevels) {
- this.hideModal = document.getElementById("topLevel").style.visibility = "hidden";
- this.hideModal = document.getElementById("middleLevel").style.visibility = "visible";
- this.hideModal = document.getElementById("bottomLevel").style.visibility = "hidden";
+ this.hideModal = document.getElementById("topLevel").style.display = "none";
+ this.hideModal = document.getElementById("middleLevel").style.display = "block";
+ this.hideModal = document.getElementById("bottomLevel").style.display = "none";
instance.showModal();
} else if (instance.runned == false && instance.LEVEL <= instance.allLevels) {
- this.hideModal = document.getElementById("topLevel").style.visibility = "hidden";
- this.hideModal = document.getElementById("middleLevel").style.visibility = "hidden";
- this.hideModal = document.getElementById("bottomLevel").style.visibility = "visible";
+ this.hideModal = document.getElementById("topLevel").style.display = "none";
+ this.hideModal = document.getElementById("middleLevel").style.display = "none";
+ this.hideModal = document.getElementById("bottomLevel").style.display = "block";
instance.setcurrentPos(event.latLng);
instance.showModal();
}
+
});
}
}
}
showModal() {
- return this.hideModal = document.getElementById("divModal").style.display = "block";
+ //TODO fix me
+ console.log("trenger vi denne?");
}
closeModal() {
+ /*
this.hideModal = document.getElementById("topLevel").style.visibility = "hidden";
this.hideModal = document.getElementById("middleLevel").style.visibility = "hidden";
this.hideModal = document.getElementById("bottomLevel").style.visibility = "hidden";
- this.hideModal = document.getElementById("divModal").style.display = "none";
+ */
+ $("#myModal").modal("hide");
+
this.setRunned(false);
+
+ console.log("trenger vi denne?");
}
}
</ul>
</div>
</span>
- <div class="row">
- <span [hidden]="!hideDiv()">
- <div class="divhelp col-md-8"></div>
- </span>
-
<div id="dropdowndiv" class="btn-group collapse col-md-2">
exitButton: any;
featureType: Control = new Control("");
coordinates: Control = new Control("");
- ctrlGroups: Control[]= [new Control('')];
+ ctrlGroups: Array<Control> = [new Control('')];
groupsArray: ControlArray = new ControlArray(this.ctrlGroups);
}
addOrgUnitSets(instance, res){
- instance.ctrlArray.removeAt(0);
+ //delete instance.ctrlGroups[0];
for( group in res){
console.log(instance.form.controls);
instance.groupsArray.push(new Control(''));
.result{
opacity: 0.8;
- height: 25vh;
+ max-height: 70vh;
+ min-height: 8vh;
overflow: scroll;
position: relative;
z-index: 1;
color: white;
}
-/* modal */
-
-#divModal{
- position: relative;
- margin-top: 0;
- width: 20%;
- background: red;
- overflow: hidden;
-}
/* other */