js/jquery.livequery.js @@ -5,6 +5,7 @@ JSS Change Log * Adds support for css triggers, this allows you to provide a JS callback for a CSS selector, a simple use case would be to provide rounded corners to IE. [Thanks go to Angelo Berios for this idea] * support for a custom list of rel tags , this is mostly useful to stop JSS from snooping in rel="styleshet" includes * minor performance tweaks +* Added experimental support for live page updates using the livequery plugin 0.5 changelog.txt @@ -12,7 +12,6 @@ // TODO @import support // TODO IE conditional comments support // FIXME Safari 3 bug with media types not always being loaded correctly. -// TODO Add livequery support where available for when adding new DOM elements when ever the DOM is modified. Will need to cache selectors and properties for this to work, should be optional, off by default $.jss.liveUpdates = true // TODO add basic :hover support (function($) { @@ -44,6 +43,8 @@ $.jss = { relTypes: ['stylesheet', 'jss-stylesheet'], // types that jss will lookout for in html rel tags + liveUpdates: false, // this option requires the livequery plugin, is Alpha and has a serious effect on performance + apply: function(content) { var selectors = []; var jss = this; @@ -62,7 +63,7 @@ $.jss = { }; }); if(content) selectors.concat(this.parse(content)); // parse any passed in styles - this.applyBehaviors(selectors); // apply callbacks if any exist + this.applyBehaviors(selectors); // apply behaviors before filters selectors = this.filterSelectors(selectors); this.applySelectors(selectors); }, @@ -123,20 +124,26 @@ $.jss = { var result = null; $.each(selectors, function(){ // load each of the matched selectors if(jss.isUnderstoodSelector(this.selector)) return; // skip applying the selector if the browser already understands it. - if(jss.disableCaching) return $(this.selector).css(this.attributes); // cache is turned off so just apply styles + if(jss.disableCaching) return jss.applyStyles($(this.selector), this.attributes); // cache is turned off so just apply styles if(jss.cache[this.selector]){ // check the cache jss.debug('HIT',this.selector) - jss.cache[this.selector].css(this.attributes); // direct cache hit + jss.applyStyles(jss.cache[this.selector], this.attributes); // direct cache hit } else if( result=jss.scanCache(this.selector) ) { jss.debug('PARTIAL',result,result[0].find(result[1])) - result[0].find(result[1]).css(this.attributes); // partial cache hit + jss.applyStyles(result[0].find(result[1]), this.attributes); // partial cache hit } else { jss.debug('MISS',this.selector) - jss.cache[this.selector] = $(this.selector).css(this.attributes); // cache miss + jss.cache[this.selector] = jss.applyStyles($(this.selector), this.attributes); // cache miss }; }); }, + applyStyles: function($els,styles) { + if(this.livequery) $els.livequery(function() { $(this).css(styles); }); + else $els.css(styles); + return $els; + }, + applyBehaviors: function(selectors){ if(this.behaviors.length==0) return; var jss = this; js/jquery.jss.js @@ -48,6 +48,12 @@ only selectors that match one of these rules will be processed by JSS. This can greatly improve performance if you only have one or two selectors that need applying. +$.jss.liveUpdates - Boolean - false +Turn this option on to live update css styles as the page +changes. You will need the livequery plugin installed to +use this option. NOTE: this option is a significant +performance hit and should be considered an Alpha feature. + $.jss.addBehavior('property', behaviourFunction('selector', 'value')) This function can be used to add callbacks to a css property, whenever the css property is found the callback is fired readme.txt @@ -8,6 +8,7 @@ <title>Speed Test</title> <script src="js/jquery.js" type="text/javascript" charset="utf-8"></script> + <script src="js/jquery.livequery.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery.jss.js" type="text/javascript" charset="utf-8"></script> <link rel="stylesheet" href="styles/test.css" type="text/css" charset="utf-8" /> @@ -18,6 +19,7 @@ $(document).ready(function() { $.jss.disableCaching=0; $.jss.debugMode=0; + $.jss.liveUpdates=1; $.jss.addBehavior('alert', function(selector, value) { alert(value+' from '+selector); }); start = (new Date()).getTime(); $.jss.apply(); test.html 3460812a9075b1ffe04fb32fc32ea523e8562040 Andy Kent andrew.d.kent@gmail.com http://github.com/andykent/jss/commit/2a4fe2c6c66f0189c03cc5b7b22a7fcb7fc604c0 2a4fe2c6c66f0189c03cc5b7b22a7fcb7fc604c0 2008-11-30T07:13:41-08:00 2008-11-30T07:13:41-08:00 added live update support via livequery 7e4e231cf36b46c47491629d24d6ec1d214091ad Andy Kent andrew.d.kent@gmail.com