Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 25.09.2012, 17:03
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Симуляция drag'n'drop (html5)
Любой элемент можно сделать перетаскиваемым добавив атрибут draggable="true" и управлять процессом перетаскивания через обработчики событий. Вопрос - можно ли как-то инициировать процесс drag'n'drop, если мы не имеем конкретного элемента и имеется собственный обработчик mousedown. То есть реально ли запустить процесс drag'n'drop не имея перетаскиваемого объекта?

Необходимо в реализовать в текстовом редакторе. В нем выделенный текст не представляет из себя отдельный dom-элемент, да и вообще, лежит под другими слоями и не ловит никаких событий.

Пока писал, возникла идея запуска mousedown + mousemove событий на отдельно-выделенном элементе, но вот сомневаюсь что таким образом отработает дефолтное поведение (начало перетаскивания).
Ответить с цитированием
  #2 (permalink)  
Старый 26.09.2012, 02:54
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

danik.js, что мешает обернуть выделенный текст в, например, span?
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #3 (permalink)  
Старый 26.09.2012, 11:29
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Мешает реализация редактора. Там используется особая схема "прорисовки" строк, и каждая строка - это отдельный dom-элемент.

Кажется в спецификации явно говорится, что браузер не должен допускать симуляцию drag'n'drop.

Я пришел к одной идее - покрыть текст слоем с атрибутом draggable.
В обычных условиях клик по контейнеру будет перехватываться и preventDefault'иться и перетаскивания не будет происходить. А когда нужно будет перетащить текст, клик будет освобожден, и запустится перетаскивание этого слоя. А там уже по dragstart можно установить нужные данные (перетаскиваемый кусок текста) и словить событие drop

Маленькое неудобство - не будет видно призрачного текста при перетаскивании. Но это и не нужно особо.
Вот думаю что если попробовать отрисовать текст в canvas-е и установить через e.dataTransfer.setDragImage() , но в параметре должен быть Image а не Canvas. Можно ли из Canvas создать Image ?
Ответить с цитированием
  #4 (permalink)  
Старый 26.09.2012, 19:34
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

danik.js, вы какой-то редкостный извращенец. Нет, серьёзно.

Есть замечательное событие "selectionchange" на которое вешаешь обработчик. Выделенный текст оборачиваешь в спан, которому draggable ставишь в true. Бинго.
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #5 (permalink)  
Старый 29.09.2012, 18:30
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Сообщение от trikadin
danik.js, вы какой-то редкостный извращенец. Нет, серьёзно.
А-ха ))
Ну да, я не один такой. Вот, тогда гляньте на результат работы извращенных умов: http://ace.ajax.org/
Думаете там будет такое событие ? )
Ответить с цитированием
  #6 (permalink)  
Старый 30.09.2012, 01:25
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

danik.js, с этого надо было начинать. Судя по тому, что я увидел, у них там есть какой-то свой драг'н'дроп текста (уж не знаю, чем не угодил стандартный). Советую покопаться в коде и найти, возможно, вы сможете отловить или как-то подключиться к их собственному событию.

А ещё можно ловить mousemove на document. Не уверен, что вам это поможет, но на всякий случай сообщаю о такой возможности)
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #7 (permalink)  
Старый 30.09.2012, 22:29
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

В ie9 (и вроде 8) есть возможность запуска drap'n'drop - у элементов есть функция dragDrop(). Более того, без ее ручного запуска не работает перетаскивание элементов, неперетаскиваемых по умолчанию(тоесть всех кроме ссылок, картинок, выделенного текста и т.д.)
К тому же в ie9 какие то глюки с dropEffect - я не могу его динамически менять по событию dragover (в зависимости от ctrl), причем в ie8 такого глюка нет.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
D'n'D html5 Общие вопросы gJam Элементы интерфейса 2 22.07.2012 23:06
jquery поддерживает ли браузер html5 vanderv jQuery 1 07.04.2012 10:12
HTML5 в наше время это что? Policeman (X)HTML/CSS 4 06.12.2011 10:27
vkontakte, html5 и как почему не перезагружается страница olga153b Events/DOM/Window 10 02.11.2011 15:20
Когда тэги типа <font> исчезнут? Alex455 (X)HTML/CSS 10 14.06.2011 20:14