[Présentation] F$B33

[arnlig3550]

Bon en fait ne trouvant pas la solution, j'ajoute à mon design, juste un texte correspondant à l'équipement pour chaque batterie, c'est le plus simple que j'ai trouvé pour contourner le problème.

Oki je n'ai pas la solution de mon côté non plus, du coup merci pour ton retour

De rien

[Sartog]

Salut

Je viens d'utiliser ce code pour mon widget batterie_led, mais j'ai un soucis avec la ligne <td>&nbsp;&nbsp;#name_display#</td>, celà m'affiche le nom de la commande qui est donc "Batterie" (comme sur tous les modules à batterie je pense), alors qu'il faudrait le nom de l'équipement !
Quel tag dois-je utiliser ? Je ne trouve pas

Merci à vous

2 possibilités :

1. tu modifie le code pour ajouter une balise (#NomAMoi# par exemple) que tu appel dans les "paramêtres optionnels" du widget en mettant dans le champ valeur l'affichage que tu souhaite.
2. tu utilise la nouvelle fonction d'affichage sous forme de tableau de l'équipement. Ainsi, tu pourra mettre l'intitulé de ton choix dans les colonnes / lignes

[arnlig3550]

Salut

Je viens d'utiliser ce code pour mon widget batterie_led, mais j'ai un soucis avec la ligne <td>&nbsp;&nbsp;#name_display#</td>, celà m'affiche le nom de la commande qui est donc "Batterie" (comme sur tous les modules à batterie je pense), alors qu'il faudrait le nom de l'équipement !
Quel tag dois-je utiliser ? Je ne trouve pas

Merci à vous

2 possibilités :

1. tu modifie le code pour ajouter une balise (#NomAMoi# par exemple) que tu appel dans les "paramêtres optionnels" du widget en mettant dans le champ valeur l'affichage que tu souhaite.
2. tu utilise la nouvelle fonction d'affichage sous forme de tableau de l'équipement. Ainsi, tu pourra mettre l'intitulé de ton choix dans les colonnes / lignes

Peux tu détailler ta 2ème solution stp ? Car je ne vois pas de quoi tu parles

Merci

[Sartog]

Quand tu as ouvert la page de configuration de ton équipement, tu clique (en haut) sur configuration avancée.
Dans la fenêtre qui va s’ouvrir tu clique sur Disposition et tu sélectionne Tableau à la place de Defaut.
Une fois fait, tu renseigne le nombre de ligne et colonne que tu souhaites, tu sauvegarde et ferme cette fenêtre.
Ensuite tu re-clique sur Configuration avancée, puis sur Disposition afin d’avoir un tableau dans lequel tu va pouvoir mettre les intitulés que tu souhaites et, via drag and drop, les commandes de ton équipement.

Si ce n’est pas très clair, je te fais des impressions écran demain.

[arnlig3550]

Quand tu as ouvert la page de configuration de ton équipement, tu clique (en haut) sur configuration avancée.
Dans la fenêtre qui va s’ouvrir tu clique sur Disposition et tu sélectionne Tableau à la place de Defaut.
Une fois fait, tu renseigne le nombre de ligne et colonne que tu souhaites, tu sauvegarde et ferme cette fenêtre.
Ensuite tu re-clique sur Configuration avancée, puis sur Disposition afin d’avoir un tableau dans lequel tu va pouvoir mettre les intitulés que tu souhaites et, via drag and drop, les commandes de ton équipement.

Si ce n’est pas très clair, je te fais des impressions écran demain.

Salut

Si c'est très clair merci ! Encore une fonction de Jeedom que je ne connaissais pas et bien sympathique
Pour ce que je voulais faire, je crois que je vais rester avec ma solution de texte car c'est qu'une commande qui était concernée, ta solution est bien pour disposer toutes les commandes d'un équipement

Merci de ton aide quand même, ça pourra me servir plus tard (et d'autres aussi peut-être)

[lithium73fr]

Hello,

J'ai utilisé le code html pour créer le menu, mais chez les icones sont alignées verticalement, comment faire pour passer en horizontal ?
Merci

[jonatd05]

Est-ce que tu n’utilises pas le fichier m_perso.css au lieu du fichier perso.css ?

[lithium73fr]

Est-ce que tu n’utilises pas le fichier m_perso.css au lieu du fichier perso.css ?

Non, par contre je ne suis pas sur d'avoir la dernière version des fichiers perso.css et menu.html, j'ai téléchargé le ZIP dans le premier post de F$B33.
Faut il utiliser les fichiers du github de tonnerre33 ? https://github.com/tonnerre33/jeedom_FB33_responsive

[jonatd05]

Pour le moment j’utilise toujours ceux de F$B33.
Ceux de tonnerre33 sont fait pour un affichage responsive.

[lithium73fr]

Pour le moment j’utilise toujours ceux de F$B33.
Ceux de tonnerre33 sont fait pour un affichage responsive.

OK. Pourrais tu me donner le lien du github de F$B33 ?

[jonatd05]

Essaie d’utiliser les liens de cette page : viewtopic.php?f=50&t=14863&start=60

C’est ce que j’ai utilisé pour mon design.

[BertrandP]

Bonjour,

Superbe travail, et surtout c''est facile d'avoir quelque chose de propre.

2 questions :
- Comment mettre un équipement 'résumé' dans la barre de menu, avant l'heure ?
- Est-ce possible d'avoir 2 cadre d'un au dessus de l'autre dans une colonne. J'ai fait un essais, mais 1) les cadres se touche, et 2° l'objet se répéte au lieux de prendre le nouveau (2 x '72' dans mon exemple au loei de '72' puis '80')

Code : Tout sélectionner

<div class="row">
   <div class="col-xs-12 col-sm-4 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">T° et Hydro INTERIEUR</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="69" ></div>
      </div>
   </div>
   <div class="col-xs-12 col-sm-5 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal">
         <!-- Imagette  -->
<!--         <div class="cadre_imagette"><img src="montheme/images/icon_camera.png" height=30px width=30px></div>
         <!-- TITRE -->
<!--         <div align=center class="cadre_titre">ARROSAGE</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="56" ></div>
      </div>
   </div>
   <div class="col-xs-12 col-sm-3 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">T° et Hydro EXTERIEUR</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="72" ></div>
      </div>
      <div  class="cadre_principal">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">Météo Concarneau</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="80" ></div>
      </div>
   </div>
</div>

Merci

[arnlig3550]

Bonjour,

Superbe travail, et surtout c''est facile d'avoir quelque chose de propre.

2 questions :
- Comment mettre un équipement 'résumé' dans la barre de menu, avant l'heure ?
- Est-ce possible d'avoir 2 cadre d'un au dessus de l'autre dans une colonne. J'ai fait un essais, mais 1) les cadres se touche, et 2° l'objet se répéte au lieux de prendre le nouveau (2 x '72' dans mon exemple au loei de '72' puis '80')

Code : Tout sélectionner

<div class="row">
   <div class="col-xs-12 col-sm-4 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">T° et Hydro INTERIEUR</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="69" ></div>
      </div>
   </div>
   <div class="col-xs-12 col-sm-5 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal">
         <!-- Imagette  -->
<!--         <div class="cadre_imagette"><img src="montheme/images/icon_camera.png" height=30px width=30px></div>
         <!-- TITRE -->
<!--         <div align=center class="cadre_titre">ARROSAGE</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="56" ></div>
      </div>
   </div>
   <div class="col-xs-12 col-sm-3 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">T° et Hydro EXTERIEUR</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="72" ></div>
      </div>
      <div  class="cadre_principal">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">Météo Concarneau</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="80" ></div>
      </div>
   </div>
</div>

Merci

Salut

Je vais essayer de répondre à ta 1ère question
Je crois que c'est juste un clic droit sur ton design (en mode édition) puis "insérer un résumé"

[BertrandP]

Je vais essayer de répondre à ta 1ère question
Je crois que c'est juste un clic droit sur ton design (en mode édition) puis "insérer un résumé"

J'arrive bien a insérer un résumer, mais comment le mettre dans la barre de menu ?

Code : Tout sélectionner

<LINK href='http://fonts.googleapis.com/css?family=Ubuntu:300,400' rel='stylesheet' type='text/css' />
<LINK href="montheme/clock.css?2017102201" rel="stylesheet" type="text/css">
<script type="text/javascript" src="montheme/clock.js?2017102201"></script>


<LINK href="montheme/perso.css?2017102201" rel="stylesheet" type="text/css">
<script type="text/javascript" src="montheme/scripts.js?2017102201"></script>

<div class="menu_top center" id="menu">
   <div class="col-xs-1  " style="	height: 1%; padding: 0.5% 0px 0.5% 0px;"><img class="img-responsive" src="montheme/images/logo.png" ></div>
   <div class="col-xs-1 monmenu selected" >
      <a onClick="planHeader_id=2; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_home.png">  </a>
   </div>
   <div class="col-xs-1 monmenu" >
      <a onClick="planHeader_id=3; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_DVD.png"> </a>
   </div>
   <div class="col-xs-1 monmenu" >
      <a onClick="planHeader_id=4; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_volets.png">  </a>
   </div>
   <div class="col-xs-1 monmenu" >
      <a onClick="planHeader_id=6; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_chauffage.png">  </a>
   </div>
   <div class="col-xs-1 monmenu" >
      <a onClick="planHeader_id=7; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_camera.png">  </a>
   </div>
   <div class="col-xs-1 monmenu" >
      <a onClick="planHeader_id=8; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_energy.png">  </a>
   </div>
   <div class="col-xs-1 monmenu" >
      <a onClick="planHeader_id=9; displayPlan();"><img class="img-responsive" src="montheme/images/icon_menu_reseau.png">  </a>
   </div>
   <div class="col-xs-2 hidden-xs" >

Il faut mettre quoi ici ?

Code : Tout sélectionner

   </div>
   <div class="col-xs-2 hidden-xs" >
      <div class="clock" id="clock">
         <div class="date"></div>
         <div class="time"></div>
      </div>
   </div>
</div>

[arnlig3550]

Salut

Là désolé je sais pas, je laisse les plus expérimentés te répondre car je ne me suis pas encore servi du résumé.

[domoggvad]

Bonjour
tu ouvre ton outils-> objet choisir un objet et onglet résumé.

[BertrandP]

Bonjour
tu ouvre ton outils-> objet choisir un objet et onglet résumé.

Comme je l'ai déja dit, J'arrive bien a insérer un résumé, mais comment le mettre dans la barre de menu ?

[Sartog]

Bonjour
tu ouvre ton outils-> objet choisir un objet et onglet résumé.

Comme je l'ai déja dit, J'arrive bien a insérer un résumé, mais comment le mettre dans la barre de menu ?

Dans les paramètres d'affichage de ton résumé, tu le place à une profondeur supérieure à celle de ton menu puis tu le déplace au-dessus de l'emplacement que tu souhaite.

[tonnerre33]

Bonjour,

Superbe travail, et surtout c''est facile d'avoir quelque chose de propre.

2 questions :
- Comment mettre un équipement 'résumé' dans la barre de menu, avant l'heure ?
- Est-ce possible d'avoir 2 cadre d'un au dessus de l'autre dans une colonne. J'ai fait un essais, mais 1) les cadres se touche, et 2° l'objet se répéte au lieux de prendre le nouveau (2 x '72' dans mon exemple au loei de '72' puis '80')


