Help Widget for delete persistence data

hello
i’m working on a widget for delete database data

I have some problems:

  • I would like the graphic to adapt to the start and end selection with an offset
    and for the start and end selection to be represented on the graph in this way Examples - Apache ECharts or Examples - Apache ECharts

  • I can’t use dayjs to compare the start and end to prevent validation if the start is after the end

thanks in advance

Screen4

uid: frs_persistence_list_items
tags:
  - list
  - persistence
props:
  parameters:
    - default: Delete data
      description: Header Title
      label: Title
      name: HeaderTitle
      required: false
      type: TEXT
      groupName: header
    - default: InfuxDB
      description: Header Subtitle
      label: Subtitle
      name: HeaderSubTitle
      required: false
      type: TEXT
      groupName: header
    - default: iconify:majesticons:analytics-delete-line
      description: Header Icon - Use oh:iconName (openHAB icon), f7:iconName
        (Framework7 icon), material:iconName (Material icon) or
        iconify:iconSet:iconName
      label: Icon
      name: HeaderIcon
      required: false
      type: TEXT
      groupName: header
    - default: Data to be deleted
      description: Data Title
      label: Data Title
      name: DataTitle
      required: false
      type: TEXT
      groupName: content
    - default: iconify:mdi:graph-box
      description: Data Icon - Use oh:iconName (openHAB icon), f7:iconName (Framework7
        icon), material:iconName (Material icon) or iconify:iconSet:iconName
      label: Data Icon
      name: DataIcon
      required: false
      type: TEXT
      groupName: content
    - default: Begin
      description: Begin Title
      label: Begin Title
      name: BeginTitle
      required: false
      type: TEXT
      groupName: content
    - default: iconify:tabler:brackets-contain-start
      description: Begin Icon - Use oh:iconName (openHAB icon), f7:iconName
        (Framework7 icon), material:iconName (Material icon) or
        iconify:iconSet:iconName
      label: Begin Icon
      name: BeginIcon
      required: false
      type: TEXT
      groupName: content
    - default: End
      description: End Title
      label: End Title
      name: EndTitle
      required: false
      type: TEXT
      groupName: content
    - default: iconify:tabler:brackets-contain-end
      description: End Icon - Use oh:iconName (openHAB icon), f7:iconName (Framework7
        icon), material:iconName (Material icon) or iconify:iconSet:iconName
      label: End Icon
      name: EndIcon
      required: false
      type: TEXT
      groupName: content
    - default: Delete
      description: Delete Title
      label: Delete Title
      name: DeleteTitle
      required: false
      type: TEXT
      groupName: content
    - default: Select data
      description: Popup Header Title
      label: Header Title
      name: PopupHeaderTitle
      required: false
      type: TEXT
      groupName: popup
    - default: Search
      description: Popup Search Title
      label: Search Title
      name: PopupSearchTitle
      required: false
      type: TEXT
      groupName: popup
    - default: Are you sure ?
      description: Action Title
      label: Action Title
      name: ActionTitle
      required: false
      type: TEXT
      groupName: action
    - default: This action cannot be cancelled
      description: Action SubTitle
      label: Action SubTitle
      name: ActionSubTitle
      required: false
      type: TEXT
      groupName: action
    - default: Missing information !
      description: Missing Title
      label: Missing Title
      name: MissingTitle
      required: false
      type: TEXT
      groupName: action
    - default: Yes
      description: Yes Title
      label: Yes Title
      name: YesTitle
      required: false
      type: TEXT
      groupName: action
    - default: Discard
      description: Discard Title
      label: Discard Title
      name: DiscardTitle
      required: false
      type: TEXT
      groupName: action
    - context: item
      default: Persistence
      description: Groupe persistence items
      label: Item
      name: Persistenceitem
      required: false
      type: TEXT
    - context: item
      default: Influx_ItemVirtuelDelete
      description: item trigger rule
      label: item
      name: vituelitem
      required: false
      type: TEXT
  parameterGroups:
    - name: header
      label: Header
    - name: content
      label: Content
    - name: popup
      label: Popup
    - name: action
      label: Action
timestamp: Nov 16, 2024, 1:26:55 PM
component: f7-list-item
config:
  accordionItem: true
  mediaList: true
  style:
    --f7-list-item-after-font-size: 16px
  subtitle: =props.HeaderSubTitle
  title: =props.HeaderTitle
