Lettering PHP

Versi PHP untuk lettering.js

function lettering_PHP($text) {
    $results = '<span class="word-1 char-group">';
    $skip = false;
    $entity_open = false;
    $entity_close = false;
    $index_word = 2;
    $index_letter = 1;
    $letters = preg_split('#(?<!^)(?!$)#u', $text);
    foreach($letters as $letter) {
        $entity_open = $letter == '&';
        $entity_close = $letter == ';';
        if($letter == '<' || $entity_open) $skip = true;
        if($letter == '>' || $entity_close) $skip = false;
        if( ! $skip && $letter == ' ') {
            $results .= '</span> <span class="word-' . $index_word . ' char-group">';
            $index_word++;
        } else {
            if( ! $skip && $letter != '<' && $letter != '>' && $letter != '&' && $letter != ';' && $letter != ' ') {
                $results .= '<span class="char-' . $index_letter . '">' . $letter . '</span>';
                $index_letter++;
            } else {
                if($entity_open) {
                    $results .= '<span class="char-' . $index_letter . '">';
                }
                $results .= $letter;
                if($entity_close) {
                    $results .= '</span>';
                    $index_letter++;
                }
            }
        }
    }
    return '<span aria-label="' . str_replace(array('"', '\''), array('&quot;', '&#039;'), strip_tags($text)) . '"><span aria-hidden="true" class="word-group">' . $results . '</span></span></span>';
}

Penggunaan

<h2><?php echo lettering_PHP('Lorem Ipsum Dolor Sit Amet'); ?></h2>

Sebelum

<h2>Lorem Ipsum Dolor Sit Amet</h2>

Sesudah

<h2>
  <span aria-label="Lorem Ipsum Dolor Sit Amet">
    <span aria-hidden="true" class="word-group">
      <span class="word-1 char-group">
        <span class="char-1">L</span>
        <span class="char-2">o</span>
        <span class="char-3">r</span>
        <span class="char-4">e</span>
        <span class="char-5">m</span>
      </span> 
      <span class="word-2 char-group">
        <span class="char-6">I</span>
        <span class="char-7">p</span>
        <span class="char-8">s</span>
        <span class="char-9">u</span>
        <span class="char-10">m</span>
      </span> 
      <span class="word-3 char-group">
        <span class="char-11">D</span>
        <span class="char-12">o</span>
        <span class="char-13">l</span>
        <span class="char-14">o</span>
        <span class="char-15">r</span>
      </span> 
      <span class="word-4 char-group">
        <span class="char-16">S</span>
        <span class="char-17">i</span>
        <span class="char-18">t</span>
      </span> 
      <span class="word-5 char-group">
        <span class="char-19">A</span>
        <span class="char-20">m</span>
        <span class="char-21">e</span>
        <span class="char-22">t</span>
      </span>
    </span>
  </span>
</h2>