Merci

Je regarde ca ce soir
j'ai compris tes problèmes même si j'ai dû relire plusieurs fois le dernier point

[tonnerre33]

Re,

pour le premier point modifie le contenu menu avec cette fin :

Ancien code à remplacer :

Code : Tout sélectionner

 
 <div class="col-xs-2 hidden-xs" >
   </div>
   <div class="col-xs-2 hidden-xs" >
      <div class="clock" id="clock">
         <div class="date"></div>
         <div class="time"></div>
      </div>
   </div>

Nouveau code :

Code : Tout sélectionner

	<div class="col-xs-2 hidden-xs">
		<!-- Intégration d'un résumé -->
		<div data-plan-list_id="92">
			<!-- image pour centrage vertical, peut être supprimée si pas de centrage -->
			<img class="img-responsive" src="montheme/img/icon_blank.png" style="max-height: 25px;">
		</div>
	</div>
    <div class="col-xs-2 hidden-xs">
        <div class="clock" id="clock">
            <div class="date"></div>
            <div class="time"></div>
        </div>
    </div>
    

Par défaut j'ai mis une image pour forcer le centrage vertical automatiquement vu que les images sont responsives mais si tu as un résumé sur plusieurs lignes il te suffit de la supprimer

Remplace le data-plan-list_id="92" par ton numéro de résumé mais ça j'ai bien vu que tu as compris le fonctionnement.

