Hi,
I wanted to lazy load advertisements on our website www.joomla-cbe.de,
so I've written a class called Request.LazyLoad which loads external
JavaScript files after the main content has been loaded. Therefore I'd
like to know your opinion (is the code safe, ...). You simply call it
like you'd call a Request.HTML. Please be aware that we're using
Joomla so the real advertising codes come frome a module.
function cbelite_lazyload(div, pos) {
new Request.LazyLoad({
url: 'index.php?option=com_cbelite&format=raw&task=getAds&mod='
+
pos,
method: 'get',
evalScripts: false,
update: div,
onComplete: function() {
$(div).fancyShow();
}
}).send();
}
Request.LazyLoad = new Class({
Extends: Request.HTML,
options: {
source: $empty,
loadedFunction: $empty
},
buf: '',
iscripts: '',
doco: '',
docw: '',
docwr:'',
docc: '',
scripts: [],
iscripts: '',
success: function(text){
var options = this.options, response = this.response, l=0;
response.html = text.stripScripts(function(script){
response.javascript = script;
});
var temp = this.processHTML(response.html);
response.tree = temp.childNodes;
response.elements = temp.getElements('*');
if ((l = this.checkForExternal(text)) === 0) {
if (this.options.update)
$(this.options.update).set('html',
text).set('opacity', 0).show();
this.onSuccess();
} else {
//this.checkforIframes(this.options.update);
this.startLazyLoad();
this.getExternalJSContent(text, false);
}
},
startLazyLoad: function() {
this.docw = document.write, this.docwr = document.writeln,
this.doco
= document.open, this.docc = document.close;
var that = this;
document.write = (function(){
return function( pString ){ // overload
document.write()
that.buf += pString;
};
})();
document.writeln = (function(){
return function( pString ){ // overload
document.write()
that.buf += pString;
};
})();
document.open = (function(){
return function(){};
})();
document.close = (function(){
return function(){};
})();
// guckt nach externen skripts und lädt diese
this.scripts = [], this.iscripts='';
},
checkForExternal: function(buffer) {
var script, regexp = /<script[^\>]*[src] *=
*[\"\']{0,1}([^\"\'\ >]
*)/gi;
var scripts = [];
while ((script = regexp.exec(buffer))) scripts.push(script[1]);
return scripts.length;
},
endLazyLoad: function() {
document.write = this.docw;
document.writeln = this.docwr;
document.open = this.doco;
document.close = this.docc;
//if (this.options.update) $(this.options.update).empty().set
('html', this.buf).show();
this.onSuccess();
},
getExternalJSSource: function(buffer) {
var script, regexp = /\< *[script][^\>]*[src] *= *[\"\']{0,1}([^
\"\'\ >]*)/gi;
while ((script = regexp.exec(buffer)))
this.scripts.push(script[1]);
},
getInternalJSSource: function(buffer) {
// fasst alle inlineskripte zusammen
var script, scripts=[], regexp =
/<script[^>]*>([\s\S]*?)<\/script>/
gi;
while ((script = regexp.exec(buffer))) scripts.push(script[1]);
this.iscripts += scripts.join('\n');
},
getExternalJSContent: function(buffer, checked) {
var that=this;
this.buf = "";
if (!checked) {
that.getExternalJSSource(buffer);
that.getInternalJSSource(buffer);
}
var headID = document.getElementsByTagName('head')[0];
var ol = function() {
that.loadFunction(that);
};
var scr = new Element('script', {language: 'javascript', type:
'text/
javascript', src: this.scripts.shift()});
scr.onload = ol;
scr.inject(headID);
},
loadFunction: function(that) {
var v1 = this.scripts.length;
this.getExternalJSSource(that.buf);
this.getInternalJSSource(that.buf);
if (v1 !== this.scripts.length)
this.getExternalJSContent(that.buf, true);
else {
try {
$exec(that.iscripts);
} catch(e) {};
if (that.options.update) {
// gerade google hat iframes, die wiederum
document.write
ausgeben,
// daher diese auch noch abfangen
$(that.options.update).set('html',
that.buf).set('opacity', 0).show
();
that.checkforIframes(that.options.update);
}
}
},
checkforIframes: function(div) {
var iframes = $(div).getElements('iframe');
if (iframes.length === 0)
this.endLazyLoad();
else {
var that=this;
var iframeGroup = new Group(iframes);
iframeGroup.addEvent('load', function() {
// wenn alle geladen sind,
// document.write, etc. wieder herstellen
that.endLazyLoad();
});
}
}
});
