hoversel: refactor hover theme

Signed-Off-By: Jee-Yong Um <jc9.um@samsung.com>

Change-Id: Ic8a2c4e899877b3c080c660061cd01ba6123c58b

1 files changed, 154 insertions, 385 deletions

diff --git a/mobile/widgets/hover.edc b/mobile/widgets/hover.edc
index 2cdf1db2..32251fb4 100644
--- a/mobile/widgets/hover.edc
+++ b/mobile/widgets/hover.edc
@@ -1,8 +1,12 @@
 group { name: "elm/hover/base/default";
    alias: "elm/hover/base/hoversel_vertical/default";
    alias: "elm/hover/base/hoversel_vertical/entry";
+
    data.item: "dismiss" "on";
-   data.item: "max_size" "528";
+   data.item: "max_size" "480";
+
+   nomouse;
+
    images {
       set {
          name: "core_dropdown_label_bg.#";
@@ -14,7 +18,7 @@ group { name: "elm/hover/base/default";
          }
       }
       set {
-         name: "core_dropdown_label_bg_stroke.#.png";
+         name: "core_dropdown_label_bg_stroke.#";
          image {
             image: SMALL"images/Old/core_dropdown_label_bg_stroke.#.png" COMP;
          }
@@ -23,458 +27,224 @@ group { name: "elm/hover/base/default";
          }
       }
    }
+
+#define GLIDE_EASE_OUT_SCRIPT(part, state1, state2) \
+   set_tween_state_anim(part, state1, 0.0, state2, 0.0, CUBIC_BEZIER, pos, 0.25, 0.46, 0.45, 1.0)
+
    script {
-      public visible = 0;
-      public right = 0;
-   }
-   parts {
-      part { name: "elm.swallow.offset";
-         type: SWALLOW;
-         scale: 1;
-         description { state: "default" 0.0;
-            align: 0.0 0.0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 0.0 0.0;
+      public visible = 0, right = 0;
+
+      public show(val, Float:pos) {
+         if (val == 0) {
+            if (get_int(right) == 0)
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.top", "default", "visible");
+            else
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.top", "right", "right_visible");
          }
-      }
-      part { name: "elm.swallow.size";
-         type: SWALLOW;
-         scale: 1;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.0 0.0;
-            rel1 {
-               to: "elm.swallow.offset";
-               relative: 1.0 1.0;
-            }
-            rel2 {
-               to: "elm.swallow.offset";
-               relative: 1.0 1.0;
-            }
+         else {
+            if (get_int(right) == 0)
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.bottom", "default", "visible");
+            else
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.bottom", "right", "right_visible");
          }
       }
-      part { name: "elm.padding.bg-top.left-top";
-         type: SPACER;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            align: 1 1;
-            fixed: 1 1;
-            min: HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT;
-            rel1.to: "elm.swallow.slot.top";
-            rel2 {
-               to: "elm.swallow.slot.top";
-               relative: 0 0;
-            }
+
+      public hide(val, Float:pos) {
+         if (val == 0) {
+            if (get_int(right) == 0)
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.top", "visible", "default");
+            else
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.top", "right_visible", "right");
          }
-      }
-      part { name: "elm.padding.bg-top.right-bottom";
-         type: SPACER;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            align: 0 0;
-            fixed: 1 1;
-            min: HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT;
-            rel1 {
-               to_x: "elm.swallow.slot.top";
-               to_y: "elm.swallow.slot.bottom";
-               relative: 1 0;
-            }
-            rel2 {
-               to_x: "elm.swallow.slot.top";
-               to_y: "elm.swallow.slot.bottom";
-            }
+         else {
+            if (get_int(right) == 0)
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.bottom", "visible", "default");
+            else
+               GLIDE_EASE_OUT_SCRIPT(PART:"elm.swallow.slot.bottom", "right_visible", "right");
          }
       }
-      part { name: "elm.padding.bg-bottom.left-top";
-         type: SPACER;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            align: 1 1;
-            fixed: 1 1;
-            min: HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT;
-            rel1 {
-               to_x: "elm.swallow.slot.bottom";
-               to_y: "elm.swallow.slot.top";
-            }
-            rel2 {
-               to_x: "elm.swallow.slot.bottom";
-               to_y: "elm.swallow.slot.top";
-               relative: 0 1;
-            }
+   }
+   parts {
+      swallow { "elm.swallow.offset"; scale;
+         desc { "default";
+            align: 0.0 0.0;
+            rel2.relative: 0.0 0.0;
          }
       }
-      part { name: "elm.padding.bg-bottom.right-bottom";
-         type: SPACER;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            align: 0 0;
-            fixed: 1 1;
-            min: HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT HOVER_HOVERSEL_VERTICAL_PADDING_SIZE_DEFAULT;
-            rel1 {
-               to: "elm.swallow.slot.bottom";
-               relative: 1 1;
-            }
-            rel2.to: "elm.swallow.slot.bottom";
+      swallow { "elm.swallow.size"; scale;
+         desc { "default";
+            align: 0.0 0.0;
+            rel1 { to: "elm.swallow.offset"; relative: 1.0 1.0; }
+            rel2.to: "elm.swallow.offset";
          }
       }
-      part { name: "button_image";
-         type: RECT;
-         mouse_events: 1;
-         scale: 1;
-         description { state: "default" 0.0;
-            rel1 {
-               to: "elm.padding.bg-top.left-top";
-               relative: 0 0;
-            }
-            rel2 {
-               to: "elm.padding.bg-top.right-bottom";
-               relative: 1 1;
-            }
-            color: 0 0 0 0;
-         }
-         description { state: "bottom" 0.0;
-            rel1 {
-               to: "elm.padding.bg-bottom.left-top";
-               relative: 0 0;
-            }
-            rel2 {
-               to: "elm.padding.bg-bottom.right-bottom";
-               relative: 1 1;
-            }
-            color: 0 0 0 0;
+      swallow { "elm.swallow.slot.middle"; scale;
+         desc { "default";
+            rel.to: "elm.swallow.size";
          }
       }
-      part { name: "base";
-         type: RECT;
-         mouse_events: 1;
-         scale: 1;
-         description { state: "default" 0.0;
+      rect { "event"; scale; mouse;
+         desc{ "default";
             color: 0 0 0 0;
          }
       }
-      part { name: "clipper";
-         type: RECT;
-         scale: 1;
-         description { state: "default" 0.0;
+      rect { "clipper"; scale;
+         desc { "default";
             color: 255 255 255 0;
          }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
+         desc { "visible"; inherit;
             color: 255 255 255 255;
          }
       }
-      part { name: "top_bg";
-         type: IMAGE;
-         clip_to: "top_clipper";
-         scale: 1;
-         description { state: "default" 0.0;
-            rel1.to: "top_clipper";
-            rel2.to: "top_clipper";
+      /* top */
+      image { "bg_top"; scale;
+         clip: "clipper_top";
+         desc { "default";
+            rel.to_x: "elm.swallow.slot.top";
+            rel.to_y: "clipper_top";
             image.normal: "core_dropdown_label_bg.#";
-            color_class: "hoversel/default/bg_popup";
-            visible: 0;
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
          }
       }
-      part { name: "top_clipper";
-         type: RECT;
-         clip_to: "clipper";
-         scale: 1;
-         description { state: "default" 0.0;
-            rel1.to: "elm.swallow.slot.top";
-            rel2 {
-               to_x: "elm.swallow.slot.top";
-               to_y: "elm.swallow.slot.middle";
-               relative: 1.0 0.0;
-            }
-         }
-      }
-      part { name: "top_border";
-         type: IMAGE;
-         clip_to: "top_clipper";
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1.to: "top_clipper";
-            rel2.to: "top_clipper";
-            image.normal: "core_dropdown_label_bg_stroke.#.png";
-            color_class: "hoversel/default/bg_popup_border";
-            visible: 0;
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "elm.swallow.slot.top";
-         type: SWALLOW;
-         clip_to: "top_clipper";
-         scale: 1;
-         description { state: "default" 0.0;
-            visible: 1;
+      swallow { "elm.swallow.slot.top"; scale; mouse;
+         clip: "clipper_top";
+         desc { "default";
             align: 0.0 0.66;
-            rel1 {
-               to: "elm.swallow.slot.middle";
-               relative: 0.0 0.0;
-               offset: 0 -1;
-            }
-            rel2 {
-               to: "elm.swallow.slot.middle";
-               relative: 1.0 0.0;
-               offset: -1 -1;
-            }
+            rel1.to: "elm.swallow.slot.middle";
+            rel2 { to: "elm.swallow.slot.middle"; relative: 1.0 0.0; }
          }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
+         desc { "visible"; inherit;
             align: 0.0 1.0;
          }
-         description { state: "right" 0.0;
-            inherit: "default" 0.0;
+         desc { "right"; inherit;
             align: 1.0 0.66;
          }
-         description { state: "right_visible" 0.0;
-            inherit: "default" 0.0;
+         desc { "right_visible"; inherit: "right";
             align: 1.0 1.0;
          }
       }
-      part { name: "bottom_bg";
-         type: IMAGE;
-         clip_to: "bottom_clipper";
-         scale: 1;
-         description { state: "default" 0.0;
-            rel1.to: "bottom_clipper";
-            rel2.to: "bottom_clipper";
-            image.normal: "core_dropdown_label_bg.#";
-            color_class: "hoversel/default/bg_popup";
-            visible: 0;
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+      image { "border_top"; scale;
+         clip: "clipper_top";
+         desc { "default";
+            rel.to_x: "elm.swallow.slot.top";
+            rel.to_y: "clipper_top";
+            image.normal: "core_dropdown_label_bg_stroke.#";
+            color_class: "hoversel/default/bg_popup_border";
          }
       }
-      part { name: "bottom_clipper";
-         type: RECT;
-         clip_to: "clipper";
-         scale: 1;
-         description { state: "default" 0.0;
-            rel1 {
-               to_x: "elm.swallow.slot.bottom";
-               to_y: "elm.swallow.slot.middle";
-               relative: 0.0 1.0;
-               offset: 0 -2;
-            }
-            rel2.to: "elm.swallow.slot.bottom";
+      rect { "clipper_top";
+         clip: "clipper";
+         desc { "default"; hid;
+            rel1.to_y: "elm.swallow.slot.top";
+            rel2 { to_y: "elm.swallow.slot.middle"; relative: 1.0 0.0; }
          }
+         desc { "visible"; inherit; vis; }
       }
-      part { name: "bottom_border";
-         type: IMAGE;
-         clip_to: "bottom_clipper";
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1.to: "bottom_clipper";
-            rel2.to: "bottom_clipper";
-            image.normal: "core_dropdown_label_bg_stroke.#.png";
-            color_class: "hoversel/default/bg_popup_border";
-            visible: 0;
-         }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+      /* bottom */
+      image { "bg_bottom"; scale;
+         clip: "clipper_bottom";
+         desc { "default";
+            rel.to_x: "elm.swallow.slot.bottom";
+            rel.to_y: "clipper_bottom";
+            image.normal: "core_dropdown_label_bg.#";
          }
       }
-      part { name: "elm.swallow.slot.bottom";
-         type: SWALLOW;
-         clip_to: "bottom_clipper";
-         scale: 1;
-         description { state: "default" 0.0;
+      swallow { "elm.swallow.slot.bottom"; scale; mouse;
+         clip: "clipper_bottom";
+         desc { "default";
             align: 0.0 0.34;
-            rel1 {
-               to: "elm.swallow.slot.middle";
-               relative: 0.0 1.0;
-               offset: 0 -2;
-            }
-            rel2 {
-               to: "elm.swallow.slot.middle";
-               relative: 1.0 1.0;
-               offset: -1 -2;
-            }
-
+            rel1 { to: "elm.swallow.slot.middle"; relative: 0.0 1.0; offset: 0 -2; }
+            rel2.to: "elm.swallow.slot.middle";
          }
-         description { state: "visible" 0.0;
-            inherit: "default" 0.0;
+         desc { "visible"; inherit;
             align: 0.0 0.0;
          }
-         description { state: "right" 0.0;
-            inherit: "default" 0.0;
+         desc { "right"; inherit;
             align: 1.0 0.34;
          }
-         description { state: "right_visible" 0.0;
-            inherit: "default" 0.0;
+         desc { "right_visible"; inherit: "right";
             align: 1.0 0.0;
          }
       }
-      part { name: "over1";
-         type: RECT;
-         mouse_events: 0;
-         scale: 1;
-         description { state: "default" 0.0;
-            rel1.to: "button_image";
-            rel2.to: "button_image";
-            color: 0 0 0 0;
+      image { "border_bottom"; scale;
+         clip: "clipper_bottom";
+         desc { "default";
+            rel.to_x: "elm.swallow.slot.bottom";
+            rel.to_y: "clipper_bottom";
+            image.normal: "core_dropdown_label_bg_stroke.#";
+            color_class: "hoversel/default/bg_popup_border";
          }
       }
-      part { name: "elm.swallow.slot.middle";
-         type: SWALLOW;
-         description { state: "default" 0.0;
-            rel1.to: "elm.swallow.size";
-            rel2.to: "elm.swallow.size";
+      rect { "clipper_bottom";
+         clip: "clipper";
+         desc { "default"; hid;
+            rel1 { to_y: "elm.swallow.slot.middle"; relative: 0.0 1.0; offset: 0 -2; }
+            rel2.to_y: "elm.swallow.slot.bottom";
          }
+         desc { "visible"; inherit; vis; }
       }
    }
    programs {
-      program { name: "end";
-         signal: "mouse,up,1";
-         source: "base";
+      program {
+         signal: "mouse,up,1"; source: "event";
          action: SIGNAL_EMIT "elm,action,dismiss" "elm";
       }
-      program { name: "show";
-         signal: "elm,action,show";
-         source: "elm";
-         action: STATE_SET "visible" 0.0;
+      program {
+         signal: "elm,action,show"; source: "elm";
+         action: STATE_SET "visible";
          transition: GLIDE_EASE_OUT(0.25);
          target: "clipper";
       }
-      program { name: "hide";
-         signal: "elm,action,hide";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         transition: GLIDE_EASE_OUT(0.3);
-         target: "clipper";
-         after: "hidefinished";
-      }
-      program { name: "topshow";
-         signal: "elm,action,slot,top,show";
-         source: "elm";
-         script {
-            set_state(PART:"top_bg", "visible", 0.0);
-            set_state(PART:"top_border", "visible", 0.0);
-            set_state(PART:"button_image", "default", 0.0);
-            run_program(PROGRAM:"topshow2");
-         }
-      }
-      program { name: "topshow2";
-         script {
-            if (get_int(right) == 0) {
-               run_program(PROGRAM:"topshow_default");
-            }
-            else {
-               run_program(PROGRAM:"topshow_right");
+      program {
+         signal: "elm,action,hide"; source: "elm";
+         sequence {
+            action: STATE_SET "default";
+            transition: GLIDE_EASE_OUT(0.3);
+            target: "clipper";
+            //
+            action: STATE_SET "default";
+            targets: "clipper_top" "clipper_bottom";
+            //
+            action: SIGNAL_EMIT "elm,action,hide,finished" "elm";
+         }
+      }
+      program {
+         signal: "elm,action,slot,top,show"; source: "elm";
+         sequence {
+            action: STATE_SET "visible";
+            target: "clipper_top";
+            script {
+               anim(0.25, "show", 0);
+               set_int(visible, 1);
             }
-            set_int(visible, 1);
          }
       }
-      program { name: "topshow_default";
-         action: STATE_SET "visible" 0.0;
-         target: "elm.swallow.slot.top";
-         transition: GLIDE_EASE_OUT(0.25);
-      }
-      program { name: "topshow_right";
-         action: STATE_SET "right_visible" 0.0;
-         target: "elm.swallow.slot.top";
-         transition: GLIDE_EASE_OUT(0.25);
-      }
-      program { name: "tophide";
-         signal: "elm,action,slot,top,hide";
-         source: "elm";
-         script {
-            if (get_int(right) == 0) {
-               run_program(PROGRAM:"tophide_default");
+      program {
+         signal: "elm,action,slot,bottom,show"; source: "elm";
+         sequence {
+            action: STATE_SET "visible";
+            target: "clipper_bottom";
+            script {
+               anim(0.25, "show", 1);
+               set_int(visible, 1);
             }
-            else {
-               run_program(PROGRAM:"tophide_right");
-            }
-            set_int(visible, 0);
          }
       }
-      program { name: "tophide_default";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.slot.top";
-         transition: GLIDE_EASE_OUT(0.30);
-      }
-      program { name: "tophide_right";
-         action: STATE_SET "right" 0.0;
-         target: "elm.swallow.slot.top";
-         transition: GLIDE_EASE_OUT(0.30);
-      }
-      program { name: "bottomshow";
-         signal: "elm,action,slot,bottom,show";
-         source: "elm";
+      program {
+         signal: "elm,action,slot,top,hide"; source: "elm";
          script {
-            set_state(PART:"bottom_bg", "visible", 0.0);
-            set_state(PART:"bottom_border", "visible", 0.0);
-            set_state(PART:"button_image", "bottom", 0.0);
-            run_program(PROGRAM:"bottomshow2");
-         }
-      }
-      program { name: "bottomshow2";
-         script {
-            if (get_int(right) == 0) {
-               run_program(PROGRAM:"bottomshow_default");
-            }
-            else {
-               run_program(PROGRAM:"bottomshow_right");
-            }
-            set_int(visible, 1);
+            anim(0.30, "hide", 0);
+            set_int(visible, 0);
          }
       }
-      program { name: "bottomshow_default";
-         action: STATE_SET "visible" 0.0;
-         target: "elm.swallow.slot.bottom";
-         transition: GLIDE_EASE_OUT(0.25);
-      }
-      program { name: "bottomshow_right";
-         action: STATE_SET "right_visible" 0.0;
-         target: "elm.swallow.slot.bottom";
-         transition: GLIDE_EASE_OUT(0.25);
-      }
-      program { name: "bottomhide";
-         signal: "elm,action,slot,bottom,hide";
-         source: "elm";
+      program {
+         signal: "elm,action,slot,bottom,hide"; source: "elm";
          script {
-            if (get_int(right) == 0) {
-               run_program(PROGRAM:"bottomhide_default");
-            }
-            else {
-               run_program(PROGRAM:"bottomhide_right");
-            }
+            anim(0.30, "hide", 1);
             set_int(visible, 0);
          }
       }
-      program { name: "bottomhide_default";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.slot.bottom";
-         transition: GLIDE_EASE_OUT(0.30);
-      }
-      program { name: "bottomhide_right";
-         action: STATE_SET "right" 0.0;
-         target: "elm.swallow.slot.bottom";
-         transition: GLIDE_EASE_OUT(0.30);
-      }
-      program { name: "hidefinished";
-         action: SIGNAL_EMIT "elm,action,hide,finished" "elm";
-      }
-      program { name: "align_right";
-         signal: "elm,state,align,right";
-         source: "elm";
+      program {
+         signal: "elm,state,align,right"; source: "elm";
          script {
             set_int(right, 1);
             if (get_int(visible) == 0) {
@@ -487,9 +257,8 @@ group { name: "elm/hover/base/default";
             }
          }
       }
-      program { name: "align_default";
-         signal: "elm,state,align,default";
-         source: "elm";
+      program {
+         signal: "elm,state,align,default"; source: "elm";
          script {
             set_int(right, 0);
             if (get_int(visible) == 0) {