+ Antworten
Seite 1 von 3 1 2 3 LetzteLetzte
Ergebnis 1 bis 10 von 23
  1. #1
    Registriert seit
    Oct 2007
    Ort
    Villach,Kärnten,Österreich
    Beiträge
    2,911

    Standard Universeller HSL Slider mit Farbkalibration

    Hallo zusammen

    Nach mehreren Versuchen mit diversen Colorpickern mußte ich feststellen das die Dinger zwar hübsch aussehen, aber mittels Touchscreen einfach nicht sinnvoll zu bedienen sind.

    Darum hab ich mich entschlossen zu den guten alten Slidern zurückzukehren.
    Aber diesmal welche für den HSV Farbmodus.
    Warum ?
    Mit HSV ( Farbeton - Sättigung -Helligkeit) läßt sich eine gewünschte Lichtstimmung sehr viel besser einstellen als wie sonst im Forum üblich per RGB. Vorteile:
    - der Farbton kann ohne rumzumischen direkt angefahren werden
    - mit dem Sättigungsregler wählt man zwischen Weiß über Pastell bis Disco-bunt
    - dimmen geht ganz bequem per dediziertem Regler

    Ich steuere damit China RGB Stripes welche an ein DMX Controllern hängen.-
    Die Farben haben recht unterschiedliche Intensität, ein R=255/G=255/B=255 ergibt eher ein Hellblau als ein Weiß. Das Verhältnis bleibt beim dimmen auch nicht konstant und verschiebt sich erst zu grün, und dann zu rot.

    Um das zu verbessern hab ich einen kleinen Weißabgleich eingebaut.
    Damit bleibt der eingestellte Farbton über den kompletten Dimmbereich viel besser konstant.
    Erst bei ganz geringer Helligkeit schlägt die niedrigere Einsatzspannungen der roten LED zu. Ansonsten finde ich das sehr brauchbar.

    Im Script sind mal meine Werte drinnen, ihr solltet sie an eure Leuchtmittel anpassen.
    Anleitung für Abgleich ist im Script.

    Die Slider werden komplett per HTML/CSS erzeugt. Dadurch sind sie voll skalierbar und sollten bei allen Bildschirmgrößen oder Auflösungen funktionieren.
    Sie funktionieren auch besser als die WF eigenen Slider. Sie "sliden" nämlich wirklich, (Wert ändert sich während ziehen) und nicht nur beim loslassen so wie bei den IPS Originalen.

    Wer Lust und Laune hat kann auch das Aussehen ganz simpel durch editieren der CSS Tags in der sliders.php tunen.
    Getestet hab ich mit Chrome bzw. diversen Webkit basierenden Android Browsern.
    Für FF muß vermutlich noch an der CSS gefeilt werden.


    Installation kommt im nächsten Post.

    Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL1.PNG 
