Skip to content

Commit 1d0319a

Browse files
andyblacandyblac
authored
Merge pull request #5 from andyblac/dev
Merge latest dev branch
2 parents a9a6d94 + 0d3ed18 commit 1d0319a

File tree

7 files changed

+299
-3
lines changed

7 files changed

+299
-3
lines changed

‎custom_cards/custom_card_andyblac_room/custom_card_andyblac_room.yaml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
custom_card_andyblac_room:
3-
# v2.0.2
3+
# v2.0.3
44
template:
55
- "ulm_translation_engine"
66

@@ -662,9 +662,9 @@ custom_card_andyblac_room_sensor_icon:
662662
- fill: >
663663
[[[
664664
if (variables.ulm_custom_card_andyblac_room_sensor_color_on == 'theme') {
665-
return 'rgba(var(--color-'+variables.ulm_custom_card_andyblac_room_sensor_color_on+'),0.2)';
665+
return 'rgba(var(--color-'+variables.ulm_custom_card_andyblac_room_sensor_color+'),0.2)';
666666
} else {
667-
return 'rgba(var(--color-'+variables.ulm_custom_card_andyblac_room_sensor_color_on+'),0.4)';
667+
return 'rgba(var(--color-'+variables.ulm_custom_card_andyblac_room_sensor_color+'),0.4)';
668668
}
669669
]]]
670670
state:

‎custom_cards/custom_card_andyblac_room/icons/fan_animation.yaml‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
fan_animation:
2+
variables:
3+
timeout: "[[[ return Date.now() - Date.parse(entity.last_changed); ]]]"
4+
triggers_update: "all"
5+
show_icon: false
6+
custom_fields:
7+
icon: >
8+
[[[
9+
let path = `
10+
<path d="M12,11A1,1 0 0,0 11,12A1,1 0 0,0 12,13A1,1 0 0,0 13,12A1,1 0 0,0 12,11M12.5,2C17,2 17.11,5.57 14.75,6.75C13.76,7.24 13.32,8.29 13.13,9.22C13.61,9.42 14.03,9.73 14.35,10.13C18.05,8.13 22.03,8.92 22.03,12.5C22.03,17 18.46,17.1 17.28,14.73C16.78,13.74 15.72,13.3 14.79,13.11C14.59,13.59 14.28,14 13.88,14.34C15.87,18.03 15.08,22 11.5,22C7,22 6.91,18.42 9.27,17.24C10.25,16.75 10.69,15.71 10.89,14.79C10.4,14.59 9.97,14.27 9.65,13.87C5.96,15.85 2,15.07 2,11.5C2,7 5.56,6.89 6.74,9.26C7.24,10.25 8.29,10.68 9.22,10.87C9.41,10.39 9.73,9.97 10.14,9.65C8.15,5.96 8.94,2 12.5,2Z"/>
11+
`,
12+
style = `
13+
<svg viewBox="0 0 24 24">
14+
<style>
15+
@keyframes rotate {
16+
0% {
17+
visibility: visible;
18+
transform: rotate(0deg) translateZ(0);
19+
}
20+
100% {
21+
transform: rotate(1080deg) translateZ(0);
22+
}
23+
}
24+
.start {
25+
animation: rotate 2.8s ease-in;
26+
transform-origin: center;
27+
visibility: hidden;
28+
will-change: transform;
29+
}
30+
.on {
31+
animation: rotate 1.8s linear infinite;
32+
transform-origin: center;
33+
animation-delay: 2.8s;
34+
visibility: hidden;
35+
will-change: transform;
36+
}
37+
.end {
38+
animation: rotate 2.8s;
39+
transform-origin: center;
40+
animation-timing-function: cubic-bezier(0.61, 1, 0.88, 1);
41+
will-change: transform;
42+
}
43+
.start_timeout {
44+
animation: rotate 1.8s linear infinite;
45+
transform-origin: center;
46+
visibility: hidden;
47+
will-change: transform;
48+
}
49+
.end_timeout {
50+
transform-origin: center;
51+
will-change: transform;
52+
}
53+
</style>
54+
`;
55+
if (entity.state === 'on' && variables.timeout < 1000) {
56+
return `${style}<g class="start">${path}</g><g class="on">${path}</g></svg>`;
57+
}
58+
if (entity.state === 'off' && variables.timeout < 1000) {
59+
return `${style}<g class="end">${path}</g></svg>`;
60+
}
61+
if (entity.state === 'on' && variables.timeout > 1000) {
62+
return `${style}<g class="start_timeout">${path}</g></svg>`;
63+
} else {
64+
return `${style}<g class="end_timeout">${path}</g></svg>`;
65+
}
66+
]]]
67+
img_cell: "[[[ return `<svg viewBox='0 0 24 24'><ellipse stroke='none' fill='none'></ellipse></svg>`; ]]]"