slots:
  default:
    - component: f7-accordion-content
      slots:
        default:
          - component: f7-list
            config:
              mediaList: true
              style:
                background-color: "=themeOptions.dark === 'dark' ? 'rgb(35, 35, 35)' : 'rgb(247,
                  247, 247)'"
            slots:
              default:
                - component: oh-list-item
                  config:
                    class:
                      - margin-left
                    subtitle: =vars.Selection
                    icon: =props.DataIcon
                    title: =props.DataTitle
                  slots:
                    after:
                      - component: oh-link
                        config:
                          iconF7: plus_circle_fill
                          popupOpen: .popup.add-item-pop
                - component: oh-input-item
                  config:
                    icon: =props.BeginIcon
                    sendButton: true
                    title: =props.BeginTitle
                    type: datetime-local
                    variable: Debut
                    style:
                      --f7-typography-padding: 0px
                      margin-right: 3px
                  slots:
                    media:
                      - component: oh-icon
                        config:
                          color: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
                          icon: f7:timer
                - component: oh-input-item
                  config:
                    icon: =props.EndIcon
                    sendButton: true
                    title: =props.EndTitle
                    type: datetime-local
                    variable: Fin
                    style:
                      --f7-typography-padding: 0px
                      margin-right: 3px
                  slots:
                    media:
                      - component: oh-icon
                        config:
                          color: "=themeOptions.dark === 'dark' ? 'white' : 'black'"
                          icon: f7:timer
                - component: f7-block
                  config:
                    key: =Math.random() + items.Influx_UIRefresh.state
                    style:
                      margin: 0
                      padding: 0
                      --f7-menu-item-height: 30px
                  slots:
                    default:
                      - component: oh-chart
                        config:
                          chartType: day
                          options:
                            backgroundColor: "=themeOptions.dark === 'dark' ? 'rgb(35, 35, 35)' :
                              'rgb(247,247, 247)'"
                            color:
                              - red
                          height: 350px
                          stylesheet: |
                            .f7-icons {
                              font-size: 16px;
                            }
                        slots:
                          dataZoom:
                            - component: oh-chart-datazoom
                              config:
                                bottom: 18px
                                show: true
                                type: slider
                                xAxisIndex:
                                  - 0
                            - component: oh-chart-datazoom
                              config:
                                show: true
                                type: inside
                                xAxisIndex:
                                  - 0
                          grid:
                            - component: oh-chart-page
                              config:
                                containLabel: true
                                height: 66%
                                left: 20px
                                right: 20px
                                show: false
                                top: 60px
                          series:
                            - component: oh-time-series
                              config:
                                gridIndex: 0
                                item: =vars.Selection
                                name: =vars.Selection
                                smooth: false
                                type: line
                                xAxisIndex: 0
                                yAxisIndex: 0
                              slots:
                                markArea:
                                  - component: oh-mark-area
                                    config:
                                      item: =vars.Selection
                                      name: =vars.Selection
                          tooltip:
                            - component: oh-chart-tooltip
                              config:
                                confine: true
                                orient: vertical
                                show: true
                                smartFormatter: true
                                trigger: axis
                                axisPointer:
                                  type: cross
                                  label:
                                    backgroundColor: "#505765"
                          xAxis:
                            - component: oh-time-axis
                              config:
                                gridIndex: 0
                          yAxis:
                            - component: oh-value-axis
                              config:
                                gridIndex: 0
                - component: f7-block
                  config:
                    style:
                      display: flex
                      flex-direction: row
                      height: 50px
                      justify-content: center
                      background-color: "=themeOptions.dark === 'dark' ? 'rgb(25, 25, 25)' : 'rgb(250,
                        250, 250)'"
                  slots:
                    default:
                      - component: f7-link
                        config:
                          iconF7: trash_fill
                          iconSize: 28px
                          color: red
                          actionsOpen: "=(!!vars.Debut && !!vars.Fin && !!vars.Selection) ||
                            (dayjs(vars.Debut).isBefore(dayjs(vars.Fin))) ?
                            '.confirm-actions' : '.error-actions'"
                          style:
                            margin-right: 6px
                      - component: oh-link
                        config:
                          actionsOpen: "=(!!vars.Debut && !!vars.Fin && !!vars.Selection) ||
                            (dayjs(Debut).isBefore(dayjs(Fin))) ?
                            '.confirm-actions' : '.error-actions'"
                          text: =props.DeleteTitle
                          color: red
    - component: f7-actions
      config:
        class:
          - error-actions
        stylesheet: |
          .actions-button-text {
            white-space: wrap;
            flex-wrap: wrap
          }
      slots:
        default:
          - component: f7-actions-group
            slots:
              default:
                - component: f7-actions-label
                  config:
                    class:
                      - actions-button-text
                  slots:
                    default:
                      - component: oh-icon
                        config:
                          icon: f7:exclamationmark_octagon_fill
                          color: red
                          style:
                            fontSize: 30px
                      - component: Label
                        config:
                          class:
                            - actions-button-text
                          style:
                            font-size: 20px
                            font-weight: 600
                            color: "#ff3b30"
                          text: =props.MissingTitle
          - component: f7-actions-group
            slots:
              default:
                - component: f7-actions-button
                  config:
                    actionsClose: .error-actions
                    class:
                      - actions-button
                      - color-blue
                  slots:
                    default:
                      - component: Label
                        config:
                          class:
                            - actions-button-text
                          text: =props.DiscardTitle
    - component: f7-actions
      config:
        class:
          - confirm-actions
        stylesheet: |
          .actions-button-text {
            white-space: wrap;
            flex-wrap: wrap
          }
      slots:
        default:
          - component: f7-actions-group
            slots:
              default:
                - component: f7-actions-label
                  config:
                    class:
                      - actions-button-text
                  slots:
                    default:
                      - component: oh-icon
                        config:
                          icon: f7:question_circle_fill
                          color: red
                          style:
                            fontSize: 30px
                      - component: Label
                        config:
                          class:
                            - actions-button-text
                          style:
                            font-size: 20px
                            font-weight: 600
                            color: "#ff3b30"
                          text: =props.ActionTitle
                      - component: Label
                        config:
                          class:
                            - actions-button-text
                          style:
                            font-size: 16px
                            font-weight: 600
                            color: "#ff3b30"
                          text: =props.ActionSubTitle
                - component: oh-link
                  config:
                    action: command
                    actionCommand: =vars.Selection + ';' + vars.Debut + ';' + vars.Fin
                    actionItem: =props.vituelitem
                    actionsClose: .confirm-actions
                    class:
                      - actions-button
                      - color-blue
                    item: =props.vituelitem
                  slots:
                    default:
                      - component: Label
                        config:
                          class:
                            - actions-button-text
                          text: =props.YesTitle
          - component: f7-actions-group
            slots:
              default:
                - component: f7-actions-button
                  config:
                    actionsClose: .confirm-actions
                    class:
                      - actions-button
                      - color-blue
                  slots:
                    default:
                      - component: Label
                        config:
                          class:
                            - actions-button-text
                          text: =props.DiscardTitle
    - component: f7-popup
      config:
        animate: true
        backdrop: true
        class:
          - add-item-pop
        closeByBackdropClick: true
        push: true
        style:
          background: "=themeOptions.dark === 'dark' ? 'rgb(0, 0, 0)' : 'rgb(239, 239,
            244)'"
        stylesheet: |
          .page-content::-webkit-scrollbar {
            background-color:transparent;
            width:16px
          } .page-content::-webkit-scrollbar-track {
            background-color:transparent
          } .page-content::-webkit-scrollbar-track:hover {
            background-color:transparent
          } .page-content::-webkit-scrollbar-thumb {
            background-clip: content-box;
            background-color:#babac0;
            border-radius:16px;
            border:5px solid transparent
          } .page-content::-webkit-scrollbar-thumb:hover {
            background-clip: content-box;
            background-color:#a0a0a5;
            border:4px solid transparent
          } .page-content::-webkit-scrollbar-button {
            display:none}
          body {
            background-color:#000
          } .page-content {
            overflow-y: scroll
          } .overflow {
            min-height: 100vh
          }
        swipeToClose: to-bottom
      slots:
        default:
          - component: f7-navbar
            config:
              transparent: true
            slots:
              left:
                - component: Label
                  config:
                    style:
                      font-size: 16px
                      font-weight: 700
                      margin-left: 10px
                    text: =props.PopupHeaderTitle
              right:
                - component: f7-link
                  config:
                    color: gray
                    iconF7: xmark_circle_fill
                    iconSize: 28px
                    popupClose: .popup.add-item-pop
                    style:
                      margin-top: 5px
          - component: f7-page-content
            slots:
              default:
                - component: f7-col
                  config:
                    style:
                      background: transparent
                      margin-left: 0px
                      margin-right: 0px
                      margin-top: -66px
                      padding-bottom: 16px
                  slots:
                    default:
                      - component: f7-list
                        config:
                          class: elevation-1
                          inset: true
                          outline: false
                          style:
                            margin-left: 24px
                            margin-right: 16px
                            margin-bottom: 16px
                        slots:
                          default:
                            - component: f7-row
                              config:
                                style:
                                  align-items: center
                              slots:
                                default:
                                  - component: oh-icon
                                    config:
                                      color: gray
                                      icon: f7:search
                                      style:
                                        margin-left: 20px
                                  - component: oh-input
                                    config:
                                      clearButton: true
                                      outline: false
                                      placeholder: =props.PopupSearchTitle
                                      style:
                                        margin-left: 16px
                                        margin-right: 20px
                                        flex-grow: 10
                                      type: text
                                      variable: filterText
                      - component: f7-list
                        config:
                          class: elevation-2
                          inset: true
                          outline: false
                          mediaList: true
                          virtualList: true
                          style:
                            margin-left: 24px
                            margin-right: 16px
                            margin-top: 0px
                        slots:
                          default:
                            - component: oh-repeater
                              config:
                                fetchMetadata: semantics
                                filter: "(vars.filterText == 0 ) || (!!vars.filterText &&
                                  loop.ohItem.name.includes(vars.filterText)) ?
                                  true : false"
                                for: ohItem
                                fragment: true
                                groupItem: =props.Persistenceitem
                                sourceType: itemsInGroup
                              slots:
                                default:
                                  - component: oh-list-item
                                    config:
                                      action: variable
                                      actionVariable: Selection
                                      actionVariableValue: =loop.ohItem.name
                                      after: =loop.ohItem.label
                                      icon: =loop.ohItem.category
                                      popupClose: .popup.add-item-pop
                                      title: =loop.ohItem.metadata.semantics.config.isPointOf
  media:
    - component: oh-icon
      config:
        height: 30px
        icon: =props.HeaderIcon
        width: 30px

