Stop Propagation of Google Maps Marker Click Event – a Solution!

by Oliver 18. September 2015 18:55

Here's a simple scenario using Google Maps Javascript API v3 that until today I could not get to work properly:

Open a custom map popup window after clicking on a map marker, and close it when clicking anywhere on the map or the rest of the surrounding page.

The code I tried

to open the map on click of a marker:

  1. google.maps.event.addListener(marker, "click", function() {
  2.     showPopup(marker);
  3. });

to close any open marker on clicking anywhere outside the map popup:

  1. $(document).on("click.mappopup.offmap", function() {
  2.     closeAllMarkers(markers);
  3. });

The problem I was facing was that the click event that was triggered on the marker would bubble all the way up to the document and the map popup would barely show up when it was already being closed again.

Looking for a solution on the web I stumbled upon this old thread on Google code in which several attempts were made to fix the issue and a maps API team member even announced the bug as fixed, but no-one seemed to actually have actually solved the problem.

Things I've tried according to the above thread

  1. google.maps.event.addListener(marker, "click", function(ev) {
  2.     showPopup(marker);
  4.     // does not do a thing
  5.     ev.cancelBubble = true;
  7.     // does not exist on the passed in event object
  8.     ev.stopPropagation && ev.stopPropagation();
  10.     // does not exist on the passed in event object
  11.     ev.preventDefault && ev.preventDefault();
  13.     // what Google devs proposed but also did not work
  14.     ev.stop();
  15. });

But then I stumbled upon this answer on stackoverflow in which the author mentions: Keep in mind that if you pass "event" as an argument to the handler function you will get a custom Google maps click event which does not have stopPropagation method. And that brought me on the right track!

So I removed the ev parameter from the handler and used the global event object to try and stop it from bubbling up. After trying a few combinations of the above code I settled with this one:

The Working Code

  1. google.maps.event.addListener(marker, "click", function() {
  2.     showPopup(marker);
  4.     // actually stops the event from bubbling up to the map or the document
  5.     event.preventDefault();
  6. });

And that was it! I couldn't believe that the solution was so simple.

Move-Restore – A Little jQuery Plugin to Help Make Your Existing HTML More Mobile-Friendly

by Oliver 27. June 2015 12:46

In the process of making Camping.Info more mobile-friendly, I've needed to move around pieces of HTML in the DOM time and again. At last, I've come up with two little helper functions that I wrapped into a little jQuery plugin that I want to share in this post.

When To Use Move-Restore

The DOM tree on every page on Camping.Info is quite large and often convoluted. At least partly this is a consequence of the many UserControls we use to build our pages on the server using ASP.NET WebForms.

To achieve a more mobile-friendly layout of these pages we needed to position certain elements differently, hide some and show others, and in the end also move around some critical parts to fit the mobile design. Much of work could and has been done by our designer via CSS but for the rest of them we need to touch the DOM tree.

Move-Restore proves especially helpful in the case of a user-agent switching between two different layouts of your site, e.g. the desktop and the mobile layout (in case you have just those two), because it easily allows you to restore elements you previously moved around.

How to Use Move-Restore

Just call $("#move-me").moveTo("#target") when you want to move something e.g. in your mobile layout and at a later point, e.g. when switching back to your desktop layout, call $("move-me").restore(). That's it.

I've also put together a fiddle to show how to use the plugin here. Also, have a look at the usage.html in the below gist.

How It Works

The beauty of this plugin, in my opinion, lies in the fact that you don't have to manually keep track of where you get an element from to later restore it.

Internally, the plugin inserts a <script> element in place of the moved element. The (highly probably) unique id of that script element is stored as a datum on the moved element and later retrievable when we need to restore the element to its original position.

Currently, at revision 2 of the gist, there's one option you can tweak to match your scenario: the jQuery method the plugin should use to move the selected element(s) around. By default, move-restore uses appendTo but there are other sensible options, e.g. prependTo, insertAfter, or insertBefore. Just pass the one that fits your needs as the second optional argument to moveTo.

