Develop Reference

Chromecast m3u8 error

I have an Android sender that casts a M3U8 file like this:
metaData = new MediaMetadata(MediaMetadata.MEDIA_TYPE_MOVIE);
metaData.putString(MediaMetadata.KEY_TITLE, "Test");
MediaInfo mediaInfo = new MediaInfo.Builder(m3u8URL)
.setContentType("application/x-mpegURL")
.setStreamType(MediaInfo.STREAM_TYPE_BUFFERED)
.setMetadata(metaData)
.build();
try {
player.load(client, mediaInfo, true)
}
Here is my onLoad function (for MediaManager) in my Custom Receiver:
var self = this;
var title = sampleplayer.getValue_(event.data, ['media', 'metadata', 'title']
);
var titleElement = self.element_.querySelector('.media-title');
sampleplayer.setInnerText_(titleElement, title);
var subtitle = sampleplayer.getValue_(event.data, ['media', 'metadata',
'subtitle']);
var subtitleElement = self.element_.querySelector('.media-subtitle');
sampleplayer.setInnerText_(subtitleElement, subtitle);
var artwork = sampleplayer.getValue_(event.data, ['media', 'metadata',
'images', 0, 'url']);
var artworkElement = self.element_.querySelector('.media-artwork');
sampleplayer.setBackgroundImage_(artworkElement, artwork);
var autoplay = sampleplayer.getValue_(event.data, ['autoplay']);
var contentId = sampleplayer.getValue_(event.data, ['media', 'contentId']);
var contentType = sampleplayer.getValue_(event.data, ['media', 'contentType']
);
self.setContentType_(contentType);
self.setState_(sampleplayer.State.LOADING, false);
if (self.mediaPlayer != null)
{
self.mediaPlayer.unload();
}
if (event.data['media'] && event.data['media']['contentId'])
{
self.mediaHost = new cast.player.api.Host(
{
'mediaElement': self.mediaElement_,
'url': contentId
}
);
self.mediaHost.onError = function (errCode)
{
if(self.mediaPlayer != null)
{
self.mediaPlayer.unload();
}
}
var initialTimeIndexSeconds = event.data['media']['currentTime'] || 0;
self.protocol = null;
self.parser = document.createElement('a');
self.parser.href = contentId;
self.ext = self.parser.pathname.split('.').pop();
if (self.ext === 'm3u8') {
self.protocol = cast.player.api.CreateHlsStreamingProtocol(self.mediaHost);
} else if (self.ext === 'mpd') {
self.protocol = cast.player.api.CreateDashStreamingProtocol(self.mediaHost);
} else if (self.ext === 'ism/') {
self.protocol = cast.player.api.CreateSmoothStreamingProtocol(self.mediaHost);
}
console.log('### Media Protocol Identified as ' + self.ext);
if (self.protocol === null) {
self.mediaManager_['onLoadOrig'](event); // Call on the original callback
} else {
self.mediaPlayer = new cast.player.api.Player(self.mediaHost);
self.mediaPlayer.load(self.protocol, initialTimeIndexSeconds);
}
}
self.mediaElement_.autoplay = autoplay || true;
I am not sure what is causing this. This is only happening to M3U8 files. I tested in mp4 and it seems to work. When I debug on Chrome, I tracked that it goes to playing state then the buffering state and gives this error in media_player.js 81. So I am not sure where this is coming from.
Uncaught InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable.
Any ideas as to whats causing this?

Error preloading images in IE8

I am using this code to preload image and reference them later by id.
It's working in most browsers and on ipad, but IE8 generates this error:
'Unable to get property 'target' of undefined null reference'
This is my code:
var images = [{id:"kids", url:"assets/driekids.png"}, {id:"title",url:"assets/gametitle.png"}];
var assets = [];
var fnCallback = fn;
var loaded = 0;
this.startLoading = function() {
var t = this;
for(var i = 0;i<images.length;i++){
var r = new Image();
r.src = images[i].url;
r.name = images[i].id;
r.onload = function(){t.checkLoaded();};
}
}
this.checkLoaded = function(e) {
this.assets[e.target.name] = e.target;
loaded++;
if(loaded == images.length) fnCallback();
}
My question: is this way of image preloading, by using new Image(), possible on IE8?

