BUGFIX: Added support for CSS media types to CSS on demand

git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/sapphire/trunk@65711 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Sam Minnee 2008-11-12 21:44:35 +00:00
parent ac9eaa3c0d
commit 7c2861b0f4
2 changed files with 31 additions and 48 deletions

View File

@ -593,7 +593,7 @@ class Requirements_Backend {
foreach(array_diff_key($this->css,$this->blocked) as $file => $params) { foreach(array_diff_key($this->css,$this->blocked) as $file => $params) {
$path = $this->path_for_file($file); $path = $this->path_for_file($file);
if($path) $cssRequirements[] = $path; if($path) $cssRequirements[] = isset($params['media']) ? "$path:##:$params[media]" : $path;
} }
$response->addHeader('X-Include-CSS', implode(',', $cssRequirements)); $response->addHeader('X-Include-CSS', implode(',', $cssRequirements));

View File

@ -115,19 +115,19 @@
} }
}, },
requireCss : function(styleUrl){ requireCss : function(styleUrl, media){
if(media == null) media = 'all';
if(document.createStyleSheet){ if(document.createStyleSheet){
document.createStyleSheet($.requireConfig.routeCss + styleUrl); var ss = document.createStyleSheet($.requireConfig.routeCss + styleUrl);
} ss.style.media = media;
else {
} else {
var styleTag = document.createElement('link'); var styleTag = document.createElement('link');
$(styleTag).attr({ $(styleTag).attr({
href : $.requireConfig.routeCss + styleUrl, href : $.requireConfig.routeCss + styleUrl,
type : 'text/css', type : 'text/css',
media : 'screen', media : media,
rel : 'stylesheet' rel : 'stylesheet'
}).appendTo($('head').get(0)); }).appendTo($('head').get(0));
@ -159,38 +159,7 @@
// We remove the success handler and take care of calling it outselves within _ondemandComplete // We remove the success handler and take care of calling it outselves within _ondemandComplete
s.success = null; s.success = null;
s.complete = function(xml, status) { s.complete = function(xml, status) {
var i; processOnDemandHeaders(xml);
// CSS
if(xml.getResponseHeader('X-Include-CSS')) {
var cssIncludes = xml.getResponseHeader('X-Include-CSS').split(',');
for(i=0;i<cssIncludes.length;i++) {
$.requireCss(cssIncludes[i]);
}
}
// JavaScript
if(xml.getResponseHeader('X-Include-JS')) {
var jsIncludes = xml.getResponseHeader('X-Include-JS').split(',');
var newIncludes = [];
for(i=0;i<jsIncludes.length;i++) {
if(!$.isJsLoaded(jsIncludes[i])) {
newIncludes.push(jsIncludes[i]);
}
}
}
// We make an array of the includes that are actually new, and attach the callback to the last one
// They are placed in a queue and will be included in order. This means that the callback will
// be able to execute script in the new includes (such as a livequery update)
if(newIncludes.length > 0) {
for(i=0;i<jsIncludes.length;i++) {
$.requireJs(jsIncludes[i], (i == jsIncludes.length-1) ? function() { _ondemandComplete(xml, status); } : null);
}
// If there aren't any new includes, then we can just call the callbacks ourselves
} else {
_ondemandComplete(xml, status);
}
} }
_originalAjax(s); _originalAjax(s);
@ -203,18 +172,32 @@
* once we get rid of all uses of prototype, we can remove this * once we get rid of all uses of prototype, we can remove this
*/ */
function prototypeOnDemandHandler(xml, callback) { function prototypeOnDemandHandler(xml, callback) {
var i; processOnDemandHandlers(xml, callback);
var newIncludes = []; }
/**
* Process the X-Include-CSS and X-Include-JS headers provided by the Requirements class
*/
function processOnDemandHandlers(xml, _ondemandComplete) {
var i;
// CSS // CSS
if(xml.getResponseHeader('X-Include-CSS')) { if(xml.getResponseHeader('X-Include-CSS')) {
var cssIncludes = xml.getResponseHeader('X-Include-CSS').split(','); var cssIncludes = xml.getResponseHeader('X-Include-CSS').split(',');
for(i=0;i<cssIncludes.length;i++) { for(i=0;i<cssIncludes.length;i++) {
// Syntax 1: "URL:##:media"
if(cssIncludes[i].match(/^(.*):##:(.*)$/)) {
jQuery.requireCss(RegExp.$1, RegExp.$2);
// Syntax 2: "URL"
} else {
jQuery.requireCss(cssIncludes[i]); jQuery.requireCss(cssIncludes[i]);
} }
} }
}
// JavaScript // JavaScript
var newIncludes = [];
if(xml.getResponseHeader('X-Include-JS')) { if(xml.getResponseHeader('X-Include-JS')) {
var jsIncludes = xml.getResponseHeader('X-Include-JS').split(','); var jsIncludes = xml.getResponseHeader('X-Include-JS').split(',');
for(i=0;i<jsIncludes.length;i++) { for(i=0;i<jsIncludes.length;i++) {
@ -229,11 +212,11 @@ function prototypeOnDemandHandler(xml, callback) {
// be able to execute script in the new includes (such as a livequery update) // be able to execute script in the new includes (such as a livequery update)
if(newIncludes.length > 0) { if(newIncludes.length > 0) {
for(i=0;i<jsIncludes.length;i++) { for(i=0;i<jsIncludes.length;i++) {
jQuery.requireJs(jsIncludes[i], (i == jsIncludes.length-1) ? callback : null); jQuery.requireJs(jsIncludes[i], (i == jsIncludes.length-1) ? function() { _ondemandComplete(xml, status); } : null);
} }
// If there aren't any new includes, then we can just call the callbacks ourselves // If there aren't any new includes, then we can just call the callbacks ourselves
} else { } else {
callback(); _ondemandComplete(xml, status);
} }
} }