Hits:	693 
Größe:	44.3 KB 
ID:	20854Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL2.PNG 
Hits:	680 
Größe:	76.9 KB 
ID:	20855

  2. #2
    Registriert seit
    Oct 2007
    Ort
    Villach,Kärnten,Österreich
    Beiträge
    2,911

    Die Installation ist ganz einfach, daher hab mir daher den Aufwand eines eigenen Installationsscipt gespart:

    1.) Dateien aus der beiligenden HSL.zip nach ../webfront/user/HSL kopieren

    2.) an beliebiger Stelle ein Dummy Modul erstellen und darin die Variablen lt. Screenshot erstellen.
    Auf exakte Schreibweise achten !!!
    "SliderFrame" ist ein String vom Typ ~HTMLBox, alle anderen ganz normale Integer

    3.) in die Variable "SliderFrame" diesen String reinschreiben
    PHP-Code:
    <iframe src="user/HSL/sliders.php?id=xxxxx&hue=29&sat=54&light=0" border="0" frameborder="0" style"width: 100%; height: 130px;"/></iframe
    Anstatt xxxxx in obigem String müßt ihr die ID des Dummymodules einsetzen, bei mir ist das 55037

    4.) Dann noch das Script "setRGBHardware" anlegen
    In der ersten Zeile die ID der RGB Instanz die ihr steuern wollt eintragen


    5.) ggfls. die Konstanten für den Weißableich anpassen, der Werteberech geht von 0 bis 1. Was soviel wie 0-100% entspricht.

    6.) falls ihr kein DMX sondere eine andere RGB Hardware verwendet (zb. RGBW868) habt so sind ab Zeile 48/49/50 die passenden Befehle einzutragen. Denke das ist eh selbsterklärend.



    PHP-Code:
    // ID of RGB instance you want to control
    $RGBInstanceID 34265 /*[Licht\RGB-Chouch]*/;

    // ========= White Balance  ====================== 
    // Set Saturation control to Minimum
    // Set Brightness control to 100% 
    // modify this constants until you get proper white
    $r100=1;    // red
    $g100=0.7;  // green
    $b100=0.6;  // blue

    // Do the same again, but set Brightness control to 10%
    // modify this constants until you get proper white
    $r10=1;     // red
    $g10=0.92;  // green
    $b10=0.92;  // blue


    // nothing to be changed below this line
    //===================================================================
    $InstId IPS_GetParent($_IPS['SELF']);
    $HSV[0] = GetValue(IPS_GetObjectIDByName("HueSlider",$InstId));
    $HSV[1] = GetValue(IPS_GetObjectIDByName("SaturationSlider",$InstId)) / 100;
    $HSV[2] = GetValue(IPS_GetObjectIDByName("BrightnessSlider",$InstId)) / 100;

    // convert to HSV to RGB
    $RGBhsv2rgb($HSV);

    //  set brightness to 0 if it is below 10% ( better handling at some browser)
    // can be deleted if you dont like it
    if ($HSV[2] <0.10){
        
    $HSV[2] = 0;
        }
    // set saturation to 1% if below 1% (avoid all dark at 0% brightness)
    // can be deleted if you dont like it
    if ($HSV[1] < 0.01){
        
    $HSV[1] = 0.01;
        }

    // Scale Channels to get propper White balance
    $red $RGB[0]*(((($r10-$r100)/0.9)*(1-$HSV[2]))+$r100);
    $green $RGB[1]*(((($g10-$g100)/0.9)*(1-$HSV[2]))+$g100);
    $blue $RGB[2]*(((($b10-$b100)/0.9)*(1-$HSV[2]))+$b100);


    // Now set the hardware
    DMX_SetValue($RGBInstanceID,1,$red);         // set value for red channel
    DMX_SetValue($RGBInstanceID,2,$green);     // set value for green channel
    DMX_SetValue($RGBInstanceID,3,$blue);       // set value for blue channel


    // Module for Colorspace conversion
    // Credits to http://www.zend.com//code/codex.php?ozid=1403&single=1
    function hsv2rgb($hsv)
        {
            if (!
    $hsv[1]) {
                if (
    $hsv[0] === null) {
                    
    $rgb[0] = $rgb[1] = $rgb[2] = $hsv[2];
                } else {
                    return 
    false;
                }
            } else {
                if (
    $hsv[0] == 360) {
                    
    $hsv[0] = 0;
                }
                
    $hsv[0] /= 60;
                
    $i floor($hsv[0]);
                
    $f $hsv[0] - $i;
                
    $p $hsv[2] * ($hsv[1]);
                
    $q $hsv[2] * (- ($hsv[1] * $f));
                
    $t $hsv[2] * (- ($hsv[1] * ($f)));
                switch (
    $i) {
                    case 
    0:
                        
    $rgb[0] = $hsv[2];
                        
    $rgb[1] = $t;
                        
    $rgb[2] = $p;
                        break;
                    case 
    1:
                        
    $rgb[0] = $q;
                        
    $rgb[1] = $hsv[2];
                        
    $rgb[2] = $p;
                        break;
                    case 
    2:
                        
    $rgb[0] = $p;
                        
    $rgb[1] = $hsv[2];
                        
    $rgb[2] = $t;
                        break;
                    case 
    3:
                        
    $rgb[0] = $p;
                        
    $rgb[1] = $q;
                        
    $rgb[2] = $hsv[2];
                        break;
                    case 
    4:
                        
    $rgb[0] = $t;
                        
    $rgb[1] = $p;
                        
    $rgb[2] = $hsv[2];
                        break;
                    case 
    5:
                        
    $rgb[0] = $hsv[2];
                        
    $rgb[1] = $p;
                        
    $rgb[2] = $q;
                        break;
                }
            }
            for (
    $c=0$c<3$c++) {
                
    $rgb[$c] = round($rgb[$c] * 255);
            }
            return 
    $rgb;
        } 

    Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL3.PNG 
