<?php

function renderLogoElement($b, $element, $custom_classes, $elStyles, $colors, $viewport) {
  $data = $element['data'];
  $user_data = $data['user_data'];
  $elMarkup = "";

  $useTextLogo = isset($user_data['useTextLogo']) && $user_data['useTextLogo'];
  $wrapperClasses = "flex-element-type-logo";

  if ($useTextLogo) {
    $wrapperClasses .= " flex-element-type-logo--type-text";
  }

  $elMarkup .= '
    <div class="'.$b.'__element '.$b.'__element--'.$element["id"].' '.$b.'__element--logo '.$custom_classes.'" style="'.$elStyles.'">
      <div class="'.$wrapperClasses.'">
  ';

  // Content - Text or Image
  if ($useTextLogo) {
    // Text Logo
    $text_enc = urldecode($user_data['textLogoText']);
    $text_enc = str_replace("__SLASH__","--",$text_enc);
    $text_html = html_entity_decode($text_enc);
    $text = $text_html;

    $dataFontStyle = "";

    if(isset($user_data['textLogoFont_useFontStyle']) && $user_data['textLogoFont_useFontStyle']) {
      $dataFontStyle = "data-font='".$user_data['textLogoFont_fontStyle']."'";
    } else {
      $textLogoStyles = "";
      if(isset($user_data['textLogoFont_fontFamily'])) {
        $textLogoStyles .= "font-family: ".$user_data['textLogoFont_fontFamily'].";";
      }
      if(isset($user_data['textLogoFont_fontSize'])) {
        $textLogoStyles .= "font-size: ".$user_data['textLogoFont_fontSize']."em;";
      }
      if(isset($user_data['textLogoFont_lineHeight'])) {
        $textLogoStyles .= "line-height: ".$user_data['textLogoFont_lineHeight']."em;";
      }
      if(isset($user_data['textLogoFont_letterSpacing'])) {
        $textLogoStyles .= "letter-spacing: ".$user_data['textLogoFont_letterSpacing']."em;";
      }
    }

    $elMarkup .= '
      <div '.$dataFontStyle.' class="flex-element-type-logo__text" style="'.$textLogoStyles.'">
      '.$text.'
      </div>
    ';
  } else {
    // Image
    $backgroundImage = isset($user_data['imageLogo_backgroundImage']) ? $user_data['imageLogo_backgroundImage'] : "";
    $elMarkup .= '
      <div class="flex-element-type-logo__image" style="background-image: url('.$backgroundImage.')"></div>
    ';
  }

  $elMarkup .= '
      </div>
    </div>
  ';

  return $elMarkup;
}
