Persist favourites

apps/TelerikNEXT/app-view-model.ts

@@ -1,5 +1,6 @@
 import observable = require("data/observable");
 import dialogs = require("ui/dialogs");
+import localSettings = require("local-settings");
 import button = require("ui/button");
 var everlive = require("./lib/everlive");
 
@@ -32,6 +33,38 @@ var conferenceDays: Array<ConferenceDay> = [
 ];
 var sessions: Array<SessionModel> = new Array<SessionModel>();
 
+var FAVOURITES = "FAVOURITES";
+var favourites: Array<string>;
+try {
+    favourites = <Array<string>>JSON.parse(localSettings.getString(FAVOURITES, "[]"));
+}
+catch (error) {
+    console.log("Error while retrieveing favourites: " + error);
+    favourites = new Array<string>();
+    updateFavourites()
+}
+
+function addToFavourites(session: SessionModel) {
+    if (favourites.indexOf(session.Id) < 0) {
+        favourites.push(session.Id);
+        updateFavourites();
+    }
+}
+
+function removeFromFavourites(session: SessionModel) {
+    var index = favourites.indexOf(session.Id);
+    if (index >= 0) {
+        favourites.splice(index, 1);
+        updateFavourites();
+    }
+}
+
+function updateFavourites() {
+    var newValue = JSON.stringify(favourites);
+    localSettings.setString(FAVOURITES, newValue);
+}
+
+
 var el = new everlive("mzacGkKPFlZUfbMq");
 var expandExp = {
     "speakers": true
@@ -42,14 +75,19 @@ el.data('NextSessions').expand(expandExp).get().then(
         var sessionsFromEvelive: Array<Session> = <Array<Session>> data.result;
 
         for (var i = 0; i < sessionsFromEvelive.length; i++) {
-            sessions.push(new SessionModel(sessionsFromEvelive[i]));
+            var newSession = new SessionModel(sessionsFromEvelive[i]);
+            if (favourites.indexOf(newSession.Id) >= 0) {
+                newSession.favorite = true;
             }
+            sessions.push(newSession);
+        }
+
         appModel.onDataLoaded();
 
     }, function (error) {
         dialogs.alert("Could not load sessions. Error: " + error);
     }
-);
+    );
 
 
 export class AppViewModel extends observable.Observable {
@@ -213,4 +251,14 @@ export class SessionModel extends observable.Observable implements Session {
             this.notify({ object: this, eventName: observable.knownEvents.propertyChange, propertyName: "favorite", value: this._favorite });
         }
     }
+
+    public toggleFavorite() {
+        this.favorite = !this.favorite;
+        if (this.favorite) {
+            addToFavourites(this);
+        }
+        else {
+            removeFromFavourites(this);
+        }
+    }
 }

apps/TelerikNEXT/main-page.ts

@@ -11,16 +11,14 @@ export function pageLoaded(args: observable.EventData) {
     page.bindingContext = appViewModel.appModel;
 }
 
-export function toggleFavorite(args: gestures.GestureEventData) {
-    var item = <appViewModel.SessionModel>args.view.bindingContext;
-
-    item.favorite = !item.favorite;
-}
-
-
 export function selectSession(args: listView.ItemEventData) { 
     frame.topmost().navigate({
         moduleName: "app/session-page",
         context: args.view.bindingContext
     });
 }
+
+export function toggleFavorite(args: gestures.GestureEventData) {
+    var item = <appViewModel.SessionModel>args.view.bindingContext;
+    item.toggleFavorite();
+}

apps/TelerikNEXT/session-page.ts

@@ -11,6 +11,5 @@ export function pageNavigatedTo(args: observable.EventData) {
 
 export function toggleFavorite(args: gestures.GestureEventData) {
     var item = <appViewModel.SessionModel>args.view.bindingContext;
-
+    item.toggleFavorite();
-    item.favorite = !item.favorite;
 }

apps/TelerikNEXT/session-page.xml

@@ -36,7 +36,7 @@
 
         <!-- Speakers -->
         <Label text="Speakers" cssClass="section-header" row="2" col="1" />
-        <ListView items="{{ speakers }}" row="3" colSpan="2" height="{{ speakers.length * 76 }}" selectedBackgroundColor="#fac950" separatorColor="#FFFFFF">
+        <ListView items="{{ speakers }}" row="3" colSpan="2" height="{{ speakers.length * 72 }}" selectedBackgroundColor="#fac950" separatorColor="#FFFFFF">
           <ListView.itemTemplate>
             <GridLayout columns="65, *" cssClass="list-view-row">
               <Image src="{{ '~/app/images/' + picture }}" verticalAlignment="top"/>