Clic on action

Hornet_49000 · Septembre 2, 2024, 7:39

Bonjour,

j’ai un custom:refreshable-picture-card qui affiche le dernier event de frigate ça ok ça fonctionne.
je voudrais simplement que quand je clique dessus ça m’ouvre un autre onglet.

j’ai regarder la doc mais ça ne fonctionne pas je sais pas ou je me plante ?
voici mon code.

  - type: custom:refreshable-picture-card
    noMargin: true
    refresh_interval: 30
    url: >-
      /api/hassio_ingress/JuWXRk3zeiNcpOeen8Q1YXFf5STFq5I8WS8wpmHLlzc/api/cam01/any/snapshot.jpg
    tap_action:
      action: navigate
      navigation_path: /dashboard-tablette/cam

Merci d’avance pour votre aide.
Cdlt.

selecus · Septembre 2, 2024, 9:34

quand tu cliques que se passe-t-il ?

Cloom · Septembre 2, 2024, 10:24

Hello,

C’est supporté par ta carte d’après la doc. Essaye peut-être avec autre chose que navigate comme donné dans l’exemple voir si ça fonctionne:

Après je peux te conseiller d’ouvrir la console javascript (CTRL+SHIFT+I sous Google Chrome et l’onglet Console) cliquer sur ta carte et voir si tu as une erreur.

Hornet_49000 · Septembre 4, 2024, 7:03

Merci pour vos réponses, en faite la carte apparait comme non cliquable.
quand on passe la souris dessus le curseur ne change pas :-/
comme si on affichait une simple image.
je regarde en mode console de google.

Pulpy-Luke · Septembre 4, 2024, 7:07

Salut,

Dans quelle autre carte est incluse ta carte en question ? Et dans quel ordre ?
C’est la carte au premier plan, qui intercepte le passage de souris

Hornet_49000 · Septembre 4, 2024, 7:16

je pense que je dirais qu’elle est en 2 ème position ? caméra en haut à droite ( en haut à gauche j’ai l’heure)
voici le code complet si ça peux t’aider ?

square: false
type: grid
columns: 2
cards:
  - type: picture-elements
    elements:
      - type: state-label
        entity: sensor.time
        style:
          top: 35%
          left: 50%
          font-size: 12vw
          color: white
      - type: state-label
        entity: sensor.date
        style:
          top: 75%
          left: 50%
          font-size: 6vw
          color: white
    image: /local/Image/fond_1280x720tr.png
  - type: custom:refreshable-picture-card
    refresh_interval: 30
    url: >-
      /api/hassio_ingress/JuWXRk3zeiNcpOeen8Q1YXFf5STFq5I8WS8wpmHLlzc/api/cam01/any/snapshot.jpg
    tap_action:
      action: navigate
      navigation_path: /dashboard-tablette/cam
    noMargin: true
  - type: horizontal-stack
    cards:
      - show_name: true
        show_icon: true
        type: button
        tap_action:
          action: toggle
        entity: input_boolean.vocal
      - show_name: true
        show_icon: true
        type: button
        tap_action:
          action: none
        name: Machine à laver
        show_state: false
        icon: mdi:washing-machine
        hold_action:
          action: none
        entity: input_boolean.machine_a_laver_retour_info_on_off
      - show_name: true
        show_icon: true
        type: button
        tap_action:
          action: none
        entity: binary_sensor.seche_linge_virtual
        icon: mdi:tumble-dryer
        hold_action:
          action: none
        name: Sèche linge
  - type: horizontal-stack
    cards:
      - type: custom:button-card
        entity: calendar.poubelle
        show_state: true
        show_name: true
        icon: mdi:delete
        state:
          - operator: template
            value: '[[[ return entity.attributes.message == ''Aucune Poubelle'' ]]]'
            color: white
          - operator: template
            value: '[[[ return entity.attributes.message == ''Poubelle Jaune'' ]]]'
            color: yellow
          - operator: template
            value: '[[[ return entity.attributes.message == ''Poubelle Verte'' ]]]'
            color: green
        state_display: '[[[ return states["calendar.poubelle"].attributes[''message'']]]]'
      - type: sensor
        entity: sensor.total_edf_jour
        graph: line
      - type: sensor
        entity: sensor.total_edf_jour
        graph: line

