Option to generate new CSS rules instead of using inline styles.

[adambiggs]

I'm loving noseGen for development. One less reason to open Photoshop!

This pull request allows you to pass an optional CSS selector as the first argument, which generates a new CSS rule instead of applying the styles inline for each element.

This allows one noise pattern to be reused as many times as you'd like without the overhead of generating new patterns (it can take > 100ms even for very simple patterns). Also makes the HTML look much cleaner when you're inspecting elements :)

Usage:

// normal usage unchanged
$('#foo').noiseGen({
    // options
});

// generate CSS rule instead
$.fn.noseGen('#foo, .noise, .any-other-selector', {
    // options
});

Note: $.fn.newCssRule is very basic and most likely won't work in old browsers... But it would be very easy to flesh-out a bit more for compatibility. I just don't need that for the project I'm working on.

[lucaong]

Adam, This sounds like a great idea. Let me have a look at the pull request later today. Thank you for your contribution!

Luca

On 15/giu/2012, at 01:46, Adam [email protected] wrote:

I am loving noseGen for development. One less reason to open Photoshop!

This pull request allows you to pass an optional CSS selector as the first argument, which generates a new CSS rule instead of applying the styles inline for each element.

This allows one noise pattern to be reused as many times as you'd like without the overhead of generating new patterns (it can take > 100ms even for very simple patterns). Also makes the HTML look much cleaner when you're inspecting elements :)

Usage:

// normal usage unchanged
$('#foo').noiseGen({
   // options
});

// generate CSS rule instead
$.fn.noseGen('#foo, .noise, .any-other-selector', {
   // options
});

Note: $.fn.newCssRule (line 14) is very basic and most likely won't work in old browsers... But it would be very easy to flesh-out a bit more for compatibility. I just don't need that for the project I'm working on.

You can merge this Pull Request by running:

git pull https://github.com/adambiggs/noiseGen generate-css-rules

Or you can view, comment on it, or merge it online at:

https://github.com/DukeLeNoir/noiseGen/pull/8

-- Commit Summary --

• very minor syntax cleanups
• If the 1st argument is a CSS selector, noiseGen will dynamically generate a new CSS rule instead of using inline styles.

-- File Changes --

M noisegen-0.1.4.js (50)

-- Patch Links --

https://github.com/DukeLeNoir/noiseGen/pull/8.patch https://github.com/DukeLeNoir/noiseGen/pull/8.diff

---

Reply to this email directly or view it on GitHub: https://github.com/DukeLeNoir/noiseGen/pull/8

[mdarens]

I was just wondering if this was possible. Is there a reason this request was never merged?

Edit: upon further inspection, this differs from the inline method as currently implemented in that it does not add existing backgrounds to the style rule.

[lucaong]

Yeah but the idea was cool anyway (sorry I just forgot to follow up on this, I was actually spending more effort on other related tools like https://github.com/lucaong/jquery.wallpainter). One thing I would do is having this function in the jQuery namespace rather than in the jQuery.fn, so that one would do:

jQuery.noiseGen( ".my_css_selector", { ... } );