diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index eeadb7baf..3ff044de4 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -77,6 +77,7 @@
+
@@ -541,6 +542,7 @@
Designer
+
@@ -665,6 +667,13 @@
+
+
+
+
+
+
+
diff --git a/apps/TelerikNEXT/app-view-model.ts b/apps/TelerikNEXT/app-view-model.ts
index af4a40e33..08e540edd 100644
--- a/apps/TelerikNEXT/app-view-model.ts
+++ b/apps/TelerikNEXT/app-view-model.ts
@@ -1,7 +1,31 @@
import observable = require("data/observable");
import button = require("ui/button");
-var dayHeaders = ["WORKSHOPS", "CONFERENCE DAY 1", "CONFERENCE DAY 2"];
+interface ConferenceDay {
+ date: Date;
+ title: string;
+}
+
+interface Session {
+ title: string;
+ start: Date;
+ end: Date;
+ room: string;
+}
+
+interface Speaker {
+ name: string;
+ title: string;
+ company: string;
+ picture: string;
+}
+
+var conferenceDays: Array = [
+ { title: "WORKSHOPS", date: new Date(2015, 5, 3) },
+ { title: "CONFERENCE DAY 1", date: new Date(2015, 5, 4) },
+ { title: "CONFERENCE DAY 2", date: new Date(2015, 5, 5) }
+];
+
export class AppViewModel extends observable.Observable {
public selectedViewIndex: number;
@@ -18,7 +42,7 @@ export class AppViewModel extends observable.Observable {
return this._sessions;
}
- get speakers(): Array {
+ get speakers(): Array {
return speakers;
}
@@ -44,7 +68,7 @@ export class AppViewModel extends observable.Observable {
this._selectedIndex = value;
this.notify({ object: this, eventName: observable.knownEvents.propertyChange, propertyName: "selectedIndex", value: value });
- this.set("dayHeader", dayHeaders[value]);
+ this.set("dayHeader", conferenceDays[value].title);
if (this.search !== "") {
this.search = "";
@@ -56,7 +80,7 @@ export class AppViewModel extends observable.Observable {
private filter() {
this._sessions = sessions.filter(s=> {
- return s.start.getDay() === dates[this.selectedIndex].getDay()
+ return s.start.getDay() === conferenceDays[this.selectedIndex].date.getDay()
&& s.title.toLocaleLowerCase().indexOf(this.search.toLocaleLowerCase()) >= 0;
});
@@ -139,6 +163,10 @@ export class SessionModel extends observable.Observable implements Session {
this.notify({ object: this, eventName: observable.knownEvents.propertyChange, propertyName: "favorite", value: this._favorite });
}
}
+
+ get speakers(): Array {
+ return speakers.slice(0, 3);
+ }
}
var sessions: Array = [
@@ -473,23 +501,7 @@ var sessions: Array = [
room: "General Session"
})];
-var dates: Array = [new Date(2015, 5, 3), new Date(2015, 5, 4), new Date(2015, 5, 5)];
-
-interface Session {
- title: string;
- start: Date;
- end: Date;
- room: string;
-}
-
-interface Speakers {
- name: string;
- title: string;
- company: string;
- picture: string;
-}
-
-var speakers: Array = [
+var speakers: Array = [
{
name: "Todd Anglin",
title: "Vice President of Product Strategy",
diff --git a/apps/TelerikNEXT/app.css b/apps/TelerikNEXT/app.css
new file mode 100644
index 000000000..824f9de5e
--- /dev/null
+++ b/apps/TelerikNEXT/app.css
@@ -0,0 +1,57 @@
+Label, Button {
+ margin: 0 5;
+}
+
+Image {
+ margin: 5;
+}
+
+.header-image {
+ margin: 0;
+}
+
+.page-title {
+ font-size: 18;
+ color: #fac950;
+}
+
+.favourite-image{
+ width: 32;
+ height: 32;
+ vertical-align: center;
+ margin: 20;
+}
+
+.info {
+ color: #555555;
+}
+
+.info-bigger {
+ color: #555555;
+ font-size: 18;
+}
+
+.info-orange {
+ font-size: 16;
+ color: #A17201;
+}
+
+.break-row {
+ padding: 5;
+ background-color: #FFFBF0;
+}
+
+.list-view-row {
+ padding: 5;
+}
+
+.section-header {
+ color: #A17201;
+ margin: 5 5 0 10;
+}
+
+.horizontalLine {
+ height: 1;
+ background-color: #FAC950;
+ margin: 5 5 0 10;
+}
diff --git a/apps/TelerikNEXT/app.ts b/apps/TelerikNEXT/app.ts
index 643df21ff..741c77ffe 100644
--- a/apps/TelerikNEXT/app.ts
+++ b/apps/TelerikNEXT/app.ts
@@ -3,5 +3,8 @@
// Set the start module for the application
application.mainModule = "app/main-page";
+// TODO: This is only neede because of the deply script.
+application.cssFile = "app/TelerikNEXT/app.css";
+
// Start the application
application.start();
diff --git a/apps/TelerikNEXT/images/background.jpg b/apps/TelerikNEXT/images/background.jpg
index 3c8134b00..9a17becc5 100644
Binary files a/apps/TelerikNEXT/images/background.jpg and b/apps/TelerikNEXT/images/background.jpg differ
diff --git a/apps/TelerikNEXT/main-page.css b/apps/TelerikNEXT/main-page.css
deleted file mode 100644
index aab469377..000000000
--- a/apps/TelerikNEXT/main-page.css
+++ /dev/null
@@ -1,31 +0,0 @@
-Label, Button, Image {
- margin: 5;
-}
-
-.speakerPicture {
- width: 100;
- height: 100;
-}
-
-.speakerTitle, .speakerCompany {
- font-size: 18;
- color: #07ab9e;
-}
-
-.speakerName {
- font-size: 22;
- color: black;
-}
-
-.title {
- font-size: 22;
- color: black;
-}
-
-.sessionRow{
-
-}
-
-.breakRow{
- background-color: #FFFBF0;
-}
\ No newline at end of file
diff --git a/apps/TelerikNEXT/main-page.ts b/apps/TelerikNEXT/main-page.ts
index 4dc8a1ddf..52c116021 100644
--- a/apps/TelerikNEXT/main-page.ts
+++ b/apps/TelerikNEXT/main-page.ts
@@ -1,6 +1,8 @@
import observable = require("data/observable");
import pages = require("ui/page");
import gestures = require("ui/gestures");
+import listView = require("ui/list-view");
+import frame = require("ui/frame");
import appViewModel = require("./app-view-model");
export function pageLoaded(args: observable.EventData) {
@@ -13,4 +15,12 @@ export function toggleFavorite(args: gestures.GestureEventData) {
var item = args.view.bindingContext;
item.favorite = !item.favorite;
+}
+
+
+export function selectSession(args: listView.ItemEventData) {
+ frame.topmost().navigate({
+ moduleName: "app/session-page",
+ context: args.view.bindingContext
+ });
}
\ No newline at end of file
diff --git a/apps/TelerikNEXT/main-page.xml b/apps/TelerikNEXT/main-page.xml
index 76700bcb0..9ee25dca9 100644
--- a/apps/TelerikNEXT/main-page.xml
+++ b/apps/TelerikNEXT/main-page.xml
@@ -38,9 +38,9 @@
-