gistfile1.js

// spread_the_fire/index.html
<div id="popup_spread_fire">
<a class="close_box" onclick="window.top.tb_remove();" href="#">close</a>  
<% form_tag('/spread_the_fire', :id => 'fireForm', :class => 'remoteForm') do %>
<div class="left_form">
  <p>
    <%= label :email, :recipients, "To" %>
    <%= text_field :email, :recipients, :class => 'required email' %>
  </p>

  <p>
    <%= label :email, :from, "From" %>
    <%= text_field :email, :from %>
  </p>
  
  <p id="player_select">
    <label>Choost Players to Greet Them</label>
    <%= select_tag 'email[player_1]', players_for_select(@players) -%>
    <%= select_tag 'email[player_2]', players_for_select(@players) -%>
    <%= select_tag 'email[player_3]', players_for_select(@players) -%>
  </p>
</div>
<div class="right_form">
  <p>

    <%= label :email, :subject, "Subject" %>
    <span id="email_subject_warning"></span>
    <%= text_field :email, :subject %>
  </p>

  <p>

    <%= label :email, :body, "Your Message" %>
    <span id="email_body_warning"></span>
    <%= text_area :email, :body, :rows => 8, :cols => 50 %>
  </p>
  
  <p class="addPermalink">
    <label>Send permalink to article</label>
    <span class="radio_label">Yes</span>
    <%= radio_button_tag "permalink", 1, true, :class => "crirHiddenJS"
 -%>
    <span class="radio_label">No</span>
    <%= radio_button_tag "permalink", 0, false, :class => "crirHiddenJS"
 -%>
    <%= hidden_field :email, :permalink -%>
  </p>
</div>
<label>Message Preview</label>
  <div id="live_preview">
    <table>
      <tr>
        <td id="player_1_preview">
          <img src="" />
        </td>
        <td id="player_2_preview">
        </td>
        <td id="player_3_preview">
        </td>
        <td id="message_preview">
          <h4 class="subject"></h4>
          <p class="message_text"></p>
          <a href="http://pyromaniac.com/" id="check_it_out">Check it out!</a>
        </td>
      </tr>
    </table>
  </div>
  
  <p>
      <%= image_submit_tag("comment_submit.png") %>
  </p>
  
<% end %>
</div>

// spread_the_fire.js
function validateThickboxForm() {
  $('#fireForm').validate();
}

function addPermalinkToHiddenField(permalink) {
  var checkbox = $('p.addPermalink input[type=radio]')
  var hiddenField = $("#email_permalink");
  checkbox.live("click", function(){
    var checkboxVal = $(this).val();
    if ( checkboxVal > 0 ) { 
      hiddenField.val(permalink) 
      insertPermalinkinMessage(permalink)
    } 
    else { 
      hiddenField.val()
      insertPermalinkinMessage("http://pyromaniac.com/")
    }
  });
}

function textPreview(inputElement, previewElement, warningElement, limit) {
  var input = $(inputElement)
  var inputPreview = $(previewElement)
  var warning = $(warningElement)
  
  input.keyup(function(){
    var inputVal = $(this).val();
    
    if ( inputVal.length > limit ) {
      inputVal = inputVal.substr(0, limit); // This is not changing the val live
      warning.html("only " + limit + " characters allowed")
    }
    inputVal = inputVal.replace(/\n/g, "<br />").replace(/\n\n+/g, '<br /><br />').replace(/(\<\/?)script/g,"$1noscript");
    inputPreview.html(inputVal);
  });
}

function imagePreview(selectElement, previewElement) {
  var selectbox = $(selectElement)
  var preview = $(previewElement)
  
  selectbox.change(function(){
    var selectboxVal = selectbox.val()

  });
}
function livePreview() {
  
  // This could probably be cleaned up a bit 
  textPreview("#email_subject", "td#message_preview h4.subject", "span#email_subject_warning", 50)
  textPreview("#email_body", "td#message_preview p.message_text", "span#email_body_warning", 365)
  imagePreview("#email_player_1","#player_1_preview")
  
}