In IE you get the event object like this:
window.event
so you will have to make modifications to your code:
this.startLoading = function() {
var t = this;
for(var i = 0;i<images.length;i++){
var r = new Image();
r.src = images[i].url;
r.name = images[i].id;
r.onload = t.checkLoaded; // you dont want an anonymous function here
}
}
this.checkLoaded = function(e) {
// get the event object for both IE and other browsers
var event = e || window.event;
var target = e.target || event.srcElement ;
this.assets[target.name] = target;
loaded++;
if(loaded == images.length) fnCallback();
}

JS target doesn't work ie 8

I have this code, where data is DWR object that contains rows from response servlet.
img.onclick works using IE9 but I need that it works on IE8 too. Some idea?
Thanks!
function functionA(data){
var getPrintCred = function(data) {
var img = document.createElement("img");
img.src = "images/image1.jpg";
img.style.width="20px";
img.style.height="18px";
img.alt = data.field1;
img.title = getRegimen;
img.onclick = function(target) { functionB(target) };
return img;
};
}
function functionB(data){
var var1= data.target.title;
var var2= data.target.alt;
if ( var1 != null && var1 == "IM")
var1 = "valueA";
else
var1 = "valueB";
functionC(var2,var1);
}
function functionC(param1, param2){
alert ('Using IE 9 works, but IE8 no works...help me!'+param1+'-'param2);
}

Ie 8 does not support the target property in the event object, you have to use srcElement property.
function functionB(data){
var var1= (data.target || data.srcElement).title;
var var2= data.target.alt;
if ( var1 != null && var1 == "IM")
var1 = "valueA";
else
var1 = "valueB";
functionC(var2,var1);
}
Also it looks like no event object is passed to the onclick event handler, so you can pass window.event as a fallback.
img.onclick = function(target) { functionB(target || event) };
http://jsfiddle.net/mowglisanu/wkB6K/

Try the below one
function functionA(data){
var getPrintCred = function(data) {
var img = document.createElement("img");
img.src = "images/image1.jpg";
img.style.width="20px";
img.style.height="18px";
img.alt = data.field1;
img.title = getRegimen;
img.onclick = function(target) {
target = target || window.event;
functionB(target);
};
return img;
};
}
function functionB(data){
var var1= data.target.title;
var var2= data.target.alt;
if ( var1 != null && var1 == "IM")
var1 = "valueA";
else
var1 = "valueB";
functionC(var2,var1);
}
function functionC(param1, param2){
alert ('Using IE 9 works, but IE8 no works...help me!'+param1+'-'param2);
}
In IE the event object is not passed as an argument to the event handler method, but it is available in the global property window.event object.

create object from processor output to append/replaceChild

Attempting to add parameters to an xsl template, for use in a navigation menu.
Trying to figure out how to use the output that IXSLProcessor leaves me with.
I have the following code that works perfectly for Firefox
var xslStylesheet;
var xsltProcessor = new XSLTProcessor();
var myDOM;
var xmlDoc;
var myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "client.xsl", false);
myXMLHTTPRequest.send(null);
xslStylesheet = myXMLHTTPRequest.responseXML;
xsltProcessor.importStylesheet(xslStylesheet);
// load the xml file
myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "client.xml", false);
myXMLHTTPRequest.send(null);
xmlDoc = myXMLHTTPRequest.responseXML;
// set the parameter using the parameter passed to the outputgroup function
xsltProcessor.setParameter(null, "cid", client);
xsltProcessor.setParameter(null, "browser", "other");
var fragment = xsltProcessor.transformToFragment(xmlDoc,document);
document.getElementById("scriptHook").innerHTML = "";
document.getElementById("maincontent").replaceChild(fragment, document.getElementById("scriptHook"));
scroll(0,0);
This is the code I have (mostly pilfered from msdn)
var xslt = new ActiveXObject("Msxml2.XSLTemplate.3.0");
var xsldoc = new ActiveXObject("Msxml2.FreeThreadedDOMDocument.3.0");
var xslproc;
xsldoc.async = false;
xsldoc.load("client.xsl");
if (xsldoc.parseError.errorCode != 0) {
var myErr = xsldoc.parseError;
WScript.Echo("You have error " + myErr.reason);
} else {
xslt.stylesheet = xsldoc;
var xmldoc = new ActiveXObject("Msxml2.DOMDocument.3.0");
xmldoc.async = false;
xmldoc.load("client.xml");
if (xmldoc.parseError.errorCode != 0) {
var myErr = xmldoc.parseError;
WScript.Echo("You have error " + myErr.reason);
} else {
xslproc = xslt.createProcessor();
xslproc.input = xmldoc;
xslproc.addParameter("cid", client);
xslproc.addParameter("browser", "ie");
xslproc.transform();
//somehow convert xslproc.output to object that can be used in replaceChild
document.getElementById("scriptHook").innerHTML = "";
document.getElementById("maincontent").replaceChild(xslproc.output, document.getElementById("scriptHook"));
}
}
Any and all help is appreciated, cheers.

