From: bunam.jeon Date: Thu, 16 May 2013 05:41:43 +0000 (+0900) Subject: Change Drag operation and Drag image X-Git-Tag: submit/tizen_2.2/20130714.131554~36 X-Git-Url: http://review.tizen.org/git/?p=framework%2Fweb%2Fwebkit-efl.git;a=commitdiff_plain;h=5d93369d88c2b831d23ce846db9aa9db0cc2d63f Change Drag operation and Drag image [Title] Change Drag operation and Drag image [Issue#] N/A [Problem] N/A [Cause] Modify the behavior according to the UX Guide. [Solution] Change Drag operation and Drag image Change-Id: I52bb0c07a1d023563e0ba5762c75224f5d0bd0e3 --- diff --git a/Source/WebKit2/UIProcess/API/efl/PageClientImpl.cpp b/Source/WebKit2/UIProcess/API/efl/PageClientImpl.cpp index f1c88ae..c797a77 100755 --- a/Source/WebKit2/UIProcess/API/efl/PageClientImpl.cpp +++ b/Source/WebKit2/UIProcess/API/efl/PageClientImpl.cpp @@ -1301,7 +1301,7 @@ void PageClientImpl::startDrag(const DragData& dragData, PassRefPtrpage()->dragEntered(dragInfo, dragStorageName); setDragMode(true); - m_drag->setDragData(dragInfo); + m_drag->setDragData(dragInfo, dragImage); m_drag->Show(); } #endif diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.cpp b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.cpp index ba0bbc7..32568b6 100755 --- a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.cpp +++ b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.cpp @@ -72,6 +72,12 @@ void Drag::setDragMode(bool isDragMode) m_isDragMode = isDragMode; } +void Drag::setDragData(WebCore::DragData* dragdata, PassRefPtr dragImage) +{ + m_dragData = dragdata; + m_dragImage = dragImage; +} + void Drag::hide() { IntPoint viewPoint = m_viewImpl->transformFromScene().mapPoint(m_Handle->position()); @@ -86,8 +92,8 @@ void Drag::hide() void Drag::Show() { - m_Handle->move(m_savePoint); m_Handle->show(); + m_Handle->move(m_savePoint); } // handle callbacks diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc index 373c4ea..e4ceaab 100755 --- a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc +++ b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc @@ -1,131 +1,229 @@ collections { -group { name: "drag_support"; - data.item: "position" "BOTTOM"; - data.item: "height" "40"; +group { + name: "drag_support"; images { - image: "drag_able.png" COMP; - image: "drop_able.png" COMP; + image: "I01_drag_item_bg.png" COMP; + image: "I01_drag_item_link.png" COMP; } parts { part { - name:"top_padding"; - type: RECT; + name: "bg"; + mouse_events: 1; scale: 1; + type: RECT; description { state: "default" 0.0; - min: 0 30; - visible: 0; - fixed: 0 1; - align: 0.5 0.0; - rel1.relative: 0.0 0.0; - rel2.relative: 1.0 0.0; - } - description { - state: "show_up" 0.0; - inherit: "default" 0.0; + fixed: 1 1; + min: 0 0; + align: 0.0 0.0; + visible: 1; + color: 0 0 0 0; } + } + part { + name: "bg_img"; + mouse_events: 0; + scale: 1; description { - state: "visible" 0.0; - inherit: "default" 0.0; - min: 0 0; + state: "default" 0.0; + fixed: 0 0; + min: 110 100; + align: 0.0 0.0; + rel1 { relative: 0.0 0.0; to: "bg"; } + rel2 { relative: 1.0 1.0; to: "bg"; } + image { + normal: "I01_drag_item_bg.png"; + border: 34 34 24 34; + } + image.middle: 1; + fill.smooth: 0; } } part { name: "swallow"; + mouse_events: 1; + scale: 1; type: SWALLOW; description { state: "default" 0.0; - visible: 0; + fixed: 1 1; + align: 0 0; + visible: 1; + rel1 { + offset : 10 0; + to: "bg"; + } + rel2 { + offset : -10 -10; + to: "bg"; + } } description { - state: "show_up" 0.0; - rel1 {to_y:"top_padding"; relative: 0.0 1.0;} - rel2 {to_y:"top_padding"; relative: 0.0 1.0;} - align: 0.5 0.0; + state: "hide" 0.0; + inherit: "default" 0.0; + visible: 0; } } part { - name: "handle"; + name: "link"; mouse_events: 1; scale: 1; - clip_to: "layout_clip"; description { state: "default" 0.0; - visible: 1; fixed: 1 1; - align: 1 1; - min: 100 100; - rel1 {to: "swallow"; relative: 0.0 0.0; offset: 0 -2; } - rel2 {to: "swallow"; relative: 1.0 1.0; offset: 0 -2; } + align: 0 0; + min: 90 90; + visible: 1; image { - normal: "drag_able.png"; + normal: "I01_drag_item_link.png"; + } + rel1 { + offset : 10 0; + to: "bg"; + } + rel2 { + offset : -10 -10; + to: "bg"; } } description { - state: "drop_out" 0.0; + state: "hide" 0.0; inherit: "default" 0.0; - image { - normal: "drag_able.png"; + visible: 0; + } + } + part { + name: "cover_rect"; + mouse_events: 1; + scale: 1; + type: RECT; + description { + state: "default" 0.0; + fixed: 1 1; + align: 0 0; + visible: 0; + color: 175 0 0 125; + rel1 { + to: "bg"; + } + rel2 { + to: "bg"; } } description { state: "drop_in" 0.0; inherit: "default" 0.0; - image { - normal: "drop_able.png"; - } + visible: 1; + } + description { + state: "drop_out" 0.0; + inherit: "default" 0.0; + visible: 0; + } + } + } + programs { + program { + signal: "dragndrop,drop,in"; + source: "dragndrop"; + script { + set_state(PART:"cover_rect", "drop_in", 0.0); + } + } + program { + signal: "dragndrop,drop,out"; + source: "dragndrop"; + script { + set_state(PART:"cover_rect", "drop_out", 0.0); + } + } + program { + signal: "dragndrop,link,hide"; + source: "dragndrop"; + script { + set_state(PART:"link", "hide", 0.0); + } + } + program { + signal: "dragndrop,link,show"; + source: "dragndrop"; + script { + set_state(PART:"link", "default", 0.0); + } + } + program { + signal: "dragndrop,image,hide"; + source: "dragndrop"; + script { + set_state(PART:"swallow", "hide", 0.0); } } + program { + signal: "dragndrop,image,show"; + source: "dragndrop"; + script { + set_state(PART:"swallow", "default", 0.0); + } + } + } + } + + +group { + name: "drag_cancel"; + images { + image: "I01_delete_btn.png" COMP; + image: "I01_delete_btn_press.png" COMP; + } + parts { part { - name: "layout_clip"; - type: RECT; + name: "cancel_img"; + mouse_events: 1; + scale: 1; description { state: "default" 0.0; - color: 255 255 255 0; - rel1 {to: "handle"; relative: -0.2 -0.2; } - rel2 {to: "handle"; relative: 1.2 1.2;} + fixed: 1 1; + align: 0 0; + min: 72 72; + visible: 1; + image { + normal: "I01_delete_btn.png"; + } } description { - state: "show_up" 0.0; + state: "press" 0.0; inherit: "default" 0.0; + image { + normal: "I01_delete_btn_press.png"; + } } description { - state: "visible" 0.0; + state: "hide" 0.0; inherit: "default" 0.0; - color: 255 255 255 255; + visible: 0; } } } programs { program { - name: "showup"; - signal: "dragndrop,drop,show,up"; + signal: "dragndrop,cancel,press"; source: "dragndrop"; - action: STATE_SET "show_up" 0.0; - target: "swallow"; - target: "top_padding"; - target: "layout_clip"; - after: "showupend"; - } - program { - name: "showupend"; - action: STATE_SET "visible" 0.0; - transition: SIN_FAC 0.2 1.1; - target: "top_padding"; - target: "layout_clip"; + script { + set_state(PART:"cancel_img", "press", 0.0); + } } program { - signal: "dragndrop,drop,in"; + signal: "dragndrop,cancel,hide"; source: "dragndrop"; script { - set_state(PART:"handle", "drop_in", 0.0); + set_state(PART:"cancel_img", "hide", 0.0); } } program { - signal: "dragndrop,drop,out"; + signal: "dragndrop,cancel,default"; source: "dragndrop"; script { - set_state(PART:"handle", "drop_out", 0.0); + set_state(PART:"cancel_img", "default", 0.0); } } } diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.h b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.h index 9fd59f6..5fa38db 100755 --- a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.h +++ b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.h @@ -51,9 +51,11 @@ public: bool isDragMode() { return m_isDragMode; } void setDragMode(bool isDragMode); - void setDragData(WebCore::DragData* dragdata) { m_dragData = dragdata; } + void setDragData(WebCore::DragData* dragdata, PassRefPtr dragImage); void setDragPoint(const WebCore::IntPoint& point) { m_savePoint = point; } WebCore::IntPoint getDragPoint() { return m_savePoint; } + PassRefPtr getDragImage() { return m_dragImage; } + EwkViewImpl* getViewImpl() { return m_viewImpl; } // handle callback void handleMouseMove(DragHandle* handle); @@ -68,8 +70,10 @@ private: private: EwkViewImpl* m_viewImpl; + RefPtr m_dragImage; DragHandle* m_Handle; + bool m_isDragMode; String m_dragStorageName; WebCore::DragData* m_dragData; diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp b/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp index dcb5f53..b37c7e4 100755 --- a/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp +++ b/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp @@ -34,17 +34,30 @@ using namespace WebCore; namespace WebKit { -const int s_iconOffset = 30; +const int s_iconOffset = 90; +const int s_widthMargin = 20; +const int s_heightMargin = 10; +const double s_minIconWidth = 110; +const double s_minIconHeight = 100; +const double s_minImageLength = 90; +const double s_maxImageLength = 300; + DragHandle::DragHandle(Evas_Object* object, const String& theme, const String& path, Drag* drag) : m_drag(drag) , m_dragJob(0) { - m_icon = edje_object_add(evas_object_evas_get(object)); - if (!m_icon) + Evas_Object* topWidget = elm_object_top_widget_get(elm_object_parent_widget_get(object)); + if (!topWidget) + topWidget = object; + + m_icon = elm_layout_add(topWidget); + m_cancelIcon = elm_layout_add(topWidget); + + if (!m_icon || !m_cancelIcon) return; - if (!edje_object_file_set(m_icon, theme.utf8().data(), path.utf8().data())) + if (!elm_layout_file_set(m_icon, theme.utf8().data(), path.utf8().data()) || !elm_layout_file_set(m_cancelIcon, theme.utf8().data(), "drag_cancel")) return; evas_object_smart_member_add(m_icon, object); @@ -53,6 +66,9 @@ DragHandle::DragHandle(Evas_Object* object, const String& theme, const String& p evas_object_event_callback_add(m_icon, EVAS_CALLBACK_MOUSE_DOWN, mouseDown, this); evas_object_event_callback_add(m_icon, EVAS_CALLBACK_MOUSE_MOVE, mouseMove, this); evas_object_event_callback_add(m_icon, EVAS_CALLBACK_MOUSE_UP, mouseUp, this); + evas_object_propagate_events_set(m_cancelIcon, false); + evas_object_event_callback_add(m_cancelIcon, EVAS_CALLBACK_MOUSE_DOWN, cancelMouseDown, this); + evas_object_event_callback_add(m_cancelIcon, EVAS_CALLBACK_MOUSE_UP, cancelMouseUp, this); } DragHandle::~DragHandle() @@ -68,19 +84,73 @@ DragHandle::~DragHandle() evas_object_event_callback_del(m_icon, EVAS_CALLBACK_MOUSE_UP, mouseUp); evas_object_del(m_icon); } + + if (m_cancelIcon) { + evas_object_event_callback_del(m_cancelIcon, EVAS_CALLBACK_MOUSE_DOWN, cancelMouseDown); + evas_object_event_callback_del(m_cancelIcon, EVAS_CALLBACK_MOUSE_UP, cancelMouseUp); + evas_object_del(m_cancelIcon); + } } void DragHandle::move(const IntPoint& point) { - if (m_icon) - evas_object_move(m_icon, point.x(), point.y()); + if (m_icon) { + evas_object_move(m_icon, point.x() - m_dragImageWidth / 2, point.y() - m_dragImageHeight / 2); + evas_object_move(m_cancelIcon, point.x() - (m_dragImageWidth / 2) - 26, point.y() - (m_dragImageHeight / 2) - 36); + } } void DragHandle::show() { if (m_icon) { - edje_object_signal_emit(m_icon, "dragndrop,drop,show,up", "dragndrop"); + if (m_drag->getDragImage()) { + elm_object_signal_emit(m_icon, "dragndrop,link,hide", "dragndrop"); + elm_object_signal_emit(m_icon, "dragndrop,image,show", "dragndrop"); + + m_dragImageWidth = cairo_image_surface_get_width(m_drag->getDragImage()->createCairoSurface().get()); + m_dragImageHeight = cairo_image_surface_get_height(m_drag->getDragImage()->createCairoSurface().get()); + + if (m_dragImage) + m_dragImage = 0; + + if (m_dragImageWidth < s_minImageLength) { + m_dragImageWidth *= 1.5; + m_dragImageHeight *= 1.5; + } + + if (m_dragImageHeight > s_maxImageLength) { + m_dragImageWidth = m_dragImageWidth * (s_maxImageLength / m_dragImageHeight); + m_dragImageHeight = s_maxImageLength; + } + if (m_dragImageWidth > s_maxImageLength) { + m_dragImageHeight = m_dragImageHeight * (s_maxImageLength / m_dragImageWidth); + m_dragImageWidth = s_maxImageLength; + } + + if (m_dragImageWidth < s_minImageLength) + m_dragImageWidth = s_minImageLength; + if (m_dragImageHeight < s_minImageLength) + m_dragImageHeight = s_minImageLength; + + m_dragImage = ewk_util_image_from_cairo_surface_add(evas_object_evas_get(m_drag->getViewImpl()->view()), m_drag->getDragImage()->createCairoSurface().get()); + evas_object_size_hint_min_set(m_dragImage, m_dragImageWidth, m_dragImageHeight); + evas_object_resize(m_dragImage, m_dragImageWidth, m_dragImageHeight); + evas_object_image_filled_set(m_dragImage, EINA_TRUE); + evas_object_show(m_dragImage); + + evas_object_resize(m_icon, m_dragImageWidth + s_widthMargin, m_dragImageHeight + s_heightMargin); + elm_object_part_content_set(m_icon, "swallow", m_dragImage); + } else { + elm_object_signal_emit(m_icon, "dragndrop,image,hide", "dragndrop"); + elm_object_signal_emit(m_icon, "dragndrop,link,show", "dragndrop"); + + m_dragImageWidth = s_minIconWidth; + m_dragImageHeight = s_minIconHeight; + + evas_object_resize(m_icon, m_dragImageWidth, m_dragImageHeight); + } evas_object_show(m_icon); + evas_object_show(m_cancelIcon); } } @@ -88,7 +158,10 @@ void DragHandle::hide() { if (m_icon) { evas_object_hide(m_icon); - edje_object_signal_emit(m_icon, "dragndrop,drop,out", "dragndrop"); + evas_object_hide(m_cancelIcon); + + elm_object_signal_emit(m_icon, "dragndrop,drop,out", "dragndrop"); + elm_object_signal_emit(m_cancelIcon, "dragndrop,cancel,default", "dragndrop"); } } @@ -98,12 +171,25 @@ void DragHandle::updateHandleIcon(bool isDropAble) return; if (isDropAble) - edje_object_signal_emit(m_icon, "dragndrop,drop,in", "dragndrop"); + elm_object_signal_emit(m_icon, "dragndrop,drop,in", "dragndrop"); else - edje_object_signal_emit(m_icon, "dragndrop,drop,out", "dragndrop"); + elm_object_signal_emit(m_icon, "dragndrop,drop,out", "dragndrop"); } // callbacks +void DragHandle::cancelMouseDown(void* data, Evas*, Evas_Object*, void* eventInfo) +{ + DragHandle* handle = static_cast(data); + elm_object_signal_emit(handle->cancelIcon(), "dragndrop,cancel,press", "dragndrop"); +} + +void DragHandle::cancelMouseUp(void* data, Evas*, Evas_Object*, void* eventInfo) +{ + DragHandle* handle = static_cast(data); + elm_object_signal_emit(handle->cancelIcon(), "dragndrop,cancel,default", "dragndrop"); + handle->hide(); +} + void DragHandle::mouseDown(void* data, Evas*, Evas_Object*, void* eventInfo) { Evas_Event_Mouse_Down* event = static_cast(eventInfo); diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.h b/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.h index 327a672..d9b1492 100755 --- a/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.h +++ b/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.h @@ -47,9 +47,12 @@ public: void hide(); void updateHandleIcon(bool isDropAble); const WebCore::IntPoint position() const { return m_mousePosition; } + Evas_Object* cancelIcon() { return m_cancelIcon; } private: // callbacks + static void cancelMouseDown(void*, Evas*, Evas_Object*, void*); + static void cancelMouseUp(void*, Evas*, Evas_Object*, void*); static void mouseDown(void*, Evas*, Evas_Object*, void*); static void mouseMove(void*, Evas*, Evas_Object*, void*); static void mouseUp(void*, Evas*, Evas_Object*, void*); @@ -59,6 +62,10 @@ private: private: Evas_Object* m_icon; + Evas_Object* m_cancelIcon; + Evas_Object* m_dragImage; + double m_dragImageWidth; + double m_dragImageHeight; WebCore::IntPoint m_mousePosition; Drag* m_drag; Ecore_Job* m_dragJob; diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/images/drag_able.png b/Source/WebKit2/UIProcess/API/efl/tizen/images/drag_able.png deleted file mode 100755 index 95514fd..0000000 Binary files a/Source/WebKit2/UIProcess/API/efl/tizen/images/drag_able.png and /dev/null differ diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/images/drop_able.png b/Source/WebKit2/UIProcess/API/efl/tizen/images/drop_able.png deleted file mode 100755 index bad8dee..0000000 Binary files a/Source/WebKit2/UIProcess/API/efl/tizen/images/drop_able.png and /dev/null differ