Share your Floorplan

Yes. I use calendar.a=calendar.f1, calendar.b=calendar.moto_gp.

Guy, who help me to write this is write me that this is automation and that i should add this code to template.yaml which is connected via configuration.yaml.

Ok so what states and attributes are in the multi cal sensor now?

It shows me: Unknown!
I don’t think this is the right way to solve what I would like to get!

If it was possible to make a template with the help of this code, maybe it would be ok. Otherwise, I don’t know if the code can be used directly in the floor plan card under:

   state_action:
   - service: floorplan.text_set
   service_data: ?

The current code, which I don’t even know in which language it is written, but at least shows me the first event for a specific calendar:

{{as_timestamp(strptime(state_attr("calendar.f1","start_time"),"%Y-%m-%d %H:%M:%S")) | timestamp_custom("%d %B %Y %H:%M")}}-{{as_timestamp(strptime(state_attr("calendar.f1","end_time"),"%Y-%m-%d %H:%M:%S")) | timestamp_custom("%H:%M")}} {{state_attr("calendar.f1","message")}}, {{state_attr("calendar.f1","location")}}

Result type: string
07 March 2024 14:30-15:30 F1: Prvi prosti trening (VN Savdske Arabije), Jeddah

This template listens for the following state changed events:
Entity: calendar.f1

Yes so this one will work and will show you the next event in the calendar. So one solution would be to have a line in your floorplan for each calendar and then use the above.

The other one is looking for changes in the start or end times of two calendars (you could add more). If they change then the action pulls down all events for a 72 hour period and sticks them in the e variable. The sensor then should have a state which indicates how many total events and an attribute with the events.
If the state is unknown maybe the trigger wasn’t met. Add something else in the trigger list like this which will cause it to update every minute (just use this for testing)

  - platform: state
    entity_id: sensor.time

OK so the problem is the trigger isn’t firing. Change the trigger to this for testing

  - trigger:
      - platform: time_pattern
        minutes: /30

Now you will have an time ordered list of upcoming events. From here you can just have a series of lines in your SVG and then use code like this (it is javascript) to set your text:


            - element: line1
              tap_action:
                service: floorplan.text_set
                service_data: |
                    >
                    var startDate = new Date(hass.states["sensor.multical_72_hour_agenda"].attributes.events[0].start);
                    return `
                      ${startDate.toDateString()} ${startDate.getHours()}:${(startDate.getMinutes() < 10 ? '0' : '') + startDate.getMinutes()} ${hass.states["sensor.multical_72_hour_agenda"].attributes.events[0].summary}
                    `;
            - element: line2
              tap_action:
                service: floorplan.text_set
                service_data: |
                    >
                    var startDate = new Date(hass.states["sensor.multical_72_hour_agenda"].attributes.events[1].start);
                    return `
                      ${startDate.toDateString()} ${startDate.getHours()}:${(startDate.getMinutes() < 10 ? '0' : '') + startDate.getMinutes()} ${hass.states["sensor.multical_72_hour_agenda"].attributes.events[1].summary}
                    `;

edit: If you find an entry is too long for the screen then work out the max length and you can trim it by using these extra functions. The 15 in the slice function is what you need to adjust:

${(hass.states["sensor.multical_72_hour_agenda"].attributes.events[1].summary).toString().slice(0,15)}

Hi OzGav!

I spent a lot of time surfing the Internet on the topic of a domestic helper calendar.

There is a lot written about this topic (automation template) which made me wonder why people use calendar for automation! It is true that Google has divided the tasks and is now in HA in the to-do list. So now I use events instead of tasks, which is not even that important.

I have a feeling that the google calendar add-on is written in such a way that it uses HAOS to display the data. I also installed atomic-calendar-revive, which is obviously a front-end and other calendar cards are no different.

Conclusion: Apparently no one knows or has a need to add an entity from a calendar other than the next event that follows in a specific calendar for automation, which doesn’t help me. Quite a few questions were also asked about how to call the next event, but there was no answer.

In short, I had enough of everything and I said I will try the grid card and insert the other cards on the basis of that, which I somehow managed to display satisfactorily on all devices, otherwise it is not the same as if the entire card was in SVG format, which looks nice on its own automatically adjusts to the screen size.

