From 29240037a6a270fdd6950de04901d01a0de27a47 Mon Sep 17 00:00:00 2001 From: Amitesh Singh Date: Wed, 11 Apr 2018 19:07:11 +0900 Subject: [PATCH] themes: tooltip - remove elm tooltip inheritance. --- data/elementary/themes/edc/efl/tooltip.edc | 428 ++++++++++++++++++++- 1 file changed, 422 insertions(+), 6 deletions(-) diff --git a/data/elementary/themes/edc/efl/tooltip.edc b/data/elementary/themes/edc/efl/tooltip.edc index 204b2b4ddc..389d3894e6 100644 --- a/data/elementary/themes/edc/efl/tooltip.edc +++ b/data/elementary/themes/edc/efl/tooltip.edc @@ -1,15 +1,431 @@ -group { "efl/label/tooltip"; - inherit: "elm/label/base/tooltip/default"; +group { name: "efl/label/tooltip"; alias: "efl/label/base/tooltip"; //XXX: Remove it in EFL 2.0 alias: "efl/label/base/tooltip/transparent"; + styles { + style { name: "tooltip_style2"; + base: "font="FN" font_size=10 color=#ffffff style=shadow,bottom shadow_color=#00000080 text_class=bubble"; + tag: "br" "\n"; + tag: "hilight" "+ font="FN" text_class=bubble"; + tag: "b" "+ font="FN" text_class=bubble"; + tag: "tab" "\t"; + } + } + parts { + part { name: "elm.text"; type: TEXTBLOCK; mouse_events: 0; + scale: 1; + description { state: "default" 0.0; + text { + style: "tooltip_style2"; + min: 1 1; + ellipsis: -1; + } + } + } + } } -group { "efl/tooltip"; - inherit: "elm/tooltip/base/default"; +group { name: "efl/tooltip"; + min: 30 30; + data.item: "pad_x" "10"; + data.item: "pad_y" "10"; + data.item: "pad_border_x" "1"; + data.item: "pad_border_y" "1"; + /* tooltip is hidden after this amount. + Keep in sync with hide animations */ + data.item: "hide_timeout" "0.35"; + // if in a window... it's transparent! + data.item: "transparent" "enabled"; + images.image: "tooltip-base.png" COMP; + images.image: "tooltip-corner-top-left-tip.png" COMP; + images.image: "tooltip-corner-top-right-tip.png" COMP; + images.image: "tooltip-corner-bottom-left-tip.png" COMP; + images.image: "tooltip-corner-bottom-right-tip.png" COMP; + images.image: "tooltip-edge-left-tip.png" COMP; + images.image: "tooltip-edge-right-tip.png" COMP; + images.image: "tooltip-edge-bottom-tip.png" COMP; + images.image: "tooltip-edge-top-tip.png" COMP; + script { + hide_corners() { + set_state(PART:"corner-top-left", "default", 0.0); + set_state(PART:"corner-top-right", "default", 0.0); + set_state(PART:"corner-bottom-left", "default", 0.0); + set_state(PART:"corner-bottom-right", "default", 0.0); + } + hide_edges() { + set_state(PART:"clipper-edge-left", "default", 0.0); + set_state(PART:"clipper-edge-right", "default", 0.0); + set_state(PART:"clipper-edge-top", "default", 0.0); + set_state(PART:"clipper-edge-bottom", "default", 0.0); + } + show_corner_top_left() { + set_state(PART:"corner-top-left", "visible", 0.0); + set_state(PART:"corner-top-right", "default", 0.0); + set_state(PART:"corner-bottom-left", "default", 0.0); + set_state(PART:"corner-bottom-right", "default", 0.0); + hide_edges(); + } + show_corner_top_right() { + set_state(PART:"corner-top-right", "visible", 0.0); + set_state(PART:"corner-top-left", "default", 0.0); + set_state(PART:"corner-bottom-left", "default", 0.0); + set_state(PART:"corner-bottom-right", "default", 0.0); + hide_edges(); + } + show_corner_bottom_left() { + set_state(PART:"corner-bottom-left", "visible", 0.0); + set_state(PART:"corner-bottom-right", "default", 0.0); + set_state(PART:"corner-top-left", "default", 0.0); + set_state(PART:"corner-top-right", "default", 0.0); + hide_edges(); + } + show_corner_bottom_right() { + set_state(PART:"corner-bottom-right", "visible", 0.0); + set_state(PART:"corner-bottom-left", "default", 0.0); + set_state(PART:"corner-top-left", "default", 0.0); + set_state(PART:"corner-top-right", "default", 0.0); + hide_edges(); + } + show_edge_left(Float:val) { + set_state(PART:"clipper-edge-left", "visible", 0.0); + set_drag(PART:"edge-drag-left", 0.0, val); + set_state(PART:"clipper-edge-right", "default", 0.0); + set_state(PART:"clipper-edge-top", "default", 0.0); + set_state(PART:"clipper-edge-bottom", "default", 0.0); + hide_corners(); + } + show_edge_right(Float:val) { + set_state(PART:"clipper-edge-right", "visible", 0.0); + set_drag(PART:"edge-drag-right", 0.0, val); + set_state(PART:"clipper-edge-left", "default", 0.0); + set_state(PART:"clipper-edge-top", "default", 0.0); + set_state(PART:"clipper-edge-bottom", "default", 0.0); + hide_corners(); + } + show_edge_top(Float:val) { + set_state(PART:"clipper-edge-top", "visible", 0.0); + set_drag(PART:"edge-drag-top", val, 0.0); + set_state(PART:"clipper-edge-bottom", "default", 0.0); + set_state(PART:"clipper-edge-left", "default", 0.0); + set_state(PART:"clipper-edge-right", "default", 0.0); + hide_corners(); + } + show_edge_bottom(Float:val) { + set_state(PART:"clipper-edge-bottom", "visible", 0.0); + set_drag(PART:"edge-drag-bottom", val, 0.0); + set_state(PART:"clipper-edge-top", "default", 0.0); + set_state(PART:"clipper-edge-left", "default", 0.0); + set_state(PART:"clipper-edge-right", "default", 0.0); + hide_corners(); + } + public message(Msg_Type:type, id, ...) { + if ((type == MSG_FLOAT_SET) && (id == 1)) { + new Float:x, Float:y; + + x = getfarg(2); + y = getfarg(3); + + if (x < 0.0) { + if (y < 0.0) show_corner_top_left(); + else if (y > 1.0) show_corner_bottom_left(); + else show_edge_left(y); + } else if (x > 1.0) { + if (y < 0.0) show_corner_top_right(); + else if (y > 1.0) show_corner_bottom_right(); + else show_edge_right(y); + } else { + if (y < 0.0) show_edge_top(x); + else if (y > 1.0) show_edge_bottom(x); + else { + hide_corners(); + hide_edges(); + } + } + } + } + } + parts { + part { name: "clipper"; type: RECT; + description { state: "default" 0.0; + color: 255 255 255 0; + rel1 { to: "pop"; offset: -5 -5; } + rel2 { to: "pop"; offset: 5 5; } + } + description { state: "visible" 0.0; + inherit: "default" 0.0; + color: 255 255 255 255; + } + } + part { name: "pop"; mouse_events: 0; + clip_to: "clipper"; + scale: 1; + description { state: "default" 0.0; + min: 30 30; + rel1 { + to: "elm.swallow.content"; + offset: -5 -4; + } + rel2 { + to: "elm.swallow.content"; + offset: 4 5; + } + image { + normal: "tooltip-base.png"; + border: 7 7 6 8; + } + image.middle: SOLID; + } + } + #define TT_CORNER(name_, rx, ry, ax, ay, ox, oy) \ + part { name: "corner-"name_; mouse_events: 0; \ + clip_to: "clipper"; \ + scale: 1; \ + description { state: "default" 0.0; \ + visible: 0; \ + align: ax ay; \ + FIXED_SIZE(12, 12) \ + rel1 { \ + relative: rx ry; \ + offset: ox oy; \ + to: "pop"; \ + } \ + rel2 { \ + relative: rx ry; \ + offset: ox oy; \ + to: "pop"; \ + } \ + image.normal: "tooltip-corner-"name_"-tip.png"; \ + } \ + description { state: "visible" 0.0; \ + inherit: "default" 0.0; \ + visible: 1; \ + } \ + } + TT_CORNER("top-left", 0, 0, 0, 0, -4, -5); + TT_CORNER("top-right", 1, 0, 1, 0, 3, -5); + TT_CORNER("bottom-left", 0, 1, 0, 1, -4, 2); + TT_CORNER("bottom-right", 1, 1, 1, 1, 3, 2); + #undef TT_CORNER + + #define TT_EDGE_VERT(name_, rx, ax, ox) \ + part { name: "clipper-edge-"name_; type: RECT; \ + clip_to: "clipper"; \ + description { state: "default" 0.0; \ + visible: 0; \ + min: 9 13; \ + align: ax 0.5; \ + fixed: 1 1; \ + rel1 { \ + relative: rx 0.0; \ + offset: ox 0; \ + to: "elm.swallow.content"; \ + } \ + rel2 { \ + relative: rx 1.0; \ + offset: ox 0; \ + to: "elm.swallow.content"; \ + } \ + } \ + description { state: "visible" 0.0; \ + inherit: "default" 0.0; \ + visible: 1; \ + } \ + } \ + part { name: "edge-area-"name_; type: RECT; mouse_events: 0; \ + clip_to: "clipper-edge-"name_; \ + scale: 1; \ + description { state: "default" 0.0; \ + color: 0 0 0 0; \ + min: 9 13; \ + align: ax 0.5; \ + fixed: 1 1; \ + rel1 { \ + relative: rx 0.0; \ + offset: ox 0; \ + to: "elm.swallow.content"; \ + } \ + rel2 { \ + relative: rx 1.0; \ + offset: ox 0; \ + to: "elm.swallow.content"; \ + } \ + } \ + } \ + part { name: "edge-drag-"name_; type: RECT; mouse_events: 0; \ + clip_to: "clipper-edge-"name_; \ + scale: 1; \ + dragable { \ + x: 0 0 0; \ + y: 1 1 0; \ + confine: "edge-area-"name_; \ + } \ + description { state: "default" 0.0; \ + color: 0 0 0 0; \ + min: 9 13; \ + rel1.to: "edge-area-"name_; \ + rel2.to: "edge-area-"name_; \ + } \ + } \ + part { name: "edge-img-"name_; mouse_events: 0; \ + clip_to: "clipper-edge-"name_; \ + description { state: "default" 0.0; \ + FIXED_SIZE(9, 13) \ + align: ax 0.5; \ + rel1.to: "edge-drag-"name_; \ + rel2.to: "edge-drag-"name_; \ + image.normal: "tooltip-edge-"name_"-tip.png"; \ + } \ + } + TT_EDGE_VERT("left", 0, 1, -3); + TT_EDGE_VERT("right", 1, 0, 2); + #undef TT_EDGE_VERT + + #define TT_EDGE_HORIZ(name_, ry, ay, oy) \ + part { name: "clipper-edge-"name_; type: RECT; \ + clip_to: "clipper"; \ + scale: 1; \ + description { state: "default" 0.0; \ + visible: 0; \ + min: 11 9; \ + align: 0.5 ay; \ + fixed: 1 1; \ + rel1 { \ + relative: 0.0 ry; \ + offset: 0 oy; \ + to: "elm.swallow.content"; \ + } \ + rel2 { \ + relative: 1.0 ry; \ + offset: 0 oy; \ + to: "elm.swallow.content"; \ + } \ + } \ + description { state: "visible" 0.0; \ + inherit: "default" 0.0; \ + visible: 1; \ + } \ + } \ + part { name: "edge-area-"name_; type: RECT; mouse_events: 0; \ + clip_to: "clipper-edge-"name_; \ + scale: 1; \ + description { state: "default" 0.0; \ + color: 0 0 0 0; \ + min: 11 9; \ + align: 0.5 ay; \ + fixed: 1 1; \ + rel1.to: "clipper-edge-"name_; \ + rel2.to: "clipper-edge-"name_; \ + } \ + } \ + part { name: "edge-drag-"name_; type: RECT; mouse_events: 0; \ + clip_to: "clipper-edge-"name_; \ + scale: 1; \ + dragable { \ + x: 1 1 0; \ + y: 0 0 0; \ + confine: "edge-area-"name_; \ + } \ + description { state: "default" 0.0; \ + color: 0 0 0 0; \ + min: 11 9; \ + rel1.to: "edge-area-"name_; \ + rel2.to: "edge-area-"name_; \ + } \ + } \ + part { name: "edge-img-"name_; mouse_events: 0; \ + clip_to: "clipper-edge-"name_; \ + scale: 1; \ + description { state: "default" 0.0; \ + FIXED_SIZE(11, 9) \ + align: 0.5 ay; \ + rel1.to: "edge-drag-"name_; \ + rel2.to: "edge-drag-"name_; \ + image.normal: "tooltip-edge-"name_"-tip.png"; \ + } \ + } + TT_EDGE_HORIZ("top", 0, 1, -1); + TT_EDGE_HORIZ("bottom", 1, 0, 1); + #undef TT_EDGE_HORIZ + part { name: "clipper_content"; type: RECT; + description { state: "default" 0.0; + color: 255 255 255 0; + rel1.to: "elm.swallow.content"; + rel2.to: "elm.swallow.content"; + } + description { state: "visible" 0.0; + inherit: "default" 0.0; + color: 255 255 255 255; + } + } + part { name: "elm.swallow.content"; type: SWALLOW; + clip_to: "clipper_content"; + description { state: "default" 0.0; + rel1.offset: 10 10; + rel2.offset: -11 -11; + } + } + programs { + program { name: "show0"; + signal: "elm,action,show"; source: "elm"; + action: ACTION_STOP; + target: "hide0"; + target: "hide1"; + target: "hide2"; + target: "hide3"; + after: "show1"; + after: "show2"; + } + program { name: "show1"; + action: STATE_SET "visible" 0.0; + transition: LINEAR 0.15; + target: "clipper"; + } + program { name: "show2"; + in: 0.1 0.0; + action: STATE_SET "visible" 0.0; + transition: LINEAR 0.15; + target: "clipper_content"; + } + program { name: "hide0"; + signal: "elm,action,hide"; source: "elm"; + action: ACTION_STOP; + target: "show0"; + target: "show1"; + target: "show2"; + after: "hide1"; + after: "hide2"; + after: "hide3"; + } + program { name: "hide1"; + script { + hide_corners(); + hide_edges(); + } + } + program { name: "hide2"; + action: STATE_SET "default" 0.0; + transition: LINEAR 0.1; + target: "clipper_content"; + } + program { name: "hide3"; + in: 0.1 0.0; + action: STATE_SET "default" 0.0; + transition: LINEAR 0.1; + target: "clipper"; + } + } + } } -group { "efl/tooltip:transparent"; - inherit: "elm/tooltip/base/transparent"; +group { name: "efl/tooltip:transparent"; + data.item: "pad_x" "10"; + data.item: "pad_y" "10"; + data.item: "transparent" "enabled"; + parts { + part { name: "elm.swallow.content"; type: SWALLOW; mouse_events: 0; + scale: 1; + description { state: "default" 0.0; } + } + } } ///////////////////////////////////////////////////////////////////////////////