///-----------------------------------------------------------------------------------
/// Raphael Using functions for Gradient Displays
///-----------------------------------------------------------------------------------

  var FlowBar_Rph;
  var arrd = 9;
  var fbh = 50;
  var gap = 2.5;
  var the_fill;
/*      
  var inactive_backcol = 'ccc';
  var backcol = '613B62';
  var linecol = '444';
  var txtcol = 'fff';

  var fb_txt_1 = "Available\nAccomodation";
  var fb_txt_2 = "Reservation\nRequirements";
  var fb_txt_3 = "Confirmation\nScreen";
*/
    ///-----------------------------------------------------------------------------------
  $(document).ready( function()
    {
      //do_headbar('gk_headbar');
    });

    ///-----------------------------------------------------------------------------------
  function make_fill(backcol)
  {
    return '90-#'+backcol+'-#'+backcol+':50-#'+backcol+':70-#ffffff';
  }

    ///-----------------------------------------------------------------------------------
  function doflow(lbackcol,llinecol,ltxtcol)
  {
  var is_inactive = 0;
    backcol = lbackcol;
    lc = llinecol;
    txtcol = ltxtcol;
    FlowBar_Rph.clear();
    the_fill = make_fill(backcol);
    arrow(0,200,fb_txt_1,false,true,backcol,linecol,txtcol);
    
    if(active_item < 3)
    {
      the_fill = make_fill(inactive_backcol);
      lc = inactive_backcol;
    }
    arrow(200,400,fb_txt_2,true,true,backcol,lc,txtcol);
    
    if(active_item < 5)
    {
      the_fill = make_fill(inactive_backcol);
      lc = inactive_backcol;
    }
    arrow(400,600,fb_txt_3,true,false,backcol,lc,txtcol);
  }

    ///-----------------------------------------------------------------------------------
  function do_headbar(hbid)
  {
  var go_center = arguments[1] || false;
  var hbtxt = $("#"+hbid+" td").html();
    $("#"+hbid+" td").html('').removeClass('gk_bar_control');
  var w = parseInt($("#"+hbid).css('width'));
  var t,hb = Raphael(hbid);
    if(hb)
    {
      hb.clear();
      the_fill = make_fill(backcol);
      var r = hb.rect(0,0,w,32);
      r.attr({fill:the_fill});
      r.attr({
            'stroke':'#'+linecol,
            'stroke-width':.5,
            'stroke-linejoin':'round',
            'stroke-linecap':'round'});
    var ta = 'middle';
      if(go_center)
        t = hb.text( Math.ceil(w/2), 16, hbtxt);
      else
      {
        ta = 'start';
        t = hb.text( 10, 16, hbtxt);
      }
      t.attr({'font-weight':'bold','font-size':'12px','font-family':'Arial','text-anchor':ta, 'fill':'#'+txtcol});
    }
  }

    ///-----------------------------------------------------------------------------------
  function do_submit_button(bid)
  {
    var b = $('#'+bid);
    var f = b.attr('value');
    var o = b.onclick;

    var hb = Raphael(bid);
      hb.clear();
      the_fill = make_fill(backcol);
    var r = hb.rect(0,0,200,32);
      r.attr({fill:the_fill});
      r.attr({
            'stroke':'#'+linecol,
            'stroke-width':.5,
            'stroke-linejoin':'round',
            'stroke-linecap':'round'});
      r.onclick = o;
  
    var t = hb.text( 100, 16, f);
      t.attr({'font-weight':'bold','font-size':'12px','font-family':'Arial','fill':'#'+txtcol});
  }

    ///-----------------------------------------------------------------------------------
  function do_a_button(bid)
  {
    var b = $('#'+bid);
    var f = b.attr('value');
    var o = b.onclick;
    var w = b.css('width');

    var hb = Raphael(bid);
      hb.clear();
      the_fill = make_fill(backcol);
    var r = hb.rect(0,0,w,32);
      r.attr({fill:the_fill});
      r.attr({
            'stroke':'#'+linecol,
            'stroke-width':.5,
            'stroke-linejoin':'round',
            'stroke-linecap':'round'});
      r.onclick = o;
  
    var t = hb.text( Math.ceil(w/2), 16, f);
      t.attr({'font-weight':'bold','font-size':'12px','font-family':'Arial','fill':'#'+txtcol});
  }

    ///-----------------------------------------------------------------------------------
  function arrow(s,e,w, as,ae, backcol,linecol,txtcol)
  {
  var f = '';
  var b = '';
  var r = s;
  var fbh2 = Math.floor(fbh/2);
    if(as)
    {
      f = (s-arrd+gap)+',4L'+(s+arrd+gap)+','+fbh2+'L'+(s-arrd+gap)+','+(fbh-gap-gap);
      r = s-arrd+gap;
    }
    else
      f = s+',4L'+s+','+(fbh-gap-gap);
    if(ae)
      b = (e-arrd-gap)+','+(fbh-gap-gap)+'L'+(e+arrd-gap)+','+fbh2+'L'+(e-arrd-gap)+',4';
    else
      b = e+','+(fbh-gap-gap)+'L'+e+',4';
  
    var p = FlowBar_Rph.path( 'M'+f+'L'+b+'L'+r+',4' );
  
    p.attr({fill:the_fill});
    p.attr({
          'stroke':'#'+linecol,
          'stroke-width':.5,
          'stroke-linejoin':'round',
          'stroke-linecap':'round'});
    var t = FlowBar_Rph.text((s)+((e-s)/2), fbh2, w);
      t.attr({'font-weight':'bold','font-size':'13px','font-family':'Arial','fill':'#'+txtcol});
  }

    ///-----------------------------------------------------------------------------------