My favorites | Sign in
Google
                
Search
for
Updated Feb 19, 2008 by api.kurrik.g00g1e
NavigationBetweenViews  
How to navigate between views (API 0.7)

Introduction

0.7 changed the Surface object to a View object and moved navigation out of the opensocial namespace into the gadgets namespace. This page updates the sample code available in the OpenSocial Developer's Guide to work with the 0.7 API

Details

Here is a complete example to list the supported views and navigate between them:

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs title="Navigating Between Views (0.7)" description="Navigates between views">
    <Require feature="opensocial-0.7" />
    <Require feature="views" />
  </ModulePrefs>
  <Content type="html">
  <![CDATA[
    <div id="main"></div>
    <script type="text/javascript">


/**
 * Create the list of links to the other views
 */
function createLinks() {
  //Get the environment, current view and an object containing the supported views
  var env = opensocial.getEnvironment();
  var views = gadgets.views.getSupportedViews();
  var currentview = gadgets.views.getCurrentView();
  var text = [ "You are currently on the ",
               currentview.getName(),
               " view.  Other views: " ].join("");

  //Set up some DOM
  var outputdom = document.getElementById("main");
  outputdom.appendChild(document.createTextNode(text));
  var ol = document.createElement("ol");
  outputdom.appendChild(ol);

  //Iterate over each view
  for (var viewname in views) {
    var view = views[viewname];
    //Make some DOM to present each link
    var li = document.createElement("li");
    var a = document.createElement("a");
    ol.appendChild(li);
    li.appendChild(a);
    a.href = "javascript:void(0);";

    //Put the name of the surface in the link
    a.appendChild(document.createTextNode("Link to " + view.getName()));
    //Handle when the user clicks a link to the other server
    a.onclick = getNavigateClosure(view);
  }
};

/**
 * Returns a function that navigates to the supplied view
 */
function getNavigateClosure(view) {
  return function() { gadgets.views.requestNavigateTo(view); };
};

//Execute createLinks when the page is done loading
gadgets.util.registerOnLoadHandler(createLinks);


    </script>
  ]]>
  </Content>
</Module>

Here is a sample that navigates to the canvas view:

function gotoCanvas() {
  var canvas_view = new gadgets.views.View("canvas");
  gadgets.views.requestNavigateTo(canvas_view);
};

gotoCanvas();

Here is a sample that navigates to the profile view:

function gotoProfile() {
  var profile_view = new gadgets.views.View("profile");
  gadgets.views.requestNavigateTo(profile_view);
};

gotoProfile();

Comment by antjohns.odibab, Feb 06, 2008

The link works perfectly in Mozilla but not in IE :(


Sign in to add a comment