‎custom_cards/custom_card_andyblac_room/icons/garage-door_animation.yaml‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
garage-door_animation:
2+
variables:
3+
timeout: "[[[ return Date.now() - Date.parse(entity.last_changed); ]]]"
4+
# triggers_update: "all"
5+
show_icon: false
6+
custom_fields:
7+
icon: >
8+
[[[
9+
let path = `
10+
<path d="M22 9V20H20V11H4V20H2V9L12 5L22 9M19 12H5V14H19V12M19 18H5V20H19V18M19 15H5V17H19V15Z" />
11+
`,
12+
style = `
13+
<svg viewBox="0 0 24 24">
14+
<style>
15+
@keyframes door_open {
16+
0% { clip-path: inset(0 0 0 0); }
17+
25% { clip-path: polygon(0 0, 100% 0, 100% 100%, 85% 100%, 85% 83%, 15% 83%, 14% 100%, 0 100%); }
18+
50% { clip-path: polygon(0 0, 100% 0, 100% 100%, 85% 100%, 85% 61%, 15% 61%, 14% 100%, 0 100%); }
19+
75% { clip-path: polygon(0 0, 100% 0, 100% 100%, 85% 100%, 85% 45%, 15% 45%, 14% 100%, 0 100%); }
20+
}
21+
@keyframes door_close {
22+
0% { clip-path: polygon(0 0, 100% 0, 100% 100%, 85% 100%, 85% 45%, 15% 45%, 14% 100%, 0 100%); }
23+
25% { clip-path: polygon(0 0, 100% 0, 100% 100%, 85% 100%, 85% 61%, 15% 61%, 14% 100%, 0 100%); }
24+
50% { clip-path: polygon(0 0, 100% 0, 100% 100%, 85% 100%, 86% 83%, 15% 83%, 14% 100%, 0 100%); }
25+
75% { clip-path: inset(0 0 0 0); }
26+
}
27+
.start {
28+
animation: door_open 3s steps(1);
29+
}
30+
.on {
31+
clip-path: polygon(0 0, 0 100%, 10% 100%, 10% 45%, 85% 45%, 85% 100%, 100% 100%, 100% 0);
32+
}
33+
.end {
34+
animation: door_close 3s steps(1);
35+
}
36+
.start_timeout {
37+
clip-path: polygon(0 0, 0 100%, 10% 100%, 10% 45%, 85% 45%, 85% 100%, 100% 100%, 100% 0);
38+
}
39+
.end_timeout {
40+
transform-origin: center;
41+
will-change: transform;
42+
}
43+
</style>
44+
`;
45+
if (entity.state === 'open' && variables.timeout < -1000) {
46+
return `${style}<g class="start">${path}</g></svg>`;
47+
}
48+
if (entity.state === 'closed' && variables.timeout < 1000) {
49+
return `${style}<g class="end">${path}</g></svg>`;
50+
}
51+
if (entity.state === 'open' ) {
52+
return `${style}<g class="start_timeout">${path}</g></svg>`;
53+
} else {
54+
return `${style}<g class="end_timeout">${path}</g></svg>`;
55+
}
56+
]]]
57+
58+
img_cell: "[[[ return `<svg viewBox='0 0 24 24'><ellipse stroke='none' fill='none'></ellipse></svg>`; ]]]"

‎custom_cards/custom_card_andyblac_room/icons/motion_animation.yaml‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
motion_animation:
2+
variables:
3+
timeout: "[[[ return Date.now() - Date.parse(entity.last_changed); ]]]"
4+
triggers_update: "all"
5+
show_icon: false
6+
custom_fields:
7+
icon: >
8+
[[[
9+
let path = `
10+
<path d="M10,0.2C9,0.2 8.2,1 8.2,2C8.2,3 9,3.8 10,3.8C11,3.8 11.8,3 11.8,2C11.8,1 11,0.2 10,0.2M15.67,1A7.33,7.33 0 0,0 23,8.33V7A6,6 0 0,1 17,1H15.67M18.33,1C18.33,3.58 20.42,5.67 23,5.67V4.33C21.16,4.33 19.67,2.84 19.67,1H18.33M21,1A2,2 0 0,0 23,3V1H21M7.92,4.03C7.75,4.03 7.58,4.06 7.42,4.11L2,5.8V11H3.8V7.33L5.91,6.67L2,22H3.8L6.67,13.89L9,17V22H10.8V15.59L8.31,11.05L9.04,8.18L10.12,10H15V8.2H11.38L9.38,4.87C9.08,4.37 8.54,4.03 7.92,4.03Z" />
11+
`,
12+
style = `
13+
<svg viewBox="0 0 24 24">
14+
<style>
15+
@keyframes clip {
16+
50% { clip-path: polygon(0 0, 55% 0, 100% 100%, 0 100%); }
17+
}
18+
.start {
19+
animation: clip 2s linear infinite;
20+
}
21+
.on {
22+
animation: clip 2s linear infinite;
23+
}
24+
.end {
25+
clip-path: polygon(0 0, 55% 0, 100% 100%, 0 100%);
26+
}
27+
.start_timeout {
28+
animation: clip 2s linear infinite;
29+
}
30+
.end_timeout {
31+
clip-path: polygon(0 0, 55% 0, 100% 100%, 0 100%);
32+
}
33+
</style>
34+
`;
35+
if (entity.state === 'on' && variables.timeout < -1000) {
36+
return `${style}<g class="start">${path}</g></svg>`;
37+
}
38+
if (entity.state === 'off' && variables.timeout < 1000) {
39+
return `${style}<g class="end">${path}</g></svg>`;
40+
}
41+
if (entity.state === 'on') {
42+
return `${style}<g class="start_timeout">${path}</g></svg>`;
43+
} else {
44+
return `${style}<g class="end_timeout">${path}</g></svg>`;
45+
}
46+
]]]
47+
48+
img_cell: "[[[ return `<svg viewBox='0 0 24 24'><ellipse stroke='none' fill='none'></ellipse></svg>`; ]]]"

