Willkommen!

Willkommen auf der privaten Webseite von Axel Hahn.

Axels Blog

Texte anhand einer Quelle einfärben

04.02.2018 - 22:07

Meine Nachrichten-Feeds benennen die Nachrichten-Quelle und färben sie ein. Es entsteht eine “bunt” eingefärbte Quelle, bevor deren Meldungs-Überschrift genannt wird.

Und wie funktioniert es, dass “Tagesschau”, “Spiegel” oder “Heise” jeweils spezifisch eingefärbt sind?

2018-02-04-rssnews.png

Naja, der Text - also String - der Quelle wird mit einer MD5 Funktion gehasht. Dann erhält man so einen Hexcode aus einem vorgegebenen String.

Wenn man sich vom Beginn des Hex-Strings jeweils die aufeinanderfolgenden 2..3 Stellen herausgreift, kann man diese dem Anteil für rot, grün und blau zuordnen.
Damit der Hintergrund und Vordergrund relativ zueinander passen, definiere ich für beide einen eine Range von..bis. Der ermittelte Wert aus dem Hash wird relativ zum von-bis-Range für Vordergrund und Hintergrund eingeordnet.

Und das ist der zugehörige PHP-Code:

/**
 * return html code for a span with background color based on a checksum of the given text
 * @param string $sText      text that is used for checksum; if false it returns a gray box
 * @param string $sContent   optional: text to show
 * @return string
 */
function _getChecksumSpan($sText, $sContent = '') {
    if ($sText) {
        // color ranges in decimal values for RGB from ... to
        $iFgStart = 60;
        $iFgEnd = 160;

        $iBgStart = 180;
        $iBgEnd = 240;

        // divider: 3 digits of md5 will be extracted
        $iFgDivider = 16 * 16 * 16 / ($iFgEnd - $iFgStart);
        $iBgDivider = 16 * 16 * 16 / ($iBgEnd - $iBgStart);

        $sHash = md5($sText);
        $sColor = ''
                . 'color: rgba('
                . ($iFgStart + round(hexdec(substr($sHash, 0, 3)) / $iFgDivider)) . ','
                . ($iFgStart + round(hexdec(substr($sHash, 3, 3)) / $iFgDivider)) . ','
                . ($iFgStart + round(hexdec(substr($sHash, 6, 3)) / $iFgDivider)) . ','
                . '1'
                . ');'
                . 'background: rgba('
                . ($iBgStart + round(hexdec(substr($sHash, 0, 3)) / $iBgDivider)) . ','
                . ($iBgStart + round(hexdec(substr($sHash, 3, 3)) / $iBgDivider)) . ','
                . ($iBgStart + round(hexdec(substr($sHash, 6, 3)) / $iBgDivider)) . ','
                . '1'
                . ');'
        ;
    } else {
        $sColor = "color: #888; background: #ccc;";
    }
    return '<span style="' . $sColor . '; border-left: 0.8em solid; padding: 0.1em 0.4em 0.1em 0.3em ;">' . ($sContent ? $sContent : ' ') . '</span>';
}

weiterführende Links:

  1. meine RSS-Seite: Nachrichten

Blog-Kategorieen: Programmierung CSS PHP


die letzten Blog-Einträge:
04.02.2018-22:07 Uhr Texte anhand einer Quelle einfärben
20.01.2018-13:56 Uhr Magix Music Maker - keine Abspielanzeige und mehr
18.01.2018-22:57 Uhr Immer wieder hilfreich: SMS mit Roaming-Kosten
22.12.2017-23:21 Uhr Bye-bye Facebook
11.12.2017-0:37 Uhr Es wird Weihnachten ...

Statistisches



Herkunft der Besucher

Übersicht der Herkunftsländer der Besucher meiner Webseite. Bots von Suchmaschinen sind in dieser Liste ausgeschlossen.

Übersicht der Herkunftsländer der Besucher meiner Webseite. Bots von Suchmaschinen sind in dieser Liste ausgeschlossen.


Webbrowser meiner Besucher

Welche Webbrowser werden verwendet? Die Anzeige fasst alle Versionsnummern zusammen.

Welche Webbrowser werden verwendet? Die Anzeige fasst alle Versionsnummern zusammen.