Merge pull request AdguardTeam#528 in EXTENSIONS/browser-extension from fix/1499 to master

* commit 'dc4803e787503f1a2ec294088ae34ebd65caeead':
  fix/1499 remove nested selector
  fix/1499 fix css classes naming
  fix/1499 add class to link
  fix/1499 fix animation

Author: maximtop

Extension/lib/pages/options.js

@@ -1339,6 +1339,7 @@ var AntiBannerFilters = function (options) {
 
     function updateAntiBannerFilters(e) {
         e.preventDefault();
+        document.querySelector('.settings-actions__update-button').classList.add('settings-actions__update-button--spinning');
         contentPage.sendMessage({ type: 'checkAntiBannerFiltersUpdate' }, () => {
             setLastUpdatedTimeText(Date.now());
         });
@@ -1593,16 +1594,18 @@ var AntiBannerFilters = function (options) {
         filterElements.forEach((filterElement) => {
             filterElement.querySelector('.preloader').classList.add('active');
         });
-        document.querySelector('.settings-actions--update-filters a').classList.add('active');
     }
 
     function onFilterDownloadFinished(filter) {
         getCategoryElement(filter.groupId).querySelector('.preloader').classList.remove('active');
         updateFilterMetadata(filter);
-        document.querySelector('.settings-actions--update-filters a').classList.remove('active');
         setLastUpdatedTimeText(filter.lastUpdateTime);
     }
 
+    function onFiltersUpdateCheckReady() {
+        document.querySelector('.settings-actions__update-button').classList.remove('settings-actions__update-button--spinning');
+    }
+
     return {
         render: renderCategoriesAndFilters,
         updateRulesCountInfo,
@@ -1611,6 +1614,7 @@ var AntiBannerFilters = function (options) {
         onFilterDownloadStarted,
         onFilterDownloadFinished,
         renderCustomFilterPopup,
+        onFiltersUpdateCheckReady,
     };
 };
 
@@ -2325,6 +2329,7 @@ var initPage = function (response) {
             EventNotifierTypes.SYNC_STATUS_UPDATED,
             EventNotifierTypes.SETTINGS_UPDATED,
             EventNotifierTypes.SETTING_UPDATED,
+            EventNotifierTypes.FILTERS_UPDATE_CHECK_READY,
         ];
 
         createEventListener(events, function (event, options) {
@@ -2369,6 +2374,10 @@ var initPage = function (response) {
                 case EventNotifierTypes.SETTINGS_UPDATED:
                     controller.onSettingsImported(options);
                     break;
+                case EventNotifierTypes.FILTERS_UPDATE_CHECK_READY: {
+                    controller.antiBannerFilters.onFiltersUpdateCheckReady();
+                    break;
+                }
                 default:
                     break;
             }

Extension/lib/ui-service.js

@@ -707,6 +707,7 @@ adguard.ui = (function (adguard) { // jshint ignore:line
         const successCallback = showPopup
             ? (updatedFilters) => {
                 adguard.listeners.notifyListeners(showPopupEvent, true, updatedFilters);
+                adguard.listeners.notifyListeners(adguard.listeners.FILTERS_UPDATE_CHECK_READY);
             }
             : (updatedFilters) => {
                 if (updatedFilters && updatedFilters.length > 0) {
@@ -717,6 +718,7 @@ adguard.ui = (function (adguard) { // jshint ignore:line
         const errorCallback = showPopup
             ? () => {
                 adguard.listeners.notifyListeners(showPopupEvent, false);
+                adguard.listeners.notifyListeners(adguard.listeners.FILTERS_UPDATE_CHECK_READY);
             }
             : () => {};
 

Extension/lib/utils/notifier.js

@@ -42,6 +42,7 @@ adguard.listeners = (function () {
         UPDATE_USER_FILTER_RULES: 'event.update.user.filter.rules',
         UPDATE_WHITELIST_FILTER_RULES: 'event.update.whitelist.filter.rules',
         SETTING_UPDATED: 'event.update.setting.value',
+        FILTERS_UPDATE_CHECK_READY: 'event.update.filters.check',
         // Log events
         TAB_ADDED: 'log.tab.added',
         TAB_CLOSE: 'log.tab.close',

Extension/pages/css/style.css

@@ -152,7 +152,7 @@
   right: 0;
   top: calc(50% - 10px);
 }
-.settings-actions--update-filters a {
+.settings-actions__update-button {
   font-size: 0;
   display: block;
   width: 22px;
@@ -161,7 +161,7 @@
   background-repeat: no-repeat;
   background-image: url(../images/reload-ico.svg);
 }
-.settings-actions--update-filters a.active {
+.settings-actions__update-button--spinning {
   animation: clockwise 2s linear infinite;
 }
 .setting-desc {

Extension/pages/options.html

@@ -283,7 +283,7 @@
                         <span id="filtersRulesInfo"></span>
                         <div id="lastUpdateTime" class="upd"></div>
                         <div class="settings-actions settings-actions--update-filters">
-                            <a href="#" i18n-title="options_update_antibanner_filters"></a>
+                            <a href="#" class="settings-actions__update-button" i18n-title="options_update_antibanner_filters"></a>
                         </div>
                     </div>
                     <span i18n="options_antibanner"></span>