Google Gadgets are also compatible with Open Social Gadgets. This allows Google Gadgets integrated with Volusion API to be implemented with OpenSocial partners such as: MySpace, Friendster, Orkut, Hi5, FotoFlexer, iLike, RockYou, slide, viadeo, Ning, Linkedin, Flixster and many more.

Sample Social Gadget

This sample gadget retrieves and displays featured products.

<?xml version="1.0" encoding="UTF-8" ?> 
<Module>
<ModulePrefs title="Kams Store" height="300" width="600" scrolling="true"
author="" author_email=""
screenshot="" description="Featured Products" />
<UserPref name="s_url" display_name="URL" required="false" />
<UserPref name="s_email" display_name="Login Email" required="false" />
<UserPref name="s_password" display_name="Encrypted Password" required="false" />
<UserPref name="s_interval" display_name="Seconds" required="false" />
<Content type="html">
<![CDATA[

  <style type="text/css">
    body {
      width:200;
      height:230;
    }

    .regular {
      font-family: calibri;
      font-size: 12px;
      color: #000000;
    }

    .td1 {
      text-align: center;
      border-right: 1px solid #dddddd;
    }

    .td2 {
      font-family: verdana;
      font-size: 11px;
      text-align: left;
      border-bottom: 1px solid #dddddd;
    }

    .colors_productname {color:#0055bb}
    A.colors_productname:hover, A.colors_productname:visited {color:#0055bb}
    .pricecolor { FONT: bold 11px Verdana; }
    .colors_productprice {color:#cc0000}  
    .productnamecolor, A.productnamecolor {FONT: bold 11px Verdana; TEXT-DECORATION: none; }
  </style>
 
   <script type="text/javascript">
     var chkConn;
     var s_url = "";
     var s_email = "";
     var s_password = "";
     var s_interval = "";
 
     function vTrim(strInput) {
       while(strInput.charAt(0) == " ") {strInput = strInput.substr(1);}
       while(strInput.charAt(strInput.length-1) == " ") {strInput = strInput.substr(0,strInput.length-1);}
       return strInput.toString();
     }
 
     function load_gadget() {
       if (isNaN(s_interval) == true || s_interval == "") {s_interval = 300;}
       load_settings();
       download_products();
       chkConn = setInterval(download_products, 1000 * s_interval);
     }
 
     function load_settings() {
       var prefs = new _IG_Prefs();
       s_url = prefs.getString("s_url");
       s_email = prefs.getString("s_email");
       s_password = prefs.getString("s_password");
       s_interval = prefs.getString("s_interval");
     }
 
     function download_products() {
       try {
         var api_url = "http://" + s_url + "/net/WebService.aspx?Login=" + s_email +
         "&EncryptedPassword=" + s_password +
         "&API_Name=Generic\\Products&SELECT_Columns=p.HomePage_Section,p.ProductCode,p.ProductID,
         p.ProductName,pd.ProductDescriptionShort,pe.Availability,pe.ListPrice,pe.PhotoURL_Small,
         pe.ProductPrice,pe.SalePrice&WHERE_Column=p.HomePage_Section&WHERE_Value=1";
 
         var xmlhttp;
         var api_response = "";
 
         _IG_FetchContent(api_url, function (response) {
           if (s_url == "" || s_email == "" || s_password == "") {
             content_area.innerHTML = "<font class=\"regular\">Check settings</font>";
           } else {
             display_products(response);
           }
         },
         1
         );
       } catch(err) {
         if (s_url == "" || s_email == "" || s_password == "") {
           content_area.innerHTML = "<font class=\"regular\">Check settings</font>";
         } else {
           content_area.innerHTML = "<font class=\"regular\">Unable to connect</font>";
         }
       }
     }
 
     function display_products(api_response) {
       var xml_api;
       var xml_product;
       var xml_product_detail;
       var node_products;
       var node_product_details;
       var i = 0, j = 0;
 
       var product_id = "";
       var product_code = "";
       var product_name = "";
       var product_description_short = "";
       var product_list_price = "";
       var product_price = "";
       var product_photo_url_small = "";
       var html_products = "";
 
       html_products = html_products + "<table border=0 cellpadding=10 cellspacing=0 width=\"100%\">";
 
       try {
         xml_api = new ActiveXObject("MSXML2.DOMDocument");
         xml_api.loadXML(api_response);
         node_products = xml_api.getElementsByTagName("Products");
 
         xml_product = new ActiveXObject("MSXML2.DOMDocument");
         xml_product_detail = new ActiveXObject("MSXML2.DOMDocument");
 
         if (node_products.length > 0) {
           for (i = node_products.length - 1; i > -1; i--) {
             xml_product.loadXML(node_products.item(i).xml);  
             product_id = get_node_text(xml_product, "Products/ProductID");
             product_code = get_node_text(xml_product, "Products/ProductCode");
             product_name = get_node_text(xml_product, "Products/ProductName");
             product_description_short = get_node_text(xml_product, "Products/ProductDescriptionShort");
             product_list_price = get_node_text(xml_product, "Products/ListPrice");
             product_price = get_node_text(xml_product, "Products/ProductPrice");
             product_photo_url_small = get_node_text(xml_product, "Products/PhotoURL_Small");
 
             html_products = html_products + "<tr>";
             html_products = html_products + "<td class=\"td1\">";
             if (product_photo_url_small != null && product_photo_url_small.length > 0) {
               html_products = html_products + "<a target=\"_blank\"
               href=\"http://" + s_url + "/productdetails.asp?ProductCode=" +
               escape(product_code) + "\" class=\"productnamecolor colors_productname\"><img src=\""
               + product_photo_url_small + "\" border=0></a>";
             } else {
               html_products = html_products + "<a target=\"_blank\"
               href=\"http://" + s_url + "/productdetails.asp?ProductCode=" + escape(product_code) + "\"
               class=\"productnamecolor colors_productname\"><img border=0 src=\http://" + s_url
               + "/v/vspfiles/templates/110/images/nophoto.gif\></a>";
             }
 
             html_products = html_products + "</td>";
             html_products = html_products + "<td class=\"td2\">";
             html_products = html_products + "<a target=\"_blank\" href=\"http://" + s_url
             + "/productdetails.asp?ProductCode=" + escape(product_code) + "\" class=\"productnamecolor
             colors_productname\">" + product_name + "</a><br>";
 
             if (product_list_price != null && vTrim(product_list_price) != "") {
               html_products = html_products + "<b>List Price:</b> " + product_list_price + "<br>";
             }
             if (product_price != null && vTrim(product_price) != "") {
               html_products = html_products + "<b>Our Price:</b> <font class=\"pricecolor
               colors_productprice\">" + product_price + "</font> ";
               html_products = html_products + "<a target=\"_blank\" class=\"productnamecolor
               colors_productname\" href=\"http://" + s_url + "/shoppingcart.asp?ProductCode="
               + escape(product_code) + "\"><img src=\"http://" + s_url  
               + "/v/vspfiles/templates/110/images/buttons/btn_addtocart_small.gif\" border=0></a><br>";
             }
             if (product_description_short != "" && vTrim(product_description_short) != "") {
               html_products = html_products + "" + product_description_short + "<br>";
             }
       
             html_products = html_products + "</td>";
             html_products = html_products + "</tr>";
           }
         }
       } catch(err) {
         //error parsing xml
       }  
       html_products = html_products + "</table>";
       content_area.innerHTML = html_products;
     }
 
     function get_node_text(xml_doc, node_name) {
       var current_node;
       var node_text; current_node = xml_doc.getElementsByTagName(node_name);
       if (current_node.length > 0) {node_text = current_node.item(0).text;}
       return node_text;
     }
   </script>
   
  <body onload="load_gadget()" style="margin:0px;" >
   
     <table border=0 cellpadding=0 cellspacing=0 style="margin:0px">
       <tr>
         <td><div style="margin:0px;" x="1" y="1" id="content_area">
           <font style="color:#000000;font-family:calibri;font-size:12px;\">Loading...</font></div>
         </td>
       </tr>
     </table>
     
  </body>
 ]]>
</Content>
</Module>
Did this answer your question?