Pulpy-Luke · Septembre 4, 2024, 7:28

Dans cette sous-carte

C’est le 1er des ces éléments qui se place à arrière plan et ça empile les éléments dans l’ordre jusqu’au premier plan.
Dans ton cas, l’image est dans la partie type: grid, effectivement en 2ème mais rien ne se superpose dessus.

Donc l’autre piste à explorer c’est le lien à vérifier

Hornet_49000 · Septembre 4, 2024, 7:37

si je met ça, ça fonctionne mais ça m’ouvre un nouvelle onglet

type: custom:refreshable-picture-card
refresh_interval: 30
url: >-
  /api/hassio_ingress/JuWXRk3zeiNcpOeen8Q1YXFf5STFq5I8WS8wpmHLlzc/api/cam01/any/snapshot.jpg
tap_action:
  action: url
  url_path: /dashboard-tablette/cam
noMargin: true

WarC0zes · Septembre 4, 2024, 7:43

Salut,
avec l’action navigate et navigation_path pour le chemin, ça fonctionnera. L’action url est pour ouvrir une page web.

tap_action:
  action: navigate
  navigation_path: /dashboard-tablette/cam

tap_action:
  action: url
  url_path: https://......

Tu avais des exemples dans la doc sur le github

Hornet_49000 · Septembre 4, 2024, 7:59

oui je sais bien, et c’est bien ce que j’ai mis si tu regardes mon prémier poste j’ai bien mis

    tap_action:
      action: navigate
      navigation_path: /dashboard-tablette/cam

mais ça ne fonctionne pas , c’est pour ça que j’ai essayé avec action: url pour voir si ça, ça fonctionnait et ça fonctionne bien et l’url est donc bonne. en résumer:
action url fonctionne
action navigate ne fonctionne pas

WarC0zes · Septembre 4, 2024, 8:02

Voila le problème :

github.com/dimagoltsman/refreshable-picture-card

Doesn't navigate on click

opened 08:43PM - 18 Sep 23 UTC

robhercz

For some reason I am unable to get the refreshable picture card to navigate on c…lick. The card has loaded successfully and refreshes the picture according to the setting. While the "regular" picture card causes the cursor to change on mouseover to indicate that the card will respond to click (when set to "navigate" to another tab), this card does not. (same also on mobile devices, clicking/tapping does nothing) I have double checked and checked again that I have everything set correctly as per the instructions and examples. Is there something special I need to check or change to get "navigate" to work?

vu la date de la dernière release, je pense que c’est mort.

Il faut passer par une autre carte.

Hornet_49000 · Septembre 4, 2024, 8:07

ha oui c’est exactement le même problème que je rencontre… zut…
vous savez pas, par quoi je peux remplacer la custom:refreshable-picture-card ?
Existe t il une autre solution pour réaliser ça ?

WarC0zes · Septembre 4, 2024, 8:13

Tu pourrais passer par l’intégration :

Ça permet, à partir d’une image locale, d’en faire une caméra. Que tu intègres dans une carte et qui actualise l’image si elle change.

exemple, dans le configuration.yaml:

camera:
  - platform: local_file
    name: MF_alerte_today
    file_path: /config/www/weather/meteo_france_alerte_today.png

avec button-card:

type: custom:button-card
entity: camera.mf_alerte_today
name: Alerte Météo Aujourd'hui
show_icon: false
show_entity_picture: true
aspect_ratio: 1/1
size: 100%
styles:
  name:
    - font-size: 18px
tap_action:
  action: navigate
  navigate_path: /dashboard-tablette/cam

Hornet_49000 · Septembre 4, 2024, 8:55

ha top merci pour l’info je vais testé ça