With Mozilla you can exchange nodes between XSLT and DOM but with IE you need to take the XSLT transformation result as a string and feed that to IE's HTML parser; so for your sample I think you want
document.getElementById("scriptHook").outerHTML = xslproc.output;
which will replace the scriptHook element with the result of the transformation.

In regards to stopping a nsIRequest before completion and determining when a nsIRequest is complete (firefox extension)

Thanks to everyone in advance!
I am using a xul:browser and attaching a nsIWebProgressListener to it. I am trying to accomplish two things:
1. Determine when a request is complete (when a document is completely load with all css/js/imgs).
2. Stop a request from completing, specifically URLs with files that issue the download prompt.
In regards to my first issue, because the aStateFlags argument is set with (STATE_IS_* | STATE_STOP) in nsIWebProgressListener.onStateChange() and is called multiple times it is impossible to determine when a request is 100% complete and there are no more state changes. How is this accomplished?
What I am trying to accomplish specifically with the second issue that I am having is terminating a request when a certain "content-type" header value is found. For instance if a "application/pdf" content type is found, if the request is terminated then the download prompt (which from my understanding is not part of the nsIDownloadManager) is never displayed - this is the exact behavior I am trying to accomplish.
Here is the nsIWebProgressListener code I am currently working with:
//setup progress listener
var progressListener = {
stateIsRequest:false,
methodCalled:"",
WebProgress:"",
Request:"",
Flag:"",
Status:"",
Location:"",
CurSelfProgress:"",
MaxSelfProgress:"",
CurTotalProgress:"",
MaxTotalProgress:"",
Message:"",
State:"",
QueryInterface : function(aIID) {
if(aIID.equals(Components.interfaces.nsIWebProgressListener) || aIID.equals(Components.interfaces.nsISupportsWeakReference) || aIID.equals(Components.interfaces.nsISupports)){
return this;
}
else{
throw Components.results.NS_NOINTERFACE;
}
},
onStateChange : function(aWebProgress, aRequest, aFlag, aStatus) {
this.methodCalled = "onStateChange";
this.WebProgress = aWebProgress;
this.Request = aRequest;
this.Flag = aFlag;
this.Status = aStatus;
this.Location = "";
this.CurSelfProgress = "";
this.MaxSelfProgress = "";
this.CurTotalProgress = "";
this.MaxTotalProgress = "";
this.Message = "";
this.State = "";
this.CaptureHeaders(aRequest);
},
onLocationChange : function(aWebProgress, aRequest, aLocation) {
this.methodCalled = "onLocationChange";
this.WebProgress = aWebProgress;
this.Request = aRequest;
this.Flag = "";
this.Status = "";
this.Location = aLocation;
this.CurSelfProgress = "";
this.MaxSelfProgress = "";
this.CurTotalProgress = "";
this.MaxTotalProgress = "";
this.Message = "";
this.State = "";
this.CaptureHeaders(aRequest);
},
onProgressChange : function(aWebProgress, aRequest, aCurSelfProgress, aMaxSelfProgress, aCurTotalProgress, aMaxTotalProgress){
this.methodCalled = "onProgressChange";
this.WebProgress = aWebProgress;
this.Request = aRequest;
this.Flag = "";
this.Status = "";
this.Location = "";
this.CurSelfProgress = aCurSelfProgress;
this.MaxSelfProgress = aMaxSelfProgress;
this.CurTotalProgress = aCurTotalProgress;
this.MaxTotalProgress = aMaxTotalProgress;
this.Message = "";
this.State = "";
this.CaptureHeaders(aRequest);
},
onStatusChange : function(aWebProgress, aRequest, aStatus, aMessage){
this.methodCalled = "onStatusChange";
this.WebProgress = aWebProgress;
this.Request = aRequest;
this.Flag = "";
this.Status = aStatus;
this.Location = "";
this.CurSelfProgress = "";
this.MaxSelfProgress = "";
this.CurTotalProgress = "";
this.MaxTotalProgress = "";
this.Message = aMessage;
this.State = "";
this.CaptureHeaders(aRequest);
},
onSecurityChange : function(aWebProgress, aRequest, aState){
this.methodCalled = "onSecurityChange";
this.WebProgress = aWebProgress;
this.Request = aRequest;
this.Flag = "";
this.Status = "";
this.Location = "";
this.CurSelfProgress = "";
this.MaxSelfProgress = "";
this.CurTotalProgress = "";
this.MaxTotalProgress = "";
this.Message = "";
this.State = aState;
this.CaptureHeaders(aRequest);
},
onLinkIconAvailable : function(a){},
CaptureHeaders : function(ThisRequest){
try{
//specify response headers to get
var ResponseHeaders = new Array();
ResponseHeaders.push("status");
ResponseHeaders.push("data");
ResponseHeaders.push("server");
ResponseHeaders.push("content-language");
ResponseHeaders.push("content-encoding");
ResponseHeaders.push("content-length");
ResponseHeaders.push("expires");
ResponseHeaders.push("cache-control");
ResponseHeaders.push("keep-alive");
ResponseHeaders.push("status");
ResponseHeaders.push("connection");
ResponseHeaders.push("content-type");
ResponseHeaders.push("set-cookie");
//specify request headers to get
var RequestHeaders = new Array();
RequestHeaders.push("host");
RequestHeaders.push("user-agent");
RequestHeaders.push("accept");
RequestHeaders.push("accept-language");
RequestHeaders.push("accept-encoding");
RequestHeaders.push("accept-charset");
RequestHeaders.push("keep-alive");
RequestHeaders.push("connection");
RequestHeaders.push("cookie");
RequestHeaders.push("cache-control");
//get browser
var CurrentBrowser = document.getElementById("current_browser");
//var CurrentURL = CurrentBrowser.current_url;
//var CurrentURL = ThisRequest.nsIHttpChannel.originalURI.spec;
if(ThisRequest.nsIHttpChannel != undefined){
var CurrentURL = ThisRequest.nsIHttpChannel.originalURI.spec;
//is this the first time headers were created for this browser?
if(CurrentBrowser.headers instanceof Object){
//have we collected headers for this url before
if(CurrentBrowser.headers[CurrentURL] instanceof Object){
//do nothing
}
else{
CurrentBrowser.headers[CurrentURL] = new Object();
CurrentBrowser.headers[CurrentURL].request = new Object();
CurrentBrowser.headers[CurrentURL].response = new Object()
}
}
else{
CurrentBrowser.headers = new Object();
CurrentBrowser.headers[CurrentURL] = new Object();
CurrentBrowser.headers[CurrentURL].request = new Object();
CurrentBrowser.headers[CurrentURL].response = new Object()
}
//load up headers
//add response headers
for(i = 0; i < ResponseHeaders.length; i++){
try{
if(ResponseHeaders[i] == "status"){
CurrentBrowser.headers[CurrentURL].response[ResponseHeaders[i]] = ThisRequest.nsIHttpChannel.responseStatus;
}
else{
CurrentBrowser.headers[CurrentURL].response[ResponseHeaders[i]] = ThisRequest.nsIHttpChannel.getResponseHeader(ResponseHeaders[i]);
}
}
catch(e){}
}
//add request headers
for(i = 0; i < RequestHeaders.length; i++){
try{
CurrentBrowser.headers[CurrentURL].request[RequestHeaders[i]] = ThisRequest.nsIHttpChannel.getRequestHeader(RequestHeaders[i]);
}
catch(e){}
}
//end load up headers
/*
Completed flag - STATE_IS_REQUEST:65552
Completed flag - STATE_IS_DOCUMENT:131088
Completed flag - STATE_IS_NETWORK:262160
Completed flag - STATE_IS_WINDOW:524304
//CurrentBrowser.webNavigation.nsIWebNavigation.stop(1);
//CurrentBrowser.webNavigation.nsIWebNavigation.stop(2);
//CurrentBrowser.webNavigation.nsIWebNavigation.stop(3);
//CurrentBrowser.stop();
//ThisRequest.cancel(2152398850);
//ThisRequest.cancel(Components.results.NS_OK);
//ThisRequest.suspend();
*/
//setup nonload rules
if(CurrentBrowser.headers[CurrentURL].response["content-type"] == "application/zip"){
MyExtension.WriteToDebug("Cancelled Request: "+ CurrentURL);
//try multiple ways to terminate the request
if(ThisRequest.nsIHttpChannel.loadGroup.activeCount > 0){
ThisRequest.nsIHttpChannel.loadGroup.removeRequest(ThisRequest, ThisRequest, Components.results.NS_BINDING_ABORTED);
}
CurrentBrowser.webNavigation.nsIWebNavigation.stop(1);
CurrentBrowser.webNavigation.nsIWebNavigation.stop(2);
CurrentBrowser.webNavigation.nsIWebNavigation.stop(3);
CurrentBrowser.stop();
ThisRequest.cancel(Components.results.NS_OK);
//end try multiple ways to terminate the request
//after request is terminated execute onNONload
CurrentBrowser.OnNonLoad(CurrentURL);
}
//setup nonload rules
else if(CurrentBrowser.headers[CurrentURL].response["content-type"] == "application/pdf"){
MyExtension.WriteToDebug("Cancelled Request: "+ CurrentURL);
//try multiple ways to terminate the request
if(ThisRequest.nsIHttpChannel.loadGroup.activeCount > 0){
ThisRequest.nsIHttpChannel.loadGroup.removeRequest(ThisRequest, ThisRequest, Components.results.NS_BINDING_ABORTED);
}
CurrentBrowser.webNavigation.nsIWebNavigation.stop(1);
CurrentBrowser.webNavigation.nsIWebNavigation.stop(2);
CurrentBrowser.webNavigation.nsIWebNavigation.stop(3);
CurrentBrowser.stop();
ThisRequest.cancel(Components.results.NS_OK);
//end try multiple ways to terminate the request
//after request is terminated execute onNONload
CurrentBrowser.OnNonLoad(CurrentURL);
}
//determine if finished loading
else if(this.Flag == 65552 || this.Flag == 131088 || this.Flag == 262160 || this.Flag == 524304){
MyExtension.WriteToDebug("Request Completed!");
MyExtension.WriteToDebug("pending:"+ ThisRequest.isPending() +"<br/>name:"+ ThisRequest.name +"<br/>URL:"+ CurrentURL +"<br/>content-type:"+ CurrentBrowser.headers[CurrentURL].response["content-type"]+"<br/>status:"+ CurrentBrowser.headers[CurrentURL].response["status"]);
if(this.Flag == (Components.interfaces.nsIWebProgressListener.STATE_IS_REQUEST | Components.interfaces.nsIWebProgressListener.STATE_STOP)){
MyExtension.WriteToDebug("Completed flag - STATE_IS_REQUEST:"+ (Components.interfaces.nsIWebProgressListener.STATE_IS_REQUEST | Components.interfaces.nsIWebProgressListener.STATE_STOP));
}
if(this.Flag == (Components.interfaces.nsIWebProgressListener.STATE_IS_DOCUMENT | Components.interfaces.nsIWebProgressListener.STATE_STOP)){
MyExtension.WriteToDebug("Completed flag - STATE_IS_DOCUMENT:"+ (Components.interfaces.nsIWebProgressListener.STATE_IS_DOCUMENT | Components.interfaces.nsIWebProgressListener.STATE_STOP));
}
if(this.Flag == (Components.interfaces.nsIWebProgressListener.STATE_IS_NETWORK | Components.interfaces.nsIWebProgressListener.STATE_STOP)){
MyExtension.WriteToDebug("Completed flag - STATE_IS_NETWORK:"+ (Components.interfaces.nsIWebProgressListener.STATE_IS_NETWORK | Components.interfaces.nsIWebProgressListener.STATE_STOP));
}
if(this.Flag == (Components.interfaces.nsIWebProgressListener.STATE_IS_WINDOW | Components.interfaces.nsIWebProgressListener.STATE_STOP)){
MyExtension.WriteToDebug("Completed flag - STATE_IS_WINDOW:"+ (Components.interfaces.nsIWebProgressListener.STATE_IS_WINDOW | Components.interfaces.nsIWebProgressListener.STATE_STOP));
}
//MyExtension.WriteToDebug("methodCalled:"+ this.methodCalled);
//MyExtension.WriteToDebug("WebProgress:"+ this.WebProgress);
//MyExtension.WriteToDebug("Request:"+ this.Request);
MyExtension.WriteToDebug("Flag:"+ this.Flag);
//MyExtension.WriteToDebug("Status:"+ this.Status);
//MyExtension.WriteToDebug("Location:"+ this.Location);
//MyExtension.WriteToDebug("CurSelfProgress:"+ this.CurSelfProgress);
//MyExtension.WriteToDebug("MaxSelfProgress:"+ this.MaxSelfProgress);
//MyExtension.WriteToDebug("CurTotalProgress:"+ this.CurTotalProgress);
//MyExtension.WriteToDebug("MaxTotalProgress:"+ this.MaxTotalProgress);
//MyExtension.WriteToDebug("Message:"+ this.Message);
//MyExtension.WriteToDebug("State:"+ this.State);
MyExtension.WriteToDebug("Load group count:"+ ThisRequest.nsIHttpChannel.loadGroup.activeCount);
MyExtension.WriteToDebug("WebProgress.isLoadingDocument:"+ this.WebProgress.isLoadingDocument);
MyExtension.WriteToDebug("WebProgress.DOMWindow:"+ this.WebProgress.DOMWindow);
//execute non load
//CurrentBrowser.OnNonLoad(CurrentURL);
}
}
}
catch(e){
MyExtension.WriteToDebug("Error Name:"+ e.name +" Message:"+ e.message);
}
}
};
//add progress listener
ThisBrowser.addProgressListener(progressListener);
//end setup progress listener
https://developer.mozilla.org/en/nsIWebProgressListener

