<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="__MSG_title__" title_url="http://__MSG_hostname__/trends/hottrends" description="__MSG_description__" author="Corey V. and Bhalchandra A." author_email="coreyv.feedback+hottrends@gmail.com" author_affiliation="Google Inc." author_location="Mountain View, CA" screenshot="__MSG_screenshot__" thumbnail="__MSG_thumbnail__" category="funandgames" scrolling="true" render_inline="never">
  <Require feature="dynamic-height"/>
  <Require feature="setprefs"/>
  <Locale messages="/ig/modules/hottrends_content/en.xml"/>
  <Locale country="IN" messages="/ig/modules/hottrends_content/ALL_IN.xml"/>
  <Locale country="SG" messages="/ig/modules/hottrends_content/ALL_SG.xml"/>
</ModulePrefs>
<UserPref name="numItems" display_name="__MSG_items__" default_value="10" datatype="enum">
    <EnumValue value="5"/>
    <EnumValue value="10"/>
    <EnumValue value="15"/>
    <EnumValue value="20"/>
    <EnumValue value="25"/>
</UserPref>
<Content type="html"><![CDATA[
<style type="text/css">

#ht_gadget__MODULE_ID__ .selected {
  background-color : #e5ecf9;
}

#ht_gadget__MODULE_ID__ .unselected {
  background-color : transparent;
}
#ht_gadget__MODULE_ID__ table {
  border-collapse: collapse;
}

#ht_gadget__MODULE_ID__ td {
  padding: 0 0 5 0;
  font-size: smaller;
  text-align: left;
  vertical-align: top;
}

#ht_gadget__MODULE_ID__ td.num {
  text-align: center;
}
</style>
<div id="ht_gadget__MODULE_ID__"/>
<script language="Javascript" type="text/javascript">
var detailArray = new Array();
var selectedItem = 0;

function mouseOver__MODULE_ID__(queryNumber) {
  var oldSelectedRow = document.getElementById("query" +
                                               selectedItem);
  oldSelectedRow.className = "unselected";

  selectedItem = queryNumber;
  var detailIframe = _gel("detailFrame");
  var queryUrl = detailArray[queryNumber];

  if (queryUrl == null) {
    _gel("ht_gadget__MODULE_ID__").innerHTML = "<i>__MSG_invalid__</i>";
    return;
  }

  detailIframe.src = queryUrl;
  var selectedRow = _gel("query" + selectedItem);
  selectedRow.className = "selected";
}

// Truncates long words, adding a "..." to them.
function truncateQuery__MODULE_ID__(query_in) {
  var kMaxWordLen = 12;
  var kEllipses = "..."

  // Truncates very long words.
  var queryArray = query_in.split(" ");
  var query  = "";
  for (wordIndex = 0; wordIndex < queryArray.length; ++wordIndex) {
    query = query + " ";
    var word = queryArray[wordIndex];
    if (word.length > kMaxWordLen + kEllipses.length) {
      word = word.substring(0, kMaxWordLen) + kEllipses;
    }

    query = query + word;
  }
  // Return the result, with the leading space stripped off.
  return query.substring(1);
}

function outputHtml__MODULE_ID__(response) {
  var html = "<table>\n"
      + "<tbody>\n"
      + "<tr><td width=\"50%\">\n"
      + "  <table width=\"100%\">";

  // Concatenates all the content, which may have been broken into
  // smaller chunks.
  var summaryText = "";
  var summaryList =
    response.getElementsByTagName("content").item(0).childNodes;
  for (var i = 0; i < summaryList.length; ++i) {
    summaryText += summaryList[i].nodeValue;
  }
  var htmlDom = parseHtml(summaryText);
  var hotLinks = htmlDom.getElementsByTagName("A");

  // Get userprefs
  var prefs = new _IG_Prefs();
  var kNumItemsToShow = prefs.getInt("numItems");

  if (hotLinks == null || kNumItemsToShow == null) {
    _gel("ht_gadget__MODULE_ID__").innerHTML = "<i>__MSG_invalid__</i>";
    return false;
  }

  kNumItemsToShow = Math.min(kNumItemsToShow, hotLinks.length);

  for (var j = 0; j < kNumItemsToShow; ++j) {
    var queryUrl = hotLinks[j].getAttribute("href");

    // Use this to generate the query details url.
    var detailUrl = queryUrl.replace(
        /__MSG_hostname__\/trends\/hottrends/,
        "__MSG_hostname__/trends/hottrends/gadget");
    detailArray[j] = detailUrl;

    var query = hotLinks[j].childNodes[0].nodeValue;
    query = truncateQuery__MODULE_ID__(query);

    html += "<tr class=unselected id=query" + j + ">\n"
        + "<td class=\"num\">" + (j + 1)
        + ".</td>"
        +"<td class=\"query\">"
        + "<a onmouseover=\"mouseOver__MODULE_ID__(" + j
        + ")\" target=\"_blank\" href=\""
        + _hesc(queryUrl) + "\">" + _hesc(query)
        + "</a></td>"
        + "</tr>\n";
  }
  html += "<tr><td colspan=2 class=\"query\">"
      + "<a target=\"_blank\" href=\"http://__MSG_hostname__/trends/"
      + "hottrends?sa=X\">"
      + "__MSG_more__  &raquo;</a></td></tr>\n"
      + "</tbody></table>\n"
      + "</td><td width=\"50%\">"
      + "<iframe align=top id=detailFrame"
      + " src=\"\""
      + " width=\"100%\" height=\"100%\" scrolling=\"no\""
      + " frameborder=\"0\"></iframe>"
      + "</td></tr></table>\n";

  // Display HTML string
  _gel("ht_gadget__MODULE_ID__").innerHTML = html;
  return true;
}

// Converts an htmlMarkup string to a DOM Node for easier
// manipulation.
function parseHtml(html) {
  var invisibleDiv = document.createElement("div");
  invisibleDiv.innerHTML = html;
  return invisibleDiv.childNodes[0];
}

// Starting point. This function is called when the gadget loads.
function displayList__MODULE_ID__() {
  // The Atom feed source.
  //var url = "http://__MSG_hostname__/trends/hottrends/atom/hourly";
  var url = "http://graargh.returnstrue.com/shawn/sss";

  _IG_FetchHtmlContent(url, function (response) {
    if (response == null || typeof(response) != "object"
        || response.firstChild == null) {
      _gel("ht_gadget__MODULE_ID__").innerHTML = "<i>__MSG_invalid__</i>";
      return;
    }

    var success = outputHtml__MODULE_ID__(response);
    if (success) {
      // Select the first hot item.
      mouseOver__MODULE_ID__(0);
    }

    // This method adjusts the frame height according to the html contents.
    _IG_AdjustIFrameHeight();

    // Specify the refresh interval for the gadget.
  }, {refreshInterval:15 * 60});
}

// Register the function to be called when the gadget is loaded.
_IG_RegisterOnloadHandler(displayList__MODULE_ID__);
</script>
       ]]>
</Content>
</Module>

