var socialMedia = {};

(function(){

  var theSocialContainer,
      theSocialSubContainer,
      theTabs,
      thePanes,
      IS_SMALL_CONTAINER = false;

  function setUpSocialMedia(socNo) {

      theSocialSubContainer = "#socialTabs" + socNo;
      theSocialContainer = "#SocialMedia" + socNo;
      theTabs = "#tabs" + socNo;
      thePanes = "#panes" + socNo;
       
      $(theTabs).tabs(thePanes, { effect: 'ajax' });

      IS_SMALL_CONTAINER = $(theSocialContainer)[0].parentNode.className.indexOf("sub") >= 0;

      //**************************
      //Skapa tabbar
      //**************************
      $.ajax({
          type: "POST",
          url: "/Templates/Public/Services/SocialMediaService.asmx/GetSocialTabs",
          async: false,
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          data: "{pageId:'" + PageId + "', socMNr:'" + socNo + "'}",
          success: function (response) {
              var c = 0;
              var container = $(theSocialContainer);

              container.show();
              if (response.d.length == 0) {
                  container.hide();
                   var sub = $(theSocialSubContainer).parent().parent();
			      sub.hide();
                  $(theSocialSubContainer).hide();
              }

              $.each(response.d, function (i, n) {
                  var showIcon = n.ShowIcon;

                  //Visa ikon eller text
                  if (showIcon) {
                      $(theTabs).append("<li id=theTab" + socNo + "><a rel=" + n.PageName + "><img src='/Templates/PublicCulture/styles/Images/icon_" + n.PageName + ".png' width=22 height=22></a></li>");
                  }
                  else {
                      $(theTabs).append("<li id=theTab" + socNo + "><a rel=" + n.PageName + ">" + n.TabName + "</a></li>");
                  }

                  //Ladda första tabbens innehÃ¥ll
                  if (c == 0)
                      LoadCorrectPage(socNo, n.PageName);

                  c++; // << ha ha ha
              });

              //Lite style-trollande
              var theParentClassName = container[0].parentNode.className;
              if (theParentClassName.indexOf("sub") >= 0) {
                  var modul = container[0].parentNode;
                  modul.style.marginBottom = "10px";

                  var href = $(theTabs).find("a");
                  var img = $(href).find("img");
                  if (img.length > 0) {
                      href.css("padding", "10px 12px");
                  }
              }
          },
          error: function (response) {
              displayError(response.responseText, socNo);
          }
      });

      //**************************
      //Click-event för tabbarna
      //**************************
      $("#tabs" + socNo).find("#theTab" + socNo)
          .each(function () {
              $(this).click(function () {
                  var $this = $(this);
                  $this.parent().find("li").removeClass("selected");
                  $this.addClass("selected");
                  var thePageName = $this[0].firstChild.rel; //Fungerar i IE7, 8, 9, FF, Chrome
                  LoadCorrectPage(socNo, thePageName);
              });
          })
          .first().addClass("selected");
  }

  function displayError(errMsg, socNo) {
      $("#socError" + socNo).html(errMsg);
      $("#socError" + socNo).show();
      $("#socError" + socNo).css("border", "solid");
      $("#socError" + socNo).css("border-color", "red");
  }

  function LoadCorrectPage(socNo, pageName) {
      $("#socError" + socNo).hide();
      try {
          if (pageName == "YouTube") {
              CreateYouTubeTab(pageName, socNo);
          }
          else if (pageName == "Flickr") {
              CreateFlickrTab(pageName, socNo);
          }
          else if (pageName == "Bambuser") {
              CreateBambuserTab(pageName, socNo);
          }
          else if (pageName == "Twitter") {
              CreateTwitterTab(pageName, socNo);
          }
          else {
              if (IS_SMALL_CONTAINER) {
                  //CreateFaceBookTabSmall(pageName,socNo);
                  var theRightUrl = "/Templates/PublicCulture/Units/Modules/SocialMedia/" + pageName + ".aspx?pid=" + PageId + "&moduleNo=" + socNo + "&fbWidth=205";

                  $.get(theRightUrl, function (data) {
                      $("#panes" + socNo).html(data);
                  });
              }
              else {
                  var theRightUrl = "/Templates/PublicCulture/Units/Modules/SocialMedia/" + pageName + ".aspx?pid=" + PageId + "&moduleNo=" + socNo + "&fbWidth=290";
                  $.get(theRightUrl, function (data) {
                      $("#panes" + socNo).html(data);
                  });
              }
          }
      }
      catch (e) {
          displayError(e.Message, socNo);
      }
  }

  function AppendLinkToSocialMedia(pageName, socNo, userId) {

      var createLink = function(href, text) {
            var $container = $("#socContainer" + socNo),
                link = $("<a/>", { id:"socialMediaLink", target:"_blank", href: "http://" + href + userId, text: text });
            $container.append($("<p/>").append(link));
          };

      switch (pageName) {
          case 'YouTube':
              createLink("www.youtube.com/", "Filmer på YouTube");
              break;
          case 'Flickr':
              createLink("www.flickr.com/photos/", "Se fler bilder på Flickr");
              break;
          case 'Bambuser':
              createLink("bambuser.com/channel/", "Se live-sändning på Bambuser");
              break;
          case 'Twitter':
              createLink("twitter.com/", "Följ oss på Twitter");
              break;
          case 'Facebook':
              createLink("www.facebook.com", "Följ oss på Facebook");
              break;
          default:
              break;
      }
  }

  function CreateYouTubeTab(pageName, socNo) {
      try {
          $.ajax({
              type: "POST",
              url: "/Templates/Public/Services/SocialMediaService.asmx/GetYouTubeChannel",
              async: false,
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              data: "{pageId:'" + PageId + "', socMNr:'" + socNo + "'}",
              success: function (response) {
                  if (response.d == null) {
                  }
                  else {
                      var youTubeChannel = response.d.SocMedAccount;
                      var numHits = response.d.NoOfObjects;
                      $("#panes" + socNo).html('');
                      $("#panes" + socNo).append("<div id=socContainer" + socNo + "></div>");

                      AppendLinkToSocialMedia(pageName, socNo, youTubeChannel);

                      $("#socContainer" + socNo).fnGetYouTubeUrls({
                          author: youTubeChannel,
                          results: numHits,
                          showNumRatings: false,
                          showRatings: false,
                          showDescription: false,
                          socMedNum: socNo
                      });
                      //TemporaryAfterFix();
                  }
              },
              error: function (response) {
                  displayError(response.responseText, socNo);
              }
          });
      }
      catch (e) {
          displayError(e.Message, socNo);
      }
  }

  function CreateFlickrTab(pageName, socNo) {
      try {
          $.ajax({
              type: "POST",
              url: "/Templates/Public/Services/SocialMediaService.asmx/GetFlickrId",
              async: false,
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              data: "{pageId:'" + PageId + "', socMNr:'" + socNo + "'}",
              success: function (response) {
                  if (response.d == null) {
                  }
                  else {
                      var flickrId = response.d.SocMedAccount;
                      var numHits = response.d.NoOfObjects;
                      $("#panes" + socNo).html('');
                      $("#panes" + socNo).append("<div id=socContainer" + socNo + "></div>");

                      AppendLinkToSocialMedia(pageName, socNo, flickrId);

                      $("#socContainer" + socNo).append("<div id=images></div>");
                      var theUrl = "http://api.flickr.com/services/feeds/photos_public.gne?id=" + flickrId + "&lang=en-us&format=json&jsoncallback=?";

                      //$.getJSON(theUrl, displayFlickrImages);

                      $.getJSON(theUrl, function (data) {
                          if (data.items.length > 0) {
                              displayFlickrImages(data, socNo, numHits);
                          }
                      });
                  }
              },
              error: function (response) {
                  displayError(response.responseText, socNo);
              }
          });
      }
      catch (e) {
          displayError(e.Message, socNo);
      }
  }

  function CreateBambuserTab(pageName, socNo) {
      try {
          $.ajax({
              type: "POST",
              url: "/Templates/Public/Services/SocialMediaService.asmx/GetBambuserAccount",
              async: false,
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              data: "{pageId:'" + PageId + "', socMNr:'" + socNo + "'}",
              success: function (response) {
                  if (response.d == null) {
                  }
                  else {
                      var bambuserAccount = response.d.SocMedAccount;
                      var numHits = response.d.NoOfObjects;
                      var appKey = response.d.AppKey;
                      $("#panes" + socNo).html('');
                      $("#panes" + socNo).append("<div id=socContainer" + socNo + "></div>");

                      AppendLinkToSocialMedia(pageName, socNo, bambuserAccount);

                      $("#socContainer" + socNo).append('<div class="video-item" id="videoItem' + socNo + '">');

                      //TODO: Change api_key! Felix key right now! Needs to be an episerverproperty and each customer needs to get its own key!
                      var theUrl = "http://api.bambuser.com/getVideos.json?username=" + bambuserAccount + "&limit=" + numHits + "&api_key=" + appKey;
                      //var theUrl = "http://api.bambuser.com/getVideo.json?vid=1234&api_key=987de468071bbee011ff41894e39cabd";

                      $.ajax({
                          type: "GET",
                          url: theUrl,
                          dataType: 'jsonp',
                          success: function (data) {
                              var container = $("#socContainer" + socNo);
                              videoItem = container.find('#videoItem' + socNo);
                              var theList = "";
                              theList = "<ul>";
                              $.each(data.result, function (i, item) {
                                  var theParentClassName = container[0].parentNode.className;
                                  theList += '<li><img height="84" width="112" id=bambVid rel="' + item.vid + '" src="' + item.preview + '" title="' + item.title + '" /></li>';
                              });
                              theList += "</ul>";
                              videoItem.append(theList);

                              $('.video-item #bambVid').each(function () {
                                  var picture = $(this);
                                  picture.click(function () {
                                      var videoId = picture.attr("rel");
                                      var videoUrl = "http://static.bambuser.com/r/player.swf?vid=" + videoId;
                                      var theRightUrl = "/Templates/PublicCulture/Units/Modules/SocialMedia/MovieEmbed.aspx?url=" + videoUrl;
                                      $.get(theRightUrl, function (data) {
                                          $("#socialMediaVideoContainer" + socNo).html(data);
                                          var c = $("#socialMediaVideoContainer" + socNo);
                                          c.show().overlay({
                                              effect: 'apple',
                                              api: true,
                                              left: "center",
                                              expose: {
                                                  color: "#ccc",
                                                  loadSpeed: 500,
                                                  opacity: 0
                                              },
                                              closeOnClick: false,
                                              top: "center",
                                            onClose:function(content) {
                                                var thePlayer = $("#socialMediaVideoContainer" + socNo).find('#theMoviePlayer');
                                                if (thePlayer.length > 0) {
                                                    thePlayer.remove();
                                                }
                                            }
                                          }).load();
                                          var closeButton = c.find(".close");
                                          if (closeButton.length == 0) {
                                              c.append("<a class=close></a>");
                                              $(".close").css("display", "block");
                                           
                                          }
                                      });

                                  });
                              });
                              TemporaryAfterFix();
                          },
                          error: function (response) {
                              displayError(response.responseText);
                          }
                      });
                  }
              },
              error: function (response) {
                  displayError(response.responseText, socNo);
              }
          });
      }
      catch (e) {
          displayError(e.Message, socNo);
      }
  }

  //function CreateFaceBookTab(pageName, socNo) {
  //    //<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
  //    //<fb:like-box href="http://www.facebook.com/konserthuset" width="310" height="360" show_faces="true" stream="false" header="true"></fb:like-box>
  //
  //    $("#panes" + socNo).html('');
  //    $("#panes" + socNo).append("<div id=socContainer" + socNo + "></div>");

  //    var faceBookId = "konserthuset"; //hårdkodat just nu!
  //
  //    AppendLinkToSocialMedia(pageName, socNo, faceBookId);

  //    //$.getScript("http://connect.facebook.net/en_US/all.js#xfbml=1");
  //    $.getScript("http://connect.facebook.net/en_US/all.js#xfbml=1", function(){
  //        alert("Script loaded and executed.");
  //        var faceBookStr = "<div><fb:like></fb:like></div>"

  //        $("#socContainer" + socNo).append(faceBookStr);
  //    });
  //    //var faceBookStr = '<fb:like-box href="http://www.facebook.com/' + faceBookId + ' width=310 height=360 show_faces=true stream=false header=true></fb:like-box>';
  //
  //}

  function CreateFaceBookTabSmall(pageName, socNo) {
      try {
          $.ajax({
              type: "POST",
              url: "/Templates/Public/Services/SocialMediaService.asmx/GetFacebookSite",
              async: false,
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              data: "{pageId:'" + PageId + "', socMNr:'" + socNo + "'}",
              success: function (response) {
                  if (response.d == null) {
                  }
                  else {
                      var facebookSite = response.d.SocMedAccount;

                      $("#panes" + socNo).html('');
                      $("#panes" + socNo).append("<div id=socContainer" + socNo + "></div>");

                      if (facebookSite.length > 0) {
                          //AppendLinkToSocialMedia(pageName, socNo, facebookSite);

                          var faceBookStr = "<a id=socialMediaLink target=_blank href=http://www.facebook.com/" + facebookSite + "><span id=fbText>Mer om oss på Facebook</span><img src=/Templates/PublicCulture/styles/Images/icon_facebook.png></a>";

                          $("#socContainer" + socNo).append(faceBookStr);

                          //TemporaryAfterFix();
                      }
                  }
              },
              error: function (response) {
                  displayError(response.responseText, socNo);
              }
          });
      }
      catch (e) {
          displayError(e.Message, socNo);
      }
      finally {
          TemporaryAfterFix();
      }
  }

  function CreateTwitterTab(pageName, socNo) {
      try {
          $.ajax({
              type: "POST",
              url: "/Templates/Public/Services/SocialMediaService.asmx/GetTwitterUser",
              async: false,
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              data: "{pageId:'" + PageId + "', socMNr:'" + socNo + "'}",
              success: function (response) {
                  if (response.d == null) {
                  }
                  else {
                      var twitterUser = response.d.SocMedAccount;
                      var numHits = response.d.NoOfObjects;
                      $("#panes" + socNo).html('');
                      $("#panes" + socNo).append("<div id=socContainer" + socNo + "></div>");

                      AppendLinkToSocialMedia(pageName, socNo, twitterUser);

                      $("#socContainer" + socNo).append("<div id=twitter" + socNo + "></div>");

                      $("#twitter" + socNo).getTwitter({
                          userName: twitterUser,
                          numTweets: numHits,
                          loaderText: "Laddar...",
                          slideIn: true,
                          showHeading: true,
                          headingText: "&nbsp;",
                          showProfileLink: true,
                          socMedNum: socNo
                      });
                  }
              },
              error: function (response) {
                  displayError(response.responseText, socNo);
              }
          });
      }
      catch (e) {
          displayError(e.Message, socNo);
      }
  }

  function TemporaryAfterFix() {
      if ($("#panes1").length > 0) {
          if ($("#panes1").is(':visible'))
              $("#socContainer1").show();
      }
      if ($("#panes2").length > 0) {
          if ($("#panes2").is(':visible'))
              $("#socContainer2").show();
      }
         
    

  }

  //**************************************
  //START FLICKR
  //***************************************
   /*
      Code based on:
          Richard Shepherds's code http://www.richardshepherd.com/how-to-use-jquery-with-a-json-flickr-feed-to-display-photos/
      Modified by KnowIt
      */
  function displayFlickrImages(data, socNr, numHits) {
      // Randomly choose where to start. A random number between 0 and the number of photos we grabbed (20) minus 9 (we are displaying 9 photos).
      var iStart = 1; //Math.floor(Math.random() * (11));

      // Reset our counter to 0
      var iCount = 0;

      // Start putting together the HTML string
      var htmlString = "<ul>";

      // Now start cycling through our array of Flickr photo details
      $.each(data.items, function (i, item) {

          // Let's only display 9 photos (a 3x3 grid), starting from a random point in the feed
          //if (iCount > iStart && iCount < (iStart + 10)) {
          if (iCount < numHits) {

              // I only want the ickle square thumbnails
              var sourceSquare = (item.media.m).replace("_m.jpg", "_s.jpg");
              var bigPic = (item.media.m).replace("_m.jpg", "_z.jpg");

              //WITH DIRECT LINKS
              //Here's where we piece together the HTML
              //htmlString += '<li><a href="' + item.link + '" target="_blank">';
              //htmlString += '<img src="' + sourceSquare + '" alt="' + item.title + '" title="' + item.title + '"/>';
              //htmlString += '</a></li>';

              htmlString += '<li>';
              htmlString += '<img id="flickrPic" rel="' + bigPic + '" src="' + sourceSquare + '" alt="' + item.title + '" title="' + item.title + '"/>';
              htmlString += '<span id="flickUrl" style="display:none">' + item.link + '</span>';
              htmlString += '</li>';
          }
          // Increase our counter by 1
          iCount++;
      });

      // Pop our HTML in the #images DIV
      $('#images').html(htmlString + "</ul>");

      $('#images #flickrPic').each(function () {
          var picture = $(this);
          picture.click(function () {
              var picUrl = picture.attr("rel");
              //var flickrUrl = picture[0].nextSibling.textContent;
              var flickrUrl = picture[0].nextSibling.innerHTML;
              var theRightUrl = "/Templates/PublicCulture/Units/Modules/SocialMedia/Flickr.aspx?picUrl=" + picUrl + "&theflickrUrl=" + flickrUrl;
              $.get(theRightUrl, function (data) {
                  $("#socialMediaPicContainer" + socNr).css("display", "block");
                  $("#socialMediaPicContainer" + socNr).html(data);
                  var c = $("#socialMediaPicContainer" + socNr);
                  c.show().overlay({
                      effect: 'apple',
                      api: true,
                      left: "center",
                      expose: {
                          color: "#ccc",
                          loadSpeed: 500,
                          opacity: 0
                      },
                      closeOnClick: false,
                      top: "center"
                  }).load();
                  var closeButton = c.find(".close");
                  if (closeButton.length == 0) {
                      c.append("<a class=close></a>");
                      $(".close").css("display", "block");
                      closeButton = c.find(".close");
                      closeButton.click(function () {
                          c.overlay().close();
                      });
                  }
              });
          });
      });

      TemporaryAfterFix();
      // Close down the JSON function call
  }
  //**************************************
  //END FLICKR
  //**************************************

  //**************************************
  //START TWITTER
  //**************************************
  (function ($) {
      /*
      Code based on:
          Damien du Toit's code http://coda.co.za/blog/2008/10/26/jquery-plugin-for-twitter
      Modified by KnowIt
      */

      $.fn.getTwitter = function (options) {
          var o = $.extend({}, $.fn.getTwitter.defaults, options);

          var socNo = o.socMedNum;

          // hide container element
          $(this).hide();

          // add heading to container element
          if (o.showHeading) {
              $(this).append('<h2>' + o.headingText + '</h2>');
          }

          // add twitter list to container element
          $(this).append('<ul id="twitter_update_list' + socNo + '"><li></li></ul>');

          // hide twitter list
          $("ul#twitter_update_list" + socNo).hide();

          // add preLoader to container element
          var pl = $('<p id="' + o.preloaderId + '">' + o.loaderText + '</p>');
          $(this).append(pl);

          // add Twitter profile link to container element
          if (o.showProfileLink) {
              //$(this).append('<a id="profileLink" href="http://twitter.com/' + o.userName + '">http://twitter.com/' + o.userName + '</a>');
              $(this).append('<a id="profileLink" href="http://twitter.com/' + o.userName + '"><center><img src="/Templates/PublicCulture/styles/Images/twitter_logo_right.png" title="Besök vÃ¥r Twittersida"></center></a>');

          }

          // show container element
          $(this).show();

          var theUrl = "http://twitter.com/statuses/user_timeline/" + o.userName + ".json?callback=?&count=" + o.numTweets;

          $.getJSON(theUrl, function (data) {
              if (data.length > 0) {
                  var statusHTML = [];
                  for (var i = 0; i < data.length; i++) {
                      var username = data[i].user.screen_name;
                      var status = data[i].text.replace(/((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g, function (url) {
                          //return '<a href="' + url + '" target="_blank">' + url + '</a>';
                          return '<a href="' + url + '" target="_blank"> &raquo; Länk</a>';
                      }).replace(/\B@([_a-z0-9]+)/ig, function (reply) {
                          return reply.charAt(0) + '<a href="http://twitter.com/' + reply.substring(1) + '">' + reply.substring(1) + '</a>';
                      });
                      statusHTML.push('<li><span>' + status + '</span> <a target="_blank" style="font-size:85%" href="http://twitter.com/' + username + '/statuses/' + data[i].id_str + '">' + relative_time(data[i].created_at) + '</a></li>');
                  }
                  $("#twitter_update_list" + socNo).html(statusHTML.join(''));
              }

              // remove preLoader from container element
              $(pl).remove();

              // show twitter list
              if (o.slideIn) {
                  $("ul#twitter_update_list" + socNo).slideDown(1000);
              }
              else {
                  $("ul#twitter_update_list" + socNo).show();
              }

              // give first list item a special class
              $("ul#twitter_update_list" + socNo + " li:first").addClass("firstTweet");

              // give last list item a special class
              $("ul#twitter_update_list" + socNo + " li:last").addClass("lastTweet");

              TemporaryAfterFix();
          });

          function relative_time(time_value) {
              var values = time_value.split(" ");
              time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
              var parsed_date = Date.parse(time_value);
              var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
              var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
              delta = delta + (relative_to.getTimezoneOffset() * 60);

              if (delta < 60) {
                  return 'mindre än en minut sedan';
              } else if (delta < 120) {
                  return 'ungefär en minut sedan';
              } else if (delta < (60 * 60)) {
                  return (parseInt(delta / 60)).toString() + ' minuter sedan';
              } else if (delta < (120 * 60)) {
                  return 'ungefär en timme sedan';
              } else if (delta < (24 * 60 * 60)) {
                  return 'ungefär ' + (parseInt(delta / 3600)).toString() + ' timmar sedan';
              } else if (delta < (48 * 60 * 60)) {
                  return '1 day ago';
              } else {
                  return (parseInt(delta / 86400)).toString() + ' dagar sedan';
              }
          }
      };

      // plugin defaults
      $.fn.getTwitter.defaults = {
          userName: null,
          numTweets: 5,
          preloaderId: "preloader",
          loaderText: "Laddar twitter...",
          slideIn: false,
          showHeading: true,
          headingText: "Senaste Twitterinläggen",
          showProfileLink: true
      };
  })(jQuery);
  //**************************************
  //END TWITTER
  //**************************************

  //**************************************
  //START YOUTUBE
  //**************************************
  (function ($) {
      /*
      Code based on:
          "jquery YouTube grabber, from systemseven (http://www.systemsevendesigns.com) released on blog : webdevkungfu.com"
      Modified by KnowIt
      */
      $.fn.fnGetYouTubeUrls = function (options) {
          var defaults = {
              results: 8								/* number of results to return / display */
        , author: null								/* author of the video */
        , showRatings: true							/* Display the rating stars assigns a class of 00,05,10,15,20,25,30,35,40,45,50 */
        , showNumRatings: true						/* Displays the actual number of ratings */
        , showDescription: true						/* show a clipped version of the video description */
        , thumbnail: 'small'						/* small: 120x90 | large: 480 x 360 */
          };
          options = $.extend(defaults, options);

          var socNo = options.socMedNum;

          return this.each(function () {
              var container = $(this);

              getYTUrls();

              function getYTUrls() {
                  var requestUrl = 'http://gdata.youtube.com/feeds/api/videos?alt=json&max-results=' + options.results;

                  if (options.author != null) {
                      requestUrl += '&author=' + options.author;
                  }

                  $.ajax({
                      type: "GET",
                      url: requestUrl,
                      async:false,
                      dataType: 'jsonp',
                      success: function (response) {
                          var feed = response.feed;
                          var rfeed = feed.entry || [];
                          var relVideos = [];
                          var theUrls = [];
                          var videoItem;
                          if (rfeed.length > 0) {
                              $(rfeed).each(function (i) {
                                  relVideos[i] = [];
                                  relVideos[i].url = rfeed[i].link[0].href;
                                  relVideos[i].title = rfeed[i].title.$t;

                                  var vidId = rfeed[i].id.$t;
                                  var videoId = vidId.split('/');
                                  var theVideoId = videoId[6];
                                  relVideos[i].id = theVideoId;

                                  var index = 0;

                                  relVideos[i].thumbnail = rfeed[i].media$group.media$thumbnail[index].url;
                              }).ready(function () {
                                  if (relVideos.length > 0) {
                                      if (!$(container).is(':visible'))
                                      {
                                          $(container).show();
                                      }
                                      container.append('<div class="video-item" id="videoItem'+socNo+'">');
                                      videoItem = container.find('#videoItem' + socNo);
                                      var theList = "";
                                      theList = "<ul>";
                                      $(relVideos).each(function (i) {
                                          var theUrl;
                                          theUrl = "http://www.youtube.com/v/" + relVideos[i].id + "&hl=en&fs=1&rel=0";

                                          var theParentClassName = container[0].parentNode.className;
                                          theList += '<li><img height="84" width="112" class="youtubepic" rel="' + theUrl + '" src="' + relVideos[i].thumbnail + '" title="' + relVideos[i].title + '" /></li>';
                                        
                                      });
                                      theList += "</ul>";
                                      videoItem.append(theList);

                                      $('.video-item .youtubepic').each(function () { 
                                          var picture = $(this);
                                          picture.click(function () {
                                              var videoUrl = picture.attr("rel");
                                              var theRightUrl = "/Templates/PublicCulture/Units/Modules/SocialMedia/MovieEmbed.aspx?url=" + videoUrl;
                                              $.get(theRightUrl, function (data) {
                                                  $("#socialMediaVideoContainer" + socNo).html(data);
                                                  var c = $("#socialMediaVideoContainer" + socNo);
                                                  c.show().overlay({
                                                      effect: 'apple',
                                                      api: true,
                                                      left: "center",
//                                                      expose: {
//                                                          color: "#ccc",
//                                                          loadSpeed: 500,
//                                                          opacity: 0
//                                                      },
                                                      closeOnClick: false,
                                                      top: "center",
                                                      onClose:function(content) {
                                                            var thePlayer = $("#socialMediaVideoContainer" + socNo).find('#theMoviePlayer');
                                                            if (thePlayer.length > 0) {
                                                                thePlayer.remove();
                                                            }
                                                        }
                                                  }).load();
                                                  var closeButton = c.find(".close"); 
                                                  if (closeButton.length == 0) {
                                                      c.append("<a class=close></a>");
                                                      $(".close").css("display", "block");
                                                      closeButton = c.find(".close");
                                                      closeButton.click(function () {
                                                        var thePlayer = $("#socialMediaVideoContainer" + socNo).find('#theMoviePlayer');
                                                        thePlayer.remove();
                                                        c.overlay().close();
                                                      });
                                                  }
                                                  //Quick-fix for IE
                                                  if (jQuery.browser.msie  ) {
                                                       c.find(".close").remove(); 
                                                      c.append("<div class='close' style='position:absolute;top:2px;padding-left:60px;right:-40px'></a>");
                                                      $(".close").css("display", "block");
                                                      closeButton = c.find(".close");
                                                      closeButton.click(function () {
                                                        var thePlayer = $("#socialMediaVideoContainer" + socNo).find('#theMoviePlayer');
                                                        thePlayer.remove();
                                                         c.find(".close").remove(); 
                                                        c.overlay().close();
                                                      });
                                                      if( jQuery.browser.version == 7)
                                                        $("body > img").css("display","none");
                                                  }
//                                                
                                              });
                                                
                                          });
                                      });
                                      TemporaryAfterFix();
                                  }
                              });
                          } else {
                              /* if we have no youtube videos returned, let's hide the container */
                              container.hide();
                          }
                      },
                      error: function (response) {
                          //displayError(response.responseText);
                      }
                  })
              }
          });
      };
  })(jQuery);
  //**************************************
  //END YOUTUBE
  //**************************************

  socialMedia.init = function(socNo) {
    setUpSocialMedia(socNo);
  };

}());