Fix issues in the article and in the code samples

myshov · myshov · commit db791401dabb · 2015-06-12T13:38:10.000+05:00
diff --git a/2-ui/3-event-details/5-drag-and-drop-objects/article.md b/2-ui/3-event-details/5-drag-and-drop-objects/article.md
@@ -187,7 +187,7 @@ document.onmousemove = function(e) {
 
     // аватар создан успешно
     // создать вспомогательные свойства shiftX/shiftY
-    var coords = getCoords(avatar);
+    var coords = getCoords(dragObject.avatar);
     dragObject.shiftX = dragObject.downX - coords.left;
     dragObject.shiftY = dragObject.downY - coords.top;
 
@@ -343,7 +343,7 @@ function findDroppable(event) {
     return null;
   }
 
-  return target.closest('.droppable');
+  return elem.closest('.droppable');
 }
 ```
 
@@ -376,9 +376,9 @@ var DragManager = new function() {
 }
 ```
 
-Всю работу будут выполнять обработчики `onMouse*`, которые оформлены как локальные функции. В данном случае они ставятся на `document` через `on...`, но это легко поменять это на `addEventListener`.
+Всю работу будут выполнять обработчики `onMouse*`, которые оформлены как локальные функции. В данном случае они ставятся на `document` через `on...`, но это легко поменять на `addEventListener`.
 
-Код функция `onMouse*` мы подробно рассмотрели ранее, но вы сможете увидеть их в полном примере ниже.
+Код функции `onMouse*` мы подробно рассмотрели ранее, но вы сможете увидеть их в полном примере ниже.
 
 Внутренний объект `dragObject` будет содержать информацию об объекте переноса.
 
@@ -396,7 +396,7 @@ var DragManager = new function() {
 
 Задачей `DragManager` является общее управление переносом. Что же касается действий при его окончании -- их должен назначить внешний код, который использует `DragManager`.
 
-Можно сделать это через вспомогательные методы `onDrag*`, которые устанавливаются внешним кодом и затем вызываются фреймворком. Разработчик, подключив `DragManager`, описывает в этих методах, что делать при начале и завершении переноса. Конечно же, можно заменить методы `onDrag*` на генерацию "своих" событий.
+Можно сделать это через вспомогательные методы `onDrag*`, которые устанавливаются внешним кодом и затем вызываются фреймворком. Разработчик, подключив `DragManager`, описывает в этих методах, что делать при завершении или отмене переноса. Конечно же, можно заменить методы `onDrag*` на генерацию "своих" событий.
 
 С использованием `DragManager` пример, с которого начиналась эта глава -- перенос иконок браузеров в компьютер, реализуется совсем просто:
 
@@ -514,11 +514,11 @@ DragManager.onDragCancel = function(dragObject) {
 Уточнённый алгоритм Drag'n'Drop:
 <ol>
 <li>При `mousedown` запомнить координаты нажатия.</li>
-<li>При `mousemove` инициировать перенос, как только зажатый элемент передвинули на 3 пикселя или больше. Сообщить во внешний код вызовом `onDragStart`.</li>
+<li>При `mousemove` инициировать перенос, как только зажатый элемент передвинули на 3 пикселя или больше. Сообщить во внешний код вызовом `onDragStart`. При этом:</li>
 <ol>
-<li>Создать аватар, если можно начать перенос с этой точки `draggable`.</li>  
-<li>Перемещать его по экрану, новые координаты ставить по `e.pageX/pageY` с учетом изначального сдвига элемента относительно курсора.</li>
-<li>Сообщать во внешний код о текущем `droppable` под курсором и позиции над ним вызовами `onDragEnter`, `onDragMove`, `onDragLeave`.</li>
+<li>Создать аватар, если можно начать перенос элемента `draggable` с данной позиции курсора.</li>  
+<li>Переместить аватар по экрану, установив его новую позицию из `e.pageX/pageY` с учетом изначального сдвига элемента относительно курсора.</li>
+<li>Сообщить во внешний код о текущем `droppable` под курсором и позиции над ним вызовами `onDragEnter`, `onDragMove`, `onDragLeave`.</li>
 </ol>
 </li>
 <li>При `mouseup` обработать завершение переноса. Элемент под аватаром получить по координатам, предварительно спрятав аватар. Сообщить во внешний код вызовом `onDragEnd`.</li>
