1@ = require(['mho:surface', 'mho:surface/html']);
2
3exports.fakeNetworkElem = function(val) {
4 return @Label([
5 @Checkbox(val),
6 " Fake network delay"
7 ]) .. @CSS('
8 {
9 margin: 1em 0;
10 }
11
12 input {
13 vertical-align: baseline;
14 }
15 ');
16};
17
18exports.spinnerElem = @Svg(
19 `<circle cx="50" cy="50" r="42" transform="rotate(-90,50,50)"></circle>`,
20 {
21 'class': "spinner",
22 'viewBox': "0 0 100 100",
23 'width': "20",
24 'height': "20",
25 }) .. @CSS(`
26 @global {
27 @-webkit-keyframes spin {
28 to {
29 stroke-dashoffset: -264;
30 }
31 }
32
33 @keyframes spin {
34 to {
35 stroke-dashoffset: -264;
36 }
37 }
38 }
39
40 circle {
41 fill: none;
42 stroke: slategray;
43 stroke-width: 16;
44 stroke-linecap: round;
45 stroke-dasharray: 0, 0, 70, 194;
46 stroke-dashoffset: 0;
47 animation: spin 1s infinite linear;
48 -webkit-animation: spin 1s infinite linear;
49 }
50 `);
51