I will add a new zip file with the entire content on discord shortly if you are interested.

Thank you once again for the effort you put into finding a solution to the problem.

hi.

im fairly new to programming.

i created a floorplan. in this floorplan i created 2 text blocks.
1 for temperature and 1 for the remaining print time of my 3d printer.

i used this code for them. i just copied over the temperature code for the printer. and it works. but it shows it in min. and i want it to show it in hours and minutes.

    - name: Temperature
      entities:
        - sensor.lumi_lumi_weather_temperature
      state_action:
        - service: floorplan.text_set
          service_data: >-
            ${(entity.state !== undefined) ? Math.round(entity.state * 10) / 10
            + "C°" : "unknown"}
    - name: printertime
      entities:
        - sensor.p1s_01p00a3a3000367_remaining_time
      state_action:
        - service: floorplan.text_set
          service_data: >-
            ${(entity.state !== undefined) ? Math.round(entity.state * 10) / 10
            + "min" : "unknown"}

i used the template service in home assistant to test a template to convert the time in min to time in hours and min. and to make it disappear when it hits 0

{% set minutes = states('sensor.p1s_01p00a3a3000367_remaining_time') | int %}
{% set hours = minutes // 60 %}
{% set remaining_minutes = minutes % 60 %}
{% if hours == 0 and remaining_minutes == 0 %}
  Hidden
{% else %}
  {{ '%02d' | format(hours) }} hours {{ '%02d' | format(remaining_minutes) }} minutes
{% endif %}

this also works but when i add that to my floorplan yaml it doenst.

what did i do wrong

It’s because your template is written in Jinja but the floorplan code requires JavaScript. So take your proof of concept template and rewrite it in JavaScript and you will be good.

got it to work. thanks.


i dont like how my rgb light bulb lightens the whole floor. how can i change this?

      state_action:
        action: call-service
        service: floorplan.style_set
        service_data:
          element: ${entity.entity_id.replace('light.', 'light_overlay.')}
          style: |
            >
            if( entity.state !== "on" )
                return "display: none;";
            let hue = 0;
            let sat = 0;
            if( entity.attributes.hs_color )
            {
                hue = entity.attributes.hs_color[0];
                sat = entity.attributes.hs_color[1];
            }
            if( sat < 10 )
            {
              return `
                display: block;
                filter:
                  brightness(calc( ${entity.attributes.brightness} / 255));`
            }
            return `
              display: block;
              filter:
                sepia(100%)
                hue-rotate(calc( ${hue}deg - 55deg ))
                saturate(calc( ${sat}% * 2 ))
                brightness(calc( ${entity.attributes.brightness} / 255));

It will be because of the entity or element you are targeting but you haven’t shown your yaml above the state action key.


  - entities:
            - light.study
            - light.desk1
            - light.desk2
            - light.bathroom
            - light.toilet
            - light.slaapkamer
            - light.gang
            - light.woonkamer_2
            - light.bank
            - light.keuken
            - light.tafel
            - light.krabpaal
            - light.upper
            - light.upperbedroom
            - light.laundry
          tap_action:
            action: toggle
          state_action:
            action: call-service
            service: floorplan.style_set
            service_data:
              element: ${entity.entity_id.replace('light.', 'light_overlay.')}
              style: |
                >
                if( entity.state !== "on" )
                    return "display: none;";
                let hue = 0;
                let sat = 0;
                if( entity.attributes.hs_color )
                {
                    hue = entity.attributes.hs_color[0];
                    sat = entity.attributes.hs_color[1];
                }
                if( sat < 10 )
                {
                  return `
                    display: block;
                    filter:
                      brightness(calc( ${entity.attributes.brightness} / 255));`
                }
                return `
                  display: block;
                  filter:
                    sepia(100%)
                    hue-rotate(calc( ${hue}deg - 55deg ))
                    saturate(calc( ${sat}% * 2 ))
                    brightness(calc( ${entity.attributes.brightness} / 255));
                `

You will need to look at the light.overlay_ elements you have in your SVG. They should only be the size of each room.