Add info bar for episode; some rearrangement of model/view code

diff --git a/source/data/EpisodeCollection.js b/source/data/EpisodeCollection.js
new file mode 100644 (file)
index 0000000..0b665c7
--- /dev/null
+++ b/source/data/EpisodeCollection.js
@@ -0,0 +1,5 @@
+enyo.kind({
+    name: "EpisodeCollection",
+    kind: "enyo.Collection",
+    model: "EpisodeModel"
+});

diff --git a/source/data/EpisodeModel.js b/source/data/EpisodeModel.js
new file mode 100644 (file)
index 0000000..bf5b70e
--- /dev/null
+++ b/source/data/EpisodeModel.js
@@ -0,0 +1,16 @@
+enyo.kind({
+    name: "EpisodeModel",
+    kind: "enyo.Model",
+    computed: {
+        longTitle: ["number", "title"],
+        fileURL: ["file"]
+    },
+    attributes: {
+        longTitle: function() {
+            return "Episode " + this.get('number') + " - " + this.get('title');
+        },
+        fileURL: function() {
+            return nettv.Util.addBase(this.get('file'));
+        }
+    }
+});

diff --git a/source/data/package.js b/source/data/package.js
index 09e33f4..cb2f520 100644 (file)
--- a/source/data/package.js
+++ b/source/data/package.js
@@ -1,4 +1,6 @@
 enyo.depends(
     "ShowModel.js",
-    "ShowCollection.js"
+    "ShowCollection.js",
+    "EpisodeModel.js",
+    "EpisodeCollection.js"
 );

diff --git a/source/nettv/EpisodeItem.js b/source/nettv/EpisodeItem.js
index d5ed82b..e6ecbee 100644 (file)
--- a/source/nettv/EpisodeItem.js
+++ b/source/nettv/EpisodeItem.js
@@ -3,7 +3,7 @@ enyo.kind({
     kind: "moon.LabeledTextItem",
     spotlight: true,
     bindings: [
-        {from: ".model.number", to: ".label", transform: function(n) { return "Episode " + n; }},
-        {from: ".model.title", to: ".text"}
+        {from: ".model.longTitle", to: ".label"},
+        {from: ".model.description", to: ".text"}
     ]
 });

diff --git a/source/nettv/EpisodeListing.js b/source/nettv/EpisodeListing.js
index 14755f5..dbaf714 100644 (file)
--- a/source/nettv/EpisodeListing.js
+++ b/source/nettv/EpisodeListing.js
@@ -3,7 +3,7 @@ enyo.kind({
     kind: "moon.Panel",
     smallHeader: true,
     published: {
-        collection: null
+        show: null
     },
     components: [
         {name: "episodeList", kind: "moon.DataList", components: [
@@ -11,9 +11,16 @@ enyo.kind({
         ]}
     ],
     bindings: [
-        {from: ".collection", to: ".$.episodeList.collection"}
+        {from: ".show.episodes", to: ".$.episodeList.collection",
+         transform: function(v) { return new EpisodeCollection(v); }},
+        {from: ".show.name", to: ".title"},
+        {from: ".show.description", to: ".titleBelow"},
+        {from: ".show.thumbURL", to: ".headerBackgroundSrc"}
     ],
     playEpisode: function(inSender, inEvent) {
-        this.bubble('onPlayEpisode', this.collection.at(inEvent.index));
+        this.bubble('onPlayEpisode', {
+            show: this.show,
+            episode: this.$.episodeList.collection.at(inEvent.index)
+        });
     }
 });

diff --git a/source/nettv/Main.js b/source/nettv/Main.js
index fd79f82..ef0aabf 100644 (file)
--- a/source/nettv/Main.js
+++ b/source/nettv/Main.js
@@ -10,22 +10,26 @@ enyo.kind({
             {name: "showListing", kind: "nettv.ShowListing"}
         ]},
         {name: "player", kind: "moon.VideoPlayer", classes: "enyo-fit", showing: false,
-         shakeAndWake: true, components: [
+         shakeAndWake: true, infoComponents: [
+            {kind: "moon.VideoInfoBackground", components: [
+                {name: "infoHeader", kind: "moon.VideoInfoHeader"}
+            ]}
+         ], components: [
             {kind: "moon.IconButton", icon: "closex", ontap: "closePlayer", small: false}
         ]}
     ],
     showEpisodes: function(inSender, inEvent) {
         this.$.navigationPanels.popPanels(1);
         this.$.navigationPanels.pushPanel({name: "episodeListing", kind: "nettv.EpisodeListing"}, {
-            title: inEvent.get('name'),
-            titleBelow: inEvent.get('description'),
-            collection: new enyo.Collection(inEvent.get('episodes')),
-            headerBackgroundSrc: inEvent.get('thumbURL')
+            show: inEvent
         });
     },
     playEpisode: function(inSender, inEvent) {
         this.$.player.show();
-        this.$.player.set('src', nettv.Util.addBase(inEvent.get('file')));
+        this.$.player.set('src', inEvent.episode.get('fileURL'));
+        this.$.infoHeader.set('title', inEvent.show.get('name'));
+        this.$.infoHeader.set('subTitle', inEvent.episode.get('longTitle'));
+        this.$.infoHeader.set('description', inEvent.episode.get('description'));
         this.$.player.play();
     },
     closePlayer: function(inSender, inEvent) {