Group       Influx
String      Influx_ItemVirtuelDelete    (Influx)
DateTime    Influx_UIRefresh            (Influx)
configuration: {}
triggers:
  - id: "1"
    configuration:
      itemName: Influx_ItemVirtuelDelete
    type: core.ItemCommandTrigger
conditions: []
actions:
  - inputs: {}
    id: "3"
    configuration:
      blockSource: <xml
        xmlns="https://developers.google.com/blockly/xml"><variables><variable
        id="OpSC@Ti$Dwai7:!7K%I/">{listVariable}</variable></variables><block
        type="variables_set" id="D(~#Me?rr/]oy)rTS1B$" x="282" y="212"><field
        name="VAR" id="OpSC@Ti$Dwai7:!7K%I/">{listVariable}</field><value
        name="VALUE"><block type="lists_split"
        id="1(LDG!Mj`%Ubhubc-R:3"><mutation mode="SPLIT"></mutation><field
        name="MODE">SPLIT</field><value name="INPUT"><block
        type="oh_getitem_state" id="iuvdIY.9|nZis6Zg-O06"><value
        name="itemName"><shadow type="oh_item"
        id="hal6h2M44Wtx+QXfn3[h"><mutation itemName="MyItem"
        itemLabel="MyItem"></mutation><field
        name="itemName">MyItem</field></shadow><block type="oh_item"
        id="1y`=W4NPMZlbOJoQ7/5l"><mutation itemName="Influx_ItemVirtuelDelete"
        itemLabel="undefined"></mutation><field
        name="itemName">Influx_ItemVirtuelDelete</field></block></value></block></value><value
        name="DELIM"><shadow type="text" id="u4VVWarI:?lGF]PcUK5S"><field
        name="TEXT">,</field></shadow><block type="text"
        id="S:dKjf,v{`IH7]PvGN8D"><field
        name="TEXT">;</field></block></value></block></value><next><block
        type="oh_delete_persistedvalues" id="/(?lqSVhBCWD]n~9qqxM"><field
        name="methodName">removeAllStatesBetween</field><value
        name="itemName"><shadow type="oh_item"
        id="wzh-44Kp,1.o6z-)!unL"><mutation itemName="MyItem"
        itemLabel="MyItem"></mutation><field
        name="itemName">MyItem</field></shadow><block type="text_join"
        id="%m33i0;T9mrVWC74]k4g"><mutation items="1"></mutation><value
        name="ADD0"><block type="lists_getIndex"
        id="J|9Y]@73a^^UG34k5x8$"><mutation statement="false"
        at="true"></mutation><field name="MODE">GET</field><field
        name="WHERE">FROM_START</field><value name="VALUE"><block
        type="variables_get" id="%U0UaWx`It!(9Uc|5WQi"><field name="VAR"
        id="OpSC@Ti$Dwai7:!7K%I/">{listVariable}</field></block></value><value
        name="AT"><block type="math_number" id="6i]HuCAx^i1?b$SLvft+"><field
        name="NUM">1</field></block></value></block></value></block></value><value
        name="dayInfoSince"><shadow type="oh_zdt_plusminus"
        id="n)r;pId6?D5H[U%VV)^*"><field name="plusminus">minus</field><field
        name="period">Hours</field><value name="offset"><shadow
        type="math_number" id="(Tk:9I{jYw.~74mYK}F@"><field
        name="NUM">1</field></shadow></value></shadow><block
        type="oh_zdt_fromText" id="{8O_{7!#DY[kN-gt5=}x"><value
        name="day"><shadow type="text" id="zRV(uzQ8$6wm+dyf0BE9"><field
        name="TEXT">2024-11-07</field></shadow><block type="lists_getIndex"
        id="c+uX[fNL3{KP_Fw72N6;"><mutation statement="false"
        at="true"></mutation><field name="MODE">GET</field><field
        name="WHERE">FROM_START</field><value name="VALUE"><block
        type="variables_get" id="Tu/AdLWgJUSsWmH#f6@S"><field name="VAR"
        id="OpSC@Ti$Dwai7:!7K%I/">{listVariable}</field></block></value><value
        name="AT"><block type="math_number" id="hDpf^ACC$n(@T}M~qIip"><field
        name="NUM">2</field></block></value></block></value></block></value><value
        name="dayInfoUntil"><shadow type="oh_zdt_plusminus"
        id="l~9lE9TWIk~yBPL}6py!"><field name="plusminus">plus</field><field
        name="period">Hours</field><value name="offset"><shadow
        type="math_number" id="]QxiuR|XG~3S+_7X!JS)"><field
        name="NUM">1</field></shadow></value></shadow><block
        type="oh_zdt_fromText" id="djY*FImuk63~IK#4^66}"><value
        name="day"><shadow type="text" id="zRV(uzQ8$6wm+dyf0BE9"><field
        name="TEXT">2024-11-07</field></shadow><block type="lists_getIndex"
        id="Trra7`4$OHeUaEw]Jv9U"><mutation statement="false"
        at="true"></mutation><field name="MODE">GET</field><field
        name="WHERE">FROM_START</field><value name="VALUE"><block
        type="variables_get" id="66ZeswaatGqes[;~`fc0"><field name="VAR"
        id="OpSC@Ti$Dwai7:!7K%I/">{listVariable}</field></block></value><value
        name="AT"><block type="math_number" id="dkFYUGB}Y?HlxiY9FaSP"><field
        name="NUM">3</field></block></value></block></value></block></value><value
        name="persistenceName"><shadow type="oh_persistence_dropdown"
        id="?7/hs@NHR#2nHn+fbWzO"><field
        name="persistence">default</field></shadow><block
        type="oh_persistence_dropdown" id="ZL/!Z6S^U?mtiIYip08m"><field
        name="persistence">influxdb</field></block></value><next><block
        type="oh_event" id="l*TU_w#$wQO-%um.G2rs"><field
        name="eventType">postUpdate</field><value name="value"><shadow
        type="text" id=".o?]aQO_{1ttMv-}742p"><field
        name="TEXT">value</field></shadow><block type="text"
        id="|o{)3}SC![D%_b0l;@}s"><field
        name="TEXT">0</field></block></value><value name="itemName"><shadow
        type="oh_item" id="BkjxmHG#@GaIrf/2P2iU"><mutation itemName="MyItem"
        itemLabel="MyItem"></mutation><field
        name="itemName">MyItem</field></shadow><block type="oh_item"
        id="8eBMF,e*3k`uhmF8./_f"><mutation itemName="Influx_ItemVirtuelDelete"
        itemLabel="undefined"></mutation><field
        name="itemName">Influx_ItemVirtuelDelete</field></block></value><next><block
        type="oh_event" id="_k*1koJBfarH@h3oZsI%"><field
        name="eventType">sendCommand</field><value name="value"><shadow
        type="text" id="K|{4/+]e98J$_JNnwbmh"><field
        name="TEXT">value</field></shadow><block type="oh_zdt_plusminus"
        id="GiG]MhOV}g,}t:3^wkch"><field name="plusminus">plus</field><field
        name="period">Seconds</field><value name="offset"><shadow
        type="math_number" id="_Q{zO9jDb1eGXFzqNCJO"><field
        name="NUM">0</field></shadow></value></block></value><value
        name="itemName"><shadow type="oh_item"
        id="E%SyCN!ye1!%iWTr^|q#"><mutation itemName="MyItem"
        itemLabel="MyItem"></mutation><field
        name="itemName">MyItem</field></shadow><block type="oh_item"
        id=",BY9`_]$/qrv$P;Xeph4"><mutation itemName="Influx_UIRefresh"
        itemLabel="undefined"></mutation><field
        name="itemName">Influx_UIRefresh</field></block></value></block></next></block></next></block></next></block></xml>
      type: application/javascript
      script: >
        var _7BlistVariable_7D;



        _7BlistVariable_7D =
        items.getItem('Influx_ItemVirtuelDelete').state.split(';');

        items.getItem((String(_7BlistVariable_7D[0]))).persistence.removeAllStatesBetween(time.toZDT((_7BlistVariable_7D[1]))
        ,time.toZDT((_7BlistVariable_7D[2])), 'influxdb');

        items.getItem('Influx_ItemVirtuelDelete').postUpdate('0');

        items.getItem('Influx_UIRefresh').sendCommand(time.ZonedDateTime.now().plusSeconds(0));
    type: script.ScriptAction

