Bug 1838915: Allow social media to use FontAwsome icons if available

with social media icons we fetch them from external server each time
but a lot of them exist in the FontAwesome font library.

We should use the FA icons instead

behatnotneeded

Change-Id: I7b66ae0882836c7a0715969e5e03353b1e4fd70d
Signed-off-by: Robert Lyon <robertl@catalyst.net.nz>

htdocs/artefact/internal/lib.php

@@ -1215,19 +1215,19 @@ class ArtefactTypeSocialprofile extends ArtefactTypeProfileField {
 
             switch ($record->note) {
                 case 'facebook':
-                    $record->icon = favicon_display_url('facebook.com');
+                $record->faicon = '<span class="icon icon-brand icon-lg icon-facebook-square" style="color: #4267B2"></span>';
                     break;
                 case 'tumblr':
-                    $record->icon = favicon_display_url('tumblr.com');
+                    $record->faicon = '<span class="icon icon-brand icon-lg icon-tumblr-square" style="color: #001935"></span>';
                     break;
                 case 'twitter':
-                    $record->icon = favicon_display_url('twitter.com');
+                    $record->faicon = '<span class="icon icon-brand icon-lg icon-twitter" style="color: #00ACED"></span>';
                     break;
                 case 'instagram':
-                    $record->icon = favicon_display_url('instagram.com');
+                    $record->faicon = '<span class="icon icon-brand icon-lg icon-instagram" style="background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); background-clip: text; color: transparent; line-height: 1"></span>';
                     break;
                 case 'pinterest':
-                    $record->icon = favicon_display_url('www.pinterest.com');
+                    $record->faicon = '<span class="icon icon-brand icon-lg icon-pinterest" style="color: #E80021"></span>';
                     break;
                 case 'icq':
                     $record->icon = favicon_display_url('www.icq.com');
@@ -1236,11 +1236,10 @@ class ArtefactTypeSocialprofile extends ArtefactTypeProfileField {
                     $record->icon = favicon_display_url('www.aim.com');
                     break;
                 case 'yahoo':
-                    $record->icon = favicon_display_url('messenger.yahoo.com');
+                    $record->faicon = '<span class="icon icon-brand icon-lg icon-yahoo" style="color: #4B06A3"></span>';
                     break;
                 case 'skype':
-                    // Since www.skype.com favicon is not working...
-                    $record->icon = favicon_display_url('support.skype.com');
+                    $record->faicon = '<span class="icon icon-brand icon-lg icon-skype" style="color: #3498D8"></span>';
                     break;
                 case 'jabber':
                     // Since www.jabber.org favicon is not working...
@@ -1248,7 +1247,7 @@ class ArtefactTypeSocialprofile extends ArtefactTypeProfileField {
                     break;
                 default:
                     // We'll fall back to the "no favicon" default icon
-                    $record->icon = favicon_display_url('example.com');
+                    $record->faicon = '<span class="icon icon-lg icon-globe-americas" style="color: #BFBFF2"></span>';
 
                     // If they've supplied a URL, use its favicon
                     if (filter_var($record->title, FILTER_VALIDATE_URL)) {

htdocs/theme/raw/plugintype/artefact/internal/blocktype/socialprofile/templates/content.tpl

@@ -4,14 +4,20 @@
 <div class="card-body flush">
 {foreach from=$profiles item=p}
     {if $p->link}<a href="{$p->link}" title="{$p->link}" class="btn btn-secondary btn-sm socialbtn">
-        {if $showicon}<img src="{$p->icon}" alt="{$p->link}" class="valign-top">{/if}
+        {if $showicon}
+            {if $p->faicon}
+            {$p->faicon|safe}
+            {else}
+            <img src="{$p->icon}" alt="{$p->link}" class="valign-top">
+            {/if}
+        {/if}
         {if $showicon && $showtext}&nbsp;{/if}
         {if $showtext}{$p->description}{/if}
     </a>{/if}
 {/foreach}
 {if $email}
     <a href="mailto:{$email}" title="{$email}" class="btn btn-secondary btn-sm socialbtn">
-        {if $showicon}<span class="icon icon-envelope" role="presentation" aria-hidden="true"></span>{/if}
+        {if $showicon}<span class="icon icon-regular icon-envelope" role="presentation" aria-hidden="true"></span>{/if}
         {if $showicon && $showtext}&nbsp;{/if}
         {if $showtext}{str tag='email'}{/if}
     </a>

htdocs/theme/raw/plugintype/artefact/internal/templates/socialprofiles.tpl

@@ -21,7 +21,11 @@
         {foreach from=$rows item=row}
         <tr class="social-info">
             <td class="text-center">
+                {if $row->faicon}
+                {$row->faicon|safe}
+                {else}
                 <img src="{$row->icon}" alt="{$row->description}">
+                {/if}
             </td>
             <td>
                 <span>{$row->description}</span>