Here's some code I've written on top of mootools to translate xml using xslt with Mootools.
//Global Vars
var intUIDseed = 0; //For Unique IDs
var arrXMLs = []; //Array of XML docs
var arrXSLTs = []; //Array of XSLT docs
var arrCompleted = []; //Keep Track of the Statuses
//My New Implementation
function loadXMLDoc(strUrl, arrX, intIndex) {
try {
if (window.XMLHttpRequest) { //Mozilla, Safari, (Opera?)
arrX[intIndex] = new XMLHttpRequest();
arrX[intIndex].onreadystatechange = XMLReady;
arrX[intIndex].open("GET", strUrl, true);
arrX[intIndex].send(null);
}
else if (window.ActiveXObject) { //IE 6
arrX[intIndex] = new ActiveXObject("Microsoft.XMLHTTP");
arrX[intIndex].onload = XMLReady;
arrX[intIndex].open("GET", strUrl, true);
arrX[intIndex].send();
}
arrCompleted[intIndex] = false;
}
catch(e) {
logAjax("Error Loading XML Doc: " + e);
}
}
//Do the Injection, once all Requests are ReadyState = 4
function XMLReady(e) {
if (arrXMLs.length > 0) {
if (arrXSLTs.length > 0) {
var bolComplete = false;
bolComplete = arrXMLs.every(function(item, index) {return allReady(item, index)});
if (bolComplete == true) {
bolComplete = arrXSLTs.every(function(item, index) {return allReady(item, index)});
}
if (bolComplete == true) {
arrXMLs.each(function(item, index) {
if (!$chk($('divXML'+index))) {
logAjax('Could not inject divXML'+index+', it does not exist (size:'+arrXMLs.length+')');
}
else {
transformXML(parseXML(arrXMLs[index].responseText), parseXML(arrXSLTs[index].responseText), 'divXML' + index);
arrCompleted[index] = true;
logAjax('Injecting divXML'+index);
}
});
}
}
}
}
function allReady(item, index) {
if (item.readyState == 4) {
return true;
}
else {
return false;
}
}
//Given the URL of an XML and XSLT file, this function will create a function and 2 seconds later will populate your string.
function displayResult(strXML, strXSLT) {
logAjax('Initializing ' + strXML);
if (Browser.Engine.trident) {
if (Browser.Engine.version < struid = "divXML" intuidseed =" intUIDseed">
";
}
catch(err) {
logAjax(err);
return "There was a problem loading this information. This feature may not work in your browser. It has been tested in Mozilla Firefox 3.0 and Internet Explorer 7. If you are using Safari, it does not support XSLT at this time.";
}
return "This feature may be untested in your browser, or not currently working. It has been tested in Mozilla Firefox 3.0 and Internet Explorer 7. If you are using Safari, it does not support XSLT at this time."
}
//Function that should given XML string return [document object]
function parseXML(xml){
var doc;
if (window.ActiveXObject){
doc = new ActiveXObject('Microsoft.XMLDOM');
doc.async = false;
doc.loadXML(xml);
} else {
doc = new DOMParser().parseFromString(xml, 'text/xml');
}
return doc;
};
//Use a Transform document to change a variable
function transformXML(xml, xslt, strElementID) {
try {
if ($chk($(strElementID))) {
// code for IE
if (window.ActiveXObject) {
//$(strElementID).set('text','xforming...(for ie)');
ex=xml.transformNode(xslt);
$(strElementID).set('text','');
$(strElementID).set('innerHTML',ex);
}
else if (document.implementation && document.implementation.createDocument) {
//$(strElementID).set('text','xforming...(for !ie)');
// code for Mozilla, Firefox, Opera, etc. DOES NOT WORK IN SAFARI
xsltProcessor=new XSLTProcessor();
xsltProcessor.importStylesheet(xslt);
resultDocument = xsltProcessor.transformToFragment(xml,document);
$(strElementID).set('text','');
$(strElementID).appendChild(resultDocument);
//$(strElementID).innerHTML.replace(/&/gi, "&");
//$(strElementID).innerHTML.replace(/</gi, "<"); //$(strElementID).innerHTML.replace(/>/gi, ">");
}
}
}
catch(e) {
logAjax(e);
}
}
function logAjax(strMessage) {
if ($chk('divAjaxLog')) {
try {
strMessage = $('divAjaxLog').get('html') + '-'+strMessage+'
'
$('divAjaxLog').set('html', strMessage)
}
catch(e) {
}
}
}
And here's how you use that (and have a cool fade-in effect):
$('divNews').set('opacity',0);
var xmlDoc = "feeds/news.aspx";
var xsltDoc = "feeds/XSLT/homenews.xslt";
$('divNews').innerHTML = displayResult(xmlDoc, xsltDoc)
setTimeout("$('divNews').fade(1);", 1*1000);
2 comments:
One minor comment about eta-raising. You may or may not know that this
arrXMLs.every(function(item, index) {return allReady(item, index)})
is more concisely written as
arrXML.every(allReady)
in most cases. It's a big win in Javascript because function syntax is so verbose.
You also know that bolComplete == true is more concisely written as bolComplete, so you must have had some stylistic reason for saying that.
I'm curious, why doesn't Safari support XSLT? Does Safari not provide an XML parser, or just not the XSLT interpreter? Do other Webkit browsers support XSLT? (in particular, Chrome?)
Jeremy: I have the same name as you and I am the one with jeremymcneal@gmail.com
You should stop using my email for your redbox purchases and UCM student loan submissions. I have been getting emails because someone in MO is using my address. The Redbox emails even include credit card info. Did you rent "The taking of Pelham" from a McDonalds yesterday?
Post a Comment