GSoC'19 Coding Period | Week #6 | Icon API

The Google Summer of Code has reached the end of the week #6 of the coding period with my project "Complete porting of Icons API to Drupal 8" being progressing smoothly with interesting challenges along the way.

In my previous blog post, I had mentioned that I'll be implementing the part where the icon is displayed in the menu link title as saved through the configuration page of the menu link.

During this week, I've successfully implemented what I've mentioned in my previous blog and the icons are displaying on the menu link title and this was achieved using the template_preprocess_menu() hook and plugin id for the menu link is stored in the following tree path of the array:

$plugin_id = $variables['items'][index]['original_link']->getPluginId();

The following code snippet of the function is responsible for displaying the code on the menu link item:

function _icon_menu_get_icon_tag($tag, $icon, $classes, $title, $position, $title_wrapper, $title_wrapper_element, $title_classes) {
  $markup = '<' . $tag . ' class="fa fa-' . $icon . ' ' . $classes . '"></' . $tag . '>';
  if ($title_wrapper) {
    $title = '<' . $title_wrapper_element . ' ' . (!empty($title_classes) ? 'class="' . $title_classes . '"' : '') . '> ' . $title . '</' . $title_wrapper_element . '>';
  }
  switch ($position) {
    case 'title_before':
      $markup .= $title;
      break;
    case 'title_after':
      $markup = $title . $markup;
      break;
    case 'title_invisible':
      $markup .= '' . $title . '';
      break;
    case 'title_replace':
      $markup = $markup . '';
      break;
  }
  return Markup::create($markup);
}

The following screenshot shows the configuration form of the Home menu link item:

 The following screenshot shows the home page with the icon displayed as saved through the configuration:

The challenge faced during this week was to fetch the plugin id of the menu link by looking at the tree of the key/value pairs using the Devel module and find the pattern in the tree and check the plugin id against the list of plugin ids saved from the configuration form.

For the next week, I'll be implementing the Icon Filter module using the Filter API and processing the result using the regular expression to detect the pattern and replace the occurrence of the pattern with the icon.