A patch for displaying notification popup 41/61141/2
authorHyerim Kim <rimi.kim@samsung.com>
Fri, 4 Mar 2016 07:24:04 +0000 (16:24 +0900)
committerHyerim Kim <rimi.kim@samsung.com>
Fri, 4 Mar 2016 08:24:33 +0000 (17:24 +0900)
Change-Id: I2d98df4848b93a8456f239bacdacf25b898b37c4
Signed-off-by: Hyerim Kim <rimi.kim@samsung.com>
data/view/notification_view.edc [changed mode: 0644->0755]
data/widget/button.edc [changed mode: 0644->0755]
include/define.h [changed mode: 0644->0755]
src/util.c [changed mode: 0644->0755]

old mode 100644 (file)
new mode 100755 (executable)
index 165c641..bf425db
@@ -361,3 +361,310 @@ group {
                }
        }
 }
+
+group {
+       name: GRP_NOTIFICATION_POPUP;
+       parts {
+               part {
+                       name: "dimmed_bg";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               fixed: 0 0;
+                               color: 0 0 0 100;
+                               visible: 1;
+                               min: 1920 1080;
+                       }
+               }
+               part {
+                       name: "popup_bg";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               fixed: 0 0;
+                               color: 255 255 255 255;
+                               min: 0 0;
+                               visible: 1;
+                               min: 970 550;
+                               rel1 {
+                                       relative: 0.5 0.5;
+                                       to : "dimmed_bg";
+                               }
+                               rel2 {
+                                       relative: 0.5 0.5;
+                                       to : "dimmed_bg";
+                               }
+                       }
+               }
+               part {
+                       name: "padding.upbtn.lefttop";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 326 32;
+                               rel1 {
+                                       relative: 0.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               rel2 {
+                                       relative: 0.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               fixed: 1 0;
+                               align: 0.0 0.0;
+                       }
+               }
+               part {
+                       name: "part_up_btn";
+                       type: SWALLOW;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       relative: 1.0 1.0;
+                                       to: "padding.upbtn.lefttop";
+                               }
+                               rel2 {
+                                       relative: 1.0 1.0;
+                                       to: "padding.upbtn.lefttop";
+                               }
+                               min: 70 30;
+                               fixed: 1 1;
+                               visible: 1;
+                               align: 0.0 0.0;
+                       }
+               }
+               part {
+                       name: "padding.downbtn.lefttop";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 326 488;
+                               rel1 {
+                                       relative: 0.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               rel2 {
+                                       relative: 0.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               fixed: 1 0;
+                               align: 0.0 0.0;
+                       }
+               }
+               part {
+                       name: "part_down_btn";
+                       type: SWALLOW;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       relative: 1.0 1.0;
+                                       to: "padding.downbtn.lefttop";
+                               }
+                               rel2 {
+                                       relative: 1.0 1.0;
+                                       to: "padding.downbtn.lefttop";
+                               }
+                               min: 70 30;
+                               fixed: 1 1;
+                               visible: 1;
+                               align: 0.0 0.0;
+                       }
+               }
+               part {
+                       name: "padding.title.left";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 74 0;
+                               rel1 {
+                                       relative: 0.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               rel2 {
+                                       relative: 0.0 1.0;
+                                       to: "popup_bg";
+                               }
+                               align: 0.0 0.5;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "padding.title.top";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 0 96;
+                               rel1 {
+                                       relative: 0.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               rel2 {
+                                       relative: 1.0 0.0;
+                                       to: "popup_bg";
+                               }
+                               align: 0.5 0.0;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "part_title_label";
+                       type: TEXT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to_x: "padding.title.left";
+                                       to_y: "padding.title.top";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2 {
+                                       to_x: "padding.title.left";
+                                       to_y: "padding.title.top";
+                                       relative: 1.0 1.0;
+                               }
+                               text {
+                                       font: FONT_LIGHT;
+                                       text: STR_DEFAULT_USER_MESSAGE;
+                                       size: 32;
+                                       align: 0.0 0.0;
+                                       min: 1 1;
+                                       ellipsis: -1;
+                               }
+                               color: 51 51 51 255;
+                               min: 0 32;
+                               fixed: 1 1;
+                               visible: 1;
+                               align: 0.0 0.0;
+                       }
+               }
+               part {
+                       name: "padding.content.top";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 0 20;
+                               rel1 {
+                                       relative: 0.0 1.0;
+                                       to: "part_title_label";
+                               }
+                               rel2 {
+                                       relative: 1.0 1.0;
+                                       to: "part_title_label";
+                               }
+                               align: 0.5 0.0;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "part_content_swallow";
+                       type: SWALLOW;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to_x: "padding.title.left";
+                                       to_y: "padding.content.top";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2 {
+                                       to_x: "padding.title.left";
+                                       to_y: "padding.content.top";
+                                       relative: 1.0 1.0;
+                               }
+                               align: 0.0 0.0;
+                               min: 563 308;
+                               fixed: 1 1;
+                               visible: 1;
+                       }
+               }
+               part {
+                       name: "padding.divider.left";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 74 0;
+                               rel1 {
+                                       to_x: "part_content_swallow";
+                                       to_y: "popup_bg";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2 {
+                                       to_x: "part_content_swallow";
+                                       to_y: "popup_bg";
+                                       relative: 1.0 1.0;
+                               }
+                               align: 0.0 0.5;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "part_divider";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "padding.divider.left";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2 {
+                                       to: "padding.divider.left";
+                                       relative: 1.0 1.0;
+                               }
+                               min: 1 0;
+                               color: 204 204 204 255;
+                               fixed: 1 1;
+                               visible: 1;
+                       }
+               }
+               part {
+                       name: "padding.btn.lefttop";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "part_divider";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2 {
+                                       to: "part_divider";
+                                       relative: 1.0 0.0;
+                               }
+                               align: 0.0 0.0;
+                               min: 40 444;
+                               fixed: 1 1;
+                       }
+               }
+               part {
+                       name: "part_ok_btn";
+                       type: SWALLOW;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       relative: 1.0 1.0;
+                                       to: "padding.btn.lefttop";
+                               }
+                               rel2 {
+                                       relative: 1.0 1.0;
+                                       to: "padding.btn.lefttop";
+                               }
+                               min: 168 64;
+                               align: 0.0 0.0;
+                               fixed: 1 1;
+                               visible: 1;
+                       }
+               }
+       }
+}
\ No newline at end of file
old mode 100644 (file)
new mode 100755 (executable)
index c645cc9..feeb01f
@@ -529,6 +529,485 @@ group {
 }
 
 group {
+       data.item: "focus_highlight" "on";
+       name: "elm/button/base/notification/popup_up_btn";
+       images {
+               image: "ic_thumb_up_dis.png" COMP;
+               image: "ic_thumb_up_foc.png" COMP;
+               image: "ic_thumb_up_nor.png" COMP;
+       }
+       parts {
+               part {
+                       name: "btn_bg";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               align: 0.0 0.0;
+                               color: 0 119 246 255;
+                               fixed: 1 1;
+                               visible: 0;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               visible: 1;
+                       }
+               }
+               part {
+                       name: part_popup_up_btn;
+                       type: IMAGE;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               image.normal: "ic_thumb_up_nor.png";
+                               align: 0.0 0.0;
+                               fixed: 1 1;
+                               visible: 1;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               image.normal: "ic_thumb_up_dis.png";
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               image.normal: "ic_thumb_up_foc.png";
+                       }
+               }
+               part {
+                       name: "event";
+                       type: RECT;
+                       description {
+                               state: "default" 0.0;
+                               color: 0 0 0 0;
+                       }
+               }
+       }
+       programs {
+               program {
+                       name: "disabled";
+                       signal: SIGNAL_DISABLED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "disabled" 0.0;
+                       target: btn_bg;
+                       target: part_popup_up_btn;
+               }
+               program {
+                       name: "focused";
+                       signal: SIGNAL_FOCUSED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "focused" 0.0;
+                       target: btn_bg;
+                       target: part_popup_up_btn;
+               }
+               program {
+                       name: "unfocused";
+                       signal: SIGNAL_UNFOCUSED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "default" 0.0;
+                       target: btn_bg;
+                       target: part_popup_up_btn;
+               }
+               program {
+                       name: "mouse_unclick_after";
+                       signal: "mouse,clicked,1";
+                       source: "event";
+                       action: SIGNAL_EMIT "elm,action,click" "";
+               }
+       }
+}
+
+group {
+       data.item: "focus_highlight" "on";
+       name: "elm/button/base/notification/popup_down_btn";
+       images {
+               image: "ic_thumb_down_dis.png" COMP;
+               image: "ic_thumb_down_foc.png" COMP;
+               image: "ic_thumb_down_nor.png" COMP;
+       }
+       parts {
+               part {
+                       name: "btn_bg";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               align: 0.0 0.0;
+                               color: 0 119 246 255;
+                               fixed: 1 1;
+                               visible: 0;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               visible: 1;
+                       }
+               }
+               part {
+                       name: part_popup_down_btn;
+                       type: IMAGE;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               image.normal: "ic_thumb_down_nor.png";
+                               align: 0.0 0.0;
+                               fixed: 1 1;
+                               visible: 1;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               image.normal: "ic_thumb_down_dis.png";
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               image.normal: "ic_thumb_down_foc.png";
+                       }
+               }
+               part {
+                       name: "event";
+                       type: RECT;
+                       description {
+                               state: "default" 0.0;
+                               color: 0 0 0 0;
+                       }
+               }
+       }
+       programs {
+               program {
+                       name: "disabled";
+                       signal: SIGNAL_DISABLED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "disabled" 0.0;
+                       target: btn_bg;
+                       target: part_popup_down_btn;
+               }
+               program {
+                       name: "focused";
+                       signal: SIGNAL_FOCUSED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "focused" 0.0;
+                       target: btn_bg;
+                       target: part_popup_down_btn;
+               }
+               program {
+                       name: "unfocused";
+                       signal: SIGNAL_UNFOCUSED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "default" 0.0;
+                       target: btn_bg;
+                       target: part_popup_down_btn;
+               }
+               program {
+                       name: "mouse_unclick_after";
+                       signal: "mouse,clicked,1";
+                       source: "event";
+                       action: SIGNAL_EMIT "elm,action,click" "";
+               }
+       }
+}
+
+group {
+       data.item: "focus_highlight" "on";
+       name: "elm/button/base/notification/popup_ok_btn";
+       parts {
+               part {
+                       name: "btn_bg";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               align: 0.0 0.0;
+                               color: 0 119 246 255;
+                               fixed: 1 1;
+                               visible: 0;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               visible: 1;
+                       }
+               }
+               part {
+                       name: "padding.text.left";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 20 0;
+                               rel1.to: "btn_bg";
+                               rel2 {
+                                       to: "btn_bg";
+                                       relative: 0.0 1.0;
+                               }
+                               align: 0.0 0.5;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "padding.text.right";
+                       type: SPACER;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               min: 20 0;
+                               rel1 {
+                                       to: "btn_bg";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2.to: "btn_bg";
+                               align: 1.0 0.5;
+                               fixed: 1 0;
+                       }
+               }
+               part {
+                       name: "part_popup_ok_btn_text";
+                       type: TEXT;
+                       scale: 1;
+                       repeat_events: 1;
+                       description {
+                               state: "default" 0.0;
+                               rel1 {
+                                       to: "padding.text.left";
+                                       relative: 1.0 0.0;
+                               }
+                               rel2 {
+                                       to: "padding.text.right";
+                                       relative: 0.0 1.0;
+                               }
+                               text {
+                                       font: FONT_LIGHT;
+                                       text: "OK";
+                                       size: 32;
+                                       align: 0.5 0.5;
+                                       min: 1 1;
+                                       ellipsis: -1;
+                               }
+                               color: 87 87 87 255;
+                               fixed: 1 1;
+                               visible: 1;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               color: 87 87 87 127.5;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               color: COLOR_TEXT_FOCUS;
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: 64 136 211 255;
+                       }
+               }
+               part {
+                       name: "part_inside_line_up";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               color: 87 87 87 255;
+                               rel1.to: "btn_bg";
+                               rel2 {
+                                       to: "btn_bg";
+                                       relative: 1.0 0.0;
+                               }
+                               min: 0 2;
+                               align: 0.5 0.0;
+                               fixed: 0 1;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               color: 87 87 87 127.5;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               color: 0 119 246 255;
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: 64 136 211 255;
+                       }
+               }
+               part {
+                       name: "part_inside_line_left";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               color: 87 87 87 255;
+                               rel1 {
+                                       to: "part_inside_line_up";
+                                       relative: 0.0 1.0;
+                               }
+                               rel2 {
+                                       to: "btn_bg";
+                                       relative: 0.0 1.0;
+                               }
+                               min: 2 0;
+                               align: 0.0 0.5;
+                               fixed: 1 0;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               color: 87 87 87 127.5;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               color: 0 119 246 255;
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: 64 136 211 255;
+                       }
+               }
+               part {
+                       name: "part_inside_line_down";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               color: 87 87 87 255;
+                               rel1 {
+                                       to: "part_inside_line_left";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2.to: "btn_bg";
+                               min: 0 2;
+                               align: 0.5 1.0;
+                               fixed: 0 1;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               color: 87 87 87 127.5;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               color: 0 119 246 255;
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: 64 136 211 255;
+                       }
+               }
+               part {
+                       name: "part_inside_line_right";
+                       type: RECT;
+                       scale: 1;
+                       description {
+                               state: "default" 0.0;
+                               color: 87 87 87 255;
+                               rel1 {
+                                       to: "part_inside_line_up";
+                                       relative: 1.0 1.0;
+                               }
+                               rel2 {
+                                       to: "part_inside_line_down";
+                                       relative: 1.0 0.0;
+                               }
+                               min: 2 0;
+                               align: 1.0 0.5;
+                               fixed: 1 0;
+                       }
+                       description {
+                               state: "disabled" 0.0;
+                               inherit: "default" 0.0;
+                               color: 87 87 87 127.5;
+                       }
+                       description {
+                               state: "focused" 0.0;
+                               inherit: "default" 0.0;
+                               color: 0 119 246 255;
+                       }
+                       description {
+                               state: "selected" 0.0;
+                               inherit: "default" 0.0;
+                               color: 64 136 211 255;
+                       }
+               }
+               part {
+                       name: "event";
+                       type: RECT;
+                       description {
+                               state: "default" 0.0;
+                               color: 0 0 0 0;
+                       }
+               }
+       }
+       programs {
+               program {
+                       name: "disabled";
+                       signal: SIGNAL_DISABLED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "disabled" 0.0;
+                       target: btn_bg;
+                       target: part_popup_ok_btn_text;
+                       target: part_inside_line_right;
+                       target: part_inside_line_up;
+                       target: part_inside_line_down;
+                       target: part_inside_line_left;
+               }
+               program {
+                       name: "focused";
+                       signal: SIGNAL_FOCUSED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "focused" 0.0;
+                       target: btn_bg;
+                       target: part_popup_ok_btn_text;
+                       target: part_inside_line_right;
+                       target: part_inside_line_up;
+                       target: part_inside_line_down;
+                       target: part_inside_line_left;
+               }
+               program {
+                       name: "unfocused";
+                       signal: SIGNAL_UNFOCUSED;
+                       source: SOURCE_ELM;
+                       action: STATE_SET "default" 0.0;
+                       target: btn_bg;
+                       target: part_popup_ok_btn_text;
+                       target: part_inside_line_right;
+                       target: part_inside_line_up;
+                       target: part_inside_line_down;
+                       target: part_inside_line_left;
+               }
+               program {
+                       name: "selected";
+                       signal: "SIGNAL_ITEM_SELECTED";
+                       source: "SOURCE_ELM";
+                       action: STATE_SET "selected" 0.0;
+                       target: btn_bg;
+                       target: part_popup_ok_btn_text;
+                       target: part_inside_line_right;
+                       target: part_inside_line_up;
+                       target: part_inside_line_down;
+                       target: part_inside_line_left;
+               }
+               program {
+                       name: "mouse_unclick_after";
+                       signal: "mouse,clicked,1";
+                       source: "event";
+                       action: SIGNAL_EMIT "elm,action,click" "";
+               }
+       }
+}
+
+group {
        name, "elm/button/base/style.livetv.button";
        data.item, "focus_highlight" "on";
        parts {
old mode 100644 (file)
new mode 100755 (executable)
index 7a6cec6..70e9b0f
@@ -57,6 +57,7 @@
 #define FONT_REGULAR "BreezeSans"
 #define FONT_LIGHT "BreezeSans:style=Light"
 #define FONT_BOLD "BreezeSans:style=Bold"
+#define FONT_SIZE 32
 
 #define KEY_NOTI "KEY_NOTI"
 #define KEY_BUTTON "KEY_BUTTON"
@@ -76,6 +77,7 @@
 #define GRP_NOTIFICATION_CATEGORY "grp.notification.category"
 #define PART_NOTIFICATION_CATEGORY_TITLE "part.notification.category.title"
 #define PART_NOTIFICATION_CATEGORY_CONTENT "part.notification.category.content"
+#define GRP_NOTIFICATION_POPUP "grp.notification.popup"
 
 #define GRP_NOTIFICATION_CLEAR "grp.notification.clear"
 
old mode 100644 (file)
new mode 100755 (executable)
index 3bef527..0c85c5b
 
 #include "define.h"
 
+#define STYLE_POPUP_UP_BTN "notification/popup_up_btn"
+#define STYLE_POPUP_DOWN_BTN "notification/popup_down_btn"
+#define STYLE_POPUP_OK_BTN "notification/popup_ok_btn"
+
 enum _button_id {
        BUTTON_OK,
        BUTTON_OK_NOTI_DEL,
@@ -33,11 +37,19 @@ static void _key_up_cb(int id, void *data, Evas *e, Evas_Object *obj,
                Evas_Event_Key_Up *ev);
 static void _clicked(int id, void *data, Evas_Object *obj);
 
+static void _mouse_move(int id, void *data, Evas *e, Evas_Object *obj,
+               Evas_Event_Mouse_Move *ev);
+
 static input_handler popup_handler = {
        .key_up = _key_up_cb,
        .clicked = _clicked,
 };
 
+static input_handler focus_handler = {
+       .mouse_move = _mouse_move,
+       .key_up = _key_up_cb
+};
+
 static void _key_up_cb(int id, void *data, Evas *e, Evas_Object *obj,
                Evas_Event_Key_Up *ev)
 {
@@ -69,43 +81,156 @@ static void _clicked(int id, void *data, Evas_Object *obj)
        }
 }
 
+static void _up_btn_cb(void *data, Evas_Object *obj, void *event_info)
+{
+       int x, y, w, h;
+       elm_scroller_region_get((Evas_Object*)data, &x, &y, &w, &h);
+       elm_scroller_region_show((Evas_Object*)data, x, y-FONT_SIZE, w, h);
+}
+
+static void _down_btn_cb(void *data, Evas_Object *obj, void *event_info)
+{
+       int x, y, w, h;
+       elm_scroller_region_get((Evas_Object*)data, &x, &y, &w, &h);
+       elm_scroller_region_show((Evas_Object*)data, x, y+FONT_SIZE, w, h);
+}
+
+static void _ok_btn_cb(void *data, Evas_Object *obj, void *event_info)
+{
+       evas_object_del((Evas_Object*)data);
+}
+
+static void _mouse_move(int id, void *data, Evas *e, Evas_Object *obj,
+               Evas_Event_Mouse_Move *ev)
+{
+       elm_object_focus_set(obj, EINA_TRUE);
+}
+
 Evas_Object *util_show_notification_popup(
                Evas_Object *base, notification_h noti, bool noti_del)
 {
-       Evas_Object *popup, *btn1;
        char *title = NULL;
+       char *temp_content = NULL;
        char *content = NULL;
 
-       popup = elm_popup_add(base);
-       if (!popup) {
-               _ERR("create popup failed");
-               return NULL;
-       }
-       evas_object_show(popup);
+       char *start_tag = "<font=BreezeSans:style=Light align=left size=32><linesize=46>";
+       char *end_tag = "</linesize></font>";
+
+       Evas_Object *notification_popup;
+       Evas_Object *window_layout = NULL;
+       Evas_Object *up_btn, *down_btn, *ok_btn;
+       Evas_Object *scroller = NULL;
+       Evas_Object *scroller_label = NULL;
+
+       Evas *e = NULL;
+       Ecore_Evas *ee = NULL;
+       Eina_Bool result = EINA_FALSE;
+       int screen_x, screen_y, screen_w, screen_h;
 
        notification_get_text(noti, NOTIFICATION_TEXT_TYPE_TITLE, &title);
-       elm_object_part_text_set(popup, "title,text", title);
+       notification_get_text(noti, NOTIFICATION_TEXT_TYPE_CONTENT, &temp_content);
 
-       notification_get_text(noti, NOTIFICATION_TEXT_TYPE_CONTENT, &content);
-       elm_object_text_set(popup, content);
+       content = calloc(strlen(start_tag)+strlen(temp_content)+strlen(end_tag)+1, sizeof(char*));
+       strcpy(content, start_tag);
+       strcat(content, temp_content);
+       strcat(content, end_tag);
 
-       evas_object_data_set(popup, KEY_NOTI, noti);
+       /* Creating a Notification Window */
+       notification_popup = elm_win_add(NULL, "notification_popup", ELM_WIN_BASIC);
 
-       btn1 = elm_button_add(popup);
-       elm_object_text_set(btn1, "OK");
-       elm_object_part_content_set(popup, "button1", btn1);
+       if (notification_popup == NULL) {
+               _ERR("elm_win_add failed");
+               goto out;
+       }
 
-       if (noti_del)
-               inputmgr_add_callback(btn1,
-                               BUTTON_OK_NOTI_DEL, &popup_handler, popup);
-       else
-               inputmgr_add_callback(btn1,
-                               BUTTON_OK, &popup_handler, popup);
+       e = evas_object_evas_get(notification_popup);
+       if (!e) {
+               _ERR("evas_object_evas_get failed");
+               evas_object_del(notification_popup);
+               notification_popup = NULL;
+               goto out;
+       }
 
-       evas_object_show(btn1);
-       elm_object_focus_set(btn1, EINA_TRUE);
+       ee = ecore_evas_ecore_evas_get(e);
+       if (!ee) {
+               _ERR("ecore_evas_ecore_evas_get failed");
+               evas_object_del(notification_popup);
+               notification_popup = NULL;
+               goto out;
+       }
 
-       return popup;
+       elm_win_alpha_set(notification_popup, EINA_TRUE);
+       elm_win_borderless_set(notification_popup, EINA_TRUE);
+       elm_win_autodel_set(notification_popup, EINA_TRUE);
+
+       elm_win_screen_size_get(notification_popup, &screen_x, &screen_y, &screen_w, &screen_h);
+       evas_object_resize(notification_popup, screen_w, screen_h);
+
+       /* Layout */
+       window_layout = elm_layout_add(notification_popup);
+       result = elm_layout_file_set(window_layout, EDJEFILE, GRP_NOTIFICATION_POPUP);
+       _DBG("Layout elm_layout_file_set for [%s] returns [%d]", EDJEFILE, result);
+       evas_object_resize(window_layout, screen_w, screen_h);
+       evas_object_show(window_layout);
+
+       /* up, down icons */
+       up_btn = elm_button_add(window_layout);
+       elm_object_style_set(up_btn, STYLE_POPUP_UP_BTN);
+       elm_object_focus_allow_set(up_btn, EINA_TRUE);
+       elm_object_part_content_set(window_layout, "part_up_btn", up_btn);
+       evas_object_show(up_btn);
+
+       down_btn = elm_button_add(window_layout);
+       elm_object_style_set(down_btn, STYLE_POPUP_DOWN_BTN);
+       elm_object_focus_allow_set(down_btn, EINA_TRUE);
+       elm_object_part_content_set(window_layout, "part_down_btn", down_btn);
+       evas_object_show(down_btn);
+
+       /* content - title */
+       elm_object_part_text_set(window_layout, "part_title_label", title);
+
+       /* content - scroller */
+       scroller = elm_scroller_add(window_layout);
+       elm_scroller_policy_set(scroller, ELM_SCROLLER_POLICY_OFF, ELM_SCROLLER_POLICY_OFF);
+       elm_object_part_content_set(window_layout, "part_content_swallow", scroller);
+       evas_object_show(scroller);
+
+       /* content - label in scroller */
+       scroller_label = elm_label_add(scroller);
+       elm_label_line_wrap_set(scroller_label, ELM_WRAP_WORD);
+       elm_label_wrap_width_set(scroller_label, 563);
+       evas_object_size_hint_align_set(scroller_label, 0.0, 0.0);
+       elm_object_text_set(scroller_label, content);
+       evas_object_color_set(scroller_label, 104, 104, 104, 255);
+       evas_object_show(scroller_label);
+
+       elm_object_content_set(scroller, scroller_label);
+
+       /* ok btn */
+       ok_btn = elm_button_add(window_layout);
+       elm_object_style_set(ok_btn, STYLE_POPUP_OK_BTN);
+       elm_object_focus_allow_set(ok_btn, EINA_TRUE);
+       elm_object_part_content_set(window_layout, "part_ok_btn", ok_btn);
+       evas_object_show(ok_btn);
+
+       evas_object_data_set(notification_popup, KEY_NOTI, noti);
+       inputmgr_add_callback(notification_popup, 0, &popup_handler, notification_popup);
+       inputmgr_add_callback(scroller, 0, &popup_handler, notification_popup);
+
+       inputmgr_add_callback(ok_btn, 0, &focus_handler, notification_popup);
+       inputmgr_add_callback(up_btn, 0, &focus_handler, notification_popup);
+       inputmgr_add_callback(down_btn, 0, &focus_handler, notification_popup);
+
+       /* register smart callback of buttons */
+       evas_object_smart_callback_add(up_btn, "clicked", _up_btn_cb, scroller);
+       evas_object_smart_callback_add(down_btn, "clicked", _down_btn_cb, scroller);
+       evas_object_smart_callback_add(ok_btn, "clicked", _ok_btn_cb, notification_popup);
+
+       evas_object_show(notification_popup);
+       elm_win_activate(notification_popup);
+
+out:
+       return notification_popup;
 }
 
 void util_clear_notification(void)