From a33b608ce4e7e97b93367b53b6ae68bb7aa3c1c2 Mon Sep 17 00:00:00 2001
From: vakrilov <alexander.vakrilov@telerik.com>
Date: Sat, 21 Mar 2015 19:15:15 +0200
Subject: [PATCH] Persist favourites

---
 apps/TelerikNEXT/app-view-model.ts | 52 +++++++++++++++++-
 apps/TelerikNEXT/main-page.ts      | 12 ++---
 apps/TelerikNEXT/main-page.xml     | 84 +++++++++++++++---------------
 apps/TelerikNEXT/session-page.ts   |  3 +-
 apps/TelerikNEXT/session-page.xml  |  2 +-
 5 files changed, 99 insertions(+), 54 deletions(-)

diff --git a/apps/TelerikNEXT/app-view-model.ts b/apps/TelerikNEXT/app-view-model.ts
index 3de982468..3ca3d6106 100644
--- a/apps/TelerikNEXT/app-view-model.ts
+++ b/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);
+        }
+    }
 }
diff --git a/apps/TelerikNEXT/main-page.ts b/apps/TelerikNEXT/main-page.ts
index ea2046184..a7ea12436 100644
--- a/apps/TelerikNEXT/main-page.ts
+++ b/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();
 }
\ No newline at end of file
diff --git a/apps/TelerikNEXT/main-page.xml b/apps/TelerikNEXT/main-page.xml
index d46e54618..a4b05e9f7 100644
--- a/apps/TelerikNEXT/main-page.xml
+++ b/apps/TelerikNEXT/main-page.xml
@@ -29,61 +29,61 @@
 
         <GridLayout rows="auto, auto, *" visibility="{{ selectedViewIndex !== 2 ? 'visible' : 'collapsed' }}">
 
-        <StackLayout style="background-image: url('~/app/images/background.jpg')">
-          <SegmentedBar selectedIndex="{{ selectedIndex }}"  style="background-color: transparent;color: white;" selectedBackgroundColor="#fac950">
-            <SegmentedBar.items>
-              <SegmentedBarItem title="MAY 3" />
-              <SegmentedBarItem title="MAY 4" />
-              <SegmentedBarItem title="MAY 5" />
-            </SegmentedBar.items>
-          </SegmentedBar>
+    <StackLayout style="background-image: url('~/app/images/background.jpg')">
+      <SegmentedBar selectedIndex="{{ selectedIndex }}"  style="background-color: transparent;color: white;" selectedBackgroundColor="#fac950">
+        <SegmentedBar.items>
+          <SegmentedBarItem title="MAY 3" />
+          <SegmentedBarItem title="MAY 4" />
+          <SegmentedBarItem title="MAY 5" />
+        </SegmentedBar.items>
+      </SegmentedBar>
 
-          <Label cssClass="page-title" horizontalAlignment="center" margin="15">
-            <Label.formattedText>
-              <FormattedString>
-                <FormattedString.spans>
-                  <Span text="{{ dayHeader }}" fontAttributes="Bold" />
-                </FormattedString.spans>
-              </FormattedString>
-            </Label.formattedText>
-          </Label>
-        </StackLayout>
+      <Label cssClass="page-title" horizontalAlignment="center" margin="15">
+        <Label.formattedText>
+          <FormattedString>
+            <FormattedString.spans>
+              <Span text="{{ dayHeader }}" fontAttributes="Bold" />
+            </FormattedString.spans>
+          </FormattedString>
+        </Label.formattedText>
+      </Label>
+    </StackLayout>
 
-        <SearchBar text="{{ search }}" hint="Search" style="background-color: #fac950; color: #fac950;" textFieldBackgroundColor="white" row="1" />
+    <SearchBar text="{{ search }}" hint="Search" style="background-color: #fac950; color: #fac950;" textFieldBackgroundColor="white" row="1" />
 
-        <ListView items="{{ sessions }}" row="2" separatorColor="#fac950" itemTap="selectSession">
-          <ListView.itemTemplate>
-            <GridLayout columns="auto, *" cssClass="{{ canBeFavorited ? 'list-view-row' : 'break-row' }}">
+    <ListView items="{{ sessions }}" row="2" separatorColor="#fac950" itemTap="selectSession">
+      <ListView.itemTemplate>
+        <GridLayout columns="auto, *" cssClass="{{ canBeFavorited ? 'list-view-row' : 'break-row' }}">
 
-              <Image src="{{ favorite ? '~/app/images/fav.png' : '~/app/images/addfav.png' }}" 
-                     visibility="{{ canBeFavorited ? 'visible' : 'collapsed' }}" 
-                     tap="toggleFavorite" cssClass="favourite-image" />
+          <Image src="{{ favorite ? '~/app/images/fav.png' : '~/app/images/addfav.png' }}"
+                 visibility="{{ canBeFavorited ? 'visible' : 'collapsed' }}"
+                 tap="toggleFavorite" cssClass="favourite-image" />
 
-              <StackLayout col="1">
+          <StackLayout col="1">
 
-                <Label cssClass="info-orange">
-                  <Label.formattedText>
-                    <FormattedString>
-                      <FormattedString.spans>
-                        <Span text="{{ range }}" fontAttributes="Bold" />
-                      </FormattedString.spans>
-                    </FormattedString>
-                  </Label.formattedText>
-                </Label>
+            <Label cssClass="info-orange">
+              <Label.formattedText>
+                <FormattedString>
+                  <FormattedString.spans>
+                    <Span text="{{ range }}" fontAttributes="Bold" />
+                  </FormattedString.spans>
+                </FormattedString>
+              </Label.formattedText>
+            </Label>
 
-                <Label text="{{ title }}" textWrap="true" cssClass="info-bigger"/>
+            <Label text="{{ title }}" textWrap="true" cssClass="info-bigger"/>
 
-                <Label visibility="{{ room ? 'visible' : 'collapsed' }}" text="{{ room }}" cssClass="info-orange" />
+            <Label visibility="{{ room ? 'visible' : 'collapsed' }}" text="{{ room }}" cssClass="info-orange" />
 
-              </StackLayout>
+          </StackLayout>
 
-            </GridLayout>
-          </ListView.itemTemplate>
-        </ListView>
+        </GridLayout>
+      </ListView.itemTemplate>
+    </ListView>
 
     <ActivityIndicator busy="{{ isLoading }}" row="2" horizontalAlignment="center" verticalAlignment="center" />
 
-      </GridLayout>
+  </GridLayout>
 
         <Border style="background-color: #053140;" visibility="{{ selectedViewIndex === 2 ? 'visible' : 'collapsed' }}">
           <Image src="~/app/images/logo.png" margin="20" />
diff --git a/apps/TelerikNEXT/session-page.ts b/apps/TelerikNEXT/session-page.ts
index bd9539238..b8c87a427 100644
--- a/apps/TelerikNEXT/session-page.ts
+++ b/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.favorite = !item.favorite;
+    item.toggleFavorite();
 }
\ No newline at end of file
diff --git a/apps/TelerikNEXT/session-page.xml b/apps/TelerikNEXT/session-page.xml
index 02be3e0ea..ed558404b 100644
--- a/apps/TelerikNEXT/session-page.xml
+++ b/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"/>