Add a button to quickly play a channel in EPG view (#3926)

diff --git a/src/webui/static/app/epg.js b/src/webui/static/app/epg.js
index a7809fb7393bf99a6c24e0a8746d27cc85b62f0a..91c0641069d3ad310344daa41c3f535f5fc4956f 100644 (file)
--- a/src/webui/static/app/epg.js
+++ b/src/webui/static/app/epg.js
@@ -361,12 +361,16 @@ tvheadend.epg = function() {
     var detailsfcn = function(grid, rec, act, row) {
         new tvheadend.epgDetails(grid.getStore().getAt(row).data);
     };
+    var watchfcn = function(grid, rec, act, row) {
+        var item = grid.getStore().getAt(row);
+        new tvheadend.VideoPlayer(item.data.channelUuid);
+    };
 
     var actions = new Ext.ux.grid.RowActions({
         id: 'details',
         header: _('Details'),
         tooltip: _('Details'),
-        width: 45,
+        width: 67,
         dataIndex: 'actions',
         callbacks: {
             'recording':      detailsfcn,
@@ -381,6 +385,11 @@ tvheadend.epg = function() {
                 qtip: _('Broadcast details'),
                 cb: detailsfcn
             },
+            {
+                iconCls: 'watchTv',
+                qtip: _('Watch TV'),
+                cb: watchfcn
+            },
             {
                 iconIndex: 'dvrState'
             }
@@ -982,6 +991,9 @@ tvheadend.epg = function() {
                    /* do not restore sorting and filters */
                    state.sort = {};
                    state.filters = {};
+                   /* Otherwise this non-resizable column will not expand to newly set width */
+                   if (state.columns)
+                       state.columns[0].width = actions.width;
                }
             }
         }

diff --git a/src/webui/static/app/tvheadend.js b/src/webui/static/app/tvheadend.js
index fdfc6010e0c442041019fb14da19df79da1825b4..f92fa096f26bcfe59f7574f09439abf0508eeb27 100644 (file)
--- a/src/webui/static/app/tvheadend.js
+++ b/src/webui/static/app/tvheadend.js
@@ -487,11 +487,17 @@ tvheadend.playLink = function(link, title) {
 /**
  * Displays a mediaplayer using the html5 video element
  */
-tvheadend.VideoPlayer = function(url) {
+tvheadend.VideoPlayer = function(channelId) {
 
     var videoPlayer = new tv.ui.VideoPlayer({
         params: { }
     });
+    
+    var initialChannelName;
+    if (channelId) {
+        var record = tvheadend.channels.getById(channelId);
+        initialChannelName = record.data.val;
+    }
 
     var selectChannel = new Ext.form.ComboBox({
         loadingText: _('Loading...'),
@@ -501,7 +507,8 @@ tvheadend.VideoPlayer = function(url) {
         mode: 'local',
         editable: true,
         triggerAction: 'all',
-        emptyText: _('Select channel...')
+        emptyText: _('Select channel...'),
+        value: initialChannelName
     });
 
     selectChannel.on('select', function(c, r) {
@@ -631,8 +638,13 @@ tvheadend.VideoPlayer = function(url) {
         win.getTopToolbar().add(new Ext.Toolbar.Spacer());
         win.getTopToolbar().add(new Ext.Toolbar.Spacer());
         win.getTopToolbar().add(sliderLabel);
-    });
 
+        // Zap to initial channel when the player is ready
+        if (channelId) {
+            videoPlayer.zapTo(channelId);
+        }
+    });
+    
     win.on('close', function() {
         videoPlayer.stop();
     });