Par contre pour permettre l'intégration de widgets dans le menu j'ai dû modifier le fichier javascript, du coup il faut que tu remplaces le contenu de ton fichier script.js par le contenu du theme.js téléchargeable ici :
https://github.com/tonnerre33/jeedom_FB ... s/theme.js

Penses également à incrémenter la version du fichier js pour forcer le rafraichissement du cache

Code : Tout sélectionner

<script type="text/javascript" src="montheme/scripts.js?2017102201"></script>

à remplacer par

Code : Tout sélectionner

<script type="text/javascript" src="montheme/scripts.js?2017111401"></script>

Pour le deuxième point, je pense que le problème de doublon du 72 est résolu par contre je n'ai pas eu le temps de tester ni de regarder les cadres qui se touchent j'essaye demain soir.

Edit : pour le problème des cadres qui se touchent sur le deuxième cadre_principal ajoutes

Code : Tout sélectionner

style="margin-top:1%"

Exemple :

Code : Tout sélectionner

 
  <div class="col-xs-12 col-sm-3 cadre_marges">
      <!-- PRINCIPALE -->
      <div  class="cadre_principal " >
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">T° et Hydro EXTERIEUR</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="72" ></div>
      </div>
      <div  class="cadre_principal " style="margin-top:1%">
         <!-- Imagette  -->
         <div class="cadre_imagette"><img src="montheme/images/icon_mini_temp.png" height=30px width=30px></div>
         <!-- TITRE -->
         <div align=center class="cadre_titre">Météo Concarneau</div>
         <!-- CONTENU -->
         <div  class="cadre_contenu" data-plan-list_id="80" ></div>
      </div>
   </div>