Hits:	676 
Größe:	39.5 KB 
ID:	20856

    HSL.zip

    Eingebaut in eine WF Seite und garniert mit ein paar Buttons kann das dann zb. so aussehen:

    Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL5.PNG 
Hits:	1264 
Größe:	92.5 KB 
ID:	20858
    Geändert von bbernhard (29.04.13 um 21:19 Uhr)

  3. #3
    Registriert seit
    Jan 2010
    Ort
    Rheinland Pfalz
    Beiträge
    1,686

    Hallo bbernhard,

    installiert aber die Color Slider werden nicht dargestellt.
    Ansonsten keine Fehlermeldung.
    Haste eine Ahnung was das sein kann?

    Danke

    Nachtrag 15:36

    Problem sitz vor dem PC
    es klappert, Script im falschen verzeichnis
    Danke
    Geändert von wibo050447 (21.04.13 um 14:37 Uhr)
    Gruß WiBo

    "Eventuelle Rechtschreib- und Tippfehler jeglicher Art sind nur ein Zeichen meiner Geschwindigkeit Ich bitte euch, gelassen darüber hinweg zu lesen."

  4. #4
    Registriert seit
    Dec 2006
    Ort
    Oberkrämer bei Berlin
    Beiträge
    1,404

    Ich habe mir heute auch mal den HSL Slider angeschaut. Das mit der Sättigung ist schön wenn man viel mit Weißlicht aus RGB arbeitet. Bisher arbeite ich mehr mit gedimmten Farblicht. Ich glaube das muss erst mal der Familienrat entscheiden.
    Zwei Kleinigkeiten sind mir aufgefallen.
    Wenn man den Sättigungs Slider ganz nach links schiebt, also weiß, ist er 0 und alles ist dunkel.
    Wenn man die Farben anderweitig verstellt, z.B. durch ein Programm, stimmen die Slider nicht mehr mit den Werten überein. Auch ein anklicken der Slider ändert nichts. Erst ein verschieben bringt die richtigen Werte.
    Sonst aber gute Arbeit. Danke.
    MfG: Heiner_________________IPS5.1, NUC-i5 Lüfterlos, SSD, Win10Home, 24/7; IPS-Mobile Android V5.1.0; FHZ1300PC: FS20, HMS100, KS300, PS50, FHT; WDE1; Harmony1100 + Wandlung einzelner FHT80TF in FS20 Adressen mit FS20Manager; 3x ChromoflexII + 14x IIIRC; DMX4ALL, ArtNet (Dimmer6); IPS-868: EKM, RGBW, WDT, JKM/Termojet; 1Wire über blauem DS9490R; HomeMatic: CCU3, LAN_Adapter, Hm + HmIP, Winmatic; XBee Pro: Roomba;

  5. #5
    Registriert seit
    Oct 2007
    Ort
    Villach,Kärnten,Österreich
    Beiträge
    2,911

    Servus

    Das mit dem Sättigungsslider sehe ich so hier nicht. Wennst dir das Script ansiehst, dann findest eine Zeile an der der Minimumwert überschrieben wird. Damit kannst das anpassen.

    Das Updaten der Sliders wenn die Werte von extern gesetzt werden funktioniert.
    Die Sliders.php kann entsprechende Übergabeparameter richtig verarbeiten.
    Hatte nur bei mir die ganzen ID's der Einfachheit halber hardgecodet, und noch keine Lust das auf generisch erzeugte Id umzubasteln. Darum hatte ichs auch nicht gepostet.

    Als Bsp. hier ein kleines Script:

    PHP-Code:
    $HSVModuleId 34743;

    $hue 50;
    $saturation 80;
    $light 100;

    SetValue(47300 /*[Programe\Lichtsteuerung\RGB\HSV Slider\SliderIFrame]*/'<iframe src="user/picker/picker.php?id='.$HSVModuleId.'&hue='.$huse.'&sat='.$saturation.'&light='.$light.'" border="0" frameborder="0" style= "width: 100%; height: 130px;"/></iframe>'); 
    Die Id mußt halt auf deine umbauen und die SetValue ... Zeile in dein externes Script übernehmen.

    gruß
    bb

  6. #6
    Registriert seit
    Dec 2006
    Ort
    Oberkrämer bei Berlin
    Beiträge
    1,404

    Das mit dem SaturationsSlider verstehe ich nicht. Wenn er 0 ist müsste RGB 100% sein wenn ich jegliche Korrekturen entferne. Die handling Korrekturen bringen da auch nichts.
    Anbei ein paar Bilder damit du mich richtig verstehst.
    Das mit dem Updaten der Slider verstehe ich auch nicht. Was ist $HSVModuleId, SliderIFrame, picker.php? Und die Übergabeparameter sind doch RGB.
    Miniaturansichten angehängter Grafiken Miniaturansichten angehängter Grafiken Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL1.jpg 
