[TIMOB-14123] Android: Add support for creating video thumbnails

[ashcoding]

No description provided.

[ashcoding]

Jira Ticket: https://jira.appcelerator.org/browse/TIMOB-14123

[ashcoding]

Sample Code:

// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');

// create base UI tab and root window
//
function newWindow(){
var vidWin = Titanium.UI.createWindow({
    title : 'Tab 1',
    backgroundColor : '#fff'
});

var activeMovie = Titanium.Media.createVideoPlayer({
    top : 0,
    backgroundColor: 'red',
    height : 300,
    width : 300,
    //url : 'ten_sec_test.mp4'
    // url  :'http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4'
});

activeMovie.url = 'http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4';
//activeMovie.url = 'ten_sec_test.mp4';

var scrollView = Ti.UI.createScrollView({
    contentWidth : 'auto',
    contentHeight : 'auto',
    layout : 'horizontal',
    scrollType : 'horizontal'
});


activeMovie.requestThumbnailImagesAtTimes([0, 20, 59, 47, 22], Titanium.Media.VIDEO_TIME_OPTION_NEAREST_KEYFRAME, function(response) {
            Ti.API.info("Thumbnail callback called, success = " + response.success);
             Ti.API.info("Thumbnail callback called, time = " + response.time);
             Ti.API.info("Thumbnail callback called, code = " + response.code);
            if(response.success) {
                 var imgView = Titanium.UI.createImageView({
                    image : response.image
                });
                scrollView.add(imgView);

            }
        });
var cancelbtn = Ti.UI.createButton({bottom:0,width:200,height:50,title:'Cancel Request'});
cancelbtn.addEventListener('click',function(){
    Ti.API.info("Thumbnail Cancelled requested");
    activeMovie.cancelAllThumbnailImageRequests();
});


var closebtn = Ti.UI.createButton({bottom:60,width:200,height:50,title:'DONE'});
closebtn.addEventListener('click',function(){vidWin.close()});

vidWin.add(scrollView);
vidWin.add(closebtn);
vidWin.add(cancelbtn);
vidWin.open();
}

var win=Ti.UI.createWindow();
var openButton = Ti.UI.createButton({width:200,height:50,title:'open'});
openButton.addEventListener('click',newWindow);
win.add(openButton);
win.open();

[ashcoding]

To test using a test mp4 file, put it in "assets/Resources" folder.

[salachi]

Do we really need this class? I think the only thing we do here is to track if the dataSource is set or not, since we are internally setting the datasource, can't we check there?

[ashcoding]

Noted. Removing this.

[ashcoding]

New sample app.js code that includes showing the video player since video player code has changed. Change is due to sharing a helper class with thumbnail code.

// this sets the background color of the master UIView (when there are no windows/tab groups on it)
Titanium.UI.setBackgroundColor('#000');

// create base UI tab and root window
//
function newWindow(){
var vidWin = Titanium.UI.createWindow({
    title : 'Tab 1',
    backgroundColor : '#fff'
});

var activeMovie = Titanium.Media.createVideoPlayer({
    top : 0,
    backgroundColor: 'red',
    height : 300,
    width : 300,
    //url : 'ten_sec_test.mp4'
    // url  :'http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4'
});

activeMovie.url = 'http://www.quirksmode.org/html5/videos/big_buck_bunny.mp4';
//activeMovie.url = 'ten_sec_test.mp4';

var scrollView = Ti.UI.createScrollView({
    contentWidth : 'auto',
    contentHeight : 'auto',
    layout : 'horizontal',
    scrollType : 'horizontal'
});
scrollView.add(activeMovie);

activeMovie.requestThumbnailImagesAtTimes([0, 20, 59, 47, 22], Titanium.Media.VIDEO_TIME_OPTION_NEAREST_KEYFRAME, function(response) {
            Ti.API.info("Thumbnail callback called, success = " + response.success);
             Ti.API.info("Thumbnail callback called, time = " + response.time);
             Ti.API.info("Thumbnail callback called, code = " + response.code);
            if(response.success) {
                 var imgView = Titanium.UI.createImageView({
                    image : response.image
                });
                scrollView.add(imgView);

            }
        });
var cancelbtn = Ti.UI.createButton({bottom:0,width:200,height:50,title:'Cancel Request'});
cancelbtn.addEventListener('click',function(){
    Ti.API.info("Thumbnail Cancelled requested");
    activeMovie.cancelAllThumbnailImageRequests();
});


var closebtn = Ti.UI.createButton({bottom:60,width:200,height:50,title:'DONE'});
closebtn.addEventListener('click',function(){vidWin.close()});

vidWin.add(scrollView);
vidWin.add(closebtn);
vidWin.add(cancelbtn);
vidWin.open();
}

var win=Ti.UI.createWindow();
var openButton = Ti.UI.createButton({width:200,height:50,title:'open'});
openButton.addEventListener('click',newWindow);
win.add(openButton);
win.open();

[salachi]

Latest changes looks good, I don't see any issues.

[hieupham007]

Just wondering why can't this be an inner class instead of a separate file by itself? It could also be a method?

[ashcoding]

TiVideoView8 and TiThumbnailRetriever uses the same method. Hence I placed it there. Is there a better way to do this?

It originally was code that was in both files.

[hieupham007]

Have you try adding it as a static method in TiUIHelper?

[ashcoding]

Ok. I'll try it with that.

[ingo]

Attention: The contributor has signed the CLA

[ingo]

Attention: The contributor has signed the CLA

[hieupham007]

Code reviewed and functionally tested. Request accepted

[bitfabrikken]

The function requestThumbnailImagesAtTimes is still undefined in SDK 3.5.0.GA on Android - Any idea when it'll be included or where I can track the progress for GA? Edit: Nevermind, found it in Jira - it's coming in 3.6.0!