document.observe('dom:loaded',function(){
  var addr_tmpl = new Template('<div class="row"><div class="name"><label for="name[#{idx}]">Friend\'s Name #{cidx}</label><br><input type="text" name="name[#{idx}]"></div><div class="email"><label for="address[#{idx}]">Email</label><br><input type="text" name="address[#{idx}]"></div><br style="clear:both;"></div>');
  var tmpl = new Template('<form method="post" action="/qs/mailform.php"><input type="hidden" name="tellafriend" value="1"><input type="hidden" name="subject" value="#{rel0}"><input type="hidden" name="url" value="#{rel1}"><div class="heading">Tell your friends about our #{rel0}</div><div><div class="section">#{addresses}</div><div class="section"><div class="row"><div class="name"><label for="sender_name">Your Name</label><br><input type="text" name="sender_name"></div><div class="email"><label for="sender_address">Email</label><br><input type="text" name="sender_address"></div><br style="clear:both;"></div></div><div class="row"><div class="message"><label for="message_content">Message</label><br><textarea name="message_content"></textarea></div><br style="clear:both;"></div><div class="row"><div class="qwikcha"><span class="qwikcha_img"></span></div><div class="qwikcha"><input type="text" name="qwikcha"><br><label for="qwikcha"><small>Please enter the Verification Code.</small></label></div><br style="clear:both;"></div><div class="row"><br><div style="text-align:center;"><button>Send Message</button><button>Cancel</button></div></div></div></form>');

  var z_index=100;
  var qwikcha_img = new Element('img', {src:'/qs/qwikcha/qwikcha.php'});
  var qwikcha_start = new Element('span').insert(qwikcha_img);
  var old_homes = new Array();
  var browserDims = document.viewport.getDimensions();
  $$('.tell_a_friend_link').each(function(s){
    s.setStyle({cursor:'pointer'});
    if (!s.rel) {
      var rel = s.identify().split("::");
      if (rel[1]) rel[1] = rel[1].replace(/SLASH/g, "/");
      s.rel = rel.join("::");
    }
    var rels = s.rel.split("::").each(function(n,idx){
      s['rel'+idx] = n;
    });
    s.addresses='';
    var num_addresses = s.classNames().find(function(f){return f.endsWith('-addresses')});
    num_addresses = (num_addresses==undefined) ? 3 : parseInt(num_addresses.gsub('-addresses',''));
    for(var i=0; i<num_addresses; ++i) {
      s.addresses+=addr_tmpl.evaluate({idx:i,cidx:(num_addresses==1)?'':i+1});
    }
    var el = new Element('div',{'class':'tell_a_friend','style':'position:absolute; top:'+((browserDims.height - 200) / 2)+'px; left:'+((browserDims.width - 400) / 2)+'px; display:none;'}).update(tmpl.evaluate(s));

    s.insert({after:el});
    el.select('button').each(function(t){
      t.observe('click',function(e){e.stop();if(e.element().innerHTML=='Send Message'){
        $(el.select('form')[0]).request({onSuccess:function(transport){
          qwikcha_img.setAttribute('src','/qs/qwikcha/qwikcha.php?rand='+Math.floor(Math.random()*1001));
          var json=transport.responseText.evalJSON();
          if ($('status_message')!==undefined) $('status_message').update(json.status_message);
        }});
      };el.fade();if(old_homes[z_index])old_homes[z_index].insert(qwikcha_img)});
    });
    s.observe('click',function(e){e.stop();el.setStyle({zIndex:++z_index});el.appear().scrollTo();old_homes[z_index]=qwikcha_img.up();$(el.select('.qwikcha_img')[0]).insert(qwikcha_img)});
  });
});
// usage: <a class="tell_a_friend_link 3-addresses" rel="Tell your friends msg...">Tell A Friend!</a>
// in classes, you can specify <any number>-addresss and that number of address fields will be created