Hits:	388 
Größe:	82.0 KB 
ID:	20929   Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL2.jpg 
Hits:	340 
Größe:	89.9 KB 
ID:	20930   Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	HSL3.jpg 
Hits:	322 
Größe:	90.3 KB 
ID:	20931  
    Geändert von Heidewinkler (29.04.13 um 17:15 Uhr)
    MfG: Heiner_________________IPS5.1, NUC-i5 Lüfterlos, SSD, Win10Home, 24/7; IPS-Mobile Android V5.1.0; FHZ1300PC: FS20, HMS100, KS300, PS50, FHT; WDE1; Harmony1100 + Wandlung einzelner FHT80TF in FS20 Adressen mit FS20Manager; 3x ChromoflexII + 14x IIIRC; DMX4ALL, ArtNet (Dimmer6); IPS-868: EKM, RGBW, WDT, JKM/Termojet; 1Wire über blauem DS9490R; HomeMatic: CCU3, LAN_Adapter, Hm + HmIP, Winmatic; XBee Pro: Roomba;

  7. #7
    Registriert seit
    Oct 2007
    Ort
    Villach,Kärnten,Österreich
    Beiträge
    2,911

    Servus

    OK, im SetRGBhardware Script muß es irgendwo diese Zeilen geben:
    PHP-Code:
    // set saturation to 1% if below 1% (avoid all dark at 0% brightness)
    // can be deleted if you dont like it
    if ($HSV[1] < 0.01){
        
    $HSV[1] = 0.01;
        } 
    Die sollten eigentlich bei 0% Sliderstellung den Wert auf 1% überschreiben. Spiel mal damit rum.

    Zum updaten der Slider: Du hast nicht versucht zu verstehen wie das funktioniert, oder ?
    Die beiden Variablen hast ja bei der Erstinstallation schon mal in der Hand gehabt:
    Hier ein passender Screenshot zum Beispielscript. Da welche ID was ist.
    Klicken Sie auf die Grafik für eine größere Ansicht 

