caph.app.addScene('TopPicksScene', $class({
    $extends: ListScene,

    getSceneOption: function() {
    	return {
    		title: 'CAPH VIDEO',
    		selectedCategory: 'Top Picks',
    		list: {
    			row: 1,
    			column: 3.5375,
    			width: Style.width - Style.listLeft, 
    			height: Style.height - Style.topPickListTop - Style.topPickListMarginBottom,
    			x: Style.listLeft, 
    			y: Style.topPickListTop,
    			decorateItem: function(data, index) {
    				var Linear = caph.require('ui.base.layout.Linear');
    				var FocusManager = caph.require('module.focus.Manager');
    				
    				var list = this;
    		    	var itemSize = this.getItemSize();
    		    	var width = itemSize[0];
    		    	var height = itemSize[1];
    		    	
    		    	var itemData, item, bottom;
    		    	var tvShowItem, movieItem;
    		    	
    		    	if (index === 0) {
    		    		itemData = data['topPicks'];
    		    		
    		    		item = ListItem.getTopPickMovie({
    		    			id: itemData.id,
    		    			genreId: itemData.genre.id,
    		        		title: itemData.title,
    		        		publishYear: itemData.publishYear,
    		    			thumbnailUrl: '../../' + Style.imageRootPath + itemData.thumbnailUrl 
    		        	});
    		    	} else {
    		    		item = new Linear({
    		    			direction: Linear.LayoutParam.VERTICAL,
    		    			size: [width, height]
    		    		});
    		    		
    		    		itemData = data['tvShows'];
    		    		
    		    		tvShowItem = ListItem.getTopPickTvShow({
    		    			id: itemData.id,
    		    			genreId: itemData.genre.id,
    		        		title: itemData.title,
    		        		startTime: itemData.startTime,
    		        		thumbnailUrl: '../../' + Style.imageRootPath + itemData.thumbnailUrl
    		        	}).focusable(true);
    		    		
    		    		tvShowItem.on({
    		    			focus: function(message) {
    		    				list.setCurrentPositionByItem(message.source.getParent());
    		    			},
    		    			blur: function() {},
    		    			keydown: function() {},
    		    			keyup: function() {},
    		    			click: function() {}
    		    		});
    		    		
    		    		tvShowItem.requestPostRender(function() {
    		    			var bottom = this.getChildren()[1];
    		    			
    		    			var bottomSize = bottom.size();
    		    			bottomSize[1] = bottomSize[1] - (Style.descriptionHeight / 2) + Style.descriptionMarginTop;
    		    			
    		    			bottom.size(bottomSize);
    		    		}.bind(tvShowItem));
    		    		
    		    		item.addChild(tvShowItem, {
    		    			size: ['100%', '50%']
    		    		});
    		    		
    		    		bottom = new Linear({
    		    			direction: Linear.LayoutParam.HORIZONTAL,
    		    			interval: Style.listItemGap
    		    		});
    		    		
    		    		item.addChild(bottom, {
    		    			size: ['100%', '50%']
    		    		});
    		    		
    		    		itemData = data['movies'][0];
    		    		
    	    			movieItem = ListItem.getMovie({
    		    			id: itemData.id,
    		    			genreId: itemData.genre.id,
    		        		title: itemData.title,
    		        		publishYear: itemData.publishYear,
    		    			thumbnailUrl: '../../' + Style.imageRootPath + itemData.thumbnailUrl
    	        		}).focusable(true);
    	    			
    		    		movieItem.on({
    		    			focus: function(message) {
    		    				list.setCurrentPositionByItem(message.source.getParent().getParent());
    		    			},
    		    			blur: function() {},
    		    			keydown: function(message) {
    		    				if (message.key().right) {
    		    					this.getParent().getChildren()[1].focus();
    			    				message.stopPropagation();
    		    				}
    		    			},
    		    			keyup: function() {},
    		    			click: function() {}
    		    		});
    			    		
    			    	bottom.addChild(movieItem, {
    			    		size: [(width - Style.listItemGap) / 2, '100%']
    			    	});
    		    					    		
    			    	itemData = data['movies'][1];
    		    		
    	    			movieItem = ListItem.getMovie({
    		    			id: itemData.id,
    		    			genreId: itemData.genre.id,
    		        		title: itemData.title,
    		        		publishYear: itemData.publishYear,
    		    			thumbnailUrl: '../../' + Style.imageRootPath + itemData.thumbnailUrl
    	        		}).focusable(true)

    	        		movieItem.on({
    		    			focus: function(message) {
    		    				list.setCurrentPositionByItem(message.source.getParent().getParent());
    		    			},
    		    			blur: function() {},
    		    			keydown: function(message) {
    		    				if (message.key().left) {
    		    					this.getParent().getChildren()[0].focus();
    			    				message.stopPropagation();
    		    				}
    		    			},
    		    			keyup: function() {},
    		    			click: function() {}
    		    		});
    		    		
    	    			bottom.addChild(movieItem, {
    			    		size: [(width - Style.listItemGap) / 2, '100%']
    			    	});
    		    		
    					item.setProperty({
    		    			'data-list-item-no-auto-focus': true
    		    		});
    		    	}
    		    	
    		    	return item;
    			},
    			onnextpage: function() {
    				/* server version
    				caph.xhr(listUrl, {
                    	type: 'JSON',
                    	parameter: {
                    		id: 1,
                    		start: this.getItemCount(),
                    		offset: 2
                    	}
                    }).then(function(result) {
                    	var value = result.value;
                    	
                    	if (value.status === 'OK' && value.dataList.length > 0) {
                    		this.addItems(value.dataList);
                    	}
                    }.bind(this));	
    				*/
    			}
    		}
    	}
    },
    
    onshow: function(message) {
    	this.$super(message);
    	
    	this.bottom.on({
			keydown: function(message) {
				var genreId, source = message.source;
				
				if (message.key().up) {
					while (source && caph.isBlank((genreId = source.getProperty('genreId')))) {
	            		source = source.getParent();
	            	}
					
					if (source && (genreId === 3 || source.getProperty('data-list-item-index') === 0)) {
						message.stopPropagation();
						currentCategory.focus();
					}
				}
			}
		});
    	
    	if (this.bottom.getItemCount() < 1) {
    		// local version
        	caph.xhr(listUrl[1], {
        		type: 'JSON'
        	}).then(function(result) {
        		var value = result.value;
        		
        		if (value.status === 'OK') {
        			this.bottom.addItems(value.dataList);
        			currentItem = this.bottom.getCurrentPositionItem();
        		}
        	}.bind(this));
        	
        	/* server version
        	caph.xhr(listUrl, {
            	type: 'JSON',
            	parameter: {
            		id: 1,
            		start: 0,
            		offset: 6
            	}
            }).then(function(result) {
        		var value = result.value;
        		
        		if (value.status === 'OK') {
        			this.bottom.addItems(value.dataList);
        			currentItem = this.bottom.getCurrentPositionItem();
        		}
        	}.bind(this));
        	*/
    	} else {
    		currentItem = this.bottom.getCurrentPositionItem();
    	}
    	
    	currentCategory = this.top.getChildren()[0];
    	currentCategory.focus();
    }
}));