views:
  - type: sections
    sections:
      - type: grid
        cards:
          - type: heading
            icon: mdi:alarm
            heading: Alarm
            heading_style: title
          - type: tile
            name: Enable alarms
            entity: input_boolean.alarm_on
            features:
              - type: toggle
            grid_options:
              columns: 6
              rows: 2
          - type: tile
            name: Turn on alarm
            entity: input_boolean.alarm_ringing
            features:
              - type: toggle
          - type: heading
            icon: mdi:alarm-note
            heading_style: title
            heading: MIDI Alarm sound
          - type: custom:stack-in-card
            mode: vertical
            card_mod:
              style: |
                ha-card {
                  overflow: visible !important;
                }
                #root {
                  overflow: visible !important;
                }
            cards:
              - type: markdown
                content: |
                  **Select MIDI file for alarm**
                card_mod:
                  style: |
                    ha-card {
                      border: none;
                      box-shadow: none;
                      padding: 8px 16px 0;
                    }
              - type: custom:custom-features-card
                card_mod:
                  style: |
                    ha-card {
                      overflow: visible !important;
                      border: none;
                      box-shadow: none;
                    }
                features:
                  - type: custom:service-call
                    entries:
                      - type: dropdown
                        entity_id: media_player.midi_player_tux_universe_esp32_wroom_1
                        icon: mdi:music
                        label: Alarm MIDI
                        option_type: attribute
                        option_entity: media_player.midi_player_tux_universe_esp32_wroom_1
                        options_attribute: source_list
                        option_attribute: source_list
                        value_attribute: source
                        option_template:
                          label: '{{ option | safe }}'
                          tap_action:
                            action: perform-action
                            perform_action: media_player.select_source
                            target:
                              entity_id: media_player.midi_player_tux_universe_esp32_wroom_1
                            data:
                              source: '{{ option | safe }}'
          - type: custom:stack-in-card
            mode: vertical
            card_mod:
              style: |
                ha-card {
                  overflow: visible !important;
                }
                #root {
                  overflow: visible !important;
                }
            cards:
              - type: markdown
                content: |
                  **Select Buzzer for alarm**
                card_mod:
                  style: |
                    ha-card {
                      border: none;
                      box-shadow: none;
                      padding: 8px 16px 0;
                    }
              - type: custom:custom-features-card
                card_mod:
                  style: |
                    ha-card {
                      overflow: visible !important;
                      border: none;
                      box-shadow: none;
                    }
                features:
                  - type: custom:service-call
                    entries:
                      - type: dropdown
                        entity_id: media_player.midi_player_tux_universe_esp32_wroom_1
                        icon: mdi:volume-high
                        label: Alarm Buzzer
                        option_type: attribute
                        option_entity: media_player.midi_player_tux_universe_esp32_wroom_1
                        options_attribute: sound_mode_list
                        option_attribute: sound_mode_list
                        value_attribute: sound_mode
                        option_template:
                          label: '{{ option | safe }}'
                          tap_action:
                            action: perform-action
                            perform_action: media_player.select_sound_mode
                            target:
                              entity_id: media_player.midi_player_tux_universe_esp32_wroom_1
                            data:
                              sound_mode: '{{ option | safe }}'
      - type: grid
        cards:
          - type: heading
            heading: OSIRIS sync
            heading_style: title
            icon: mdi:calendar-account
          - type: horizontal-stack
            cards:
              - type: button
                name: Sync with OSIRIS
                icon: mdi:sync
                tap_action:
                  action: call-service
                  service: script.osiris_update_week
                show_state: false
              - type: button
                name: FORCE Sync with OSIRIS
                icon: mdi:sync-alert
                tap_action:
                  action: call-service
                  service: script.osiris_force_update_week
                show_state: false
          - type: markdown
            content: >
              Adjust the times for each weekday using the time pickers.


              The schedule automatically syncs with your OSIRIS timetable every
              day at **05:00**. By default, each time is set to **1 hour and 30
              minutes before the first event of that day**.


              Manual edits remain active for the current week and are not
              overwritten by the regular sync.


              **Sync with OSIRIS** updates the schedule while keeping manual
              edits.

              **FORCE Sync with OSIRIS** overwrites all manual edits and fully
              refreshes the schedule.
          - type: heading
            heading: Manual edit
            heading_style: title
            icon: mdi:pencil
          - type: grid
            columns: 2
            square: false
            cards:
              - type: custom:time-picker-card
                entity: input_datetime.osiris_maandag
                name: Monday
                hour_mode: 24
                minute_step: 5
                hide:
                  seconds: true
                layout:
                  hour_mode: single
                  align_controls: center
                  name: outside
                card_mod:
                  style:
                    .time-picker-row:
                      time-unit:
                        $: |
                          .time-input {
                            transform: scale(0.8);
                            margin: -4px !important;
                          }
                    .name:
                      $: |
                        background: none !important;
              - type: custom:time-picker-card
                entity: input_datetime.osiris_dinsdag
                name: Tuesday
                hour_mode: 24
                minute_step: 5
                hide:
                  seconds: true
                layout:
                  hour_mode: single
                  align_controls: center
                  name: outside
                card_mod:
                  style:
                    .time-picker-row:
                      time-unit:
                        $: |
                          .time-input {
                            transform: scale(0.8);
                            margin: -4px !important;
                          }
                    .name:
                      $: |
                        background: none !important;
              - type: custom:time-picker-card
                entity: input_datetime.osiris_woensdag
                name: Wednesday
                hour_mode: 24
                minute_step: 5
                hide:
                  seconds: true
                layout:
                  hour_mode: single
                  align_controls: center
                  name: outside
                card_mod:
                  style:
                    .time-picker-row:
                      time-unit:
                        $: |
                          .time-input {
                            transform: scale(0.8);
                            margin: -4px !important;
                          }
                    .name:
                      $: |
                        background: none !important;
              - type: custom:time-picker-card
                entity: input_datetime.osiris_donderdag
                name: Thursday
                hour_mode: 24
                minute_step: 5
                hide:
                  seconds: true
                layout:
                  hour_mode: single
                  align_controls: center
                  name: outside
                card_mod:
                  style:
                    .time-picker-row:
                      time-unit:
                        $: |
                          .time-input {
                            transform: scale(0.8);
                            margin: -4px !important;
                          }
                    .name:
                      $: |
                        background: none !important;
              - type: custom:time-picker-card
                entity: input_datetime.osiris_vrijdag
                name: Friday
                hour_mode: 24
                minute_step: 5
                hide:
                  seconds: true
                layout:
                  hour_mode: single
                  align_controls: center
                  name: outside
                card_mod:
                  style:
                    .time-picker-row:
                      time-unit:
                        $: |
                          .time-input {
                            transform: scale(0.8);
                            margin: -4px !important;
                          }
                    .name:
                      $: |
                        background: none !important;