// Add this to your html layout:
// 
//   <link rel="stylesheet" href="imedo-related-doctors-styles.css" type="text/css" media="screen" title="no title" charset="utf-8">
//   <script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
//   <script type="text/javascript" charset="utf-8" src="http://localhost:3000/javascripts/apps/doctors/related-doctors.js"></script>
//   
// Add this div wherever you want related doctors to show up. The "rel" attribute of the container acts as your search hint:
// <div class="imedo-related-doctors-container" rel="Neurodermitis"></div>
//
var IMEDO = {
  PageSetup: {
    buildSearchUrl: function(url){ return url; },
    urlArray: window.location.pathname.split("/"),
    setupInfrastructure: function(){}
  },
  
  RelatedDoctors: {
    // Change default settings after this file has loaded:
    //   IMEDO.RelatedDoctors.topic = "Augenarzt";
    //   IMEDO.RelatedDoctors.apiUrl = "http://arztsuche.mywebsite.de/practice/provider_search_api";
    topic: "Allgemeinmedizin",
    apiUrl: "http://doctors.imedo.de/practice/provider_search_api",
    builder: "HtmlListBuilder",
    limit: 5,
    siteId: null,
    
    fetch: function(){
      var self = this;
      $jq(".imedo-related-doctors-container").each(function(){
        var element = $jq(this);
        $jq.ajax({
          url: IMEDO.RelatedDoctors.apiUrl,
          data: {
            "url"   : location.href,
            "topic" : element.attr('rel') || self.topic, // Result of topic function
            "limit" : IMEDO.RelatedDoctors.limit,
            "site_id" : IMEDO.RelatedDoctors.siteId
          },
          dataType: "jsonp", // Works around same-origin policy
          success: function(data, status, request) {
            IMEDO[IMEDO.RelatedDoctors.builder].build(element, data);
          }
        });
      });
    }
  },
  // If you need your own custom html, implement your HtmlBuilder like this:
  // IMEDO.MySpecialBuilder = {
  //   build: function(parentContainer, data){
  //     console.log(data);
  //   }
  // }
  // 
  // Then set your Builder as default:
  // IMEDO.RelatedDoctors.builder = "MySpecialBuilder";
  HtmlListBuilder: {
    // data = result information from imedo related doctors api (parsed JSON Object)
    build: function(parentContainer, data){
      if(data.results.length === 0){
        return;
      }
      parentContainer.empty();
      // Add Header to parent container
      parentContainer.append("<div>Diese Ärzte könnten Ihnen helfen.<br/>"+(data.expertise || "Ärzte")+" in "+(data.location || "ihrer Nähe")+"</div>");
      
      // Add result list to parent container
      var list = $jq("<ul></ul>");
      for(i=0; i < data.results.length; i++){
        var result  = data.results[i];
        var providerUrl = '/practice/provider/show/' + result.permalink;
        var header  = "<a href='"+providerUrl+"'>"+result.name+"</a>";
        var image   = "<a href='"+providerUrl+"'><img src='"+result.pictureUrl+"' alt='"+result.name+"' width='45' height='45' /></a>";
        var text    = "<p>"+result.text+"</p>";
        list.append("<li>"+ image + "<div>" + header + text + "</div></li>");
      }
      parentContainer.append(list);
    }
  }
};

// Make sure we play nicely with other js libraries:
var $jq = jQuery.noConflict();

// Asynchronously fetch all releated doctors after dom tree is ready
$jq(document).ready(function(){
  IMEDO.PageSetup.setupInfrastructure();
  IMEDO.RelatedDoctors.fetch();
});