Monday, January 6, 2014
As Walter says, Coffeescript by default compiles to javascript like this:
(function() {
// your code here...
}).call(this);
This creates a closure: code within it can only be accessed by other code within it by default. In addition to Walter's ideas, you could:
1) define paintIt as window.paintIt, which will force the function into the global scope, so it can be accessed anywhere. This is not ideal, as already discussed.
2) Use JQuery or a similar library (JQuery is in your standard Rails project gemfile) to add a listener. It would be something like this:
paintIt = (element, backgroundColor, textColor) ->
element.style.backgroundColor = backgroundColor
if textColor?
element.style.color = textColor
element.style.backgroundColor = backgroundColor
if textColor?
element.style.color = textColor
$('#paintRed').click ->
paintIt(this, '#990000')
<a id="paintRed">Paint it red!</a>
The data attribute solution is the way to go for anything more than a few links, however. You may nonetheless be able to reduce boilerplate by using JQuery to make listeners.
On Sun, Jan 5, 2014 at 4:56 PM, Walter Lee Davis <waltd@wdstudio.com> wrote:
What does your JavaScript console say? Is the compiled JS in the page before the link appears to call it? Is the CS-generated JS wrapped in a closure of some sort? (I'm thinking here that your function may not be in the global scope.)
It's much better practice to establish listeners in your script, and invoke them lazily, rather than writing inline (so-called DOM Level 0) scripts in your page code.
Consider this (which you must add at the very end of the page code, not the beginning):
document.addEventListener('click', evt){
if(this.tagName == 'A'){
if(this.readAttribute('data-paint')){
this.style.backgroundColor = this.readAttribute('data-paint');
}
}
});
That would interact with this HTML:
<a href="#" data-paint="#990000">Paint it red</a>
You could extend this pattern by adding a data-text-color attribute, and add a handler for that in the one function body. There's probably little difference in following this pattern versus your example when there's a few links on the page, but if there were thousands, this method would be measurably faster to load and evaluate.
Walter
To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/F1B1FA98-9C03-49F3-9E3B-08F724FAA610%40wdstudio.com.
On Jan 5, 2014, at 11:07 AM, izik shapira wrote:
> Hi,
> I turn this code into CoffeeScript:
>
> paintIt = (element, backgroundColor, textColor) ->
> element.style.backgroundColor = backgroundColor
> if textColor?
> element.style.color = textColor
>
> and this code I turn to html.rb
>
> <a href="#" onclick="paintIt(this, '#990000')">Paint it red</a>
>
> it not worked fine, I see the link but it's not Paint it red!
>
> What Did I Do Wrong?
>
> thank, Izik
>
> --
> Posted via http://www.ruby-forum.com/.
>
> --
> You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to rubyonrails-talk+unsubscribe@googlegroups.com.
> To post to this group, send email to rubyonrails-talk@googlegroups.com.
> To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/1a13b315775cf3863839abaaded7306f%40ruby-forum.com.
> For more options, visit https://groups.google.com/groups/opt_out.
--
You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to rubyonrails-talk+unsubscribe@googlegroups.com.
To post to this group, send email to rubyonrails-talk@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to rubyonrails-talk+unsubscribe@googlegroups.com.
To post to this group, send email to rubyonrails-talk@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/CAAb4X%3DwsaBOnKvs2d5H_vt2Rt-3K0Dj-E-E0CJY%3DhESZ-aUhHg%40mail.gmail.com.
For more options, visit https://groups.google.com/groups/opt_out.
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment