diff --git a/public/images/admin/others/activity_indicator.gif b/public/images/admin/others/activity_indicator.gif
new file mode 100644
index 0000000000..08fca6b68f
Binary files /dev/null and b/public/images/admin/others/activity_indicator.gif differ
diff --git a/public/images/admin/others/close.png b/public/images/admin/others/close.png
new file mode 100644
index 0000000000..3d0bf175c5
Binary files /dev/null and b/public/images/admin/others/close.png differ
diff --git a/public/images/admin/others/corners_mashup.png b/public/images/admin/others/corners_mashup.png
new file mode 100644
index 0000000000..5cba01eaa2
Binary files /dev/null and b/public/images/admin/others/corners_mashup.png differ
diff --git a/public/images/admin/others/infowindow.png b/public/images/admin/others/infowindow.png
new file mode 100644
index 0000000000..e8f11aa5f7
Binary files /dev/null and b/public/images/admin/others/infowindow.png differ
diff --git a/public/images/admin/others/logo_mashup.png b/public/images/admin/others/logo_mashup.png
new file mode 100644
index 0000000000..c20b3db010
Binary files /dev/null and b/public/images/admin/others/logo_mashup.png differ
diff --git a/public/images/admin/others/marker.png b/public/images/admin/others/marker.png
new file mode 100644
index 0000000000..7cda19be16
Binary files /dev/null and b/public/images/admin/others/marker.png differ
diff --git a/public/prototypes/mashup.html b/public/prototypes/mashup.html
new file mode 100644
index 0000000000..5fa19abd84
--- /dev/null
+++ b/public/prototypes/mashup.html
@@ -0,0 +1,235 @@
+
+<!DOCTYPE html> 
+<html lang="en"> 
+  <head> 
+    <meta charset=utf-8 /> 
+    <title>Clubs - Mashup</title> 
+    <link rel="shortcut icon" href="/favicon/favicon_32x32.ico" /> 
+    <link href="/stylesheets/reset.css" media="screen" rel="stylesheet" type="text/css" /> 
+    
+    <style type="text/css">
+      body {position:relative; background:#2D3451;}
+      /*HEADER*/
+      header {width:900px; height:100px; margin:0 auto; padding:20px 0 50px 0; background:none;}
+      header a.logo {float:left; width:200px; height:100px; margin:21px 0 0 0; background:url('/images/admin/others/logo_mashup.png') no-repeat 0 0; text-indent:-9999px;}
+      section.map {position:relative; margin:0 auto; width:900px; height:600px; -wekit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; border:1px solid black;}
+      section.map div#map {float:left; width:900px; height:600px;}
+      section.map span.top-left {position:absolute; width:5px; height:5px; background-image:url('/images/admin/others/corners_mashup.png');top:-1px; left:-1px; background-position:0 0;}
+      section.map span.top-right {position:absolute; width:5px; height:5px; background-image:url('/images/admin/others/corners_mashup.png');top:-1px; right:-1px; background-position:-5px 0;}
+      section.map span.bottom-left {position:absolute; width:5px; height:5px; background-image:url('/images/admin/others/corners_mashup.png');bottom:-1px; left:-1px; background-position:0 -5px;}
+      section.map span.bottom-right {position:absolute; width:5px; height:5px; background-image:url('/images/admin/others/corners_mashup.png');bottom:-1px; right:-1px; background-position:-5px -5px;}
+      section.map p.loading {position:absolute; display:none; top:10px; left:50%; margin:0 0 0 -47px; padding:5px 30px 5px 10px; background:url('/images/admin/others/activity_indicator.gif') no-repeat 68px 5px rgba(0,0,0,0.9);
+       -wekit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; font:normal 15px Arial; color:white;}
+      /*Infowindow*/
+      a.clubMarker {float:left; display:block; width:25px; height:25px; background:url("/images/admin/others/marker.png") no-repeat 0 0; text-indent:-9999px;}
+      a.clubMarker:hover {cursor:pointer;}
+      div.hidden {position:absolute; top:-200px; left:-105px; display:none; width:233px; height:207px; margin:0; padding:0; background:url("/images/admin/others/infowindow.png") no-repeat 0 0;} 
+      div.hidden a.close {position:absolute; right:1px; top:0px; width:21px; height:21px; background:url("/images/admin/others/close.png") no-repeat 0 0; text-indent:-9999px;}
+      div.hidden a.close:hover {background-position:0 -21px;}
+      div.hidden h3 {float:left; width:193px; margin:20px 0 0 20px; font:bold 16px "Helvetica",Arial; color:#333333; letter-spacing:-1px;}
+      div.hidden div.content {float:left; width:193px; margin:0 0 0 20px;}
+      div.hidden div.content img {float:left; width:50px; margin:10px 10px 10px 0; border:1px solid black;}
+      div.hidden div.content p {float:none; padding:8px 0 0 0; font:normal 14px Arial; color:#666666;}
+    </style>
+    
+    <script src="/javascripts/plugins/jquery.min.js" type="text/javascript" charset="utf-8"></script>
+    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
+    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&region=ES&language=ES"></script>
+  </head> 
+  <body> 
+    <header> 
+      <a class="logo" href="/">CartoDB</a> 
+    </header> 
+    
+    <section class="map">
+      <div id="map"></div>
+      <span class="top-right"></span>
+      <span class="top-left"></span>
+      <span class="bottom-left"></span>
+      <span class="bottom-right"></span>
+      <p class="loading">Loading</p>
+    </section>
+
+    <script type="text/javascript">
+        var map;
+        var bounds = new google.maps.LatLngBounds();
+        
+        jQuery(function($) {
+            showLoader();
+            
+            var myOptions = {
+              zoom: 6,
+              center: new google.maps.LatLng(40.4166909, -3.7003454),
+              disableDefaultUI: true,
+              mapTypeId: google.maps.MapTypeId.ROADMAP
+            }
+            map = new google.maps.Map(document.getElementById("map"),myOptions);
+            
+            var current_position;
+
+            if (google.loader.ClientLocation) {
+              current_position = new google.maps.LatLng(google.loader.ClientLocation.latitude, google.loader.ClientLocation.longitude);
+              getNearClubs(current_position);
+            } else {
+              if (navigator.geolocation){
+                navigator.geolocation.getCurrentPosition(function(position){
+                  current_position = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
+                  getNearClubs(current_position);
+                });
+              }
+            }
+            
+        });
+        
+        
+        
+        function showLoader() {
+          $('p.loading').fadeIn();
+        }
+        
+        
+        function hideLoader() {
+          $('p.loading').fadeOut();
+        }
+        
+        
+        
+        function getNearClubs(position) {
+          //Marker with user position
+          map.setCenter(position);
+          bounds.extend(position);
+          map.setZoom(15);
+          var marker = new google.maps.Marker({position: position, map: map,title:"Your position!"});
+          
+          
+          //Club Markers
+          //Get other markers
+          // example - 40.41356139992232, -3.695676326751709
+          var club_marker = new ClubMarker(new google.maps.LatLng(40.4222594, -3.6996326),'',map);
+          bounds.extend(new google.maps.LatLng(40.4222594, -3.6996326));
+          map.fitBounds(bounds);
+          
+          
+          hideLoader();
+        }
+        
+
+        
+
+        function ClubMarker(latlng, info, map) {
+          this.latlng_ = latlng;
+        	this.inf = info;
+        	this.map_ = map;
+
+          this.offsetVertical_ = -12;
+          this.offsetHorizontal_ = -13;
+          this.height_ = 25;
+          this.width_ = 25;
+
+          this.setMap(map);
+        }
+
+        ClubMarker.prototype = new google.maps.OverlayView();
+
+        ClubMarker.prototype.draw = function() {
+
+          var me = this;
+        	var num = 0;
+
+          var div = this.div_;
+          if (!div) {
+            div = this.div_ = document.createElement('DIV');
+            $(div).addClass('clubMarker');
+            div.style.border = "none";
+            div.style.position = "absolute";
+        		div.style.width = '25px';
+        		div.style.height = '25px';
+
+
+            var content = ""+
+              "<a class='clubMarker'>marker</a>"+
+              "<div class='hidden'>"+
+                "<a href='#close' class='close'>close</a>"+
+                "<h3>Bonito var gay chuequeño</h3>"+
+                "<div class='content'>"+
+                  "<img src='http://chengdu.zonalibre.org/archives/bar%20gay%20patrocinado%20por%20Barcadi.JPG'/>"+
+                  "<p>En esta pequeña y humilde oficina se va celebrar una de las mayores fiestas gay del año, como anticipo el Love Gay Parade 2011. Fiestón padre.</p>"+
+                "</div>"+
+              "</div>";
+
+            $(div).append(content);
+            
+            $('a.close').live('click',function(ev){
+              ev.stopPropagation();
+              ev.preventDefault();
+              $('div.hidden').hide();
+            });
+            
+            
+            $('a.clubMarker').live('click',function(ev){
+              ev.stopPropagation();
+              ev.preventDefault();
+              me.moveMaptoOpen();
+              $('div.hidden').hide();
+              $(this).parent().children('div.hidden').show();
+            });
+
+
+            var panes = this.getPanes();
+            panes.floatPane.appendChild(div);
+          }
+
+        	var pixPosition = me.getProjection().fromLatLngToDivPixel(me.latlng_);
+          if (pixPosition) {
+        	  div.style.width = me.width_ + 'px';
+        	  div.style.left = (pixPosition.x + me.offsetHorizontal_) + 'px';
+        	  div.style.height = me.height_ + 'px';
+        	  div.style.top = (pixPosition.y + me.offsetVertical_) + 'px';
+          }
+
+        };
+
+        ClubMarker.prototype.remove = function() {
+          if (this.div_) {
+            this.div_.parentNode.removeChild(this.div_);
+            this.div_ = null;
+          }
+        };
+
+        ClubMarker.prototype.hide = function() {
+          if (this.div_) {
+            $(this.div_).find('div').fadeOut();
+          }
+        };
+
+        ClubMarker.prototype.getPosition = function() {
+         return this.latlng_;
+        };
+
+
+        ClubMarker.prototype.moveMaptoOpen = function() {
+        	var left = 0;
+        	var top = 0;
+
+          var pixPosition = this.getProjection().fromLatLngToContainerPixel(this.latlng_);
+
+
+          if ((pixPosition.x + this.offsetHorizontal_) < 110) {
+           left = (pixPosition.x + this.offsetHorizontal_ - 110);
+          }
+
+          if (($('div#map').width() - pixPosition.x + this.offsetHorizontal_) < 105) {
+           left = 105 - $('div#map').width() + pixPosition.x - this.offsetHorizontal_;
+          }
+
+        	if ((pixPosition.y + this.offsetVertical_) < 205) {
+        		top = pixPosition.y + this.offsetVertical_ -205;
+        	}
+
+        	this.map_.panBy(left,top);
+        }
+
+    </script>
+    
+  </body> 
+</html>
\ No newline at end of file
