From b4253abf76512f772f55555f38b4affaa8d23a91 Mon Sep 17 00:00:00 2001
From: Coleman Watts <coleman@civicrm.org>
Date: Wed, 26 Feb 2020 14:25:23 -0500
Subject: [PATCH] News dashboard - Code cleanup to update js & css

- Use css class instead of inline style for unread items
- Use `CRM.cache` instead of `window.localStorage`
- Longer preview snippet for wide screens
---
 templates/CRM/Dashlet/Page/Blog.tpl | 77 ++++++++++++++---------------
 1 file changed, 36 insertions(+), 41 deletions(-)

diff --git a/templates/CRM/Dashlet/Page/Blog.tpl b/templates/CRM/Dashlet/Page/Blog.tpl
index 2c18545eda..df8e45a04d 100644
--- a/templates/CRM/Dashlet/Page/Blog.tpl
+++ b/templates/CRM/Dashlet/Page/Blog.tpl
@@ -12,6 +12,9 @@
   #civicrm-news-feed {
     border: 0 none;
   }
+  #civicrm-news-feed .crm-news-feed-unread .crm-news-feed-item-title {
+    font-weight: bold;
+  }
   #civicrm-news-feed .collapsed .crm-accordion-header {
     text-overflow: ellipsis;
     text-wrap: none;
@@ -45,7 +48,7 @@
       <div class="crm-accordion-wrapper collapsed">
         <div class="crm-accordion-header">
           <span class="crm-news-feed-item-title">{$article.title}</span>
-          <span class="crm-news-feed-item-preview"> - {if function_exists('mb_substr')}{$article.description|strip_tags|mb_substr:0:100}{else}{$article.description|strip_tags}{/if}</span>
+          <span class="crm-news-feed-item-preview"> - {if function_exists('mb_substr')}{$article.description|strip_tags|mb_substr:0:150}{else}{$article.description|strip_tags}{/if}</span>
         </div>
         <div class="crm-accordion-body">
           <div>{$article.description}</div>
@@ -62,53 +65,45 @@
     </div>
   {/if}
 </div>
-  
+
 </div>
 {literal}<script type="text/javascript">
   (function($, _) {
     $(function() {
       $('#civicrm-news-feed').tabs();
-      if (window.localStorage) {
-        var opened = localStorage.newsFeed ? JSON.parse(localStorage.newsFeed) : {};
-        $('#civicrm-news-feed ul.ui-tabs-nav a').each(function() {
-          var
-            $tab = $(this),
-            href = $tab.attr('href'),
-            $content = $(href),
-            $items = $('.crm-accordion-wrapper', $content),
-            key = href.substring(19),
-            count = 0;
-          if (!opened[key]) opened[key] = [];
-          if ($items.length) {
-            $items.each(function () {
-              var itemKey = $('.crm-news-feed-item-link a', this).attr('href');
-              if ($.inArray(itemKey, opened[key]) < 0) {
-                $('.crm-news-feed-item-title', this).css('font-weight', 'bold');
-                ++count;
-                $(this).one('crmAccordion:open', function () {
-                  $('.crm-news-feed-item-title', this).css('font-weight', '');
-                  $('em', $tab).text(--count);
-                  if (!count) {
-                    $('em', $tab).remove();
-                  }
-                  opened[key].push(itemKey);
-                  localStorage.newsFeed = JSON.stringify(opened);
-                });
-              }
-            });
-            if (count) {
-              $tab.html($tab.text() + ' <em>' + count + '</em>');
+      var opened = CRM.cache.get('newsFeed', {});
+      $('#civicrm-news-feed ul.ui-tabs-nav a').each(function() {
+        var
+          $tab = $(this),
+          href = $tab.attr('href'),
+          $content = $(href),
+          $items = $('.crm-accordion-wrapper', $content),
+          key = href.substring(19),
+          count = 0;
+        if (!opened[key]) opened[key] = [];
+        if ($items.length) {
+          $items.each(function () {
+            var itemKey = $('.crm-news-feed-item-link a', this).attr('href');
+            if ($.inArray(itemKey, opened[key]) < 0) {
+              $(this).addClass('crm-news-feed-unread');
+              ++count;
+              $(this).one('crmAccordion:open', function () {
+                $(this).removeClass('crm-news-feed-unread');
+                $('em', $tab).text(--count || '');
+                opened[key].push(itemKey);
+                CRM.cache.set('newsFeed', opened);
+              });
             }
-            // Remove items from localstorage that are no longer in the current feed
-            $.each(opened[key], function(i, itemKey) {
-              if (!$('a[href="' + itemKey + '"]', $content).length) {
-                opened[key][i] = null;
-              }
-            });
-            _.remove(opened[key], function(n) {return !n});
+          });
+          if (count) {
+            $tab.html($tab.text() + ' <em>' + count + '</em>');
           }
-        });
-      }
+          // Remove items from localstorage that are no longer in the current feed
+          _.remove(opened[key], function(itemKey) {
+            return !$('a[href="' + itemKey + '"]', $content).length;
+          });
+        }
+      });
     });
   })(CRM.$, CRM._);
 </script>{/literal}
-- 
2.25.1