2

I'm making very simple ROR (rails 2.3.5) application and using jQuery plugin jRails. The idea is to lunch modified in jQuery youtube player, which will play random videos from ror's controller's list.

controller.rb

    def show
    @clip = Video.find(:all, :select =>'link', :order => 'RANDOM()', :limit => 1).map(&:link)
    respond_to do |format|
      format.html 
     end
  end

show.html.erb 

<div id="random">
<%=@clip%>
</div>

The link here is just a random youtube link for example. The question for lame me is how to get this variable in this jQuery function?

application.js

 $(document).ready(function(){
    $('#player').youTubeEmbed("http://www.youtube.com/watch?v=ZDFlmxmBne8")

});

Would be very thankful for any help.

Taryn
  • 242,637
  • 56
  • 362
  • 405
Maay
  • 575
  • 9
  • 27

3 Answers3

4

Leave your rails code as is and in jQuery use:

$(document).ready(function(){
  $('#player').youTubeEmbed($('#random').text())
});

For enhanced accessibility I'd change the erb to:

<div id="random">
<%=link_to h(@clip), h(@clip) %>
</div>

and then the js:

$(document).ready(function(){
  $('#player').youTubeEmbed($('#random a').attr('href'));
  $('#random').hide();
});
Jakub Hampl
  • 39,863
  • 10
  • 77
  • 106
  • Jakub,thank you! Your solution helped, now it works. Now I can quetly continue my self-education. – Maay Nov 28 '10 at 14:55
2

Assuming that the variable contains the URL, like this:

$(document).ready(function(){
    $('#player').youTubeEmbed("<%=escape_javascript(@clip)%>");
});

(Sorry, missed the fact that the JavaScript was not in the same file as the HTML -- as well it shouldn't be!)

Assuuming the variable contains the URL, if you don't want the URL shown, you can embed it in a page variable like so (replace the div code in show.html.erb with the following):

<script type='text/javascript'>
window.myStuff = {
    clipUrl: "<%=escape_javascript(@clip)%>"
};
</script>

...(or

<script type='text/javascript'>
var myStuff = {
    clipUrl: "<%=escape_javascript(@clip)%>"
};
</script>

...which is very nearly the same thing).

...and then you can use it like this:

$(document).ready(function(){
    $('#player').youTubeEmbed(window.myStuff.clipUrl);
});

When outputting a variable's value in this way, you need to ensure that what gets written out ends up being valid JavaScript. So for instance, if the @clip variable contains a " or a \, you'll need to ensure that the " is turned into \" and that any lone backslash is turned into \\. Jakub Hampl helpfully pointed out the escape_javascript function for this, which I've edited into the code examples.

Doing this that means we're putting a new symbol on window. I made our new symbol an object so that if we need to do this with other things, we can include them in that same object so we don't end up with symbols all over the place (creating lots of global symbols — which is to so, window properties — tends to become a maintenance issue, best avoided). So for instance, if you had two clips:

<script type='text/javascript'>
window.myStuff = {
    someNiftyClip:      "<%=escape_javascript(@clip)%>",
    someOtherNiftyClip: "<%=escape_javascript(@anotherClip)%>"
};
</script>

Off-topic: In the line calling youTubeEmbed, note I added a semicolon at the end. Best not to rely on JavaScript's semicolon insertion.

T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • 1
    Use `escape_javascript` for this aproach. `@clip` could be something like `http://youtu.be/";alert('evil code here');"`. – Jakub Hampl Nov 28 '10 at 14:36
  • @Jakub: Thanks. I did mention the importance of escaping, but I'm not much of a Railshead so didn't know the actual function. Now I do, edited in and linked to it for the OP. Thanks again! – T.J. Crowder Nov 28 '10 at 14:42
  • Your option worked as well, many thanks. That's great to find such community, thank you guys! – Maay Nov 28 '10 at 14:58
0

You could put the variable in a hidden field, then you could use it in the function like $('#hiddenFieldID').val();

Chris Westbrook
  • 1,960
  • 5
  • 23
  • 35