I'm in a rather lazy mood at the moment, so I can't say that I've done much research...
Question 1:
Why not just hook into the contentDocument for the load event. If contentDocument isn't exposed early, then use the following code to see if it's available then:
Listener.prototype.onStateChange = function(webProgress, request, stateFlags, status) {
if(stateFlags & Components.interfaces.nsIWebProgressListener.STATE_STOP && stateFlags & Components.interfaces.nsIWebProgressListener.STATE_IS_NETWORK) {
// Should be ready now.... please?
}
};
Question 2:
I'm not sure what you're trying to do with this and how it relates to the xul:browser, but a really comprehensive way to do this is to hook into nsIObserverService for http-on-modify-request and cancel the request there.

For anyone with this question in the future ...
This is a decent example to start: https://developer.mozilla.org/en-US/docs/Code_snippets/Progress_Listeners#Example
An IMHO cleaner example that takes care of adding/removing ProgressListeners as tabs open and close (prevents memory leaks) is available here: http://mdn.beonex.com/en/XUL_School/Intercepting_Page_Loads
Only by using STATE_IS_DOCUMENT and STATE_STOP will you get a one result per URI request: for the final page loaded.
You will need to get aLocation if you want to test for a URL you need to cancel aLocation.spec and aRequest so that you can issue aRequest.cancel(NS_BINDING_ABORTED). You can just goof with the page to be loaded by ussuing aWebProgress.DOMWindow adding some XUL, and reloading.
HTH,
Eric