Bonjour
J’utilise le widget de la V3 choix des heures pour la programmation jour par jour de mes volets roulants.
le code est le suivant :
<div class="cmd cmd-widget reportModeHidden" data-type="action" data-subtype="message" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#" style="width: 90px;">
<input type="time" class="form-control input-sm message" style="width: 90px;height: 30px;" data-cmd_uid="#uid#" data-cmd_id="#id#" step="60" value="#state#">
<center><a class='btn btn-success btn-xs execute cmdName'>#valueName#</a></center>
<script>
$('.cmd[data-cmd_uid=#uid#]:last .execute').on('click', function() {
jeedom.cmd.execute({id: '#id#', value: {message: $('.cmd[data-cmd_uid=#uid#] .message').value()}});
});
</script>
</div>
Sur ce code je chercher à faire de la mise en forme des cases où il y a les heures, les jours pour tenter de faire quelques choses d’uniforme avec les angles arrondis par exemple.
J’a bien des width et autres éléments de ce types mais quand je change les valeurs de px rien ne bouge.
Comme je ne connaix pas grand chpse à la structure du code dans les balises pouvez vous me dire où mettre mes informations de mise en forme pour les heures et pour les jours ?
En vous remerciant par avance
bonjour en v3 selon ton thèmes
les balises class/id permetant de modifier un input peuvent être diffèrent
essai ça
<div class="tooltips cmd cmd-widget" data-type="action" data-subtype="slider" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" style="min-width:100px;">
<span class="cmdName" style="font-weight: bold;font-size : 12px;#hideCmdName#">#name_display#</span><br/>
<div class="input-group" style="width: 75px;">
<input style="height: 33px;border-radius: 5px;font-size : 16px;font-weight: Bold;background-color:#e4e2c2;" class="form-control input-sm value execute" type="time" placeholder="#title_placeholder#" value="#state#" data-cmd_id="#id#">
<style>
/* Firefox */
input[data-cmd_id="#id#"] {
-moz-appearance: textfield;
}
/* Chrome */
input[data-cmd_id="#id#"]::-webkit-inner-spin-button,
input[data-cmd_id="#id#"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin:0;
}
/* Opéra*/
input[data-cmd_id="#id#"]::-o-inner-spin-button,
input[data-cmd_id="#id#"]::-o-outer-spin-button {
-o-appearance: none;
margin:0
}
</style>
</div>
<script>
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
$('.cmd[data-cmd_uid=#uid#] .execute').on("change", function () {
jeedom.cmd.execute({id:'#id#', value: {slider: $('.cmd[data-cmd_uid=#uid#] .value').val().replace("#unite#", "").replace(" ", "")}});
});
} else {
$('.cmd[data-cmd_uid=#uid#]:last .execute').keypress(function( event ) {
if(event.which == 13) {
jeedom.cmd.execute({id:'#id#', value: {slider: $('.cmd[data-cmd_uid=#uid#] .value').val().replace("#unite#", "").replace(" ", "")}});
}});
}
</script>
</div>
pour v4 que tu peux aussi essayé
intègre l’actu
Ok je teste tout ça demain
Merci des infos
Bonjour
Alors je viens de faire un test rapide sur ce point.
Quand je colle le code directement sur mon widget actuel cela me donne un visuel top mais sans pouvoir valider la saisie ou alors je n’ai pas trouvé le moyen de le faire.
Précédemment en cliquant sur le jour cela validait la saisie, là je ne sais pas.
Concernant, la contribution GitHub proposée il faut modifier de manière importante ce que j’ai déjà donc il faut que je fasse un test plus important en // sans bouger la production de mon Jeedom.
Je reviendrais sur cette 2nd phase de test
j’arrive bien à mettre en place l’heure comme sur l’exemple mais la valeur ne reste pas non plus !
Je voudrais garder l’heure à la manière d’un programmateur
touche Entrée
essai sur portable tel/tab tu comprendras, c’était une demande sir l’ancien forum de pouvoir validé sans devoir clic ici ou là
https://forum.jeedom.com/viewtopic.php?t=32321
j’ai pas compris,
puisque tu as une petite vidéo démonstrative sur une v4
je n’ai pas essayé le code du widget v4 sur une v3
je le ferais puisque j’ai fais ça pour une futur et lointaine mise à jour de jeedom.
Je veux pouvoir garder les infos comme ceci pour tous mes volets
tu as tous pour faire ta sauce
regarde le lien de l’ancien forum
tu as quelques exemples de mise en place
j’avais au début mis un icône pour validation
Je vais essayer de faire ma sauce.
Mais comme je le disais au début je ne suis pas développeur et je suis jeune sur le codage.
Je vais tenter de comprendre comment c’est structuré déjà partie mise en forme partie action etc…
Bonjour
Alors j’ai besoin d’aide plus profonde si cela est possible ?
Est-il possible d’avoir du commentaire sur chaque ligne ou élément du code afin que je puisse comprendre à quoi servent les lignes et autre morceau de ce code ?
Sur mon virtuel de programmation de mes horaires l’action est de type « message »
Cette information est ensuite utilisée dans mes scénarios de gestion de mes volets.
Le fait de faire entrée ne semble pas valider mon horaire et en tout cas je ne la garde pas en visuel non plus pour l’avoir à l’écran comme confirmation de l’heure enregistrée.
Je me lance tout juste dans ce genre de projet désolé si cela vous parait béta comme demande
Bonjour
Alors dans ma quête d’amélioration de mon design et de mes widgets j’avance à petits pas mais voici le résultat :
J’aimerais maintenant pouvoir modifier le fond des box « horaire » et « Jour » mais quoi que je fasse rien ne change !!!
Ci joint le code que j’ai pour mon widget :
<div class="cmd cmd-widget reportModeHidden" data-type="action" data-subtype="message" data-cmd_id="#id#" data-cmd_uid="#uid#" data-version="#version#" data-eqLogic_id="#eqLogic_id#" style="width:80px;background: rgba(60,60,60,0.1);color:rgba(60,60,60,0.7);">
<input type="time" class="form-control input-sm message" style="width: 80px;height: 30px; background: rgba(60,60,60,0.1);" data-cmd_uid="#uid#" data-cmd_id="#id#" step="60" value="#state#">
<center><a class='btn btn-success btn-xs execute cmdName'style="width: 80px;height: 20px;background: rgba(60,60,60,0.1);color:rgba(60,60,60,0.7);">#valueName#</a> </center>
<script>
$('.cmd[data-cmd_uid=#uid#]:last .execute').on('click', function() {
jeedom.cmd.execute({id: '#id#', value: {message: $('.cmd[data-cmd_uid=#uid#] .message').value()}});
});
</script>
</div>
J’ai ensuite le même besoin pour modifier le fond des boutons de commande comme ci dessous :
ou pour mon widget de présence :
Merci de votre aide.
Je peux partagé encore d’autre élément pour vous faciliter l’aide
Je reprends le file de la discussion sur l’aide au code.
Pour une personne comme moi c’est à dire non informaticien de formation ou codeur (je ne sais pas comment il faut nommer ces compétences) mais plus bricoleur, de formation technique et un peu appétant sur les sujets traités ici par où faut-il démarrer pour tenter de coder des widgets simple et surtout pour comprendre les codes à la lecture.
Je ne trouve pas de sujet expliquant les class utilisées dans le code que j’ai posté au dessus par exemple.
Mon code est pour une action / message et vous me transmettez des infos sur une action / curseur donc pas simple pour un jeune padawan de trouver le chemin et en plus le bon…
A chaque question sur le code j’ai l’impression que l’on dérange du fait de notre faible niveau de compétence et donc nous n’arrivons pas nos fins et nous nous agaçons 
Je ne demande pas à monter en compétence pour refaire Jeedom, je souhaite juste prendre des bases pour avoir un peu d’autonomie dans la recopie de code, l’adaptation et la compression à la lecture. Cela permettrait de pouvoir agrémenter mon design entre autre.
Merci à la communauté de votre aide
Bonjour,
Si tu t’adresses à moi je te reponds
Oublie la âge, formation, diplôme ou métier ; BAC-2 +50ans
J’en sais un peu plus mais de la à former !
Et si j’en avait la compétence , au 1er chapitre tu partirai en courant, c’est x métier. Former, HTML. (bootstrap,highchart ou autres) ,CSS, script (java &/ou jquery) + api jeedom
Donc non tu déranges pas, c’est des livres ta question qui se soldera pour les moins téméraire par
J’ai rien compris,
C’est pas de mon niveau,
Trop compliqué.
Se que je sais (rien d’impossible non plus) je l’ai dit ici ou là.
Part sur du simple pour commencer info (binaire …)
Ensuite action default car les sliders par leur état & actions c’est 2 paliers de compréhensions.
3 codes différents liées aux input
Salut,
Ce que tu ne comprends pas c’est qu’il y a énormément de méthodologie à appréhender que même si quelqu’un prenait le temps de te former sur tes questions tu en auras encore plus derrière !
Comme le dis @ajja17orange il ne sert à rien de mettre les gens dans des cases car il y a tous les profils. La seule manière d’avancer c’est de commencer par le plus simple et d’avancer petit à petit
Alors aucune méprise je ne cible ou accuse absolument personne.
Juste je veux comprendre les codes le basic pour avoir au moins la sensation d’être pas perdu.
Domotech m’a bien aider sur le codage d’un bouton action pour le customiser à mon design. Je le remercie beaucoup pour ça.
Je n’arrive pas à changer la couleur du texte au passage de la souris mais c’est pas grave j’y arriverai un jour avant la fin du confinement j’espère 
Si je prends l’image d’un mur je cherche à le défaire en enlevant les briques une à une sans tout faire tomber mais pas où commencer !!!
Je suis de ceux qui apprenne beaucoup en regardant en assemblant des éléments de droites ou de gauches.
Si j’arrive à modifier des éléments c’est que j’ai compris tout ou partie de l’élément. Si j’arrive à l’adapter c’est pareil.
Voilà en gros la frustration que je peux avoir et la sensation que les demandes de novices peuvent vous agacer car vous vous éclater sur de superbes réalisation que je consomme aussi mais qui sont pour le moment en dehors de mon champ d’application.
Justement il faut voir plus loin que la frustration immédiate et savoir acquérir le savoir chaque chose en son temps.
Pour info y’a 2 ans en arrière je n’y connaissais strictement rien en code ! @ajja17orange fait justement parti de ceux qui m’ont aidé à avancer exactement de la manière dont il le fait ici avec toi: en me donnant les moyens et les informations pour comprendre et faire par moi-même.
Pour les widgets il faut au moins connaitre html/css et jquery est un gros +. Un conseil que je peux te donner c’est que si tu veux modifier des classes du core en CSS il faut ajouter !important à la fin de la propriété que tu souhaites modifier.
Un autre conseil : montes un Jeedom uniquement pour faire des expérimentations (de widget par exemple) et fais tes essais de codage dessus comme ça tu peux te permettre des erreurs
Je fais les tests sur mon jeedom de test qui me sert aussi à tester l’antenne Blea 
Ensuite je copie toujours le code de départ dans un autre fichier de test que je monte de version à chaque grosse étape pour mon niveau.
Je n’ai pas peur de me lancer sur les sujets c’est le temps qui peut manquer.
Mais en ce moment j’aide aussi mon fils sur arduino et du coup je vais voir pour faire un module ultrason pour mon récupérateur d’eau.
Je cherche à travailler par les exemples et en espérant démarrer pas les plus simples pour ne pas me dégoûter non plus.
Ensuite comme je l’ai dit je n’en veux pas du tout à @ajja17orange ni à personne d’autre d’ailleurs.
Désolé si cela c’est compris comme ça. C’est juste mon impression que mes questions peuvent être idioteS et du coup vous déranger : complexe du débutant peut être
<script>
$('.cmd[data-cmd_uid=#uid#]:last .execute').on('click', function() {
jeedom.cmd.execute({id: '#id#', value: {message: $('.cmd[data-cmd_uid=#uid#] .message').value()}});
});
</script>
$(‹ .cmd[data-cmd_uid=#uid#]:last .execute ›)
. = class ; # = id
donc .cmd = class de 1er ligne
data-cmd_uid=#uid# tu en a 2
1er et 2eme ligne
last donc le 2eme
et .execute
.on(‹ click ›, function() {
ON est une fonction jquery donc clic
https://api.jquery.com/on/
donc si tu clic sur <a> tu as définie en spécifiant se <a> de se widget
$(‹ .execute ›) ferai pareil mais si tu as un autre widget identique « comme ton screen » tu auras une execution sur tous tes <a>
ensuite si tu clic
jeedom.cmd.execute({id: ‹ #id# ›, value: {message: $(‹ .cmd[data-cmd_uid=#uid#] .message ›).value()}});
jeedom.cmd.execute = api jeedom (crée par jeedom)
2 choses a savoir
(
id: ‹ #id# ›,
value: xxx
)
execute id, avec la valeur message (de la class message)
qui est la valeur de ton input
tu as comme type <a time donc un melange
de l’action message == input text
et input time
l’action message
1er ligne
data-subtype=« message »
tu reprends l’input time et tu le mets en valeur message
value: {message:
regarde de mémoires pour un
data-subtype=« slider »
valeur slider
value: {slider:
c’est pas un simple mur
ll est voûtė, avec balcon, colonne et charpente
Merci de ce détail sur le script @ajja17orange
Je ne suis pas devant le PC ce soir mais sur le téléphone malgré tout je suis déjà entrain de naviguer sur les liens donnés.
Je suis aussi sur openclassroom pour voir si les cours débutants me permettre mnt de comprendre un peu mieux la partie en amont du script. Tout ce qu’il y a dans les
il te manque les jeedom update
pour l’actualisation sans raffraichisement de la page