Use Move-Restore at Your Convenience

I invite everyone to try and use this handy little plugin and am open for feedback.

Happy coding!

Poor Performance of an ASP.NET Application on New Hardware

by Oliver 25. April 2015 22:16

Two days ago I finally did it: I asked a question on looking for advice on why our brand new server performs more poorly than our two older servers.

All the hardware details speak in favor of the new server:


But in reality, the older servers with the lower spec outperformed the new server by almost a factor of two! That is to say, for every 1 Request/sec processed the new server needed 4.5 % Processor time compared to 2.6 % on the old server. Here's a PerfMon screenshot of the new server:


New CPUs are really good at saving energy…

… actually so good, that they will rarely bother to hurry up until you really, really stress them out. Here's a good read by Brent Ozar on an energy serving CPU that would cause certain SQL queries to run two times slower on newer hardware than on the old one! That's exactly what's been happening to us.

Power Plan: From Balanced to High Performance

That brings us to: Power Plans. Windows Server and Client OSes come installed with several Power Plans, and it just so happened that the new server we had ordered with Windows Server 2012 R2 installed had its Power Plan set to Balanced (Recommended). Well, that might be a good choice for the server hoster as it helps keep the electricity bills down but it's absolutely not a good choice if you want your applications to perform well on that server. They will simply be a lot slower than the could be.

So, open the Power Options window by typing "Power Plan" into the start menu or Windows search and check the High Performance radio button:


After doins so on that new server, PerfMon would show this much more soothing picture:


Now, we have only 1,5% Processing Time per 1 Request/sec processed. That's an improvement of factor 3. Nice!

Lesson Learned

I've learned that I'm not that good of a sys admin, yet. I had been contemplating on the reasons of the poor performance of that new server of ours again and again, I had checked all kinds of settings inside IIS, ASP.NET, and the like. Those are the areas I work in day-to-day. Turns out, I needed to widen my horizon. Thanks to I did. And our server is at last performing as it should.

Happy administrating!

Visual Studio 2013 Update 4 Crashes On Startup – It Might Be GitExtensions' Fault

by Oliver 23. February 2015 22:49

Lately, I've been having a hard time with my Visual Studio installation because one day it just out of nowhere started crashing during startup.

Starting VS with the /SafeMode flag avoided the crash but wasn't of much help to do major work since all my R# syntax highlighting and refactoring tools are not available in safe mode.

First Try: Reset All Your Settings

The first time I encountered the problem I found this answer on  helpful which suggests to:

  1. Reset all your Visual Studio settings by calling devenv /resetsettings from a command line prompt or after hitting the Windows key.
  2. Delete the folders %LocalAppData%\Microsoft\VisualStudio and %LocalAppData%\Microsoft\VSCommon

Second Try: Uninstall GitExtensions

Today, VS started crashing again and I was just happy with resetting all of my fine-tuned settings AGAIN. Luckily, a google search brought up this thread on the NCrunch forum and since I use NCrunch for test execution I went to have a look

Here's what Simon had to say there:

I'm thinking the problem was a GIT plugin installed by GitExtensions - I've read other reports about it causing problems, so I've removed it and things seem stable so far.

To verify whether this was true in my case I just went ahead and uninstalled GitExtensions via the Control Panel – and Visual Studio would happily start again! What a relief.

But I Still Want To Use GitExtensions…

After uninstalling, go get the installer again (did you know there's a standalone version without msysgit and kdiff?) and during install unselect all the Visual Studio plugins like this:


UPDATE: Keep Even GitExtensions' VS Plugin!

A commenter to my answer to the VS crash problem on stackoverflow suggested that unchecking the option "Show current branch in Visual Studio" in GitExtensions under Tools –> Settings –> Appearance fixed the VS crashes for him:


I used this hint to reactivate the GitExtensions VS plugin on my machine as well, because I use some of its features quite often.

Now, you should be good to go! I'll try to get back to work now while my VS is running…

Happy coding!

Spartakiade 2015, Berlin

by Anton 20. February 2015 15:20

Andréj und ich nehmen dieses Jahr an der Spartakiade teil. Was ist das?

Die Spartakiade findet vom 21.–22. März 2015 in Berlin statt und bietet Workshops zum Mitmachen an. Bei der Spartakiade kann man sich ohne Zeitdruck ausführlich und intensiv mit einem Thema beschäftigen. Die meisten Workshops sind ganztägig (manche halbtägig). Und weil das wie beim Sport herausfordernd werden kann, heißt die Konferenz „Spartakiade“ – namentlich auch bekannt als Sportveranstaltung :).


