Radek Radek - 2 years ago 93
Ruby Question

how to inject into sintra/haml?

I coded small web app that runs ant (batch file). The processing time of the batch file could take up to minutes.

index.haml list all available ant files and run.haml runs them. The flow how it works now is that when I click a link from index.haml the ant script is run and after it finishes the whole run.haml page is sent to the browser. So after clicking link from index.haml I still can see index.haml and nothing from run.haml

After I click a link from index.haml I want to

  • show what script is going to be run and then

  • run the ant script and then

  • display the results of it.

I was recommended in my other question to use

I didn't understand how a separate worker thread could help me. Would the delayed job's results that are captured by ruby's call be sent to the browser once the job finishes?

I also didn't get how I can use Ajax in sinatra.

Could somebody point me out what a solution for that could be like? Please note that I know bit of ruby, learned bit of sinatra and haml yesterday. No nothing about Ajax :-) I learn by examples ... and happy to learn anything.

index.haml gives me html like

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<title>Available test suits</title>
<h1>Available test suits</h1>
<a href='run?run=login_build'>login_build</a>
<br />
<a href='run?run=login_cycle_build'>login_cycle_build</a>
<br />
<a href='run?run=login_cycle_academicyear_build'>login_cycle_academicyear_build</a>

run.haml looks like

%title Running
= "Starting test suite: #{params['run']}"
- output = %x[cd C:\\Program Files\\TestPro\\TestPro Automation Framework410 && ant -lib lib -f "C:\\Program Files\\TestPro\\TestPro Automation Framework410\\Output Files\\builds\\#{params['run']}.xml"]
-#The result is
= output.split("\n")[-2,2].join("<BR>")
= "<br/>"*2
%a(href="/")back to suits list

Answer Source

If you want to use Ajax must, choose a javascript library Dojo, Prototype, Mootools, jQuery... Each of them has specific tools for handling ajax requests.

In javascript you make an xhr(Ajax request), which may be asynchronous and still Sinatra serves you the wanted content, you can display in webpage what you want.

var xhrLoadClientMenu = function(param){
var result_node = dojo.byId('div_menu')
var xhrArgs = {
  // the Sinatra get "/run" ... end handler
  url: '/run',
  load: function(data){
    // When response is rendered come's here 
    result_node.innerHTML = data;
  error: function(error){
    msg = "<p>Ooops some error ...<br><br>" + error + "</p>";
  // Here you can put what you want to display durring loading
  result_node.innerHtml = "Loading..." 
  var defered = dojo.xhrGet(xhrArgs)

a xhrGet example using dojo. See inline comments.

  • xhrLoadClientMenu(param) is triggered by an event;
  • a HTML element with id #div_menu from page is stored in result_node object;
  • xhrArgs object sets the Ajax request properties like:
    1. url: the Sinatra handler which renders the content;
    2. load: function gets the response from sinatra and replaces result_node content when load is completed
    3. error if something goes wrong this message will be shown in result_node;
  • meanwhile you may set the result_node content to anything while the real content is loading;
  • last line executes the xhr request.

All of this is happening without a page reload.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download