:

BeHub/Hub/static/js/map.js

@@ -19,7 +19,12 @@ Map.prototype.init = function(){
 
 Map.prototype.addMarker = function(data){
     var self = this;
-    var color = data.color || "FE7569";
+    if(project_summary['uuids'].indexOf(data.beacon.uuid) === -1){
+        var color = "FE7569";
+    }
+    else{
+        var color = "FFFF00";
+    }
     var longitude = parseFloat(data.longitude);
     var latitude = parseFloat(data.latitude);
     var image = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + color,
@@ -34,14 +39,7 @@ Map.prototype.addMarker = function(data){
         title: data.title,
         beacon: data.beacon
       }).addListener('click', function() {
-        $.getJSON("/api/user_project/" + project_id + "/beacons", function(beacon){ return function(data){
-          project_data = data
-          project_summary['uuids'] = [];
-          for(var i=0; i< data.length; i++){
-            project_summary['uuids'].push(project_data[i].uuid)
-          }
-          self.showInfo(beacon)
-        }}(this.beacon))
+          self.showInfo(this.beacon)
       })
     self.markers.push(marker)
 
@@ -49,6 +47,12 @@ Map.prototype.addMarker = function(data){
 
 Map.prototype.getAllBeacons = function(){
     var self = this;
+    $.getJSON("/api/user_project/" + project_id + "/beacons", function(data){
+        project_data = data
+        project_summary['uuids'] = [];
+        for(var i=0; i< data.length; i++){
+            project_summary['uuids'].push(project_data[i].uuid)
+        }
         $.getJSON("/api/beacons", function(data){
             for(var i=0; i<data.count; i++){
                 self.addMarker({
@@ -60,6 +64,7 @@ Map.prototype.getAllBeacons = function(){
                 });
             }
         })
+    })
 }
 
 Map.prototype.showInfo = function(beacon){

BeHub/Hub/templates/user_panel/content/dashboard.html

@@ -7,14 +7,16 @@
 <div class="container">
     <div class="row">
 
-<a href="/project/{{ project.id }}">
+<a href="#" onclick="$('#myModal').modal('show')">
         <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-lg-offset-3" >
             <div class="box  opacity" >
                 <div class="box-icon">
                     <span class="fa fa-4x fa-html5"></span>
                 </div>
                 <div class="info">
-                    <h4 class="text-center"> Nowy projekt</h4>
+                    <h4 class="text-center"><!-- Button trigger modal -->
+                      Nowy projekt
+                    </h4>
                 </div>
             </div>
         </div>
@@ -40,5 +42,23 @@
 	</div>
 </div>
 
+<!-- Modal -->
+<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
+      </div>
+      <div class="modal-body" id="modal-content">
+
+      </div>
+      <div class="modal-footer" id="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+        <button type="button" class="btn btn-primary">Add to category</button>
+      </div>
+    </div>
+  </div>
+</div>
 
 {% endblock content %}
\ No newline at end of file