I'm following the documentation here : http://developer.samsung.com/onlinedocs/tv/caphdocs/main.html?type=jquery&doc=tutorial&p1=8
I have this in my contentList.html file :
<div class="list-container">
<div id="list1"></div>
</div>
In my contentList.js file, in the window.onLoad function I have the following:
$('#list1').caphList({
items: listOfSeries,
template: '<div class="item" focusable><div style= "width:100%; height:100%"></div><%= item.title %></div>',
containerClass : 'list',
direction: 'vertical'
});
var contentListView = $('#list1')[0].caphList;
where listOfSeries is a global variable defined as an empty array. I have a button that, when pressed, sends a GET request to a server to get a list of tv show series. I then want to update the list by calling contentListView.update() once I have populated listOfSeries. However, I get an error saying:
cannot read property 'update' of undefined.
I'm fairly new to web development so I'm sorry if this is a noob question but how do I update this content list?
EDIT:
Here is my contentList.js file
var globalUrl = "";
var contentListRequestAttempts;
var listOfSeries = [""];
window.onload = function () {
/*$(".contentListButton").caphButton({
onFocused : function(event, originalEvent){
$(event.currentTarget).css({
"border" : "3px solid red",
"height" : "50px",
"font-size" : "40px"
});
},
onBlurred : function(event, originalEvent){
$(event.currentTarget).css({
"border" : "3px solid transparent",
"height" : "50px",
"font-size" : "40px"
});
},
focusOption: {
},
toggle : false,
onSelected : function(event, originalEvent){
contentListRequestAttempts = 0;
requestContentList();
}
}); */
$('#list1').caphList({
items: listOfSeries,
template: '<div class="item" focusable><div style= "width:100%; height:100%"></div><%= item.title %></div>',
containerClass : 'list',
direction: 'vertical'
});
var contentListView = $('#list1')[0].caphList;
contentListRequestAttempts = 0;
requestContentList(contentListView);
}
function requestContentList(contentListView){
console.log("Send Content List Request- Attempt#"+contentListRequestAttempts);
globalUrl = localStorage.getItem("serverUrl");
var getContentListUrl = globalUrl + "/client/v1/content";
console.log("Get content list url:" + getContentListUrl);
$.ajax({
url: getContentListUrl,
type: 'GET',
success: function(result){
var parsed = JSON.parse(result);
console.log(parsed);
var numberOfSeries = parsed.DfwWebClient.recordings.length;
// Check if response contains recordings up to 10 times
if(contentListRequestAttempts < 10){
if(numberOfSeries === 0){
//If content list is not ready yet, wait half sec before requesting content list again
contentListRequestAttempts++;
wait(500);
requestContentList();
} else {
parseRecordings(parsed, contentListView);
}
} else {
alert("No Content Found");
}
},
error: function(xhr,status,error){
alert("Server not found. Please ensure server is enabled, and that the IP address entered is correct.");
}
});
}
function parseRecordings(jsonResponse,contentListView){
var numberOfSeries = jsonResponse.DfwWebClient.recordings.length;
console.log("Number of Series: "+numberOfSeries);
listOfSeries= new Array(numberOfSeries);
var i;
for(i=0; i < numberOfSeries; i++){
listOfSeries[i] = jsonResponse.DfwWebClient.recordings[i];
}
console.log(listOfSeries);
/*var items = listOfSeries;*/
/* $('#list1').caphList({
items: listOfSeries,
template: '<div class="item" focusable><div style= "width:100%; height:100%"></div><%= item.title %></div>',
containerClass : 'list',
direction: 'vertical',
onFocusItemView: function(context) {
//console.log('focus', context);
}
});*/
//contentListView.reload();
contentListView.update();
}
function wait(ms){
var start = new Date().getTime();
var end = start;
while (end < start + ms){
end = new Date().getTime();
}
}