‎custom_cards/custom_card_andyblac_room/icons/shower_animation.yaml‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
shower_animation:
2+
variables:
3+
timeout: "[[[ return Date.now() - Date.parse(entity.last_changed); ]]]"
4+
# triggers_update: "all"
5+
show_icon: false
6+
custom_fields:
7+
icon: >
8+
[[[
9+
let path = `
10+
<path d="M20,20A1,1 0 0,1 21,21A1,1 0 0,1 20,22A1,1 0 0,1 19,21A1,1 0 0,1 20,20M16,20A1,1 0 0,1 17,21A1,1 0 0,1 16,22A1,1 0 0,1 15,21A1,1 0 0,1 16,20M12,20A1,1 0 0,1 13,21A1,1 0 0,1 12,22A1,1 0 0,1 11,21A1,1 0 0,1 12,20M8,20A1,1 0 0,1 9,21A1,1 0 0,1 8,22A1,1 0 0,1 7,21A1,1 0 0,1 8,20M4,20A1,1 0 0,1 5,21A1,1 0 0,1 4,22A1,1 0 0,1 3,21A1,1 0 0,1 4,20M6,17A1,1 0 0,1 7,18A1,1 0 0,1 6,19H6A1,1 0 0,1 5,18A1,1 0 0,1 6,17H6M10,17A1,1 0 0,1 11,18A1,1 0 0,1 10,19A1,1 0 0,1 9,18A1,1 0 0,1 10,17M14,17A1,1 0 0,1 15,18A1,1 0 0,1 14,19A1,1 0 0,1 13,18A1,1 0 0,1 14,17M18,17A1,1 0 0,1 19,18A1,1 0 0,1 18,19A1,1 0 0,1 17,18A1,1 0 0,1 18,17M8,14A1,1 0 0,1 9,15A1,1 0 0,1 8,16A1,1 0 0,1 7,15A1,1 0 0,1 8,14M12,14A1,1 0 0,1 13,15A1,1 0 0,1 12,16A1,1 0 0,1 11,15A1,1 0 0,1 12,14M16,14A1,1 0 0,1 17,15A1,1 0 0,1 16,16A1,1 0 0,1 15,15A1,1 0 0,1 16,14M19,12H5V10H19V12M17.92,9H6.08C6.5,6.5 8.5,4.5 11,4.08V2H13V4.08C15.5,4.5 17.5,6.5 17.92,9Z" />
11+
`,
12+
style = `
13+
<svg viewBox="0 0 24 24">
14+
<style>
15+
@keyframes clip {
16+
0% {
17+
visibility: visible;
18+
clip-path: inset(0 0 45% 0);
19+
}
20+
100% {
21+
clip-path: inset(0 0 0 0);
22+
}
23+
}
24+
.start {
25+
animation: clip 1.4s ease-out;
26+
transform-origin: center;
27+
visibility: hidden;
28+
will-change: transform;
29+
}
30+
.on {
31+
animation: clip 1.4s ease-out infinite;
32+
transform-origin: center;
33+
animation-delay: 0.7s;
34+
visibility: hidden;
35+
will-change: transform;
36+
}
37+
.end {
38+
animation: clip 1.4s ease-out;
39+
transform-origin: center;
40+
animation-timing-function: cubic-bezier(0.61, 1, 0.88, 1);
41+
will-change: transform;
42+
}
43+
.start_timeout {
44+
animation: clip 1.4s ease-out infinite;
45+
transform-origin: center;
46+
visibility: hidden;
47+
will-change: transform;
48+
}
49+
.end_timeout {
50+
transform-origin: center;
51+
will-change: transform;
52+
}
53+
</style>
54+
`;
55+
if (entity.state === 'on' && variables.timeout < 1000) {
56+
return `${style}<g class="start">${path}</g><g class="on">${path}</g></svg>`;
57+
}
58+
if (entity.state === 'off' && variables.timeout < 1000) {
59+
return `${style}<g class="end">${path}</g></svg>`;
60+
}
61+
if (entity.state === 'on' && variables.timeout > 1000) {
62+
return `${style}<g class="start_timeout">${path}</g></svg>`;
63+
} else {
64+
return `${style}<g class="end_timeout">${path}</g></svg>`;
65+
}
66+
]]]
67+
img_cell: "[[[ return `<svg viewBox='0 0 24 24'><ellipse stroke='none' fill='none'></ellipse></svg>`; ]]]"

0 commit comments

Comments
 (0)