Fix url opengraph code for social wall

app/Resources/public/css/base.css

@@ -708,6 +708,18 @@ a.personal_agenda:hover, a.personal_agenda:hover {
 .social-home-anonymous-online {
     width: 200px;
 }
+.social-thumbnail {
+    padding: 0px;
+}
+.social-title {
+    font-size: 18px;
+    font-family: helvetica, arial, sans-serif;
+    color: #000;
+}
+.social-description {
+    padding: 8px;
+    color: #000;
+}
 
 .menulist {
     margin: 0px;

main/inc/ajax/social.ajax.php

@@ -225,13 +225,15 @@ switch ($action) {
         // Read the Url using OpenGraph and returns the hyperlinks content
     case 'readUrlWithOpenGraph':
         $url = isset($_POST['social_wall_new_msg_main']) ? $_POST['social_wall_new_msg_main'] : '';
+        $url = trim($url);
         $html = '';
-        if (SocialManager::verifyUrl($url) == true){
+        if (SocialManager::verifyUrl($url) == true && !$_SESSION['ogSearch']) {
+            $_SESSION['ogSearch'] = true;
             $html = Security::remove_XSS(
                 SocialManager::readContentWithOpenGraph($url)
             );
         }
-        echo utf8_decode($html);
+        echo $html;
         break;
     default:
         echo '';

main/inc/lib/social.lib.php

@@ -1565,16 +1565,21 @@ class SocialManager extends UserManager
      */
     public static function readContentWithOpenGraph($link)
     {
+        $domain = parse_url($link);
+        $domain['scheme'] = isset($domain['scheme']) ? $domain['scheme'] : 'http';
+        $domain['host'] = isset($domain['host']) ? $domain['host'] : $domain['path'] ? $domain['path'] : $link;
+
         $graph = OpenGraph::fetch($link);
         if (!$graph) {
             return false;
         }
+
         $url = $graph->url;
         $image = $graph->image;
-        $domain = empty($url) ? parse_url($link) : parse_url($url);
+        $description = $graph->description;
         $domain = $domain['scheme'].'://'.$domain['host'];
         // Trick to verify if the Image Url Exist because of some bad metatag dev
-        if (self::verifyUrl($image) == false){
+        if (self::verifyUrl($image) == false && $image){
             if (!($image[0] == '/')){
                 $domain = $domain . '/';
             }
@@ -1582,11 +1587,13 @@ class SocialManager extends UserManager
         }
         $title = $graph->title;
         
-        $html  = '<div class="thumbnail">';
-        $html .= '<a target="_blank" href="'.$link.'"><h3>'.$title.'</h3>';
-        $html .= empty($image) ? '' : '<img alt="" src="'.$image.'" /></a>';
-        $html .= empty($graph->description) ? '' : '<p class="description">'.$graph->description.'</p>';
-        $html .= '<a href="'.$link.'">'.$link.'</a>';
+        $html  = '<div class="thumbnail social-thumbnail">';
+        $html .= empty($image) ? '' : '<a target="_blank" href="'.$url.'"><img class="img-responsive" src="'.$image.'" /></a>';
+        $html .= '<div class="social-description">';
+        $html .= '<a target="_blank" href="'.$url.'"><h5 class="social-title"><b>'.$title.'</b></h5></a>';
+        $html .= empty($description) ? '' : '<p class="description">'.$description.'</p>';
+        $html .= empty($description) ? '' : '<p class="description">'.$description.'</p>';
+        $html .= '</div>';
         $html .= '</div>';
 
         return $html;

main/social/profile.php

@@ -27,6 +27,10 @@ $show_full_profile = true;
 //social tab
 $this_section = SECTION_SOCIAL;
 
+//Default OpenGraph search time
+unset($_SESSION['ogSearch']);
+$_SESSION['ogSearch'] = false;
+
 //Initialize blocks
 $social_extra_info_block = null;
 $social_course_block = null;
@@ -301,8 +305,11 @@ $socialAutoExtendLink = Display::url(
 // Added a Jquery Function to return the Preview of OpenGraph URL Content
 $htmlHeadXtra[] = '<script>
 $(document).ready(function() {
-    
-    $("[name=\'social_wall_new_msg_main\']").on("paste", function(e) {
+
+    var getUrl = $("[name=\'social_wall_new_msg_main\']");
+    var matchUrl = /https?:\/\/w{0,3}\w*?\.(\w*?\.)?\w{2,3}\S*|www\.(\w*?\.)?\w*?\.\w{2,3}\S*|(\w*?\.)?\w*?\.\w{2,3}[\/\?]\S*/ ;
+
+    getUrl.on("paste", function(e) {
         $.ajax({
             contentType: "application/x-www-form-urlencoded",
             beforeSend: function() {
@@ -332,6 +339,41 @@ $(document).ready(function() {
             }
         });
     });
+
+    getUrl.keyup(function(e) {
+        if (e.keyCode == 32) {
+            if (matchUrl.test(getUrl.val())) {
+                $.ajax({
+                    contentType: "application/x-www-form-urlencoded",
+                    beforeSend: function() {
+                        $("[name=\'wall_post_button\']").prop( "disabled", true );
+                        $(".panel-preview").hide();
+                        $(".spinner").html("' .
+                            '<div class=\'text-center\'>' .
+                                '<em class=\'fa fa-spinner fa-pulse fa-1x\'></em>' .
+                                '<p>' . get_lang('Loading') . ' ' . get_lang('Preview') . '</p>' .
+                            '</div>' .
+                        '");
+                    },
+                    type: "POST",
+                    url: "' . api_get_path(WEB_AJAX_PATH) . 'social.ajax.php?a=readUrlWithOpenGraph",
+                    data: "social_wall_new_msg_main=" + getUrl.val(),
+                    success: function(response) {
+                        $("[name=\'wall_post_button\']").prop( "disabled", false );
+                        if (!response == false) {
+                            $(".spinner").html("");
+                            $(".panel-preview").show();
+                            $(".url_preview").html(response);
+                            $("[name=\'url_content\']").val(response);
+                            $(".url_preview img").addClass("img-responsive");
+                        } else {
+                            $(".spinner").html("");
+                        }
+                    }
+                });
+            }
+        }
+    });
 });
 </script>';