<?xml version="1.0" encoding="UTF-8" ?> 
<Module>
  <ModulePrefs title="Google Tips" > 
    <Require feature="tabs"/>
  </ModulePrefs>
  <Content type="html">
     <![CDATA[

<link href="http://graargh.returnstrue.com/tips/createButton.css" type="text/css" rel="stylesheet">
<link href="http://graargh.returnstrue.com/tips/tabs.css" type="text/css" rel="stylesheet">
<style type="text/css">
p,body,select,option,input {font: 12px verdana}
a {
  color: #02679c;
  text-decoration: none;
}

a:hover {
  color: #00344f;
  text-decoration: underline;
}

input.filter {
  border: 1px solid #676767;padding: 2px;color: #676767;
}
</style>

<script src="http://graargh.returnstrue.com/tips/createButton.js"></script>
<script src="http://graargh.returnstrue.com/tips/tips.js"></script>
<script src="http://graargh.returnstrue.com/tips/tabs.js"></script>
<script src="http://sandbox.orkut.com/js/gen/People.js"></script>
<script type="text/javascript">
  google.people.Container.get().init("/46/o");    
</script>

  <script type="text/javascript">
    _IG_RegisterOnloadHandler(loadSocialData());

    var owner;
    var ownerFriends;
    var viewer;
    var viewerFriends;
    var G_SERVICES = new Array('Search', 'GMail', 'Orkut', 'Base');

    var tabs;

    function loadSocialData() {
      doRequest(google.people.DataRequest.getFriendDataRequest(), init);
    };

    function doRequest(dataRequest, callback) {
      dataRequest["bogusAppName"] = "Tips";
      google.people.requestData(dataRequest, callback);
    }

   function init(dataResponse) {
     setGlobalVars(dataResponse);
     tabs = new _IG_Tabs();
     tabs.addTab('<span class="tablib_extension_left_selected" id="tab_0"></span>home', 'home', changeLeftImage);
     tabs.addTab('<span class="tablib_extension_left_notselected" id="tab_1"></span>friends', 'friends', changeLeftImage);
     tabs.addTab('<span class="tablib_extension_left_notselected" id="tab_2"></span>services', 'services', changeLeftImage);
     tabs.alignTabs('left', 2);
     renderHomeTab();
  }

   function setGlobalVars(dataResponse) {
     owner = dataResponse.get("owner");
     ownerFriends = dataResponse.get("ownerFriends");
     viewer = dataResponse.get("viewer");
     viewerFriends = dataResponse.get("viewerFriends");
   }

  function getLatestTips(people) {
    return tips.getTipsFromPeople(people);
  }

  function getServiceDropdownHtml(userServices) {
    var htmlout = '';
    htmlout += ' <select id="service_select" >';
    for (var i=0; i<userServices.length; i++) {
      htmlout += '<option>' + tips.services[userServices[i].getServiceId()].getName() + '</option>';
    }
    htmlout += '</select>';
    return htmlout;
  }

  function getUserServicesHtml(userServices) {
    var htmlout = '';
    for (var i=0; i<userServices.length; i++) {
      if (i>0) {
        htmlout += " | ";
      }
      htmlout += '<a href="#">' + tips.services[userServices[i].getServiceId()].getName() + '</a>';
    }
    htmlout += createButton('edit services', null, 'renderSettingsDiv();');
    return htmlout;
  }

  function renderHomeTab(element) {
    var htmlout = '';
    htmlout += 'You have created ' + tips.getTips(owner).length + ' tips.<br>';
    htmlout += '<input id="new_tip" class="filter"></input>';
    var userServices = tips.getServices(owner);
    htmlout += getServiceDropdownHtml(userServices);
    htmlout += createButton('add tip', null, 'addTip();');
    htmlout += '<br>';
    htmlout += getUserServicesHtml(userServices);
    htmlout += '<br>';
    htmlout += 'Latest Tips:<br>';
    var latestTips = getLatestTips(ownerFriends);
    for (var i=0; i<latestTips.length; i++) {
      htmlout += getTipHtml(latestTips[i]) + '<br>';
    }
    _gel('home').innerHTML = htmlout; 
  }
  
  function addTip() {
    var timestamp = new Date().getTime();
    var text = _gel('new_tip').value;
    var serviceId = "0";
    var creatorName = owner.getName();
    var creatorId = owner.getId();
    var sharedWith = new Array();
    var newTip = new Tip(timestamp, text, serviceId, creatorName, creatorId, sharedWith);
    tips.addTip(owner, newTip, renderHomeTab);
  }

  function getTipHtml(tip) {
    var serviceId = tip.getServiceId();
    if (!serviceId) {
      serviceId = "0";
    }
    var htmlout = '<b>' + tips.services[serviceId].getName() + '</b> - ';
    htmlout += tip.getText();
    htmlout += ' created by <a href="#">' + tip.getCreatorName() + '</a>';
    return htmlout;
  }
   
  function renderSettingsDiv() {
     var htmlout='';
     for (s in tips.services) {
       htmlout += '<input type="checkbox" id="cb_'+tips.services[s].getId() +'" /> ' + tips.services[s].getName() + '<br>';
     }
     htmlout += createButton('save settings', null, 'setServices();');
     _gel('settings').innerHTML = htmlout;
     _gel('settings_parent').style.display = 'inline';
  }

  function setServices() {
    _gel('settings_parent').style.display = 'none';
    var serviceIds = new Array()
    for (s in tips.services) {
      var checkbox = _gel('cb_' + tips.services[s].getId());
      if (checkbox && checkbox.checked) {
        serviceIds.push(tips.services[s].getId());
      }
    }
    tips.setServicesById(owner, serviceIds, renderHomeTab);
  }


  </script>

  <div id="home">
  </div>

  <div id="friends" style="display:none">
    Your friends have created X tips.<br>
  </div>

  <div id="services" style="display:none">
    Your friends are using X of Y services.<br>
  </div>

<div id="settings_parent" style="display:none">
 <div style="position:absolute;top:0;left:0;width:100%;height:100%;background:#36b;filter:alpha(opacity=40);-moz-opacity:.40;opacity:.40;"></div>
 <div style="position:absolute;top:0;left:0;width:100%;height:100%">
   <div id="settings" style="width:50%;background:white;margin:50px auto 50px auto;border:1px solid black;text-align:center">Select your services:</div>
 </div>
</div>
]]>
  </Content> 
</Module>

