Add animation effect when drag icon has appeared

[Title] Add animation effect when drag icon has appeared
[Issue#] N/A
[Problem] N/A
[Cause] N/A
[Solution] Add animation effect when drag icon has appeared

Change-Id: Ic59b60c3acf6a26111a85020d4171fe4eeae26e7

diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc
index 9b4c062..373c4ea 100755 (executable)
--- a/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc
+++ b/Source/WebKit2/UIProcess/API/efl/tizen/Drag.edc
@@ -7,78 +7,125 @@ group { name: "drag_support";
             image: "drop_able.png" COMP;
         }
         parts {
-            part { name: "bg";
+            part {
+                name:"top_padding";
                 type: RECT;
                 scale: 1;
-                mouse_events: 1;
-                description { state: "default" 0.0;
+                description {
+                    state: "default" 0.0;
+                    min: 0 30;
                     visible: 0;
-                    fixed: 1 1;
-                    align: 0.6 0;
-                    min: 100 100;
-                    color: 0 0 0 0;
+                    fixed: 0 1;
+                    align: 0.5 0.0;
+                    rel1.relative: 0.0 0.0;
+                    rel2.relative: 1.0 0.0;
                 }
-                description { state: "show" 0.0;
+                description {
+                    state: "show_up" 0.0;
                     inherit: "default" 0.0;
-                    visible: 1;
+                }
+                description {
+                    state: "visible" 0.0;
+                    inherit: "default" 0.0;
+                    min: 0 0;
                 }
             }
-            part { name: "handle";
+            part {
+                name: "swallow";
+                type: SWALLOW;
+                description {
+                    state: "default" 0.0;
+                    visible: 0;
+                }
+                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;
+                }
+            }
+            part {
+                name: "handle";
                 mouse_events: 1;
                 scale: 1;
-                description { state: "default" 0.0;
-                    visible: 0;
+                clip_to: "layout_clip";
+                description {
+                    state: "default" 0.0;
+                    visible: 1;
                     fixed: 1 1;
-                    align: 0.6 0;
+                    align: 1 1;
                     min: 100 100;
-                    rel1 {
-                        relative: 1.1 0.0;
-                        offset: 0 -2;
-                        to: "bg";
-                    }
-                    rel2 {
-                        relative: 1.1 0.0;
-                        offset: 0 -2;
-                        to: "bg";
-                    }
+                    rel1 {to: "swallow"; relative: 0.0 0.0; offset: 0 -2; }
+                    rel2 {to: "swallow"; relative: 1.0 1.0; offset: 0 -2; }
                     image {
                         normal: "drag_able.png";
-                        border: 0 0 0 0;
                     }
-                    image.middle: SOLID;
-                    fill.smooth: 0;
                 }
-                description { state: "top" 0.0;
+                description {
+                    state: "drop_out" 0.0;
                     inherit: "default" 0.0;
-                    visible: 1;
-                    align: 1 1;
                     image {
                         normal: "drag_able.png";
                     }
                 }
-                description { state: "drop_in" 0.0;
+                description {
+                    state: "drop_in" 0.0;
                     inherit: "default" 0.0;
-                    visible: 1;
-                    align: 1 1;
                     image {
                         normal: "drop_able.png";
                     }
                 }
             }
+            part {
+                name: "layout_clip";
+                type: RECT;
+                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;}
+                }
+                description {
+                    state: "show_up" 0.0;
+                    inherit: "default" 0.0;
+                }
+                description {
+                    state: "visible" 0.0;
+                    inherit: "default" 0.0;
+                    color: 255 255 255 255;
+                }
+            }
         }
         programs {
-            program { name: "drop_in";
+            program {
+                name:   "showup";
+                signal: "dragndrop,drop,show,up";
+                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";
+            }
+            program {
                 signal: "dragndrop,drop,in";
                 source: "dragndrop";
                 script {
                     set_state(PART:"handle", "drop_in", 0.0);
                 }
             }
-            program { name: "drop_out";
+            program {
                 signal: "dragndrop,drop,out";
                 source: "dragndrop";
                 script {
-                    set_state(PART:"handle", "top", 0.0);
+                    set_state(PART:"handle", "drop_out", 0.0);
                 }
             }
         }

diff --git a/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp b/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp
index 3f6c178..dcb5f53 100755 (executable)
--- a/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp
+++ b/Source/WebKit2/UIProcess/API/efl/tizen/DragHandle.cpp
@@ -47,7 +47,6 @@ DragHandle::DragHandle(Evas_Object* object, const String& theme, const String& p
     if (!edje_object_file_set(m_icon, theme.utf8().data(), path.utf8().data()))
         return;
 
-    edje_object_signal_emit(m_icon, "dragndrop,drop,out", "dragndrop");
     evas_object_smart_member_add(m_icon, object);
 
     evas_object_propagate_events_set(m_icon, false);
@@ -79,8 +78,10 @@ void DragHandle::move(const IntPoint& point)
 
 void DragHandle::show()
 {
-    if (m_icon)
+    if (m_icon) {
+        edje_object_signal_emit(m_icon, "dragndrop,drop,show,up", "dragndrop");
         evas_object_show(m_icon);
+    }
 }
 
 void DragHandle::hide()