Merge branch 'developer' into production

app/code/Joshine/InstagramFeed/Block/ApiAddress.php

@@ -74,6 +74,6 @@ class ApiAddress extends Template
 
     public function getMediaUrl($token, $uid): string
     {
-        return self::INSTAGRAM_GRAPH_API_URL."/v16.0/{$uid}/media?access_token={$token}&fields=caption,id,is_shared_to_feed,media_type,media_url,permalink,thumbnail_url,timestamp,username&limit=6";
+        return self::INSTAGRAM_GRAPH_API_URL."/v16.0/{$uid}/media?access_token={$token}&fields=caption,id,is_shared_to_feed,media_type,media_url,permalink,thumbnail_url,timestamp,username&limit=12";
     }
 }
\ No newline at end of file

app/code/Joshine/InstagramFeed/Block/MediaFeed.php

@@ -149,12 +149,27 @@ class MediaFeed extends Template {
     public function getMedia() {
         $cache = $this->getMediaByCache();
         if (!empty($cache)) {
-            return $cache;
+            return $this->encodePostContent($cache);
         }
+
         $feed = $this->getMediaByApi();
         if (isset($feed['data'])) {
             $this->cacheFeed($this->_json->serialize($feed));
+        } else {
+            return [];
+        }
+        return $this->encodePostContent($feed);
+    }
+
+    public function encodePostContent($feed)
+    {
+        foreach ($feed['data'] as $index => $row) {
+            if (isset($row['caption'])) {
+                $feed['data'][$index]["caption"] = base64_encode($row["caption"]);
+            }
         }
+        $feed['data'] = array_merge($feed['data'], []);
         return $feed;
     }
+
 }
\ No newline at end of file

app/code/Joshine/InstagramFeed/view/frontend/templates/mediafeed.phtml

@@ -211,7 +211,7 @@ $media = $block->getMedia()['data'];
                     <div class="instagram-feed-block">
                         <?php foreach ($media as $row): ?>
                         <div class="joshine-col-lg-2 joshine-col-md-2 joshine-col-sm-3 joshine-col-xs-3" style="padding-right: 2px; padding-bottom: 2px;">
-                            <div class="instagram-media-wrapper "  data-feed-data='<?= json_encode($row) ?>'>
+                            <div class="instagram-media-wrapper "  data-feed-data='<?=  json_encode($row, true) ?>'>
                                 <img class="instagram-media-url"
                                      src=" <?= $row["thumbnail_url"] ?? $row["media_url"] ?> ">
                                 <?php if (isset($row["media_type"]) && $row["media_type"] == 'VIDEO' ) : ?>
@@ -270,15 +270,17 @@ $media = $block->getMedia()['data'];
 <script>
     require([
         'jquery', 'ko', 'mage/translate'
-    ], function ($, ko) {
+    ], function ($, ko, _) {
         $("#instagram-modal-close").on('click', function () {
             $("#instagram-modal").hide()
         });
         $(".instagram-media-wrapper").on('click', function () {
             let data = $(this).data("feed-data");
-            console.log(data);
             let link    = data.permalink;
-            let content = data.caption;
+            let content = '';
+            if (data.hasOwnProperty('caption')) {
+                content = decodeURIComponent(escape(atob(data.caption)));
+            }
             let media   = data.media_url;
             let date    = data.timestamp;
             let type    = data.media_type;
@@ -296,5 +298,6 @@ $media = $block->getMedia()['data'];
             $("#instagram-caption").html("").html(content);
             $("#instagram-modal").show()
         });
+
     });
 </script>
\ No newline at end of file