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
|
// -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*-
const UI = imports.testcommon.ui;
const { Clutter, GLib, St } = imports.gi;
const DELAY = 2000;
function resize_animated(label) {
if (label.width == 100) {
label.save_easing_state();
label.set_easing_mode(Clutter.AnimationMode.EASE_OUT_QUAD);
label.set_easing_duration(DELAY - 50);
label.set_size(500, 500);
label.restore_easing_state();
} else {
label.save_easing_state();
label.set_easing_mode(Clutter.AnimationMode.EASE_OUT_QUAD);
label.set_easing_duration(DELAY - 50);
label.set_size(100, 100);
label.restore_easing_state();
}
}
function get_css_style(shadow_style)
{
return 'border: 20px solid black;' +
'border-radius: 20px;' +
'background-color: white; ' +
'padding: 5px;' + shadow_style;
}
function test() {
let stage = new Clutter.Stage({ width: 1000, height: 600 });
UI.init(stage);
let iter = 0;
let shadowStyles = [ 'box-shadow: 3px 50px 0px 4px rgba(0,0,0,0.5);',
'box-shadow: 3px 4px 10px 4px rgba(0,0,0,0.5);',
'box-shadow: 0px 50px 0px 0px rgba(0,0,0,0.5);',
'box-shadow: 100px 100px 20px 4px rgba(0,0,0,0.5);'];
let label1 = new St.Label({ style: get_css_style(shadowStyles[iter]),
text: shadowStyles[iter],
x: 20,
y: 20,
width: 100,
height: 100
});
stage.add_actor(label1);
let label2 = new St.Label({ style: get_css_style(shadowStyles[iter]),
text: shadowStyles[iter],
x: 500,
y: 20,
width: 100,
height: 100
});
stage.add_actor(label2);
resize_animated(label1);
resize_animated(label2);
GLib.timeout_add(GLib.PRIORITY_DEFAULT, DELAY, () => {
log(label1 + label1.get_size());
resize_animated(label1);
resize_animated(label2);
return true;
});
GLib.timeout_add(GLib.PRIORITY_DEFAULT, 2 * DELAY, () => {
iter += 1;
iter %= shadowStyles.length;
label1.set_style(get_css_style(shadowStyles[iter]));
label1.set_text(shadowStyles[iter]);
label2.set_style(get_css_style(shadowStyles[iter]));
label2.set_text(shadowStyles[iter]);
return true;
});
UI.main(stage);
}
test();
|