Name:	hsv_update.PNG 
Hits:	344 
Größe:	40.2 KB 
ID:	20944

    Wie kommst du darauf das Übergabeparameter RGB sind? Wir sprechen von einem HSL Slider.

    Oder möchtest du: Die RGB Variablen deiner Hardwareinstanz von einem exteren Script beschreiben, und die HSL Slider sollen sich entsprechend ändern ? Ginge natürlich auch man müßte halt nochmals eine RGB -> HSL Umwandlung dazuwischen hängen. Aber warum willst das machen ?
    Beschreibe doch einfach die HSV Variablen.


    gruß
    bb

  8. #8
    Registriert seit
    Dec 2006
    Ort
    Oberkrämer bei Berlin
    Beiträge
    1,404

    Da auch ein
    PHP-Code:
    // set saturation to 0 if below 1% ( better handling at soem browser)
    // can be deleted if you dont like it
    if ($HSV[1] < 0.01){
        
    $HSV[1] = 0.01;
        } 
    keine Änderung bringt muss ich noch wo anders einen Fehler haben.

    Dein obiges Beispiel hat mich nur durcheinander gebracht da die Schreibweise und IDs anders war als im ersten Beitrag. Der letzte Screenshot sieht schon besser aus.
    Und Ja ich habe viele Scripte wie Szenen, Thermometer, und Licht Programme die die RGB Werte der Hardwareinstanz beschreiben.

    Es geht ja für mich nicht nur um diesen DMX Bereich sondern zukünftig auch für meine anderen Systeme wie Chromoflex und RGBW-868 die alle bisjetzt RGB(W) Werte beschreiben.


    EDIT: Hab den Fehler.
    Dein Scribt oben stimmt nicht. Das

    // convert to HSV to RGB
    $RGB= hsv2rgb($HSV);

    muss nach den Zeilen

    if ($HSV[1] < 0.01){
    $HSV[1] = 0.2;
    }

    kommen.
    Geändert von Heidewinkler (30.04.13 um 17:29 Uhr)
    MfG: Heiner_________________IPS5.1, NUC-i5 Lüfterlos, SSD, Win10Home, 24/7; IPS-Mobile Android V5.1.0; FHZ1300PC: FS20, HMS100, KS300, PS50, FHT; WDE1; Harmony1100 + Wandlung einzelner FHT80TF in FS20 Adressen mit FS20Manager; 3x ChromoflexII + 14x IIIRC; DMX4ALL, ArtNet (Dimmer6); IPS-868: EKM, RGBW, WDT, JKM/Termojet; 1Wire über blauem DS9490R; HomeMatic: CCU3, LAN_Adapter, Hm + HmIP, Winmatic; XBee Pro: Roomba;

  9. #9
    Registriert seit
    Oct 2007
    Ort
    Villach,Kärnten,Österreich
    Beiträge
    2,911

    Zitat Zitat von Heidewinkler Beitrag anzeigen
    EDIT: Hab den Fehler.
    Dein Scribt oben stimmt nicht. Das

    // convert to HSV to RGB
    $RGB= hsv2rgb($HSV);

    muss nach den Zeilen

    if ($HSV[1] < 0.01){
    $HSV[1] = 0.2;
    }

    kommen.
    Ja klar, sorry mein Fehler.
    Wie gesagt, ich hab das gepostete Script bei mir ganz anders im Einsatz. Hab nicht gemerkt das die Forumsvariante falsch ist.

    gruß
    bb

  10. #10
    Registriert seit
    Oct 2010
    Beiträge
    604

    moin,

    ich habe alles soweit installiert und eingerichtet aber am Strahler tut sich nix.

    bewege ich die Slider sehe ich die neuen Werte im Webfront, auch das RGB Script wird ausgefuehrt aber der Strahler macht nichts.

    wenn ich ein Kanal vom Strahler per Hand (Script) aendere dann geht das. also funktioniert die Uebergabe vom RGB-Script zum DMX-Ausgang nicht. Die ID hab ich aber angepasst.

    mein Strahler reagiert ab ch3 (RGB also bis ch5), solch einen Wert meine ich im RGB Script gefunden zu haben, bei DMX_SetValue... dort habe ich aus 1-3, 3-5 gemacht (obwohl im Script steht ab einer bestimmten Zeile nicht mehr aendern), aber bei beiden Einstellungen tut sich nichts.

    hat da jemand eine Idee?


    Edit:
    ich habe das RGB Script mal kopiert und in sehr vereinfachter Form in ein neues Script gepackt, wenn ich das ausfuehre, kommt am Strahler auch was an, also im Moment kann ich das Problem nicht loesen.

    // ID of RGB instance you want to control
    $RGBInstanceID = 11033 /*[DMX\DMX Ausgang]*/;


    // Scale Channels to get propper White balance
    $red = 0;
    $green = 255;
    $blue = 0;


    // Now set the hardware
    DMX_SetValue ($RGBInstanceID,3,$red); // set value for red channel
    DMX_SetValue ($RGBInstanceID,4,$green); // set value for green channel
    DMX_SetValue ($RGBInstanceID,5,$blue); // set value for blue channel
    Geändert von BeLo (13.06.13 um 10:56 Uhr)
    Im Moment im Einsatz: IPS-Professional V4.1 auf RPi3, YAHM mit HM LAN-Adapter
    Komponenten: FWS20 Wetterstation, >35x DS18B20, HM-SCI-3-FM, HM-LC-Sw2-FM, HM-LC-Sw1-FM, HM-Sec-RHS, HM-Sec-SC-2,
    mehrere Pokeys, einige Philips Hue, 4x SDM630M

Ähnliche Themen

  1. Variable mit Slider
    Von wgreipl im Forum WebFront
    Antworten: 14
    Letzter Beitrag: 26.07.17, 13:51
  2. Philips Hue mit RGB Slider ansteuern
    Von axelp im Forum Haustechnik
    Antworten: 5
    Letzter Beitrag: 20.04.13, 21:28
  3. Slider auch mit Minuten
    Von tommy86 im Forum Skripte, PHP, SQL
    Antworten: 5
    Letzter Beitrag: 15.11.12, 00:25
  4. RGB Lichtsteuerung mit Slider
    Von sabl im Forum WebFront
    Antworten: 4
    Letzter Beitrag: 09.12.10, 14:37