indicate favorite stations

css/main.css

@@ -35,6 +35,11 @@
 	opacity: 0.3;
 }
 
+.starred {
+	background-image: url('../img/starred.svg');
+	opacity: 1;
+}
+
 .icon-stationfav:hover {
 	background-image: url('../img/starred.svg');
 	opacity: 1;

js/main.js

@@ -36,10 +36,7 @@ $(function(){
               url: baseUrl + '/stations/' + data[station]["id"],
               method: 'DELETE'
             }).done(function(){
-              if ($('li.nav-favorites').hasClass('active')){
-                $( "tr[data-id='"+data[station]["stationid"]+"']" ).slideUp();
-                $( "tr[data-id='"+data[station]["stationid"]+"']" ).remove();
-              };
+              $( "tr[data-id='"+data[station]["stationid"]+"']" ).find('.icon-stationfav').removeClass('starred');
             });
         };
       };
@@ -55,6 +52,8 @@ $(function(){
                 method: 'POST',
                 contentType: 'application/json',
                 data: JSON.stringify(station)
+        }).done(function(){
+          $( "tr[data-id='"+stationid+"']" ).find('.icon-stationfav').addClass('starred');
         });
       };
     });
@@ -76,11 +75,24 @@ $(function(){
   };
 
   function render_result(data){
+
+    var baseUrl = OC.generateUrl('/apps/radio');
+    $.get(baseUrl + '/stations', function ( fav_stations ) {
+
       $.each(data, function(i, station) {
+
+        var isstarred = ""
+        for (var fav_station in fav_stations) {
+          if (fav_stations[fav_station]["stationid"] == station['id']) {
+            isstarred = "starred";
+            break;
+          }
+        };
+
         $('tbody').append('<tr data-src='+station['url']+' data-id='+station['id']+'>\
                             <td class="favcolumn">\
                               <a href="#" class="favpls" onclick="station_fav();">\
-                              <span class="icon-stationfav"></span>\
+                                <span class="icon-stationfav ' + isstarred + '"></span>\
                                 <span class="hidden-visually">Favorite</span>\
                               </a>\
                             </td>\
@@ -94,6 +106,8 @@ $(function(){
                             </td>\
                           </tr>');
       });
+
+    });
   }
 
   function action_load_favorites(){