Home-AssistantConfig/www/custom_ui/floorplan/clock_config.yaml

page_id: clock_config
image: /local/custom_ui/floorplan/clock_config.svg
stylesheet: /local/custom_ui/floorplan/clock.css

variables:
  - name: floorplan.hours
  - name: floorplan.minutes

defaults:
  hover_over: false
  more_info: false

startup:
  action:
    - service: floorplan.variable_set
      data:
        variable: floorplan.hours
        value_template: '${parseInt(entities["sensor.clock_stacey_alarm_time"].state.slice(0, 2)) ? parseInt(entities["sensor.clock_stacey_alarm_time"].state.slice(0, 2)): "00"}'
    - service: floorplan.variable_set
      data:
        variable: floorplan.minutes
        value_template: '${parseInt(entities["sensor.clock_stacey_alarm_time"].state.slice(3, 5)) ? parseInt(entities["sensor.clock_stacey_alarm_time"].state.slice(3, 5)): "00"}'

rules:

  - element: floorplan.clock_button
    action:
      service: floorplan.page_navigate
      data:
        page_id: clock

  - entity: sensor.clock_stacey_alarm_time
    text_template: '${entity.state ? entity.state.slice(0, 5) : "00:00"}'

  - entities:
    -  floorplan.hours
    -  floorplan.minutes
    text_template: '${("0" + entity.state).slice(-2)}'

  - entity: floorplan.hours
    element: input_number.alarm_time_hours_up
    action:
      service: floorplan.variable_set
      data:
        variable: floorplan.hours
        value_template: '${(parseInt(entity.state) + 1) % 24}'

  - entity: floorplan.hours
    element: input_number.alarm_time_hours_down
    action:
      service: floorplan.variable_set
      data:
        variable: floorplan.hours
        value_template: '${((parseInt(entity.state) - 1) + 24) % 24}'

  - entity: floorplan.minutes
    element: input_number.alarm_time_minutes_up
    action:
      service: floorplan.variable_set
      data:
        variable: floorplan.minutes
        value_template: '${((parseInt(entity.state / 5) * 5) + 5) % 60}'

  - entity: floorplan.minutes
    element: input_number.alarm_time_minutes_down
    action:
      service: floorplan.variable_set
      data:
        variable: floorplan.minutes
        value_template: '${(((parseInt(entity.state / 5) * 5) - 5) + 60) % 60}'

  - element: floorplan.save_alarm_time_button
    action:
      service: mqtt.publish
      data_template: '{
        "payload": "${(("0" + (parseInt((entities[`floorplan.hours`].state).slice(-2)) + 24) % 24)).slice(-2)}:${("0" + (((parseInt(entities[`floorplan.minutes`].state) / 5) * 5) % 60)).slice(-2)}",
        "topic": "clock/stacey_alarm_time",
        "retain": true
      }'

  - entity: input_boolean.clock_snooze
    image_template: '/local/custom_ui/floorplan/buttons/${(entity.state === "on") ? "snooze_on" : "snooze"}.svg'
    action:
      service: homeassistant.toggle

  - entity: input_boolean.school_mode
    image_template: '/local/custom_ui/floorplan/buttons/${(entity.state === "on") ? "school_on" : "school_off"}.svg'
    action:
      service: homeassistant.toggle

  - entity: media_player.alarm_clock
    image_template: '/local/custom_ui/floorplan/buttons/${(entity.state === "playing") ? "stop" : "radio_on"}.svg'
    action:
      service_template: '${(entity.state === "playing") ? "media_player.media_stop" : "media_player.play_media"}'
      data:
        media_content_id: http://listen.djcmedia.com:80/americascountryhigh
        media_content_type: audio/mp4

  - name: temp_darksky
    entities:
      - sensor.dark_sky_temperature
    text_template: '${entity.state ? Math.ceil(entity.state) + "°": "undefined"}'
    class_template: 'return "static-temp";'

  - name: text_states
    entities:
      - sensor.dark_sky_minutely_summary
    text_template: '${entity.state ? entity.state : "undefined"}'
    class_template: 'return "static-text";'

  - name: text_font_date
    entities:
      - sensor.clock_date
      - sensor.clock_day
    hover_over: false
    more_info: false
    text_template: '${entity.state ? entity.state : "undefined"}'
    class_template: 'return "static-text-date";'

  - name: text_font_time
    entities:
      - sensor.clock_time
    hover_over: false
    more_info: false
    text_template: '${entity.state ? entity.state : "undefined"}'
    class_template: 'return "static-text-time";'

  - name: Dark Sky Sensors
    entities:
      - entity: sensor.dark_sky_minutely_summary
        element: sensor.dark_sky_minutely_summary_icon

    image_template: '
      var imageName = "";

      switch (entity.attributes.entity_picture) {
        case "/static/images/darksky/weather-sunny.svg":
          imageName = "sunny-1";
          break;

        case "/static/images/darksky/weather-night.svg":
          imageName = "night-1";
          break;

        case "/static/images/darksky/weather-partlycloudy.svg":
          imageName = "partlycloudy-day-1";
          break;

        case "/static/images/darksky/weather-cloudy.svg":
          imageName = "partlycloudy-night-1";
          break;

        case "/static/images/darksky/weather-cloudy.svg":
          imageName = "cloudy-day-1";
          break;

        case "/static/images/darksky/weather-pouring.svg":
          imageName = "thunder";
          break;

        case "/static/images/darksky/weather-snowy.svg":
          imageName = "snowy-day-1";
          break;
      }

      return "/local/custom_ui/floorplan/images/weather/" + imageName + ".svg";
      '

  - name: Camera Images
    entities:
      - camera.stone_door
    image_template: '${entity.attributes.entity_picture}'