Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. ioBroker Allgemein
    4. WLED Color Picker über Yahka

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    WLED Color Picker über Yahka

    This topic has been deleted. Only users with topic management privileges can see it.
    • Cynric10
      Cynric10 last edited by Cynric10

      Hallo,

      Ich habe mir seit ein paar Tagen das Thema WLED angesehen und bin sehr begeistert.

      Da ich alles über das Apple Home schalte, wollte ich auch den LED Streifen welchen ich habe über Yahka in die Home App bringen.

      Ein und ausschalten funktioniert schon ohne Probleme sowie auch die Helligkeit. Jetzt würde ich gerne wie bei den Philips Hue Lampen auch die Farbe über einen Color Picker haben wollen.
      Möchte mir ersparen das ich für "bevorzugte" Farben quasi eine eigene Lampe machen muss. Genauso mit den Effekten.

      Leider finde ich im WLED das Objekt "hue" nicht auf welche viele Foren Einträge hinweisen. Dieses würde man anscheinend dafür benötigen.

      Hat hier schon jemand Erfahrung oder einen Color Picker in Yahka umgesetzt?

      Ich danke euch!

      Dutchman 1 Reply Last reply Reply Quote 0
      • Dutchman
        Dutchman Developer Most Active Administrators @Cynric10 last edited by Dutchman

        @cynric10 sagte in WLED Color Picker über Yahka:

        Leider finde ich im WLED das Objekt "hue" nicht auf welche viele Foren Einträge hinweisen. Dieses würde man anscheinend dafür benötigen.

        Hi, WLED stellt keinen HUE wert zur verfügung und arbeitet mit RGB. bzw HEX.
        Leider kennt Yahia nur die HomeKit Variante mit HUE etc..... Selbes problem habe ich mit manchen Zigbee Geräten.

        Ich hätte da ein script was hex/rgb umsetzen kan in HSV (als Hue/Saturation etc.) das muss ich noch bissl optimieren kan es dan aber gerne bereitstellen. dan wurde wir im userdaten ordner fuer die WLED einen extra state bekommen der synchronisier und halt hex/rgb nach HSV übersetzt fuer Yahaka

        Cynric10 B 2 Replies Last reply Reply Quote 0
        • Cynric10
          Cynric10 @Dutchman last edited by

          @dutchman

          Ah danke für die Erklärung!

          War nur so das ich in vielen Beiträgen wo es eben um den color picker ging, die hue Werte wichtig waren die auch nicht Hue Lampen anscheinend bereitgestellt haben.

          Das mit dem script hört sich ja sehr gut an!

          Wie würde man dieses script dann einbinden?

          Dutchman 1 Reply Last reply Reply Quote 0
          • Dutchman
            Dutchman Developer Most Active Administrators @Cynric10 last edited by

            @cynric10 sagte in WLED Color Picker über Yahka:

            Das mit dem script hört sich ja sehr gut an!
            Wie würde man dieses script dann einbinden?

            im gründe copy/paste und einen Datenpunkt eintragen, ich setze mich da die tage mal dran.
            Hmm, oder implementiere HSV im adapter muss ich noch drüber nachdenken 😕

            Cynric10 M 2 Replies Last reply Reply Quote 0
            • Cynric10
              Cynric10 @Dutchman last edited by

              @dutchman

              Also wegen mir musst du dir keinen Stress machen 😉

              Finde es schon mal gut das jemand mein Problem versteht und es Lösungen gäbe 🙂

              Danke dir nochmal! Lass mich wissen wenn du weitergekommen bist.

              1 Reply Last reply Reply Quote 0
              • M
                moonwalker @Dutchman last edited by

                @dutchman
                Hallo ich habe auch ein Problem mit der Farbe in yahka hast du vielleicht einen Tipp?https://forum.iobroker.net/topic/47677/yahka-with-hue-bridged-lamp?_=1631476246331

                Dutchman 1 Reply Last reply Reply Quote 0
                • Dutchman
                  Dutchman Developer Most Active Administrators @moonwalker last edited by

                  @moonwalker sagte in WLED Color Picker über Yahka:

                  @dutchman
                  Hallo ich habe auch ein Problem mit der Farbe in yahka hast du vielleicht einen Tipp?https://forum.iobroker.net/topic/47677/yahka-with-hue-bridged-lamp?_=1631476246331

                  Leider nein ich habe die Produkte nicht

                  M 1 Reply Last reply Reply Quote 0
                  • M
                    moonwalker @Dutchman last edited by

                    @dutchman

                    danke aber liegt das an den Innr Lampen selbst oder an der HUE Bridge ... über die HUE App funktionieren sie ja auch einwandfrei. Was meinst du?

                    Dutchman 1 Reply Last reply Reply Quote 0
                    • Dutchman
                      Dutchman Developer Most Active Administrators @moonwalker last edited by

                      @moonwalker sagte in WLED Color Picker über Yahka:

                      @dutchman

                      danke aber liegt das an den Innr Lampen selbst oder an der HUE Bridge ... über die HUE App funktionieren sie ja auch einwandfrei. Was meinst du?

                      kan ich dir leider nicht sagen, ich benutze keine hue bridge und hatte bisher mit Zigbee stick nie probleme

                      M 1 Reply Last reply Reply Quote 0
                      • M
                        moonwalker @Dutchman last edited by

                        @dutchman vielen dank dann werd ich mal einen Stick testen, kannst du mir einen empfehlen?

                        Dutchman 1 Reply Last reply Reply Quote 0
                        • Dutchman
                          Dutchman Developer Most Active Administrators @moonwalker last edited by

                          @moonwalker sagte in WLED Color Picker über Yahka:

                          @dutchman vielen dank dann werd ich mal einen Stick testen, kannst du mir einen empfehlen?

                          Das ti-board, hier im Forum gibts auch einige Fabrikate u.a. Hat @arteck einen Post dazu gemacht

                          1 Reply Last reply Reply Quote 0
                          • B
                            Bully85 @Dutchman last edited by

                            @dutchman Hallo hast du das Script fertig und würdest es frei geben? Ich hätte interesse.

                            Dutchman 1 Reply Last reply Reply Quote 0
                            • Dutchman
                              Dutchman Developer Most Active Administrators @Bully85 last edited by

                              @bully85 sagte in WLED Color Picker über Yahka:

                              @dutchman Hallo hast du das Script fertig und würdest es frei geben? Ich hätte interesse.

                              danke fuer den reminder... ja lauft hier hatte noch n kleine problem im Yak ich kümmere mich heute im laufe des mittags / spaetens abends drum ... versprochen ist versprochen 😕 entschuldige bitte fuers warten ist mir komplett von der to-do liste gerutscht

                              B 1 Reply Last reply Reply Quote 0
                              • B
                                Bully85 @Dutchman last edited by

                                @dutchman Kein problem schließlich hilfst du mir/uns und dann darfst auch du die geschwindigkeit angeben. Danke im Vorraus

                                Dutchman 1 Reply Last reply Reply Quote 0
                                • Dutchman
                                  Dutchman Developer Most Active Administrators @Bully85 last edited by Dutchman

                                  @bully85 sagte in WLED Color Picker über Yahka:

                                  @dutchman Kein problem schließlich hilfst du mir/uns und dann darfst auch du die geschwindigkeit angeben. Danke im Vorraus

                                  So und wieder hat es länger gedauert als geplant, musste noch n par bugs ausbügeln. im script 😕

                                  ok, hier der HEX/HSV converter damit man jeden HEX wert von ioBroker im Yahka verwenden kan.

                                  Man muss im script ganz am Anfang die Datenpunkte hinterlegen wo der hex wert steht (source)

                                  Beispiel :

                                  // Add the state containing HEX values here :
                                  const colorSourceHex = [
                                      'zigbee.0.group_2.color',     // Wohnzimmer Lampen
                                      'wled.0.cc50e35b832b.seg.0.col.0_HEX' // TreppenLicht
                                  ];
                                  
                                  

                                  Danach erstellt das script im 0_userdata ordner eine object Struktur fuer jeden hex wert, darin sind dan die HUE und Situation welche man fuer Yak benötigt

                                  Schermafbeelding 2021-10-11 om 14.50.47.png

                                  Ab jetzt synchronisiert daas script jeder aenderung im HS(V) wert im 0_Userdata ordner mit dem HEX wert, auch wen man anderweitig den HEX wert ändert wird das nach 0_userdate Ordner übertragen.

                                  Damit müssten wir den sync in beiden Richtungen fertig haben 🙂

                                  Hier das script (wen da so laeuft bei euch mach ich ne final 1.0 und saubere den code noch n wenig):

                                  // ##############################
                                  // ######### DutchmanNL #########
                                  // ###### HSV Color to HEX ######
                                  // ############ V1.0 ############
                                  // ##############################
                                  
                                  // Add the state containing HEX values here :
                                  const colorSourceHex = [
                                      'zigbee.0.group_2.color',     // Beispiel Zigbee
                                          'wled.0.cc50e35b832b.seg.0.col.0_HEX' // Beispeil WLED
                                  ];
                                  
                                  // #####################################
                                  // ## Don't change anything from here ##
                                  // #####################################
                                  
                                  // Prepare variables
                                  const mySubscription = {}, debounceTimer = {};
                                  
                                  // Create Folder structure
                                  extendObjectAsync(`0_userdata.0.HEXtoHSL` , {
                                      "type": "folder",
                                      "common": {
                                      "name": 'Convert HEX to HSL color',
                                          "role": "",
                                          "icon": "",
                                  },
                                      "native": {},
                                  });
                                  
                                  // Read all array objects, create new state in javascript instance and subscribe on changes
                                  for (const device in colorSourceHex) {
                                  
                                      // Define folder structure in userdata directory
                                      const statePrepare = colorSourceHex[device].split('.');
                                  	const deviceName = `0_userdata.0.HEXtoHSL.${statePrepare[0]}_${statePrepare[1]}_${statePrepare[2]}`
                                  
                                      // Create Device Structure
                                      extendObjectAsync(deviceName , {
                                          "type": "device",
                                          "common": {
                                          "name": statePrepare[2],
                                              "role": "",
                                              "icon": "",
                                      },
                                          "native": {},
                                      });
                                  
                                      // States to cover Hue and Sat values
                                  	createState(`${deviceName}.hue` , {
                                  		'name': `Hue of ${statePrepare[2]}`,
                                  		'role': 'level.color.hue',
                                  		'type': 'number'
                                  	});
                                  	// @ts-ignore
                                  	createState(`${deviceName}.sat`, {
                                  		'name': `Sat of ${statePrepare[2]}`,
                                  		'role': 'level.color.sat',
                                  		'type': 'number'
                                  	});
                                  
                                  	// Subscribe on state changes for HUE and Saturation
                                  	// @ts-ignore
                                  	mySubscription[`${deviceName}.hue`] = on(
                                          [`${deviceName}.hue`, 
                                          `${deviceName}.sat`
                                          ], (data) => {
                                  
                                          // DebounceTimer
                                          // Reset timer (if running) and start new one for next watchdog interval
                                  		if (debounceTimer[colorSourceHex[device]]) {
                                  			clearTimeout(debounceTimer[colorSourceHex[device]]);
                                  			debounceTimer[colorSourceHex[device]] = null;
                                  		}
                                  		debounceTimer[colorSourceHex[device]] = setTimeout(() => {
                                  
                                              if (!data.state.ack){
                                                  const h = getState(`${deviceName}.hue`).val / 360;
                                                  const s = getState(`${deviceName}.sat`).val / 100;
                                                  const v = 1;
                                                  const colorRGB = hsvTOrgb(h,s,v)
                                                  const colorHEX = rgbTOhex(colorRGB)
                                                  // console.log(`HSV value : ${h}, ${s}, ${v}`);
                                                  setState(`${colorSourceHex[device]}`, colorHEX);
                                              }
                                          
                                          }, (500));
                                      });
                                  
                                      // Subscribe on state changes for HEX surce
                                      mySubscription[`${deviceName}.hue`] = on(
                                          [
                                          `${colorSourceHex[device]}`,
                                          ], (data) => {
                                          // DebounceTimer
                                  		if (debounceTimer[colorSourceHex[device]]) {
                                  			clearTimeout(debounceTimer[colorSourceHex[device]]);
                                  			debounceTimer[colorSourceHex[device]] = null;
                                  		}
                                  		debounceTimer[colorSourceHex[device]] = setTimeout(() => {
                                              
                                                  // console.log(`Device change detected : ${JSON.stringify(data.id)} value : ${data.state.val} | ack : ${data.state.ack}`);
                                                  const colorHEX = data.state.val;
                                                  const colorRGB = hexTOrgb(colorHEX)
                                                  const colorHSV = rgbTOhsv(colorRGB)
                                                  const h = roundDigit(colorHSV[0]);
                                                  console.log(colorHSV);
                                                  const s = roundDigit(colorHSV[1]);
                                                  setState(`${deviceName}.sat`, s, true);
                                                  setState(`${deviceName}.hue`, h, true);
                                              
                                  
                                          }, (500));
                                  
                                      });
                                  }
                                  
                                  ////////////////Funktionen////////////////
                                  /**
                                   * Coonvert HSV to RGB
                                   * @param {number} h - HUE value 
                                   * @param {number} s - Saturation value 
                                   * @param {number} v - Brightness value 
                                   */
                                  function hsvTOrgb(h, s, v) {
                                              var r, g, b, i, f, p, q, t;
                                              i = Math.floor(h * 6);
                                              f = h * 6 - i;
                                              p = v * (1 - s);
                                              q = v * (1 - f * s);
                                              t = v * (1 - (1 - f) * s);
                                              switch (i % 6) {
                                                  case 0: r = v, g = t, b = p; break;
                                                  case 1: r = q, g = v, b = p; break;
                                                  case 2: r = p, g = v, b = t; break;
                                                  case 3: r = p, g = q, b = v; break;
                                                  case 4: r = t, g = p, b = v; break;
                                                  case 5: r = v, g = p, b = q; break;
                                              }
                                              console.log(`${r} ${g} ${b}`)
                                              r=Math.round(255 * r);
                                              g=Math.round(255 * g);
                                              b=Math.round(255 * b);
                                              return [r,g,b];
                                  };
                                  
                                  function rgbTOhsv(rgb) {
                                  	let rdif;
                                  	let gdif;
                                  	let bdif;
                                  	let h;
                                  	let s;
                                  
                                  	const r = rgb[0] / 255;
                                  	const g = rgb[1] / 255;
                                  	const b = rgb[2] / 255;
                                  	const v = Math.max(r, g, b);
                                  	const diff = v - Math.min(r, g, b);
                                  	const diffc = function (c) {
                                  		return (v - c) / 6 / diff + 1 / 2;
                                  	};
                                  
                                  	if (diff === 0) {
                                  		h = 0;
                                  		s = 0;
                                  	} else {
                                  		s = diff / v;
                                  		rdif = diffc(r);
                                  		gdif = diffc(g);
                                  		bdif = diffc(b);
                                  
                                  		if (r === v) {
                                  			h = bdif - gdif;
                                  		} else if (g === v) {
                                  			h = (1 / 3) + rdif - bdif;
                                  		} else if (b === v) {
                                  			h = (2 / 3) + gdif - rdif;
                                  		}
                                  
                                  		if (h < 0) {
                                  			h += 1;
                                  		} else if (h > 1) {
                                  			h -= 1;
                                  		}
                                  	}
                                  
                                  	return [
                                  		h * 360,
                                  		s * 100,
                                  		v * 100
                                  	];
                                  };
                                  
                                  function rgbTOhex (args) {
                                  	const integer = ((Math.round(args[0]) & 0xFF) << 16)
                                  		+ ((Math.round(args[1]) & 0xFF) << 8)
                                  		+ (Math.round(args[2]) & 0xFF);
                                  
                                  	const string = integer.toString(16).toUpperCase();
                                  	return '000000'.substring(string.length) + string;
                                  };
                                  
                                  //In HEX konvertieren
                                  function toHex(number) {
                                      if (number < 0) number = 0xFFFFFFFF + number + 1;
                                      var n = number.toString(16).toUpperCase();
                                      if (n.length == 1) {
                                          n = '0' + n;
                                      }
                                      return n;
                                  }
                                  
                                  // Function to convert HEX to RGB 
                                  function hexTOrgb(args) {
                                      const match = args.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i);
                                  
                                      if (!match) {
                                          return [0, 0, 0];
                                      }
                                  
                                      let colorString = match[0];
                                  
                                      if (match[0].length === 3) {
                                          colorString = colorString.split('').map(char => {
                                              return char + char;
                                          }).join('');
                                      }
                                  
                                      const integer = parseInt(colorString, 16);
                                      const r = (integer >> 16) & 0xFF;
                                      const g = (integer >> 8) & 0xFF;
                                      const b = integer & 0xFF;
                                      return [r, g, b];
                                  };
                                  
                                  // Function to convert RGB to HSL
                                  function rgbTOhsl (rgb) {
                                  	const r = rgb[0] / 255;
                                  	const g = rgb[1] / 255;
                                  	const b = rgb[2] / 255;
                                  	const min = Math.min(r, g, b);
                                  	const max = Math.max(r, g, b);
                                  	const delta = max - min;
                                  	let h;
                                  	let s;
                                  
                                  	if (max === min) {
                                  		h = 0;
                                  	} else if (r === max) {
                                  		h = (g - b) / delta;
                                  	} else if (g === max) {
                                  		h = 2 + (b - r) / delta;
                                  	} else if (b === max) {
                                  		h = 4 + (r - g) / delta;
                                  	}
                                  
                                  	h = Math.min(h * 60, 360);
                                  
                                  	if (h < 0) {
                                  		h += 360;
                                  	}
                                  
                                  	const l = (min + max) / 2;
                                  
                                  	if (max === min) {
                                  		s = 0;
                                  	} else if (l <= 0.5) {
                                  		s = delta / (max + min);
                                  	} else {
                                  		s = delta / (2 - max - min);
                                  	}
                                  
                                  	return [h, s * 100, l * 100];
                                  };
                                  
                                  // Funtion to round digits properly
                                  function roundDigit(num){
                                      // return Math.round((num + Number.EPSILON) * 100) / 100
                                      return Math.round((num + Number.EPSILON));
                                  }
                                  

                                  Und so muss es dan im Yak konfiguriert Werdern, WLED kennt keine ColorTemp

                                  Schermafbeelding 2021-10-11 om 14.55.23.png

                                  B Fenriswolf 2 Replies Last reply Reply Quote 0
                                  • B
                                    Bully85 @Dutchman last edited by

                                    @dutchman mit wled getestet und funktioniert einwandfrei.👍

                                    M 1 Reply Last reply Reply Quote 1
                                    • Fenriswolf
                                      Fenriswolf @Dutchman last edited by

                                      @dutchman

                                      Danke für das wunderbare Script. Funktioniert sowohl mit Zigbee, als auch mit WLED.

                                      1 Reply Last reply Reply Quote 0
                                      • T
                                        TT-Tom last edited by

                                        hallo @Dutchman habe dein Script mit WLED getestet, läuft. Danke noch mal für deine Unterstützung.

                                        Gruß Tom

                                        1 Reply Last reply Reply Quote 1
                                        • M
                                          Merz @Bully85 last edited by

                                          @bully85 hast du das mit dem Color Picker in Vis getestet? Wenn ja, kannst du mir vielleicht sagen wie du das umgesetzt hast.

                                          Wenn ich in Vis ein Color Picker nehem, ist das einzige was passiert, dass die LEDs ausgehen.

                                          1 Reply Last reply Reply Quote 0
                                          • First post
                                            Last post

                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate
                                          FAQ Cloud / IOT
                                          HowTo: Node.js-Update
                                          HowTo: Backup/Restore
                                          Downloads
                                          BLOG

                                          736
                                          Online

                                          31.9k
                                          Users

                                          80.1k
                                          Topics

                                          1.3m
                                          Posts

                                          io broker led streifen led strip wled yahka yahka adapter
                                          7
                                          19
                                          2680
                                          Loading More Posts
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          The ioBroker Community 2014-2023
                                          logo