FriendhunterWidget = new function() {
  var BASE_URL = 'http://www.friendhunter.nl';
  var STYLESHEET = BASE_URL + '/whitelabel/includes/css/widgetcss.aspx';
  var CONTENT_URL = BASE_URL + '/content/widget/widgetjobs.aspx';

  function addQueryParam( varname, paramname )
  {
    var retval = '';

    if( varname != '' )
      retval = '&' + paramname + '=' + escape( varname );

    return retval;
  }
  
  function requestStylesheet(stylesheet_url){
    stylesheet = document.createElement("link");
    stylesheet.rel = "stylesheet";
    stylesheet.type = "text/css";
    var url = stylesheet_url + '?par=fh';
    if( typeof(np) != 'undefined' ) url += addQueryParam( np, 'np' );
    stylesheet.href = url;
    stylesheet.media = "all";
    document.lastChild.firstChild.appendChild(stylesheet);
  }

  function requestContent( contentUrl ) {
    var script = document.createElement('script');
    var url = contentUrl + '?par=fh';
    if( typeof(np) != 'undefined' ) url += addQueryParam( np, 'np' );
    if( typeof(maxJobsCount) != 'undefined' ) url += addQueryParam( maxJobsCount, 'jCount' );
    if( typeof(bonusDisplayMode) != 'undefined' ) url += addQueryParam( bonusDisplayMode, 'bType' );
    script.src = url;
    document.getElementsByTagName('head')[0].appendChild(script);
  }
  
  
  this.serverResponse = function( jobs ) {
    var jobsDiv = document.getElementById('friendhunterJobs');
    var jobItem = "";
    if (jobs.length > 0){
        for (var i = 0; i < jobs.length; ++i) {
          jobItem += "<div onmouseout=\"javascript:ChangeItemAppearance(this, 'WidgetItem');\" onmouseover=\"javascript:ChangeItemAppearance(this, 'WidgetItemHover');\" onclick=\"location.href='" + jobs[i].url + "'\" class='WidgetItem'>" +
                     "<table cellspacing='0' cellpadding='0'>" + 
                        "<tbody><tr>" + 
                          "<td class='WidgetTitleArrow'>" + 
                            "<div class='WidgetArrow1 WidgetArrowColor'>&nbsp;</div>" + 
                            "<div class='WidgetArrow2 WidgetArrowColor'>&nbsp;</div>" + 
                            "<div class='WidgetArrow3 WidgetArrowColor'>&nbsp;</div>" + 
                            "<div class='WidgetArrow4 WidgetArrowColor'>&nbsp;</div>" + 
                            "<div class='WidgetArrow3 WidgetArrowColor'>&nbsp;</div>" + 
                            "<div class='WidgetArrow2 WidgetArrowColor'>&nbsp;</div>" + 
                            "<div class='WidgetArrow1 WidgetArrowColor'>&nbsp;</div>" + 
                          "</td>" + 
                          "<td class='WidgetTitle'>" + 
                            "<a href='" + jobs[i].url + "' class='WidgetTitle'>" + jobs[i].name + "</a>" + 
                          "</td>" + 
                        "</tr>" +
                    "</tbody></table>" + 
                    "<table cellspacing='0' cellpadding='0' style='width: 100%;'>" +
                      "<tbody><tr>" + 
                        "<td style='width: 100%;' class='WidgetCity'>" + jobs[i].company + ", " + jobs[i].location + "</td>" + 
                          "</tr>" + 
                            "</tbody></table>";
                            if( typeof(bonusDisplayMode) != 'undefined' && bonusDisplayMode != '0'){
                                jobItem += "<table cellspacing='0' cellpadding='0' style='width: 100%;'>" + 
                                             "<tbody><tr>" + 
                                               "<td class='WidgetPriceTitle'>Bonus</td>" + 
                                               "<td style='width: 100%;' class='WidgetPrice'>&euro; " + jobs[i].bonus + "</td>" + 
                                             "</tr>" + "</tbody></table>";
                            }
                        jobItem += "</div>";
        }
    }
    /*
    for (var i = 0; i < maxJobsCount-jobs.length; ++i){
      // If empty boxes are desired, write script
    }*/
    jobsDiv.innerHTML = jobItem;
    if (jobs.length < 1){
      document.getElementById('friendhunterJobs').innerHTML = 'No jobs were found';
    }
    jobsDiv.style.display = 'block';
  }
  
  this.init = function() {
      requestStylesheet(STYLESHEET);
      document.write("<div id='WidgetWrap'>");
      document.write("<div class='WidgetRoundCorner1 WidgetRoundCornerColor'>&nbsp;</div>");
      document.write("<div class='WidgetRoundCorner2 WidgetRoundCornerColor'>&nbsp;</div>");
      document.write("<div class='WidgetRoundCorner3 WidgetRoundCornerColor'>&nbsp;</div>");
      document.write("<div class='WidgetRoundCorner4 WidgetRoundCornerColor'>&nbsp;</div>");
      document.write("<div class='WidgetHead WidgetRoundCornerColor'>" + 
                        "<table>" + 
                          "<tbody><tr>" + 
                            "<td style='width: 50px;'><img src='http://www.friendhunter.nl/Whitelabel/Images/Widget/LogoWidget.jpg'/></td>" + 
                            "<td>Laatste vacatures op Friendhunter</td>" + 
                          "</tr>" +
                        "</tbody></table>" +
                     "</div>");
      document.write("<div id='friendhunterJobs'></div>");
      document.write("<div onmouseout=\"javascript:ChangeItemAppearance(this, 'WidgetItem');\" onmouseover=\"javascript:ChangeItemAppearance(this, 'WidgetItemHover');\" onclick=\"location.href='http://www.friendhunter.nl/Content/General/SearchResults.aspx'\" class='WidgetItem'>" + 
                        "<table cellspacing='0' cellpadding='0'>" +
                          "<tbody><tr>" +
                            "<td class='WidgetTitleArrow'>" + 
                              "<div class='WidgetArrow1 WidgetArrowColor'>&nbsp;</div>" +
                              "<div class='WidgetArrow2 WidgetArrowColor'>&nbsp;</div>" +
                              "<div class='WidgetArrow3 WidgetArrowColor'>&nbsp;</div>" +
                              "<div class='WidgetArrow4 WidgetArrowColor'>&nbsp;</div>" +
                              "<div class='WidgetArrow3 WidgetArrowColor'>&nbsp;</div>" +
                              "<div class='WidgetArrow2 WidgetArrowColor'>&nbsp;</div>" +
                              "<div class='WidgetArrow1 WidgetArrowColor'>&nbsp;</div>" +
                            "</td>"
                    );
      document.write("<td class='WidgetTitle'>" + 
                        "Meer vacatures" + 
                     "</td>");
      document.write("</tbody></table>");
      document.write("</div>");
      
      document.write("<div class='WidgetFoot WidgetRoundCornerColor'>" + 
                        "Powered by <a href='http://www.friendhunter.nl'>Friendhunter</a></div>" + 
                     "<div class='WidgetRoundCorner4 WidgetRoundCornerColor'>&nbsp;</div>" + 
                     "<div class='WidgetRoundCorner3 WidgetRoundCornerColor'>&nbsp;</div>" + 
                     "<div class='WidgetRoundCorner2 WidgetRoundCornerColor'>&nbsp;</div>" + 
                     "<div class='WidgetRoundCorner1 WidgetRoundCornerColor'>&nbsp;</div>");
      document.write("</div>");
      requestContent(CONTENT_URL);
      var no_script = document.getElementById('no_script');
      if (no_script) { no_script.style.display = 'none'; }
    }  
}
FriendhunterWidget.init();

function ChangeItemAppearance(Obj, sClassName){
    Obj.className = sClassName;
    var myDivs = Obj.getElementsByTagName("div");
    for (var t=0;t<myDivs.length;t++)
    {
        if(myDivs[t].className == "WidgetItem")
        {
            myDivs[t].className = "WidgetItemHover";
        }
        else if (myDivs[t].className == "WidgetItemHover")
        {
            myDivs[t].className = "WidgetItem";
        }
    }
}