Es sind Workshops jedes Schwierigkeitsgrads aus der Softwareentwicklung dabei – etwas für Leichtathleten, Kraftsportler oder Mehrkämpfer und die ganze Mannschaft. Inhaltlich geht es um Agile Games, Event Storming, Git, Node.js / AngularJS, Raspberry Pie, Funktionale Programmierung, Microsoft Lync und vieles mehr.


Falls auch du dich anmelden willst:


enjoyed the post?


Setting up freeSSHd to Connect to its SFTP Server Using SSH Public Key Authentication

by Oliver 14. January 2015 22:59

A while ago I've set up an SFTP server using the freeware freeSSHd which is relatively easy to get up and running. Initially, I created a user/password pair to log into the server.

Using SSH

Last week, we decided to switch to public/private SSH keys for authentication instead of the user/password pair. Among other things, this allows us to script access to our server while at the same time we can avoid keeping a clear text password in one of our scripts. Here's how we've set it up.

Configuring freeSSHd for use with SSH

I'll run you through the necessary steps:

  1. Open an instance of freeSSHd and go to the Users tab. Add or Change a login to use Public Key (SSH only) authorization and enable SFTP access: image
  2. Navigate to the Authentication tab. There you'll find the path to the folder in which to deposit your public keys. If you plan to have more than a few, consider using a subfolder of the default one: image
  3. Open the public key folder in Windows Explorer and create a new empty text file there by the name of the login you've set up in step 1. Make sure the file name is exactly the same as the name of the user and don't add any file extension to it. This is where we'll be pasting a new SSH public key to in a moment: image
  4. Now we will generate an SSH key pair. Locate puttygen.exe on your PC. You can grab it from the PuTTY download page, but it also comes bundled with GitExtensions, or WinSCP, if you use one of these: image [Side note: I use Everything to find such files. It's a great search tool that delivers instant results.]
  5. Start puttygen.exe and generate a pair of SSH keys by clicking Generate ❶: image
  6. Next, copy the public key from the grey text box ❷ and paste it into the empty file you've created in step 3. In my case, this file is called "oliver".
  7. You can now save the private key ❸ to a file of your choice, optionally protected by a passphrase, to use it to connect to freeSSHd via SSH using your preferred tool. I've successfully used WinSCP for testing, as I've experienced several problems using PuTTY's psftp.exe command line tool.


Setting up public key authentication in freeSSHd can be tricky. While researching the solution I've stumbled over this blog post addressing the same problem. Its author refers to this setup guide from IBM (pdf) as the source of help so it might be helpful to others out there, as well.

I hope that my step-by-step guide has also helped you.

Happy connecting!

ASP.NET, OWIN and Katana

by Oliver 12. November 2014 13:42

This is a short overview post on OWIN, which (I quote from its homepage)

[…] defines a standard interface between .NET web servers and web applications. The goal of the OWIN interface is to decouple server and application, encourage the development of simple modules for .NET web development, and, by being an open standard, stimulate the open source ecosystem of .NET web development tools.

In other words, the OWIN specification aims to put an end to monolithic solutions like ASP.NET WebForms or even ASP.NET MVC in favor of creating smaller, more lightweight application components that can be chained together to configure an application that does exactly what the author intends it to do – and nothing more. In addition, OWIN simplifies development of alternative web servers that can substitute IIS, e.g. Nowin, or Helios, a promising .NET server alternative on top of IIS but without the heavy, 15-year old System.Web monolith (here's a good review of Helios by Rick Strahl).

Katana is a Microsoft project that contains OWIN-compatible components…

[…] for building and hosting OWIN-based web applications.

For an overview of Katana look here. The Katana architecture can be found on the right and promotes exchangeability of components on each layer. It turns out that ASP.NET vNEXT (github repo here) continues the work that has been done by Microsoft in that direction. Here's an enlightening quote by David Fowler, development lead on the ASP.NET team:

vNext is the successor to Katana (which is why they look so similar). Katana was the beginning of the break away from System.Web and to more modular components for the web stack. You can see vNext as a continuation of that work but going much further (new CLR, new Project System, new http abstractions).

The future of ASP.NET looks bright – especially for developers!

Check out my last post on ASP.NET vNEXT and Docker, too.

Interesting Introduction to SignalR

by Anton 11. November 2014 20:10

Two weeks ago Robin Sedlaczek held an introductory presentation to SignalR at the ALT.NET group in Berlin.

The Framework has a pretty simple setup. After talking a little about the specifics, Robin showed us how to program a simple console application with clients and server, where both can push data to each other, and call functions. If you do not want to delve into specifics, the SignalR framework has a powerful API. It uses different techniques to connect server and client – it chooses the best available, for instance WebSockets.

One simple application where SignalR is useful is a chat. Robin also showed us a real-time collaboration tool (similar to Google drawings in docs). Of course I thought about our new (yet unreleased) time tracking application. It may be feasible to use SignalR if we want to update the clients often. That is not a scenario yet, but could be, if we want to show data from others users.

It was a nice experience to once again attend a meeting at the ALT.NET User Group Berlin group.

enjoyed the post?


Creating PDFs of HTML

by Anton 7. November 2014 15:47

For our new time tracking web application (which not yet live) we need the functionality to create a PDF report.

Since we use AngularJS to generate the HTML for the reports, I thought it would be nice to just convert that HTML via JavaScript into a PDF. The search for a solution pointed me to jsPDF – a pretty good tool for creating PDF via JavaScript. But its capabilites to convert HTML into PDF are limited (as of late 2014). We needed to convert a HTML table with all its styles into a PDF. I added jsPdfTablePlugin into the mix, but it still did not look good.

So we abandonded the JavaScript way, and let the backend generate the PDF. I added an MVC view that displays the report, which is then captured via wkhtmltopdf. We already knew this process since we use it in our platform tool discoverize generating invoices. It works smoothly.

enjoyed the post?


JavaScript | .NET | C# | PDF

ASP.NET vNEXT, Docker, and the Future of Application Development and Deployment

by Oliver 3. November 2014 09:16

It's been an impressive year so far in the realms of software development and deployment, especially with

Now, it took me a while to understand that we're witnesses of nothing less than a revolution in software development.

The Vision: Build Your App Anywhere, Bundle It, and Run It Anywhere (Else)

The clouds have been with us for a couple of years now and have started to provide real benefit beyond "moving your stuff to somewhere else". What's emerging now, with Docker and also the new ASP.NET runtime bundling, is something completely new: Application Containers. They don't have either specific OS requirements – Docker will be supported natively on Windows Server soon, ASP.NET runs on Linux today – nor need they a specific technology stack installed on the target machine (as with PaaS) because they bring all of the necessary runtime along. But they're also not large VMs bundled with your application, which carry a significant maintenance overhead (when using IaaS). Virtualized application containers are the sweet spot between IaaS and PaaS. Go ahead and read that post – it's eye-opening.

About Oliver code blog logo I build web applications using ASP.NET and have a passion for jQuery. Enjoy MVC 4 and Orchard CMS, and I do TDD whenever I can. I like clean code. Love to spend time with my wife and our daughter. My profile on Stack Exchange, a network of free, community-driven Q&A sites

About Anton code blog logo I'm a software developer at teamaton. I code in C# and work with MVC, Orchard, SpecFlow, Coypu and NHibernate. I enjoy beach volleyball, board games and Coke.