summaryrefslogtreecommitdiff
path: root/data/elementary/themes/edc/efl/tooltip.edc
blob: 389d3894e60b101bf1a9bf1b38c5a36b2740702f (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
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 { 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 { 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; }
      }
   }
}

///////////////////////////////////////////////////////////////////////////////