Fixing issue #10

Author: mattpodwysocki

examples/draganddrop/dragndrop.css

@@ -1,3 +1,10 @@
+html  {
+  -moz-user-select: none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  user-select: none;
+}   
+
 #dragTarget {
     background-image: url(logo.png);
     background-repeat: no-repeat;

examples/draganddrop/dragndrop.html

@@ -23,6 +23,7 @@ <h1>RxJS for jQuery Bindings Drag and Drop Example</h1>
     <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script>
     <script src="http://ajax.aspnetcdn.com/ajax/bootstrap/2.3.1/bootstrap.min.js"></script>
     <script src="http://cdn.jsdelivr.net/rxjs/2.1.11/rx.js"></script>
+    <script src="http://cdn.jsdelivr.net/rxjs/2.1.11/rx.binding.js"></script>
     <script src="../../rx.jquery.js"></script>
     <script src="dragndrop.js"></script>  
 </body>

examples/draganddrop/dragndrop.js

@@ -1,14 +1,17 @@
 $(function () {
 
-    var dragTarget = $('#dragTarget')
+    var dragTarget = $('#dragTarget');
 
     // Get the three major events
-    var mouseup = dragTarget.onAsObservable('mouseup');
-    var mousemove = dragTarget.onAsObservable('mousemove');
-    var mousedown = dragTarget.onAsObservable('mousedown').map(function (event) {
+    var mouseup = dragTarget.bindAsObservable('mouseup').publish().refCount();
+    var mousemove = $(document).bindAsObservable('mousemove').publish().refCount();
+    var mousedown = dragTarget.bindAsObservable('mousedown').publish().refCount().map(function (event) {
         // calculate offsets when mouse down
         event.preventDefault();
-        return { left: event.clientX - dragTarget.offset().left, top: event.clientY - dragTarget.offset().top };
+        return { 
+            left: event.clientX - dragTarget.offset().left, 
+            top: event.clientY - dragTarget.offset().top,
+        };
     });
 
     // Combine mouse down with mouse move until mouse up