title: Javascript/DOM event name convention
body: <p>When I started doing web development, I realized Javascript event names were all in lower case with no separators, i.e. <strong>"mousedown"</strong>, <strong>"mouseup"</strong>, etc. And when working with the jQuery UI library, I noticed they also use the same convention; i.e. <strong>"dropdeactivate"</strong> as in the following example</p>
  
  <pre class="lang-js prettyprint-override"><code>$( ".selector" ).on( "dropdeactivate", function( event, ui ) {} )
  </code></pre>
  
  <p>While this works well for names that are only 2 or 3 words, it is really awful for names with more words on it. </p>
  
  <p>Despite of this I followed that convention too when I have to fire custom (synthetic) events that I created, until recently when I decided it was better to start using some form of separator. Now I use something like <strong>"drop:deactivate"</strong>, or <strong>"app:ready"</strong>.</p>
  
  <p>on iOS apple recently added this event for the HTML 5 Airplay API, and I agree with the autor of this post <a href="http://www.mobilexweb.com/blog/safari-ios7-html5-problems-apis-review" rel="noreferrer">http://www.mobilexweb.com/blog/safari-ios7-html5-problems-apis-review</a> when he says:</p>
  
  <blockquote>
    <p>I think <strong>"webkitcurrentplaybacktargetiswirelesschanged"</strong> has won the record: <strong>the longest JavaScript event name ever</strong>.</p>
  </blockquote>
  
  <p><strong>What is the reason behind this weird convention?</strong> why not use any form of separator or camelCase convention to name the events in a more readable way? </p>
  
  <p>I think there is a reason for that, lot of clever people worked on this... But after a while I'm still wondering why?</p>