Nice work on the widget!

I assume you mean this expression here:

actionsOpen: "=(!!vars.Debut && !!vars.Fin && !!vars.Selection) || (dayjs(vars.Debut).isBefore(dayjs(vars.Fin))) ? '.confirm-actions' : '.error-actions'"

dayjs(vars.Debut) is correct and should work (as should the Fin) version. The isBefore method is definitely supported in the widget expressions, so that’s not the problem here. However, looking at the full expression you’ve got I’m not sure I follow the logic of your test statement.

(!!vars.Debut && !!vars.Fin && !!vars.Selection)

That’s all good, that’s just testing for the existence of each of the variables. But why then do you follow that with OR (||) …isBefore? Once you have tested for the existence of the variables, presumably you want AND isBefore. As it’s written right now, the isBefore test never gets run because as soon as the first part of the OR expression returns true you skip over the second part because the OR is already true.

eCharts, as you have seen gives several ways of doing this. Most of them (for example, the markArea) will be pretty complicated through a widget because those have been speficially co-opted by the OH chart system and the user doesn’t have complete control over them.

You best bet may be the markLine object which you can add to your series fairly easily. For a read vertical line at your start time this is probably all you need:

  series:
    - component: oh-time-series
      config:
        ...other config
        markLine:
          data:
            - lineStyle:
                color: red
                type: solid
              xAxis: =vars.Debut
          animation: false
          symbol:
            - none
            - none

Nice work on the widget!

Thank you, it’s partly thanks to you and the help provided on the forum.
The many examples that helped me a lot to create this widget. :+1:

“presumably you want AND isBefore”

Great, works very well now

“You best bet may be the markLine object which you can add to your series fairly easily. For a read vertical line at your start time this is probably all you need”

Thanks

Is it possible to define the display of the graphic using the Begin and End variables ?

Have a nice day

I have never tried, but I do not think it is possible.

Thanks
Maybe a useful feature to add to the chart ? @florian-h05